UX DESIGN CASE STUDY
Re-designing an Automation Process the Right Way
| My Role: | Lead UX Designer- sole contributor from discovery to ship |
| Company: | The Home Depot |
| Project: | Pro Quoting Tool: Bulk Upload |
| Timeline: | 10 weeks, discovery through ship |
| Methods: | Contextual inquiry, iterative design, UAT, GitHub validation |
| Deliverables: | Figma prototype, dev handoff, production validation in sandbox |
The Challenge
Pro Account customers at The Home Depot often make large purchases on behalf of a business. Those purchases require sign-off from a designated approver, but there was no formal mechanism to get it. The solution in practice: associates called the customer.
That meant approvers were fielding unexpected phone calls mid-job or mid-meeting. Associates were stuck waiting, sometimes following up multiple times. Orders sat in limbo. There was no record of who approved what, or when. The friction was not just an annoyance. It was a gap in the purchase flow that introduced delay, inconsistency, and a paper trail problem for high-value B2B transactions.
How do we give Pro account approvers a fast, reliable way to authorize purchases without requiring them to be at a desk or on a call?
Understanding the Users
T2C introduced a two-party interaction that hadn't existed before. The automated system triggers an authorization request in the background when a Pro purchase is initiated. The Pro Account Approver receives it and takes action, usually on a job site, in a meeting, or away from a screen.
The approver was the critical user to design for. They needed enough information about the purchase to make a confident decision, but they were likely busy, on mobile, and not expecting the message. Every word in the SMS interaction had to earn its place.
Harris D.
Pro Account Approver — Commercial Contractor
Avg. authorization
~$1,200
|
Profile
|
Behaviors Approves purchases between tasks
Relies on phone for business decisions
Rarely at a desk during the workday
|
||||||||
|
Goals +Authorize purchases without leaving the job site
+Keep projects moving without interruption
+Trust that the request is legitimate before acting
|
Pain points –Unexpected phone calls mid-meeting or mid-task
–No way to verify a request without calling back
–Orders stalling while waiting for approval
|
Workshopping the Design
SMS is an unforgiving medium. There is no visual hierarchy, no branded button that signals this is safe to tap. Just text arriving on someone's personal phone, asking them to act on a business transaction. The message had to include enough context to act on without overwhelming a small screen, and the reply mechanic had to feel unambiguous without any onboarding. The approver would never have seen this flow before.
The design problem was not complex in terms of screen count. It was precise. The message needed to surface six pieces of information: pickup person name, store number, purchase amount, job name, order URL, and store phone number. Getting all of that onto a small screen, in the right order, without losing the approver before they reached the reply instruction, was the entire UX challenge.
The SMS Needed to surface 6 pieces of info:
Pickup person name
Store number
Purchase amount
Job name
Order short url
Store phone number
How do we fit the required information into a text message with limited space, in the right order, and without overwhelming the user?
Prompting the Story
Once the flow was designed, I ran into a communication problem that is common in enterprise UX. How do you help stakeholders feel the user experience when the interaction lives entirely in a text thread? Static wireframes can show structure. They cannot show the moment.
To close that gap, I used a chain of AI tools to generate photorealistic personas in realistic settings, then built a short video loop to show the feature in motion. Claude handled the image generation prompts, specifying environment, lighting, body language, and device interaction for each persona. Google Gemini (Nano Banana 2 model) generated the photorealistic images. LTX Studio animated the scenario into a five-second video loop.
Impact and Reflection
Text 2 Confirm shipped to production. The stakeholder communication approach, including the AI-generated visuals, helped align leadership around the user context early and contributed to the design moving forward without significant revision. Translating a text-thread interaction into something stakeholders could see and feel was as much a part of the design work as the flow itself.