01 · THE PROBLEM
Helping a customer find a product, or answer a question about it, took crew too many steps and workarounds.
02 · WHAT I DID
Interviewed 5 crew, used Miro AI to synthesize and then challenge my conclusions, and tested a prototype built in Figma Make.
03 · THE RESULT
Five new crew testers finished real tasks in seconds; the one repeated stumble was fixed after two redesigns.
01 · Problem
Problem: Helping customers took too many steps and workarounds
When a customer asks for something, I sometimes need more than two minutes to find it in Quick Item Lookup, even with the workarounds we're all trained on. Search only works with the exact product name, and stock status shows what but not why or when. The customer waits, and I lose confidence in my answer. I interviewed 5 crew members across signs, ordering, floor crew and supervision to learn whether others felt the same.
4 of 5 struggled with exact names, spelling or accents, including a crew member with an IT background.
Crew are trained to search one keyword at a time to work around it.
Each role needed different stock information: why it's out, when it's back, what's new.
The challenge: help crew find a product and the information a customer asks about, quickly and with confidence.
02 · DESIGN Decisions
Three choices that put the answer first
Forgiving search with suggestions as you type
Option I considered: AI-powered natural-language search.
What I chose and why: search that handles misspellings like "halumi" and everyday descriptions, with product suggestions as you type. It solves the core problem without adding complexity to a sales-floor tool.
What I gave up: understanding vague descriptions like "the one in the blue box," saved as a future idea.
Keep Home to three things
Option I considered: a Home screen packed with filters and 21 department buttons, so any section was one tap away.
What I chose and why: Search, Most Viewed and Browse All Sections. A design critique flagged the overload, so one button now leads to sections grouped into five departments.
What I gave up: one-tap access to every section.
Keep Home to three things
Option I considered: a Home screen packed with filters and 21 department buttons, so any section was one tap away.
What I chose and why: Search, Most Viewed and Browse All Sections. A design critique flagged the overload. Hick's Law says more choices mean slower decisions, and 21 buttons is a lot to scan with a customer waiting. One button now leads to sections grouped into five departments, small chunks that are easier to hold in mind (Miller's Law).
What I gave up: one-tap access to every section.
Show why it's out and when it's back
Option I considered: a simple in-stock or out-of-stock label, like today.
What I chose and why: the reason (seasonal, temporarily out), an estimated return date and the last delivery, right on the product card. That's what customers actually ask. I also iterated on the wording: "Likely on shelf" became "In stock," because nobody could say what "likely" meant or how many units it implied.
What I gave up: a simpler card with less to scan.
How AI fit into every step
Interviews (5 crew) → Synthesis (Miro AI) → Critical review (Miro AI) → Insights v2 → Ideation (me + Miro AI) → Wireframes (Balsamiq by hand, then Miro AI variants) → Design critique → Style guide (Figma AI) → Prototype (Figma Make) → Usability test (5 crew)
Where AI helped: Miro AI turned five transcripts into an affinity map and first insights, drafted the PRD and diagrams, and offered more layout options based on my hand-drawn wireframes. I pulled styles from the public Trader Joe's website with the html.to.design plugin, and Figma AI turned them into a style guide (type, spacing, colors, buttons). Figma Make built the clickable prototype from my wireframes, and ChatGPT filled in realistic product names.
Where I made the call: I sketched several Home layouts by hand before asking AI for more. I had AI challenge my own insights, and it caught claims my evidence didn't support, so I rewrote them as hypotheses. I kept my ideas and AI's on different colored sticky notes, cut the AI search feature, and dropped Userdoc when it didn't help.
The tradeoff: because AI made a realistic prototype fast, I skipped testing low-fidelity wireframes and tested high fidelity first. It saved time, but testers may comment less freely on something that looks finished.
03 · TESTING
The hardest thing to find was the button I thought was obvious
I tested the Figma Make prototype with 5 crew members I hadn't interviewed, of different ages and roles, using 8 real tasks, like finding a misspelled "halumi" or checking whether another store had an out-of-stock item. They thought out loud. Most tasks took seconds.
Before: "Check Other Stores" sat under the delivery calendar, then under the product image, where testers overlooked it.
After: it sits right after the product details, where people look once they see an item is out of stock. Later testers found it on their own.
Image: the three positions of Check Other Stores, side by side.
Two smaller fixes:
Suggestions open the product directly. I assumed tapping a suggestion would show search results; testers expected the product page.
Removed "Sort by relevance" from browsing. One tester asked, "What does relevance mean?" Without a search, it doesn't mean anything.
What surprised me: old habits stuck. Testers still typed one keyword at a time, and when an item showed a clear reason like "temporarily out of stock," many didn't bother checking other stores.
04 · Final Design
From a customer's question to a confident answer
Home: search, most viewed and browse, nothing else competing for attention.
Search suggestions: products with stock status appear as you type, even when it's misspelled.
Product detail: price, stock, why it's out and when it's back, in one place.
Check other stores: nearby stores sorted by distance, with phone numbers, so no one has to know a store number or search the web on weak in-store reception.
Browse all sections: 22 sections grouped into five departments.
Without real catalog data, I built a sample catalog, then expanded it so results and sections felt realistic and testers would behave the way they do on the floor.
Try the prototype ↗
05 · Reflection
Better search is only half the fix
Testers moved through every task quickly, but they still searched the way the old tool trained them to. Assumptions are fine as a starting point, as long as I keep testing them, and this project tested several of mine. I'm considering a short memo to share the strongest ideas at work, starting with suggestions as you type.
What I'd do differently:
Help people break old habits, with hints like "Try typing how a customer describes it," since better search doesn't help if nobody tries it.
Measure against the current tool, timing the same tasks in today's version so the improvement is a number, not an impression.
Test on the sales-floor tablet, not a laptop, so touch targets and screen size match real use.
More case studies
Self-initiated concept · Mobile tool
Trader Joe’s Quick Item Lookup
A faster way for crew to find a product and check stock while a customer is waiting.
View project →
Research + design · Web
ASU Food Insecurity Assistance
Helping students find the support they need without added friction or stigma.
View project →
Email me
Résumé