A 46% task failure rate hiding in plain sight

eCom

Leadership called it a design refresh. I treated it as a diagnosis problem. Total Wine's mobile app account section had low engagement, negative app store reviews, and no clear explanation for either. The ask was straightforward. Update the design. I pushed back. Before redesigning anything, I wanted to understand why it was broken. I ran app analytics, pulled apart app store reviews, did a heuristic evaluation, and ran a tree test with 13 participants. The findings were worse than anyone expected. 46% of users couldn't update their payment method. People confused "My Orders" with "My Lists." The information architecture was fundamentally broken. I led the redesign from discovery through launch. Testing data changed stakeholder minds, I navigated a mid-development technical pivot, and the solution is live on the app today.

Role:Lead UX/UI Designer

Platform:Mobile App

Timeline:Discovery through launch

Status:Shipped and live

The Problem

Low engagement and public frustration

Features beyond primary account actions barely got used. App store reviews called out the account area specifically. This wasn't just internal friction. It was damaging the brand in a public channel that directly influences download decisions.

Users couldn't tell core features apart

A heuristic evaluation and pathing audit revealed fundamental confusion. Users were mixing up "My Orders" with "My Lists" and had no idea what "My Messages" was for.

Tree testing showed just how broken things were

A remote unmoderated tree test with 13 participants put numbers on what had been gut feelings:

Updating a payment method

TASK

You're getting a new credit card and want to update the one saved to your Total Wine account. Where would you go to do this?

Settings > Preferences > Payment Methods

54%Success Rate

46%Failure Rate

15%Directness

FINDING

11 of 13 users looked in the wrong section entirely.

Settings > Profile > Personal Information

TAKEAWAY

Payment method should live in the Profile section

"For me, a credit card setting is more a profile thing than a preference. I thought preferences would be more about sending notifications, allowing location sharing, etc."

Design Goals

Fix the structural IA failures

Get to the root cause of the 46% payment method failure and the My Lists/Order History confusion. Not just the symptoms.

Increase discoverability of high-value features

Surface loyalty, rewards, and reorder pathways that were buried.

Turn a utility screen into something people actually visit

The account section was a screen people went to only when they had a problem. It needed to become somewhere worth going back to.

Solutioning

Defining the problem before designing the solution

The initial ask was "low engagement, update the design." I pushed back on jumping straight to solutions and built the case through multiple evidence sources instead. App analytics showed which features were underperforming. App store reviews surfaced specific complaints. A heuristic evaluation identified IA issues. Tree testing quantified how broken things actually were. This diagnostic work changed the project entirely. What started as "refresh the account page" became "fix a fundamentally broken information architecture." The 46% failure rate on payment updates wasn't something I would have found by jumping straight to wireframes.

Structural IA fixes

Payment Method → Profile:

Testing revealed 85% of users expected payment settings in Profile, not Preferences. So I moved it there. That's a structural fix grounded in evidence, not a guess.

Clarified labeling:

Addressed the My Lists / Order History confusion by aligning labels with what users actually expected and separating the concepts more clearly in the hierarchy.

Removed broken-looking elements:

Fixed the "&More" formatting that users thought was broken.

Previous State Pathing Audit

New Pathing

Personalization features showing greeting, quick links, and rewards

Personalization & Engagement Features

Simplified navigation:

Combined "More" and "Account" into one unified page. Fewer taps, easier wayfinding.

Smarter entry points:

Added quick links above the fold for the most-used actions, informed by app analytics. The data made the prioritization defensible rather than opinion-based.

Personalization and engagement:

Added a personalized greeting, a preview of the next reward to encourage loyalty engagement, and surfaced the loyalty barcode for quick in-store access. The goal wasn't just fixing what was broken. It was creating new value from a screen that previously offered none.

Improved usability:

Redesigned the layout with clear section titles and chunked content for easy scanning. Left-aligned layout with stronger visual hierarchy, consistent icons for faster recognition, and "Sign Out" pushed to a less prominent spot where it belongs.

Influencing

Data changed stakeholder minds

Some stakeholders didn't want to move Payment Method to the Profile section. It had lived in Preferences for a while, and people worried about changing established patterns. The tree test data ended that debate. When I showed that 11 of 13 users went to Profile first and the current placement had a 54% failure rate, the decision made itself. This wasn't my opinion winning. It was evidence.

Same-day pivot under pressure

Mid-development, a technical constraint forced us to switch from the approved horizontal barcode to a QR code format. The dev team wanted to just swap the element without thinking about design implications. But a square QR code doesn't fit the same way a horizontal barcode does. I turned around an updated design the same day. Mocked up a solution that properly handled the new format, presented it to engineering leadership, and got buy-in to implement my recommendation instead of the quick fix. The shipped product reflects the considered solution, not the compromise.

Cross-functional collaboration

I presented designs through multiple rounds of stakeholder reviews, iterating based on feedback from product management and development. The final design reflected input from across the organization, which built the buy-in needed for launch.

Influencing stakeholders showing original, dev, and new designs

Outcomes

Reframed the project through diagnosis

What started as "refresh the account page" became "fix a fundamentally broken IA" because I invested in understanding the problem first. The 46% failure rate discovery changed the project's scope and urgency.

Testing directly changed the shipped design

Tree test results overruled initial assumptions. Payment Method was relocated because 11 of 13 users expected it somewhere else. The shipped product is measurably different because of the research.

Maintained quality under pressure

When a mid-development technical constraint threatened the design, I delivered a same-day solution and got engineering buy-in.

Positive reception across validation methods

UserTesting.com sessions got positive feedback. In-store demos with real customers generated strong responses. Internal stakeholders reacted well during the tech demo.

Shipped and live

The redesigned account section is in production and available to all app users.

Previous Project

I needed a better gut health app. So I built one.

Turdle

Next Project

From a sticky header idea to a full navigation overhaul