Frosted Mini Wheats brand experience
Top-10 U.S. cereal brand • $241M in annual U.S. sales
Role: Lead Visual Designer
Platform: Web
Team: Brand • UX Designer • Production • Designer
Frosted Mini-Wheats is a legacy Kellogg’s cereal brand introduced in 1969. Despite decades of recognition, the brand had never had a dedicated digital home where families could explore flavors, compare nutrition, and engage with the Built for Big Days campaign.
As Lead Visual Designer, I helped bring the brand online for the first time. My goal was to create a flexible, modern experience that made the product lineup easy to explore while preserving what made Frosted Mini-Wheats instantly recognizable.
Developing the visual direction
Frosted Mini-Wheats had a presence on the Kellogg’s website, but not a dedicated digital experience of its own. While UX partnered with the brand team on content requirements, I focused on defining the visual direction. I reviewed family-focused food brands to understand how they balanced bold visual expression with fast scanning and accessibility. The strongest experiences shared a few qualities: playful energy, clear content hierarchy, and intentional photography.
Inspiration
Before
Aligning structure with UX
We defined a flexible structure that could support campaign storytelling, product discovery, nutrition transparency, and future flavor launches.
I worked from a mobile-first foundation with bold but controlled brand expression, simple content hierarchy, reusable page templates, and flexible modules for future growth. Rather than designing individual pages, I built a scalable system the brand team could keep extending.
Creating the design system
With a short lead time, I moved quickly into a focused visual direction.
The final system balanced bold packaging colors with clean layouts, intentional photography, and accessible contrast. I introduced a deeper orange inspired by the packaging to preserve brand energy while improving readability across desktop and mobile. That became the foundation for every template that followed.
The final designs
Homepage
I designed the homepage to bring the Built for Big Days campaign to life without sacrificing clarity. Bold color and large imagery create energy. Short content blocks keep scanning fast. Structured hierarchy reduces clutter. Accessible contrast works across every device.
Product landing page
I designed for quick comparison across all nine SKUs using large product cards for recognition, simplified nutrition highlights, and minimal metadata to reduce noise. A banner module supports future flavor launches without touching the core layout.
Product detail page
I prioritized large product imagery, highlighted nutrition values, and built a consistent content structure across every SKU. Related products encourage exploration while the template balances campaign energy with structured information design.
Nutrition page
I designed for fast comprehension using bold numeric hierarchy, clear labeling, and strong contrast for accessibility. The structured layout makes detailed nutrition information easy to scan and compare — and easy for the brand team to update.
Adjustments along the way
The brand palette included several light tones that created real readability problems.
I introduced a deeper accent color inspired by the packaging and paired it with a more structured secondary tone. It preserved the brand's energy while improving accessibility and contrast across desktop and mobile. The result was a color system that felt more Frosted Mini-Wheats than the original palette did, just more inclusive and more scalable.
Supporting development and QA
I delivered organized, developer-ready files with clearly labeled components, defined responsive behavior, a structured typography system, and reusable spacing and layout patterns. The goal was to reduce implementation friction and make sure the brand team could keep building without needing a designer in the room every time.
Impact
Frosted Mini-Wheats went from having no dedicated website to its first responsive digital experience for a brand generating $400M+ in annual sales.
🚀 0 → 1 digital experience
I designed the brand’s first dedicated website, giving customers one place to explore products, nutrition information, and campaign content.
🧩 9 products → one system
I created one product system for all nine SKUs, with reusable templates for product listings, product details, and nutrition information. New products could use the same structure instead of requiring a new design.
🌱 Built to grow
I created reusable page templates and content modules for products, nutrition, campaigns, and future launches. This gave the team a system they could extend as the site grew.
👁️ More accessible brand colors
Some of the existing brand colors did not provide enough contrast for digital use. I introduced a darker accent color based on the packaging, keeping the brand recognizable while improving contrast across desktop and mobile.
Team feedback
“Nancy is the most stellar leader and design partner I could have ever asked for. I have learned so much from working with her over the past year. She has such a kind and impactful way of giving feedback, and challenges me to produce the best work possible. I value her opinion and design eye more than anyone. Not only is she someone I can look up to, she also knows how to put her head down and crank out beautiful work on tight timelines. She is proactive on all of her projects, solving problems before they get too big. If a problem does arise, Nancy maintains her composure, positive attitude and calming tone with everyone.” — Leo Burnett UX Designer