No Kid Hungry
Creating a new design system for Center For Best site that still points back to No Kid Hungry and Share Our Strength
2022
My Role
I was the lead UI Designer for this project. I was asked to create a new design system that was unique enough to stand alone as it's own site, yet use the same colors and typography as their main brand: No Kid Hungry / Share Our Strength. I teamed up with one of our UX Strategists, and collaborated with the clients to develop a color system that corresponded with their tagging system in the back end. This lead to a colorful, and joyful site that optimized No Kid Hungry's wide range of colors in an intentional way.
Visual Language
Center For Best Practices is a part of the larger brand of No Kid Hungry, a large nonprofit devoted to end childhood hunger. The main goal of this project was to refresh Center For Best Practices' site and sub-brand.
"We want this site to feel related to No Kid Hungry, but by using color's other than our main corey orange..."
No Kid Hungry has several other colors a part of their brand but they don't get used as much. We saw this as an opportunity to create a playful sub-brand that used all 8 colors and create a tagging system.
The playful nature of all these bright and fun colors were used to organize their large archive of research and resources within Center For Best Practices. Not only does this pair well with the client's vision for Center For Best Practices' brand, but it is also a solid wayfinding tool for the user.
Photography
We encouraged Center For Best Practices to use playful and impactful photography where and when they can: in heros, on their homepage, and within their resources + research pages.
Engaging UI and UX
Because this is a hub that holds helpful resources, it was important for this site to be intuitive for users to navigate. Following the KISS rule, we kept the structure of their current site and improved it by organizing the page layouts.
Programs
This page was was enhances by removing their original accordion method because it was hiding their valuable information. We created a tab system and a sticky jump link sub-nav to allow the user to get to where they need fast.
Components
For all their basic pages, we created a flexible component system for the editing team to easily build pages that supported related research and resources.
