Coolmath Games elicits tons of nostalgia and excitement, but this memorable brand didn't have a defined visual identity when I joined the team. While I never had the chance to do a full-fledged brand refresh, I strengthened the brand's visual identity with the creation of design assets, brand guidelines, and a one-of-a-kind design system in Figma. 
The Foundation (Before)
I put together this sheet to outline Coolmath Game's identity as it stood during my first month. It was a challenge to work with so little in the beginning. But overtime, I was able to refine and expand Coolmath's design language, referring to the brand's iconic qualities and past to define its future. 
There's still heaps of space for the brand to evolve, so the work you see here is just the new foundation for tomorrow. 
Color 
The palette is still vibrant but much more versatile than before, and with clear defined uses. For example, seafoam and orange are used to indicate success and failure states. 
Components
I created the component library using atomic design principles, with accessibility, reusability, and scalability in mind. This system significantly sped up the design process, allowing us to rapidly iterate and prototype new features. 
Iconography

Like animation frames

Category Icons
I created over 150 colorful category icons that are used throughout the site and within promotional graphics. 
Illustrations
I also created an illustration library of popular characters on Coolmath Games in Figma for easy cross-team collaboration. 

You may also like