Elevating storytelling across a global brand platform
Our team worked with Starbucks to reimagine their editorial platform—building a scalable system that unified storytelling and gave global teams the tools to publish with clarity and confidence.
The Challenge
Starbucks’ platform brings stories from baristas, communities, and brand initiatives to a global audience. As the platform grew, editors faced mounting complexity and readers lacked a cohesive experience. The opportunity was to create a system that could scale worldwide while staying true to the brand’s authentic voice.
Key Challenges
Inconsistent layouts: Editorial stories lacked rhythm and visual hierarchy.
Cumbersome workflows: Editors had to hack together layouts, slowing down publishing.
Limited scalability: The system didn’t flex well across global markets or seasonal campaigns.
Project Details
My Role: Lead Product Designer
Scope: Experience design & prototyping, Stakeholder workshops & alignment, Cross-functional collaboration, Design system integration
Tools: Figma, FigJam, Wordpress, Miro, Teamwork
Discovery Workshops
Audience & Goals
We kicked off with an immersive discovery phase that aligned business, editorial, and design stakeholders. Our goal was to define the right balance between brand control and content flexibility, ensuring the system could serve everything from campaign launches to community storytelling.
Facilitated cross-team interviews to understand limitations and aspirations
Mapped priorities across brand, editorial, technology
Established shared goals for storytelling and system governance
Fueling Creativity Workshop
To align creatively, we hosted a Fueling Creativity Workshop using the Disney Creativity Method, helping us explore bold ideas while staying grounded in feasibility and scale. We paired this with a Design Spectrum Workshop to map stakeholder alignment on brand expression—establishing a shared language and creative direction from the start.
Facilitated two visual workshops to align stakeholders around storytelling potential and brand expression
Used divergent and convergent thinking to explore motion, editorial layout, and component-level flexibility
Flagged early risks around accessibility, performance, and long-term maintainability
Balanced imaginative storytelling with scalable implementation across breakpoints and content types
Style Tiles
From there, we translated insights into three distinct style tiles—each a motion-rich, system-oriented direction. These weren’t just visual themes, but opinionated, testable concepts packed with theming logic, motion strategy, and component-level exploration. These helped clarify appetite for animation, seasonal variation, and scalable design patterns.
Created three distinct style tiles exploring motion, layout rhythm, and typographic hierarchy
Defined a visual strategy for modular storytelling, seasonal theming, and scalable components
Tested appetite for animation and interaction nuance across the system
UX Foundations
Alongside creative exploration, we established the UX patterns that would guide how stories are structured and discovered. Wireframes clarified where content lives, how modules scale, and how users move through editorial narratives.
Clarifying Story Entry Points
We introduced topical rivers with supporting highlight cards to guide readers into timely content while ensuring evergreen brand stories never got buried. This structure reduced editorial overhead and gave Starbucks a repeatable way to balance business priorities with audience interest.
Creating Consistency Across Modules
By defining a shared set of components, quotes, stats, video, and multi-column layouts, we eliminated the ad-hoc patterns that had been slowing down publishing. Editors gained speed and confidence, while users experienced more consistent, scannable stories.
Scaling for Longevity
Spotlight sliders and modular grids gave Starbucks the flexibility to rotate seasonal campaigns or evergreen stories without redesigning pages each time. This adaptability meant content could stay fresh for users while saving design and development resources over the long term.
Design Foundations
Building on the UX patterns, we established a visual system in Figma that made Starbucks’ platform both consistent and adaptable. Components were tokenized for color, type, and layout so seasonal campaigns could be refreshed without redesign. This approach cut down publishing effort, gave editors confidence, and ensured the brand voice carried across evergreen stories and global markets.
Seasonal Theming
The river layout combined the latest news with evergreen stats and an editorial image intro. Rounded edges, adaptable type scales, and themed tokens gave the component a dramatic seasonal voice while still aligning with the core system. This balance allowed Starbucks to keep content visually fresh without creating new one-off templates.
Brand Expression
Bringing the Starbucks voice into digital form with typographic rhythm, authentic photography, and expressive layouts.
Editorial Clarity
Establishing consistent hierarchies, spacing, and components to make long-form content easier to read and navigate.
Design System
Building a scalable design system in Figma and Storybook, ensuring design decisions could be reused across markets.
Modularity and Seasonality
Creating a system that flexes for both evergreen storytelling and seasonal campaigns like holiday promotions.
The new system launched on about.starbucks.com with the Red Cup campaign as its first seasonal test.
“We relaunched the Starbucks company website today and I'm very proud of this effort. It was an effort that was driven by data, born out of qualitative and quantitative insights, with a look towards how we can modernize and update. It came out better than I could've imagined.”
Brad Nelson
Starbucks, Global Communications
LinkedIn
This project reinforced how editorial systems can serve not just content—but culture
Designing for narrative flexibility while protecting brand clarity required constraint management, foresight, and a cross-functional collaboration model.
The most rewarding part? Shipping a system that dozens of teams now use to tell more meaningful, values-driven stories at scale.
Reflection
100%
System met full WCAG accessibility compliance in collaboration with Starbucks’ internal accessibility team.
32
Reusable components delivered as part of a fully tokenized design system, supporting editorial storytelling, campaign content, and brand expression.
4
Seasonal color themes built into the system—enabling visual flexibility for initiatives like Red Cup, Earth Day, and Pride without additional dev lift.