Shop Talk
Adding the human element back into online shopping
The Problem
This project was contracted by American Dream, a company with many in person and online retail establishments, who were looking for innovative ways to engage online customers. They had a flexible initial concept of what they wanted, but the problem at the heart of the project was to find new ways to improve customer retention and satisfaction, convert more sales, and help American Dream’s properties stand apart from other online retail experiences.
Role: UI/UX Designer, Project Coordinator
Team: 4 Remote Designers
Process: Client Consultation, Project Planning, Team Coordination, Competitive Analysis, User Flows, Wireframing, Prototyping, Usability Testing
Timeline: 4 weeks
Tools: Figma/Figjam
Project Preparation
The project began with an introductory video call between all 4 team members. We had never met before, were all in different time zones, and had different work schedules and commitments, but we were excited to overcome these roadblocks and collaborate to best serve our client.
Client Consultation
After meeting the team, we spoke with the client, who described the project as a Shopify plugin that facilitated video consultations between an online shopper and an in-store associate. For example, customers could call and ask an associate to find a dress that matched shoes they already owned (showing the shoes on video call or uploading an image beforehand), and the stylist could provide personalized assistance, boosting the customer’s confidence in their purchase and leaving them with a positive impression of American Dream’s brand.
The project was a “proof of concept,” which the client might or might not continue developing. They provided a staging site for our designs, but hoped the plugin could be adapted for multiple retailers with minimal tweaks.
I asked follow-up questions to clarify the client’s goals, competitors to research, scope expectations, preferred update processes, and any existing user insights. With this understanding, we wrapped up the initial meeting.
Project Planning
After the client call, the team met to align our interpretations of the instructions. I created a project schedule to establish internal deadlines and ensure we could routinely provide deliverables for client feedback. Due to differing time zones and schedules, we couldn’t collaborate live often, so we had to structure the project to allow independent work while maintaining cohesion.
I suggested we each conduct initial research separately, then reconvene to compare notes. We would then break off again to create user flows and sketches, coming together once more to merge the best ideas. Tthis added upfront work, but it expanded our research base, kept our initial ideating broad and creative, and ensured each designer’s influence was present in every corner of the product. It allowed us to efficiently share ideas and distill the best features from everyone’s concepts, while keeping the big picture in mind.
Research
I began with competitive analysis on video consultation retail plugins (including examples that the client had provided). My biggest takeaway was that there were already tools that did exactly what our client had asked us to design. He had even considered using one of them and was only deterred by the price. Since our goal was to create a "proof of concept" to increase customer engagement, simply replicating existing solutions wouldn’t add value. We needed to approach the project with a fresh angle tailored to American Dream’s needs.
The client intended for the tool to primarily assist customers with clothing purchases, so I expanded my analysis to companies like Nordstrom, Stitch Fix, and independent stylists’ sites to understand what we could do for both customers seeking shopping guidance, as well as associates providing it. Some important things to keep in mind were:
I also performed general secondary research to determine how we might use this format to bridge the gap between in person and online shopping. How could we get the best of both worlds? Some more takeaways included:
When online shopping, people dislike endless scrolling, ending up with clothes that don't fit, and discovering material and colors differ from how they appeared online. We can highlight that a consultation call can potentially alleviate all of these concerns.
Access to a customer’s purchase history, customer lifetime value, average order value, browsing behavior, and preferred products can all help associates make sales, on top of their own skills and inventory knowledge.
Valuable insights from other team members’ research included Shopify specific technical details, thorough breakdowns on the pros and cons of many video conferencing applications, and other valuable areas that were not the focus of my own research. We all combined our research to inform our next phase of ideation.
User Flows and “Sketching”
With a better understanding of the problem space, the team split out again to create user flows and digital “sketches” that we could use to communicate our concepts of the overall product to each other. I mapped out the process for booking appointments, gathering customer information, and the call experience for clients and associates. In addition, I included the client and associate “dashboards” for appointment management and preparation.
I translated the flows into my digital sketches. The associate dashboard emphasized easy appointment management and quick access to client details. The customer intake flow streamlined the collection of preferences, fit details, and session needs. The call flows balanced product browsing, reference access, and video focus for showcasing items in real time.
Customer answering part of the style quiz
Associate video call
Associate view of client appt
Consolidating Ideas
The team gathered to present our "sketches" and refine them into a cohesive set of low-fidelity wireframes. I had us add our flows to a Figjam file and briefly present our concepts. Afterward, we reviewed each flow, discussing the best ideas, solidifying necessary features, and determining key screens. We combined elements from each flow, adding notes to clarify features. By the end, we had a clear list of agreed-upon features and screens, with everyone’s input reflected.
With a unified vision, we divided the work: each team member was assigned one of the four main flows—style quiz, appointment booking, client-side call, or associate-side call—to turn into a low fidelity prototype for testing. If time allowed, we could also work on the dashboards.
All research and initial ideation took only a few days, so we could quickly present the client with a well-informed plan. We shared the flows we intended to develop, our project schedule, and our intention to design our solution with a specific bent towards clothes shopping, and got client approval before moving into the next design phase.
Low Fidelity Wireframes
I volunteered to work on the style quiz flow, drawing from my research on personal shopping competitors and shopper motivations. My focus was on helping customers find the best fit—since that’s the top priority for clothing shoppers—while making the process feel easy and approachable. I also aimed to include tools that would assist users who weren’t sure of their style or needs in clearly communicating their preferences to the consultant. It is worth mentioning that we had sent out user surveys to our client’s employees who would be providing the styling services to try to better understand their needs, but we only received one response, so we couldn’t draw many conclusions from that avenue.
Prioritize Fit
Easy Style Description
Usability Testing
Each team member tested the entire low-fidelity product with two users, providing us with feedback from eight users without overburdening anyone with scheduling or conducting interviews. I created a Google Sheet for the team to compile feedback, note solution ideas, and track when concerns were addressed. The initial tests highlighted several areas for improvement:
Simplify Video Calls: The call screens were cluttered with redundant features that confused users. We streamlined them to keep focus on the shopping experience, rather than on lots of unnecessary UI.
Reorder Appointment Booking & Style Quiz: Users were sometimes confused by the order of the quiz and felt that the onboarding flow had too many steps.
Service Lacked Appeal: Users were generally unconvinced by the value of the video calls. We decided to offer a simpler service to retain users who may find the video calls overcomplicated, while still having the option for those who wanted it. We also resolved to better communicate the service’s benefits.
We presented the initial wireframes to the client, who was pleased with the direction, and he provided some feature suggestions for the next round of design.
High Fidelity Design
We addressed user concerns by streamlining our flows and simplifying the UI. Notable improvements included:
Revamping the Lookbook: Initially, the 'lookbook' was a selection of individual products that the consultant could present during the video call. Based on feedback, we changed it to feature full outfits styled from 4 store products, similar to the Pinterest-esque “select outfits you like” screen that users loved from the first round of testing. We also separated the look-book into an entirely separate service, where users could fill out the style quiz and receive personalized suggestions without having to interact with the store associate. The lookbook could still consist of individual product suggestions if the client indicated they were only focused on certain product types (“I already have the shoes I want to wear, I’m just looking for dress options”), or if the retailer employed associates who didn’t feel qualified to perform styling services, but this expanded functionality engaged more customers, increased the chances of people finding clothes and completing purchases, and showcased the stylist’s value, potentially encouraging users to try the video call option.
Removing Account Creation: Users were hesitant to create accounts, as they only needed basic functionality. We removed the account requirement and client dashboard, instead emailing users links to join calls or access look-books. This reduced barriers to entry and allowed us to focus on more critical flows.
Making sure our features were easily implementable: The client had expressed concern about the revamped lookbook, worrying that showcasing products as outfits would require photoshop skills or extra resources. I proposed displaying outfits using only product thumbnails side by side. When building the lookbook, the associate would use an interface similar to searching the online store, but instead of selecting “add to cart” they would simply add to a look-book outfit. We tried to apply this philosophy of “using what the store already has” as much as possible throughout our designs, since if this plugin was to be used on multiple different websites, the fewer “hard coded” unique features we had, the more adaptable it could be.
Reimagined Lookbook
Final Testing
Our second round of testing went significantly better than our first. Users were much more likely to engage with the lookbook service, better grasped the value of the associate calls, and were no longer problematically confused at any point during the process. The client was also pleased with the efficient flows, and the look-book feature that offered value to American Dream customers that wasn’t already available in existing video retail plugins. We incorporated some quality-of-life feedback and improved the overall visual consistency and polish, and the final designs are below.
Customer Intake
Customer Reviewing Lookbook
Consultant Appointment Prep and Video Call
Personal Takeaways
This project was a valuable lesson in team management. We faced challenges due to scheduling constraints and learned a lot in the process. While we didn’t always succeed—many issues in our first round of testing stemmed from limited time to review and revise wireframes as a team—we always adapted and improved our workflow.
I also discovered that I enjoy running meetings. Having often been frustrated by unproductive calls, I was happy to take on the role of ensuring our meetings were efficient, focused, and goal-oriented. My teammates expressed appreciation for my efforts, and I found the process rewarding.
Next steps
There are many ways I would progress with this design. Primarily, I would flesh out the flow for individual retailers to apply and tailor this plugin to their own sites. We designed it with lots of flexibility in mind, including the ability for retailers to set pricing, edit offered services, manage consultant availability, personalize stylist profiles, and more. Clarifying how all these customizable settings would function would be my next priority. I would also like to create a desktop version of this plugin, as many users gave feedback that they would likely take a video call or do serious online shopping from their computers. Overall, however, our client was pleased with the product we delivered, and I am happy with the services we provided. Thank you for making it to the end of this case study! Please feel free to browse more of my work below or reach out to chat.