House2Home
UX/UI
A website to help new renters/homeowners curate a home decor starter kit that fit’s their interior design needs
Deliverables:
Competitive Analysis • User Data Synthesis • User Flows • Story Boarding • Sketching • High Fidelity Prototyping • Usability TestingHigh • Fidelity Prototyping
Role:
UX/UI Designer
Timeline:
8 weeks
Project Overview
House2Home is an e-commerce website that sells home decor items & accessories such as prints, posters and photos, lighting, small accent pieces and accessories. They cater to people who have recently moved to a new home and apartment and want to decorate their place on a budget. The typical customer has a good idea of their personal style and has a set of room inspirations on hand, but they need help picking accessories for their room that matches their inspiration and maximizes their budget.
House2Home has requested a design sprint to create a “starter kit” for their customers to help them decorate their place with ease. The design sprint follows a modified Google Venture Design Sprint over a 5 day period. I was the sole designer responsible for delivering a high fidelity design solution by leveraging research, personas, and mid-fidelity wireframes.
Objectives
• Create a website that showcases House2Home’s new feature: Home Decoration starter sets
• Help shoppers find home decoration starter sets that fits their desired room, personal style and budget
• Ensure that the starter set shopping process is simple to follow and enjoyable for shoppers
Day 1 - UX Research & Journey Mapping
In order to narrow in on the problem and the user’s pain points and goals, I compiled the company's research from 10 customer interviews into a list of 4 main takeaways:
When shopping for home decor items, Shoppers often abandon their cart because they don’t know if all of the items will look good together in their room
Shoppers find it difficult to find multiple impactful items that fit in their budget
Shoppers enjoy the process of finding room inspiration that matches their style, but feel overwhelmed when it comes to deciding which items to buy.
They wan’t to find a balance between decorating their room with items that have good quality. fit their style, and fit their budget.
It was imperative that I designed with the primary user persona in mind so that I could cater the design decisions toward actual users of the product. The primary user, Ally wants to shop for home decor that match her personal style and fits her budget. She also wants the shopping process to be streamlined so that she can quickly find a set of items, but still allow flexibility for her to mix and match items.
Persona
User Journey
After synthesizing the research, I ended the first day by sketching a map of the end-to-end user experience showing how a user might move through the website when purchasing a starter set.
Day 2 - Competitive Analysis & Ideation
Competitive Analysis
Before I started exploring designs, I took a look at other sites where shoppers can find inspiration for interior design and purchase home decorations to furnish their rooms. I looked at Modsy, IKEA and Pottery Barn where I drew much of the ecommerce features and visual inspiration from. Besides these direct competitors I looked at brands in the beauty and wellness space that curated their products into personalized kits for the shopper, such as Glossier, for inspiration on creating a “starter kit” for home decor shoppers.




Sketching
In the Crazy 8’s exercise, I brainstormed 8 potential product features in 8 minutes. Then I reviewed my sketches and chose the most critical feature to move forward with a solution sketch. The solution sketch consisted of a three screen storyboard that showcased how a shopper would view all of the starter sets, choose the best fit starter set, and finally checkout.
Day 3 - Decide
Storyboard
On the third day, I drafted a 9-panel storyboard, to use as a blueprint for building mid-fidelity prototypes. The storyboard includes the scenario of how a shopper might confidently buy a starter set of home decor that best matches their personal style using a style quiz, adjusting filters and reviewing the items in their cart.
Day 4 - Prototyping
I started the prototyping process by designing mid-fidelity screens and mapping out the user flow. I focused on designing the following key touch points first.
Home Screen
Starter Set Quiz
Best Fit Starter Set
Full View of All Starter Sets
Review Cart
Then I took inspiration from IKEA and Pottery Barn to refine e-commerce components such as the navigation bar design, filter design and website footer. After a few iterations in the mid-fidelity screens, I moved on to building the hi-fidelity screens.
View the full user flow here
Here is a video of a user walking through the desktop service of House2Home:
You can also try out the prototype below:
Day 5 - Usability Testing
The main goals for testing the prototype were:
To understand potential customers’ perceptions of the design as well as discover possible failures and successes.
To validate if the design gives shoppers an easy way to find and purchase a starter set that meet their needs ( room type, style, budget)
To assess whether the design increases customer confidence, reduces cart abandonment and maximizes converting casual window shoppers to paying customers for House2Home.
I conducted 5 moderated usability tests, 1 in person and 4 remote, with participants recruited through friends and colleagues. All participants were happy with the overall flow and thought that the shopping process was easy. While there were some design problems that distracted participants, there were no major failures and all were able to successfully complete the task.
Insights
5/5 users found it easy to use the filters to narrow down sets that matched their room type, style and budget
2/5 users would like the option to mix and match individual items rather than buy an entire set of items at a time
The starter set quiz made the shopping experience feel more personal
Iterations
With the user feedback, I took the opportunity to make improvements to the high-fidelity prototype.
Before
Users were unsure whether the budget referred to the budget for one item or for the entire starter set
After
The question now specifies that the budget is for the cost of decorating the entire room
The UI of the price ranges was changed from buttons to a slider that has equal ranges.
Before
Users were distracted by the varied layout of the starter sets and weren’t sure if the starter sets that were displayed with a larger image were more important.
After
Starter sets are arranged in a grid and the display images for all of the sets are the same size
High Fidelity Design Solution
Home Screen
Best Fit Starter Set
View All Starter Sets
Starter Set Quiz - Q1 Choose Room
Starter Set Quiz - Q2 Choose Style
Starter Set Quiz - Q3 Choose Budget
Review Cart
What I Learned
From this project I learned how to condense the full design process into a design sprint to quickly uncover major problem areas, accelerate possible solutions and validate early ideas in a short amount of time. I explored designing for a desktop and learned that desktop applications require different size dimensions for elements from mobile applications.
I also learned the importance of supporting my design decisions with the needs of users. As a creative individual who is always excited about implementing new ideas, I was challenged to design within the constraints of keeping the user persona in mind. Before diving into a decision, I had to put myself in the shoes of Ally, the user, and ask myself if the decision would benefit users like Ally.
Future Considerations
I would expand the shopper experience by including an option for shoppers to mix and match items from different sets
I received a few comments from users that they felt restricted to purchase an already curated starter set. They would like the option to add additional items to their cart and curate a more personalized set. I’d iterate on the current design and conduct additional usability tests to refine the shopping experience.
I would make the design responsive for mobile and tablet use
I understand that users own more than one piece of technology and would want their shopping experience to be seamless across their mobile and tablet devices. Responsive design would further promote House2Home as a versatile company and have a broader reach for users.