← Back to Resume
dunnhumby  ·  2019–2021

Redesign Range Functionality — Recommendations Engine

Interaction Design Data Tables B2B Enterprise User Research Workshop Facilitation Agile Design Thinking
My Role
Lead UX/UI Designer
Company
dunnhumby
Timeline
2019–2021
Methodology
Design Thinking
Range Functionality Final Design
Final range functionality design — force in, force out, keep, and reset states solved through design thinking methodology

Redesigning a core product interaction that users had abandoned for Excel

This project was part of a "Design Thinking in Action" portfolio presentation for Workday, showcasing how design thinking methodology was applied across three complex enterprise design challenges. The range functionality redesign at dunnhumby was one of the most impactful — taking a critical data table interaction that was so complex users abandoned it entirely, and transforming it into something intuitive, accessible, and genuinely useful.

Tools used to establish the audience & identify user needs

User Interviews & Shadowing

Interviewed users and shadowed their usage of the tool to observe real-world behaviour — seeing firsthand how users struggled with the existing interaction model.

User Survey

Surveyed users to quantify behaviours and usage patterns, turning qualitative observations into measurable data to build the case for redesign.

Persona Creation

Collated user data to build a detailed persona that captured the range planner's goals, digital literacy, experience levels, and key pain points.

Design Workshop

Facilitated a design workshop with internal users, the PM team, and development to create user flows and identify what was known and unknown about the problem space.

Problems and user needs identified

📋
Steve King
25 years old  ·  Category Lead, dunnhumby
"I like working on something that's having a positive impact on our customers, as well as the future of the business."

Steve's workday is often stressful as his focus is spread across several categories. He juggles his time between creating Customer Decision Trees (CDTs) and collating insights from different dunnhumby products.

Decision Making
InstinctData
Mobile Apps
Not muchExtensive
Social Networks
Not muchExtensive
dunnhumby Products
010+ yrs
  • Grow category sales and margin through deeper understanding of product relationships
  • Optimise shopping experiences by considering the customer mission when building planograms
  • Streamline product ranges to improve profitability, basing decisions on CDT insights
  • Build trust by presenting robust supporting evidence for proposed changes
  • Drive consistency across stores
  • Takes a long time to build and iterate the CDT then translate it into the planogram
  • Existing product was complex, required extensive ramp-up, and was not accessible
  • Time-poor — needs fast tools to complete tasks efficiently

Solving 6 interaction states — intuitively

The existing design relied on a dense visual key to communicate six different states — using combinations of cell backgrounds, border styles, side icons, and indicator dots that users simply couldn't decode in the flow of making commercial decisions. The interaction model was so complex that advisors admitted they exported to Excel instead.

Original range table design with a dense visual key combining cell background colour, square background, border style, and indicator dots to communicate six different states
Before — the original design encoded six states across four visual layers (cell colour, square colour, border style, dot style), forcing users to reference a separate key to interpret every row

After the research phase and all-day workshop, I designed a new interaction model that replaced the visual key with clear, labelled action controls — inline in the table, without requiring any external reference.

Keep

Product should remain in the recommended range as-is.

Keep Out

Exclude from range — user confirms to keep product out.

In

Product is currently within the recommended range.

Out

Product is currently outside the recommended range.

Force In

User overrides recommendation to force product into range.

Force Out

User overrides recommendation to force product out of range.

The design also introduced a Reset action — allowing users to revert any override back to the original recommendation, giving them confidence to experiment without fear of losing the baseline.

Range design showing force in and force out states
After — state indicators are immediately readable without any key; actions are taken directly within the table

Agile retrospectives driving continuous improvement

The closure phase was embedded into the agile process — rather than a single project close-out, the team ran retrospectives at the end of every two-week sprint using Trello to capture what went well, what needed to change, questions and discussion, and action items to carry forward.

✓ Went Well
  • People love it
  • Hit the launch date
  • Increased app usage after launch
  • Were able to deploy improvements quickly after main launch
△ Needs to Change
  • Scope not clear with a super tight deadline
  • User confusion around the existing app
  • User confusion around how sending updates would work
  • Product's breakdown of related changes to teams didn't work well for developers in practice
  • No clear definition of success/failure for the project

Action items from retrospectives were fed directly into the next sprint — ensuring the design continued to improve iteratively based on real-world usage and team learnings.

From Excel workaround to a product users actually love

The redesigned range functionality was received positively by users — the retrospective feedback captured "people love it" and "increased app usage after launch." By removing the complex visual key and replacing it with clear, inline action controls, the product became genuinely usable for the first time.

6
Interaction states fully solved
↑
App usage after launch
↓
Excel workaround usage