dmatters.png

AR Furniture Shopping

Overview

During Summer 2018, I joined DecorMatters as a Product Design Intern and helped the team build a better user friendly search experience. One of my projects was creating information architecture for categorizing items and redesigning a search experience on mobile app. I optimized search/filter usability and improved accuracy of search results. I determined user problems, conducted card sorting for information architecture, iterated solutions, conducted user testing, and finalized high-fidelity, interactive prototypes and UI animations with real-world data.

Role

Product design

Time

2 weeks, August 2018

 

Context

Improve DecorMatters' user experience for search on mobile web to increase user generate contents.

Methods & Tools

Card sort, Interview, Survey, Competitive analysis, Sketch, InVision, Principle


Business goals:

Increase user retention rate by doubling the number of UGC in Design Creation feature

User goals:

  • Find items that they are looking for and narrow down search results seamlessly

  • Quickly complete their design with less effort

Design goals:

Improve Design Creation feature (search accuracy, logical categories and filter navigation)

Project Goal

 

Décor Matters’ users enjoy decorating a virtual room with 90k+ of furniture and decorations across 11 brands such as Ikea and Living Space and publish their designs to get feedbacks from other users (UGC). I found that 80% of first time users entered Design Creation feature, but only 5% users completed a design because it took them about one hour to complete the design process. The search/filter is a key to quickly creating high quality UGC, so I initiated this project to make the search process more efficient allowing users to generate more content.

Determined Problem


DESIGN QUESTION

How might we improve home interior design experience with the AR app?

PROBLEM STATEMENT

How might we increase User Generate Contents?


Research

To understand the problem scope of existing solutions within this problem space, I conducted semi-structured interviews with 5 users who love home interior decoration and have used this app within the last 3 months and 3 users who never used the app before. I also conducted a competitive analysis with products related to our user group such as Houzz, Hutch, Havenly and IKEA . Also, with the product manager, we created online survey and got 70+ responses from the existing users.

 
Artboard.png
 
 
 

Journey map

 

#1 Low usability and learnability because the categories don’t seem logically organized

#2 Inefficient filter form and lack of essential filter/sorting criteria

  1. Users cannot apply popular colors (ex. Brown) and multiple brands

  2. Designer’s pick, trendy, style, sale items, etc

#3 No responsive and interactive results in real time (bubbles & filter result both)

#4 The filter is not discoverable enough and not interactive

#5 Inefficient search/filter and hence they don’t feel satisfied enough to publish their design

Pain points

 

Solutions

I identified a list of design requirements to address the problem statement. Most notably, the solution needs to:

#1 Help home decor lovers to quickly find items that they are looking for.

#2 Help home decor lovers to spend less time in finishing a design

#3 Help home decor lovers to feel satisfied enough to publish their design


Remove irrelevant options to reduce the time for faster loading time, better learnability and decision making!

Through the user testing, I found the previous categories of furniture and items do not match with users’ mental model, which caused confusion and low learnability. First time users struggled with finding desired items and had to visit all categories to find them, which is time consuming and not delightful. Users were also overwhelmed with a large amount of products being loaded at once, which also resulted in slow load times. Therefore, I conducted card sorting to make the categories simple and clear.

Cart sorts

 

Paper prototype

To quickly test our concept, I created the paper prototypes that demonstrate key user flow. Paper prototype allowed me to brainstorm on main features without expending too much resources. I iterated on my wireframe by conducting guerrilla usability testing with paper prototypes. With the total of 5 participants, I aimed to validate solution concept, clarity on components, and user efficiency.

 

Guerrilla user testing

Takeaways:

I iterated on the paper prototypes by conducting guerrilla usability testing with 4 participants. The goal was to test solution concept, clarity of components, and user efficiency. The participants validated the new design.

"This is easy to navigate!"

"I can quickly find what I am looking for."

"I can learn how to use(navigate) this!"


Hi-fi design

 

The previous design showed overwhelming categories in the small horizontal bar, which led to the slow loading and negative perception of data quality. Users expected to see relevant results when clicking a bubble, but experienced a long load time because too many irrelevant items are loaded at the same time. Users were overwhelmed and tended to scroll indefinitely, searching for items they want. This system prevented users’ A-ha moments to understand how it works.

Too many clicks

 
categorization_iteration2.png

I made the bubbles meaningful and interactive with users. When users tap a bubble, the bubble gives them 7-10 relevant categories, limiting items being viewed at one time, which decreases load time. Users no longer have to scroll much to find desirable items, his change created a more simplified UI allowing users to better understand how to navigate and use the system.

Less clicks

 

Time saved by:

  • Interactive design

  • Accurate search results

  • High learnability

  • Logical categorization

  • Faster loading

  • Decreased users’ effort for searching


Get accurate results

  • The previous filter design blocked the half of screen and applied result was not interactive. I chose the sidebar design which allows users to see results in real time when they apply different filters.

  • The previous color spectrum slider styles required a lot of effort to exactly select specific colors (ie brown) and showed no result very often. So I provide color palette to minimize users’ efforts.

  • The previous price slider selection didn’t allow users to have some ideas for set price range, which led to no results often. So I proposed a new price slider style with price ranges with the number of items to simplify price selection.

 

Customers shop multiple brands

  • The previous design didn’t allow users to choose more than 2 brands. However, many potential furniture shoppers want to mix items from various brands. So I added the number of items and let users choose multiple brands. Also, by providing the first letter index of the brands, when users have certain brands in their mind, they can tap an alphabet to find the brand immediately.

  • Also, I added Trendy, Sale, and Designer’s pick options based on users’ needs through the survey data that I conducted.

  • The previous design didn’t allow users to choose more than 2 brands. However, many potential furniture shoppers want to mix items from various brands. So I added the number of items and let users choose multiple brands. Also, by providing the first letter index of the brands, when users have certain brands in their mind, they can tap an alphabet to find the brand immediately.

  • Also, I added Trendy, Sale, and Designer’s pick options based on users’ needs through the survey data that I conducted.

 

Time saved by:

  • Faster refinement because of the search result accuracy (query sent at one time)

  • Filter discoverability

Due to the feasibility constraints, price slider filter cannot be applied immediately in real time.

 

Reflection

First design internship

I really appreciate my team members and my manager that they allowed me to proactively determine problems to solve and dive into the projects. I was able to learn how to communicate with engineers, project managers and senior designers and think about how effectively deliver my thoughts. I became able to think about feasibility and business model to meet a business goal as well as delightful designs.

Make an impact

I increased KPI (UGC) by up to 3 times by the new sign flow that I’ve worked on. I proposed new popup to generate more UGC and increase signup rate because data revealed that the best timing for encouraging sign-up is when users want to save content. Seeing my design impacting the world is exciting and meaningful.

Screen Shot 2020-01-02 at 11.32.23 AM.png