One Feature. Two Contexts. Two Outcomes.
Context
Canadian Tire is a multi-category retailer, and its affiliate SportChek specialises in sports apparel. Their digital strategy focuses on scaling e-commerce and increasing basket size through product discovery and cross-sell optimisation.
Problem
On mobile, 15% of users dropped off at the existing “Frequently Bought Together” (FBT) cross-sell section, hurting ATC rate and AOV.
Impact
I designed brand-specific FBT strategies for two brands, each tailored to unique contexts, constraints, and PM priorities. The redesign led to measurable impact: +9% CTR, +5% attachment rate, and +8% AOV.
Role
Product Designer
Team
A dedicated PM and dev. team for each brand
UX research team
Timeline
Canadian Tire: 2 months
Sportchek: 4 weeks
Problems
Users often missed the FBT section, resulting in fewer add-ons, lower AOV, and a weaker basket-building strategy
User problem: Users often stopped scrolling when they reached the full-width FBT section, mistaking it as the end of the page. This caused them to miss reviews and Q&A down the page, key information they relied on to feel confident in their purchase.
Business problem: Low engagement with the FBT and other cross-sell sections led to fewer add-ons and smaller baskets, negatively impacting add-to-cart (ATC) rate, AOV, ROI of the cross-sell section, and ultimately undermining the company’s e-commerce basket-building strategy.
Goals
Helping Users Discover Add-Ons to Support Basket-Building
The goal was to help users easily discover and act on relevant add-ons within the mobile viewport, supporting better purchase decisions and driving progress on the business’s basket-building strategy.
While Canadian Tire focused on redesigning its existing FBT section, SportChek introduced it as a new part of the customer journey.
Solutions
Streamlining Add-On Discovery to Support Confident & Higher-Value Purchases
Make FBT Scannable While Keeping Other Product Info Visible
For Canadian Tire, we reduced vertical space by condensing details; for SportChek, we used a carousel. Both designs made it easier for users to scan relevant add-ons without losing sight of key product information, helping them stay confident in their purchase decisions.
Increase Trust Through More Relevant Add-Ons
The FBT logic was refined to show complementary add-ons instead of alternative items by aligning product data and backend rules. This shift improved relevance and trust, helping users feel more confident that the suggestions were useful and worth adding to their basket.
Canadian Tire
Before (Full-Width & Irrelevant Add-Ons)
After
Sportchek
Before (No FBT)
After
Results
Driving Higher Engagement, FBT Adoption, & Basket Value
By improving the visibility and relevance of the FBT section through user feedback and iterative testing, both designs helped users more easily notice, trust, and act on add-on suggestions. This translated into measurable improvements in engagement and basket-building metrics.
User Outcome (projected)
CTR
Drop-off
in cross-sell sections
Business Outcome (projected)
AOV
Attachment rate
of cross-sell sections
Constraints
2 Brands, 2 PMs, Different Constraints
Working with 2 different PMs across Canadian Tire and SportChek meant balancing unique constraints for each brand.
Canadian Tire
More Time for Iteration
2-month window enabled research and testing.
Broader Stakeholder Involvement
Required alignment across teams and product owners.
Sportchek
New Design Not Ready
4-week timeline couldn’t wait for Canadian Tire’s updated FBT.
Low-Effort Scope Only
Limited dev capacity required minimal lift.
Quick Fix Prioritised
PM focused on short-term launch over long-term scale.
Research
Users Distrusted, Dropped Off, and Felt Overwhelmed
I combined Baymard’s e-commerce benchmarks, competitor analysis, and focus groups to explore user expectations and friction points. These insights shaped priorities on visibility, relevance, and placement.
Finding 1
Irrelevant Add-Ons Erode Trust
When suggestions felt random, users ignored the section and stopped trusting it.
Finding 2
“False Bottom” Caused Drop-Off
The full-width section gave users the impression they’d reached the end of the page, causing early drop-off.
Finding 3
Competing Sections Overwhelmed Users
Too many product suggestions on one page made users feel overwhelmed and skeptical.
Ideation
Exploring How We Might Help Users Trust & Engage with Add-Ons in Two Different Contexts
Canadian Tire
Approach 1: Seamless Scrolling Experience (Reduce Drop Off)
Making the FBT section more compact kept recommendations within the browsing flow. For users, it reduced the “false bottom” effect and felt like a natural continuation of product information. For the business, it increased the likelihood of engagement by keeping add-ons visible without extra effort.
Approach 2: Natural Decision Flow (Build Trust)
Placing FBT as a full-width section at the end of the product page gave users a complete overview of add-ons in one glance. For users, it mirrored their natural flow of decision making: from current product, to alternatives, to complementary add-ons. For the business, it maximised exposure by presenting all related items together.
Sportchek
Approach 1: Familiar and Predictable Add-Ons (Quick Win)
Reusing an existing component offered a quick fix that minimised development effort and enabled faster release. For users, it provided a familiar, predictable way to browse add-ons, helping them make more informed apparel purchase decisions. For the business, it ensured design consistency across brands and reduced implementation cost.
Approach 2: Convenient Apparel Selection (increase AOV)
Building on the Canadian Tire’s existing component, this approach integrated size and colour selectors directly into the FBT section. For users, it offered more control and convenience, letting them personalise items without leaving the product page. For the business, it encouraged higher basket value by making apparel add-ons easier to purchase and reducing friction in the path to conversion.
Validation
Canadian Tire
Validating Placement, Relevance, and Clarity with Users
With more time available, I partnered with the UX research team to run usability testing. The goal was to understand how placement, relevance, and interaction patterns shaped engagement. These insights guided the refinements that led to the final design.
Finding 1
Placement Drove Engagement
Users engaged more when FBT appeared within the product flow compared to the page end.
Finding 2
Relevance Increased Trust
Users trusted and interacted more when shown a small, relevant set of add-ons.
Finding 3
Clarity Supported Adoption
Users needed clearer navigation to add items smoothly.
Sportchek
Prioritising User Experience While Balancing Feasibility
With limited time for testing, I evaluated the approaches against 3 key criteria to prioritise the solution that best balanced user needs, feasibility, and business goals, guiding the design iteration.
Criterion 1
User Impact
Does the flow reduce friction in apparel selection and align with e-commerce best practices?
Criterion 2
Technical Feasibility
Can the design be built within constraints without affecting page performance?
Criterion 3
Business & PM Priorities
Does the solution support short-term delivery goals while creating opportunities to grow basket size?
Iteration
Based on usability testing insights and evaluation outcomes, we refined the initial designs into final solutions by focusing on these directions:
Canadian Tire
Refining FBT for Compactness, Trust, & Clarity
1.
Compact Placement
1.
Kept FBT compact within the product flow to balance visibility and reduce drop-off.
2.
Limit Add-Ons
2.
Limit recommendations to a maximum of 4 relevant items to build trust.
3.
Clearer Navigation
2.
Clarify FBT navigation to streamline add-on selection and purchase flow.
Sportchek
Refining FBT into a Usable, Feasible Carousel
1.
Carousel Layout
1.
Adopted a carousel to keep recommendations compact and scannable.
2.
Feasible Delivery
2.
Reused an existing component to minimise dev effort and speed up delivery.
3.
Intuitive Interactions
2.
Ensured carousel behaviour was simple and engaging for users.
Next Steps
Improving FBT Through Experimentation and Personalisation
A/B Test Design Variations: Track metrics like conversion, AOV, and engagement to validate that the redesign delivers business value compared to the original one.
Improve Recommendation Relevance: Work with backend teams to make suggestions more personalised and contextually useful.
Learnings
Adapting to Context, Designing Beyond the Feature
Adapting and Making Trade-Offs: I learned that there is no one-size-fits-all strategy as every design comes with unique contexts and constraints. The key is to maintain open communication with stakeholders, surface their priorities, and make trade-offs that balance perspectives. This strengthened my product mindset and will guide me in future roles to make informed and scalable design decisions.
Designing with a Holistic Lens: This project reminded me that even a small touchpoint like FBT is part of the broader shopping journey. Its design not only influenced engagement, but also shaped users’ trust in the brand and the value they saw in their basket. It reinforced the importance of connecting individual features to the end-to-end experience so they deliver impact at both user and business levels.
∗ ∗ ∗
Thanks for making it this far!
I hope my work gives a glimpse of the value I can bring. Let's unlock hidden opportunities together.
