← Home
shipped
Designing Walmart Canada's flagship campaign UI
A bilingual, motion-rich product UI for Walmart Canada — translating a national grocery campaign into web flows that worked on every screen, in English and French.
- Role
- Senior product design · Motion direction · Design system extension
Brief
Walmart Canada wanted a campaign hub that told a national grocery story without asking shoppers to read a manual. Two languages, three product lines, one experience that had to feel premium on a 4K monitor and clean on a $200 Android.
What we did
I led the product UI and motion design with the in-house Walmart team and our partners. From wireframe to live launch in 6 weeks.
Design problems we solved
- Bilingual parity. Every screen had to read identically in English and French — including animations whose word-counts didn’t match. We built a tokenized layout that adapts to either language without breaking rhythm.
- Buildings & cows that move. The hero animations needed to feel handcrafted, not stock. We illustrated and looped them in After Effects, then exported as optimized webp / gif sequences.
- A real grocery shopper’s flow. Filter chips, a quick-add cart, a price ladder that doesn’t lie. The entire critical path is reachable in three taps from the hero.
Outcome
Shipped on time, on schedule, and on every screen. Walmart Canada extended the campaign template into two follow-on initiatives the same year — and the design system additions we contributed are still in production.
Next case study