In less than 6 screens, I created a design sprint prototype that rendered exceptional feedback during interviews. Could my solution to this 5 day challenge be viable  for   e-commerce sites and online shoppers?
My Role: UX/UI Designer
Purpose: Google Venture/Modified Design Sprint
DAY 1-MAP
House2Home is a E-commerce website that sells home decor items and accessories. Products sold are between the prices of $10-$50. The company wants me to design a solution to quell their customer's pain points via product starter kits. The requested deliverable is a website to mainly be viewed on large screens.
The specific customer I will be designing for are those that just moved into their new home or apartment. And they want to personalize their home, but don’t feel comfortable doing so and want help with the process.
What User Want:
Wants to spruce up apartment while sticking to a budget
Wants assistance with searching for the items
Wants help finding a specific look for her home
Wants to balance; quality, quantity and budget
Insights
The one thing that shoppers mostly wanted, was to be able to find products for their homes that were within their budget.
Using a lightweight prototype I mapped a solution for end-to-end experience for users to purchase kits on the House2Home Site. First the user visits the site, clicks on the help button, answers a few questions and then is offered a kit suggestion. From there the user can modify the offering or purchase the kit.
Day 2 - SKETCH
On day two I completed a version of lighting demos. A process of reviewing likes and dislikes of sites or apps that solve similar problems.  I studied a few of the solutions and considered what parts would work in my design.
The picture cards on Pinterest site are ideal for customers to collect items that interest them visually.
This display of offerings could work for all  House2home customers to get an overview of what products are amongst its selected category.  It’s a clean look.
“I do a lot of searching and saving on Pinterest- but the photos are usually of full rooms that I like the look of.”
Macys detailed filter helps customers narrow their options from color, material brand, sales, size and price.
This filtering option would be especially perfect for House2home customers to filter select features and price based on their various needs. 
“I wanted to buy some stuff to make it a little more stylish. I knew I needed a few things, but it was hard trying to stick to a budget”
Wayfair has the same filtering capabilities as most retail stores, but one thing that makes this site stand out is the ability to search based on the room you are purchasing for. This option here is a way to get customers to upload their living space to virtually try out the products in the House2Home store.
The filtering option for these sites work well and are predictable. You put in search criteria and the result is a list of individual product offerings.  Usually displayed at the bottom of the top offerings are other similar products or things that were often purchased in conjunction with the specific product you were interested in. So, I wanted to explore solving the challenges of House2Home customers' troubles of narrowing down what they wanted.  By offering a filtering system that resulted in reduced choices I think customers are inclined to be less indecisive and make a decision to purchase quicker. 
Using the Crazy 8s exercise I quickly sketched out solutions for an easier filtering system that would lead to a population of kits based on the responses users had given on the filtering screen. 
The filtering screen I selected to move forward in the design process will allow users to filter product options in detail and fast
Day 3- DECIDE
The screens I decided to create a high fidelity mockup to test my idea and get straight to the point. 
Screen 1 The user visits the site and can click “shop for me” to the filter screen.

Screen 2 The filter filters the criteria to define search results for kits 
Screen 3 Kit contents are displayed with individual price listing and kit edit options and total kit pricing (shipping and taxes are included). From this screen users can purchase the kit without adding the collection to their cart.
Screen 4 When individual items are selected users can choose to replace items for equal or less value.   
Screen 5 The sketches below shows screen 5 to be the confirmation page. But after some thought I add a payment and billing page before it.
Screen 6 Confirmation of completion of purchase
Day 4 -  PROTOTYPE
The most challenging part of Day 4 is making the decision to NOT include details that I think matter over crucial details that do.  The balance between making a realistic website prototype enough for users to get a good feel of it’s function, and doing just enough for speedy and lean prototyping to  test effectively was challenging. I eventually decided to create an extra lean prototype for users to quickly get on with critiquing and analyzing the concept instead worrying about the perfect button color.
Within 5 screens I was able to convey my idea and get good feedback from the users. I hope to learn if curtailing the shopping and purchasing process for frustrated users is something that test subjects would appreciate during usability testing. 
Home page of the website with prominent Shop For Me buttons placed near the search bar and among the product categories.  I had a couple of ideas to name the buttons that initiated  the kit filtering feature. A few were “Help Me”, “Grab and go kits”, “Kits to go”.  But, I thought “shop for me” would eliminate frustrations for shoppers based on the insights about what users want:

Wants assistance with searching for the items
Wants help finding a specific look for her home
Wants to balance; quality, quantity and budget

Screen 1 | Homepage

Screen 2 | Popup screen with filtering options

Screen 3 | Results of the filtering search

Screen 4 | Edit Product Page

Screen 5 | Billing and payment

Screen 6 | Confirmation

DAY 5 - TEST
‘Test my prototype!’ I put this call out to several slack communities that I’m a part of and a few good people responded. 
The users: 5 women - had enough eCommerce shopping experience to have predictions and expectations of how e-commerce stores work 
All users were presented with the scenario: you visited the store and struggled for some time to find new bathroom items that fit your aesthetic and your budget. Visit House2Home to do your shopping.

Virtual interview with Tanner B. | May 15, 2020

Usability Test Insight
Minor/Major/Sad FAIL! Only two of the participants willingly or instinctively clicked on the button “SHOP FOR ME”. They opened the prototype and Even after hearing the scenario: “you visited the store and struggled for some time to find new bathroom items that fit your aesthetic and your budget. Visit House2Home to do your shopping”, they continued to shop as normal.  
I think the issue is “shop for me”. It's not a typical e-commerce option. When I asked participants why they didn’t click on it, they said they thought “shop for me” was just a filtering option.  No doubt they were surprised by the new process of ordering and was not expecting the end results.
Shop For Me works for her
3 out of 5 participants appreciated the idea of having a quick shopping experience via the Shop For Me feature.
"I really like that you can package it together"  It makes it seem like magic. If I've been on here for 2 hours and [shop for me] pulled up something for me in 5 seconds, I would be a lot happier. I would buy something." 
The participants that were pleased with the overall concept of tailored kit offerings thought the process narrows down what she might be looking for which made shopping easier.  Participants also expressed that less options were helpful to reduce impulse purchases and reduced the feeling of being overwhelmed.  
“I get distracted easily...I like that I can be specific about what I want..I'm not the person you want to go shopping with unless you want me to spend your money".
Even though the narrowing of options was appreciated, participants expressed the need for flexibility during their shopping experience.
Shop For Me doesn’t work for her
“I prefer to be in  control of my purchases. I shop by reviews. I don't see Shop For Me being beneficial to me. 
2 out of 5 participants preferred to do their own shopping and didn’t Shop For Me feature would be helpful.  These participants thought the restriction reduced their options and altered their shopping behavior too much.
Design failures and successes
While prototyping designs in sprints, you have to strategically decide what parts are important to show and work through. The goal is to present a lean prototype to participants with just enough detail for them to test and for you to gain helpful insights.  I was a little too lean in some parts of my design. I did not adhere to consistency and standards and some of my design choices confused all of the participants.
For instance on screen 3-  results of filtering options-, I placed an “x” on the top left of the products.  Clicking the “x” led participants to the 4th screen which was the -  edit your product page-. Participants were confused by this because according to design principles - consistency and standards- “x” means exit or delete.  In my prototype I used “x” to transition pages.  I won’t do that again.
Results of the filtering options
Overall this modified Google Venture process is another tool to solving complex challenges for designing for what users want and need to be happy with a product. I can see myself using this method of design to brainstorm solutions for existing websites or applications. Can't wait for the opportunity to do it again.

You may also like

Back to Top