House2Home: A Home Decoration Solution

Tools Used

Figma, Marvel App

Timeline

1 week

Role

UI/UX Designer


This project was designed to relieve the overwhelm of decorating a new home or apartment without an interior designer.

The Challenge

Create a solution for House2Home (a new startup), who wants to make it easier for people to decorate their new homes and apartments on a budget.

Project Goals

My Process

This project was a 1-week modified GV Design Sprint.

01

EMPATHIZE

I started this project by reviewing the existing research on the problem. I wrote down the key pain points that participants mentioned in order to visually see the common themes.

The Top Concerns For New Homeowners are Looks, Cost, and Time

Synthesis

By categorizing the pain points from the research, I concluded that the goals of a new homeowner were:

  1. Trying to decorate their home are sticking to their budget

  2. Making sure the items look good together

  3. Saving time

I created a map of how a user would flow through this product. The flow starts as a New Homeowner will select from a variety of looks, then enter their budget, then enter the ideal number of items they’d like to purchase, then upload a picture of their room, then virtually see the items in their room, then purchase the items & have a decorated home.

02

DEFINE

Defining the Pain Points That New Homeowners Face

Problem Statement

With the key pain points understood, I define the problem statement for this project as:

03

IDEATION

I was interested in finding products that had the ability to select from a variety of looks, enter your budget, see products in your room, and easily purchase items. I used Lightning Demos in order to understand what works well in other companies and industries, and then captured the good ideas from each.

Reviewing Great Solutions & Remixing Old Ideas

Solutions

Other Companies: Companies in the Home Decorating Industry

The IKEA Place app allows users to try out furniture in their room to see if it will look good before purchasing.

The screen is very simple with a quick instruction of how to place an item.

The Houzz app allows users to get inspiration while filtering by style & budget.

Users can look at an inspiring photo & select an item by clicking on the price tag icon to see more details.

Other Industries: Similar features in different industries

The 3D Try-On in the Zenni app allows users to try on each pair of glasses directly from the item listing.

Users can save uploads of their face so they can try on other glasses without having to upload a new picture.

Crazy 8’s

I sketched 8 possible screens for a user to upload a photo of their room and see home decor items in their room before purchasing. This would be the bridge between a user browsing through possible items & purchasing them.

I sketched out my Critical Screen, and the screens before and after my Critical Screen. The 1st screen allows a user to select an item. The Critical Screen allows a user to see the item in their room with an option to add an item. The last screen allows a user to see more items, edit, and checkout.

I proceeded with the best solution for saving time by creating a minimum number of steps in the user flow, staying within budget, and making sure items look good together.

This solution is: A user enters their preferred style & budget, then selects items to proceed with a virtual try-on, and the purchase items directly from the try-on screen.

Building the Blueprints For a Prototype

Storyboard

I sketched out a 15 panel storyboard in which a user wants to create a beach style in their room, stick to their budget, and buy 3 decor items.

I built the panels by working my way backwards through the storyboard. I found this to be easier than working forward, as I could easily figure out what the user would need to do before they got to the next step.

Though there were 3 screens that a user would need to go through in order to select each item, the screens were simple & familiar so a user could easily learn & flow through them.

04

PROTOTYPE

Creating Screens and Linking Them Together as a Prototype

Prototype

I was challenged to create a prototype quickly in Marvel, that was more focused on functionality than UI. I was able to complete the designs in 1 day, producing a workable prototype that was ready for usability testing.

05

TEST

I hosted 5 remote moderated usability tests, each lasting about 30 minutes, including a short introduction, an interview, a task performance, and a debrief.

Usability Test Goals:

  1. Quickly & easily find items to decorate their home

  2. Stay within their budget while shopping, with no surprises at checkout

  3. See how items look together in their room prior to purchasing

Testing the Prototype To See If it Would Solve Users Needs

Usability Testing

Usability Testing Top Findings & Recommendations

Users had trouble understanding that the “Try In My Room” would help them see home decor items in their room.

I recommended changing the text to read “3D Try On” in order to make it more clear for users that they could see home decor items in their room here.

Some users had difficulty finding the ‘Add First Item’ button at the bottom of the screen.

I recommended changing the color of the button to make it stand out more & moving it to the center of the screen.

Users wanted to see the price of items prior to checkout.

I recommended adding the price on the item’s price tag on the 3D Try On screen.

OUTCOMES & LESSONS LEARNED

The round of usability testing I conducted showed that participants liked the simplicity of the flow, and enjoyed the concept. Each participant specifically stated that they liked the ability to select their budget prior to browsing in order to ensure that they would not go over.

Test Participants Liked Selecting Their Budget & Seeing The Items In Their Room

Outcomes

As this was a Design Sprint, I spent the majority of the time analyzing the research and ideating a solution, and far less time preparing the UI for the usability test than I would have with more time. Additionally, developing the prototype in Marvel had UI limitations. I was not satisfied with the resulting UI for the prototype, but was pleased with the functionality.

Once the usability test results were in, I was able to clean up the UI in Figma to make it look more like what I would like this app to look like in a real world application.

A Design Sprint is less about the UI and more about the function

Lessons Learned