Empire partnered with IBM and Adobe to redesign Sobeys' digital ecosystem ahead of launching an online product catalog. This required unifying its subsidiary retail brands—each with distinct content, marketing workflows, and audiences—under a single scalable web and CMS framework. Hundreds of editorial and recipe content were reimagined to personalize product discovery and cross-selling.
I led end-to-end research, information architecture, and systems design creating modular templates and component standards that balanced brand needs with structural consistency. This work laid the foundation for future e-commerce readiness and content governance across all Empire-owned retailers.
Reworking content: a shift from storefront to online shopping
Empire lagged behind competitors in online integration, prompting a push to modernize with a new product catalog. Previously, Empire had invested time and resources producing recipe articles and instructional content to direct foot traffic to their stores. However, the website had historically seen low engagement across their retailers—with this content doing little to improve site stickiness and outgrowing the existing site structure.
Key design challenges
Make recipe content dynamic entry points for product engagement
Recipes needed to provide value to shoppers. Web analytics revealed that nearly 80% of visits to Sobeys.com were driven by flyer deals rather than content.
Develop a modular design system scalable across Sobeys & subsidiary retailers
Content pages were manually built by different marketing teams, resulting in inconsistent layouts and visual treatments. There needed to be consistency so that it was easier to manage multiple websites.
Balance standardization with creative needs of marketing teams
Redesigning the information hierarchy and implementing CMS components were part of the project scope. However, we needed to accommodate marketing teams across different retailers, each with unique brand and content requirements.
Connecting shoppers to products through personalized lifestyle content
With the website redesign and product catalog integration, we saw an opportunity to reimagine the recipe experience—positioning it as a driver for personalized shopping. We transformed recipes into interactive touchpoints that facilitate lifestyle-based shopping.
Setting personalized preferences
Once customers sign-in to Sobeys.com, they can set preferences for recipe and product recommendations based on lifestyle choices and dietary needs.
General navigation and directed searches
I redesigned the global navigation IA and contributed to the search experience through recommendations and user testing. As users type in the search, results update in real time with products, recipes, and articles on one sheet, encouraging discovery and cross-engagement.
Design for storytelling: from browsing to viewing specific pages
CMS-templated product, campaign and brand landing pages featured dynamic content recommendations to show relevant food inspiration and products. To offer Sobeys control, component contents can be customized manually by Sobeys' marketing teams or automatically populated through AI.
Adding recipe ingredients to check-out
We integrated an add-to-cart feature on recipe pages to reduce friction between inspiration and purchase. Shoppers can easily swap products from the ingredient list and discover more from Sobeys’ catalog.
Making sense of messy data, information flows, & people
The work I did to address design challenges was divided into two concurrent work streams:
Research + Strategy
I led generative and evaluative research to reframe how recipes add value in the online grocery journey. I worked with service designers and tech teams to define and scope design opportunities.
IA + Systems Design
I used research findings to inform the design and information hierarchy of the components, wireframes, and overall site structures. I collaborared with UX/UI designers, Adobe teams, and client stakeholders.
How might we give shoppers a reason to engage with online recipe content?
Our service designers needed a baseline understanding of adoption drivers and how recipes could be integrated into the new customer experience. While Sobeys had provided market segments as a proxy for understanding website users, I thought it would be helpful to distinguish demographic customer behaviours from user behaviours.
I proposed a contextual inquiry study with 20 Canadians who were primary shoppers of their household. I explored how meal-planning and grocery shopping routines shaped online behaviours.
Market segments ≠ user behaviours
As it turned out, the market segments did not map 1:1 to personas. Interestingly, there were overlapping user behaviour patterns despite varying preferences and lifestyles. I was inspired by Microsoft's Inclusive Design Method and developed a 'persona spectrum'.
A persona spectrum (or “spectrum of needs/behaviours”) recognizes that shoppers don’t fit neatly into one bucket; many grocery shopping behaviours are subject to change depending on circumstance.
A key insight...
Shoppers engaged with recipe content when it appeared contextually during relevant shopping tasks
We designed touch-points where recipes could contextually bring value to grocery shoppers in the following ways:
Reduce the mental load of meal planning decisions
Participants often swapped items for deals or alternatives, which left them uncertain about what meals to prepare, which prompted them to figure out a new plan.
"What can I cook with the different products I picked up?"
Inspire new ways to use products
When viewing product details, shoppers liked recipe ideas on physical packaging, which are often not shown in online shopping.
"How can I spice up the high-protein yogurt I usually buy?"
"I found an interesting new product but don't know what to do with it."
Cater to individual preferences and dietary needs (with help from AI)
Social media was the most common source of recipe inspiration. Participants often discovered recipes by chance. These encounters were effective because AI-driven recommendations catered to their preferences.
"My son sends me recipes that he finds on Instagram... They are quick and easy meals."
Defining the customer journey
By understanding different online shopping behaviours, we identified how to design entry points for personalized recommendations that align with user intent—ranging from exploratory browsing to targeted searches for specific products or information.
These insights informed user flows that connect moments of inspiration to check-out opportunities. We developed 12 blueprints in total. Below is an abridged version of one of the user flows and blueprints.
Determining a scalable scheme and modular design system
Our goal was not only to equip Sobeys with the tools to ensure design consistency, but also to provide shoppers with a cohesive and predictable experience. To support this, I developed the following deliverables:
A standardized site structure that maintained consistency while accommodating each retailer’s unique services, products, and content.
Card sort sessions with 10 users helped reconcile mismatches in structures within and across brands. The following sitemap shows how we can support each retailer's unique services, products, and content.
A modular design system that defined the foundational building blocks—templates and components—that make up complete web pages of our bespoke CMS solution.
This was done following a content audit where I identified content types, redundancies, outdated assets/components, and opportunities for consolidation. The design library served as a source of truth.
Collaborative whiteboards on Figma served as living documents that visualize stakeholder feedback and decisions regarding design, content, and system logic. We created these interactive boards to collaborate together with Sobeys’ marketing and Adobe teams during and after meetings—balancing feasibility with business goals.
Improving information hierarchy & personalization
I conducted usability testing with researchers at Sobeys’ Research Centre in Halifax. We validated designs by triangulating with think-aloud feedback, eye-tracking and brainwave sentiment data. Here are some revisions we made to improve the information hierarchy or add a touch of personalization:
Before
For product cards, we initially emphasized the brand and product name. Sobeys believed their primary customers were not price-sensitive, so we set out to test this assumption.
After
We elevated price placement based on eye-tracking and brain excitement data, shortened card layout with a revised button, and added item-count feedback for clearer interaction.
Before
On the recipe page, we introduced an 'add ingredients' feature that allowed shoppers to select or deselect individual products before adding them to their cart.
After
To maintain flow and retain users on the screen, we also included a “substitute” option enabling shoppers to swap ingredients without interrupting their shopping process.
Before
Retailers considered using promotional banners on category pages. To encourage browsing and gradual exploration, we added category filters for progressive product discovery.
After
The promotional banner disrupted product exploration, so we removed it. Similarly, we also changed the 'quick category filter' to improve browsing and product visibility.
Before
For article pages, we explored layout options. A sticky right rail provided constant access to interactive components but reduced the available space for important article content.
After
We chose a one-column, centered layout to draw greater attention to the article content itself. This improved readability while highlighting embedded recipes and products.
The redesign of the website as a result of the product catalog integration was a big win for our team. Standardized CMS templates empowered Empire marketing teams to scale and manage content efficiently, while providing customers with a new lifestyle-based online shopping experience.
Other accomplishments
I mentored 3 designers and 1 intern, fostering skill development and collaboration.
0-1 systems library with 100+ components and 50+ wireframes for mobile, tablet, and desktop.
Though not shown here, I also supported design for essential end-to-end interactions such as filters, Scene+ loyalty and deals, catalog pages, onboarding and checkout flows, and the global navigation system.
I helped establish a culture of design system maintenance early on, despite the growing pains of working within a small product team. Developing a workflow required trial-and-error and open communication between teammates. In the long run, this made it far easier to implement changes and scale to across other grocery retail websites.
I also learned how to conduct usability testing using brainwave data for the first time. Unlike traditional usability sessions where researchers can ask probing questions mid-task, it was crucial here to let participants complete tasks before posing any attitudinal questions. This ensured that the brainwave scans captured authentic, task-related responses without being influenced by unrelated sentiments.
