Introducing: Radical Graphics ( + logo breakdown )

I’m happy to introduce you to my new creative agency: Radical Graphics.
Currently, Radical is just ‘me’ — but I’ve been contracting with clients over the last few months and plan to scale in the near-future, so I wanted to formalize my offerings in an agency model.

A site is forthcoming, but I wanted to do a writeup of the logo I created for Radical:

Shape
First, I spent time exploring different logo approaches.
The name denotes the 90’s slang term, but the word is still relevant and commonly-used in today’s modern conversations.
I wanted a wordmark that matched that energy — some retro vibes with a modern overall shape.

Some logo explorations and variations.

I didn’t love the direction at first mainly because of the ‘L’ shape at the end. I tried using the flipped ‘R’ shape as the ‘L’ and then tucked it behind the ‘A’ and started feeling good about where it was going.

Symmetry
When I finalized the ‘I’, I realized it was almost symmetrical. My intention was not to have a perfectly-symmetrical logo, but it was so close to being symmetrical that I knew it would bother me….so I spent some time with the ‘R’ & ‘L’ & ‘I’ until the ‘I’ was perfectly centered.

Too close (to symmetrical) for comfort!

Color Palette
Radical’s strength is adaptability — the ability to jump between design and development, strategy and execution.

I wrote about brands and the importance of color here.
For Radical I wanted the brand to be decoupled from color. I had an idea it could work but needed to do some experimenting.
I started with a 10-color palette and continued reducing until I got to a 2-color version (see image below):

Color distribution of the logo changes based on the # of colors in the palette. Radical’s brand accommodates color palettes from 2–10 colors.

This execution allowed the logo-coloring to look intentional regardless of how many colors were used.

2- to 10-color palettes can be used in this configuration, while still feeling like the brand.

“Randomness”
The logo is dynamic, but to be clear that does not mean it’s random. “Random” in code means any color from ‘#000000’ to ‘#FFFFFF’. In my experience this never looks good. It’s too…random.

Ironically, “Random” coloring always looks identical.

The alternative to randomness is curation. ‘Choose a random color from within this range’, ‘use one of these specific palettes’ or something like that. This way the outcome isn’t 100% predictable, but parameters are set so that it can feel designed.
The colors in the demo below are curated palettes, currently ~30 palettes each containing from 2–10 colors, built with the ability to add more at any time.

Animation
I am a fan of the web and vector graphics. I wanted the animation to be vector and wanted to use Lottie for the vector animation.

Animated Radical Logo. This is a gif, but the interactive version is available in a demo (link below).

My workflow:
Figma > AEUX > AfterEffects > Bodymovin > JSON/Lottie > CSS/Javascript.
( Not sure what that means? Hire Radical! 😊 )

Code
I created CSS class names for each vector element, then in Javascript created color configurations based on palette length. I created a landing page that allowed for dynamic color change based on mouse position, that runs smoothly on any desktop or mobile device. Demo here.

The animation’s total file size is 38KB — not including the Lottie lib, which can be loaded and reused multiple times.

Different color palettes used, each varying in length and color.

The logo and color configuration speaks to Radical’s adaptability. I’m looking forward to scaling and solving complex problems. Let me know how I can help!