House 2 Home
Offering starter kits for first time renters and home owners
My Role
A team of one.
Ideation
Sketching and wire framing
UX / UI Design
Prototyping and Usability Testing
Design Process
Since I was operating alone, I followed a modified version of Google's Design Sprint Methodology.
The sprint was competed in 5 days.
Design Tools
Concepts iPad app : ideation and sketching
Adobe XD : Wireframes, high-fidelity design and prototyping
Project Overview
House 2 home sells home decor items and accessories:
prints, posters and photos
lighting
small accent pieces and accessories
Surveys indicate
most customers have just moved into a new home or apartment
want to buy multiple items to personalize their place but don't feel confident doing it on their own
Opportunities:
House2Home sees an opportunity to help people find a great starter kit of items to instantly decorate their new place.
Goal : Develop and validate a solution for selling starter kits to new home owners.
Design Constraints
solution should be designed as a website, starting with designs for larger screens (desktop & Laptop)
Focus on helping users that want a "starter kit" of multiple products
House2Home products are $10-$50, they don't sell furniture, appliances of larger pieces.
Research
I was handed highlights from ten user interviews, the user persona shown below and a recorded interview of one person matching the persona.
Persona - Ally (23 years old)
Successes
hire an interior designer - ideal, amazing
her space looks empty and boring she wants to change this
Pain points of frustration
place is tiny
looked online and found some quite stuff could never find the look she wanted
apartment is dark no natural light
get stuck trying to recreate a style
Quotes or insights
felt she needed many items
I have an eye for design - what I like but don't know how it will go together
Her choices in the past were random and non-functional being too big
brought a few items from home, but still feeling empty
Priorities and preferences
wanted a bright summery beach look
willing to spend $250 to complete the transformation
Behaviors
Ally graduated one month and moved into a small rented studio
she lives by herself
Before moving in she was excited to decorate since it was her first time living alone.
Ally browses Pinterest for ideas and saves photos of spaces she likes
She likes bright and lively spaces
She picked spaces that were similar to the size of her studio
Ally sets aside time to shop for decorations but puts it off because she gets overwhelmed quickly
Frustrations (Pains)
I know the look I want but don't know what items achieve that look
The photos she saves are more decorative pieces she could never afford.
She wants decorative items but isn't allowed to change the paint colors or renovate
Ally sees lots of small items she likes but never purchases them because she doesn't know if they will look good together in her space.
Goals (Gains)
I want to give my apartment a quick facelift, without needing to shop for individual items.
Ally wants to find decorative items in her budget that will give her apartment the look and feel she wants.
User Interview Chelsea
Day 1 - Map
To know where we are going, we need to know where we are.
A map of the user's end-to-end-experience tells us how our design fits in and contributes to the desired customer experience
End-to-end experience map
Day 2 - Sketch
Competitor solutions provide insights into what's been done before. Since the competition's personas are most likely different from ours, a quick look makes clear what is lacking. And provides inspiration into what new solutions we can design for our unique persona.
Competitor Conclusions
Most of the solutions seem to copy each other and don't fully address the needs or our persona.
Being able to work with a designer seems ideal to our persona. A few places offer free
design services and some offer paid. Paid seems out of budget for our persona.
One site showed items that are out of stock. That would be a frustration point for our user.
I liked the detailed descriptions of styles. This seems like a must for our persona who had their first apartment and may not know how to describe their styles.
Sketch the most important screen
In the end-to-end experience, visualize-in-room is the most important screen.
Here the user verifies if the chosen kit meets their criteria:
matches style
within budget
looks good in their room
Crazy 8
Crazy 8s is an ideation method where 8 variants are drawn rapidly.
Lightning prototypes
Create a solution sketch
Best of the 8 Solutions
Three Panel Board
Next we sketch the screens coming before and after the most important screen.
The user would add rooms in their house. Uploading a photo, choosing a style for the room and the color scheme.
Next they could pick kits kit attributes and then switch out items in the kit
Item options would only show items that would create a cohesive design
Add to cart would give them a lit of the rooms designed, the kits chosen and the cost
The user could add another room or checkout
Day 3 - Decide
I chose my solution because it allows users to get right into playing with kit options. If our persona is getting overwhelmed with options, a long onboarding process could have similar effects.
I think we can avoid overwhelming the user further by constraining options to a single page which shows up after they upload photos.
I think the steps could be broken down further. But since we're designing for desktop, we might as well put all the options on one page.
If the plan is to go to mobile or even a mobile version of the desktop app, then we would revisit this decision.
Day 4 - Prototype
Before investing too much time on final screens, I converted the sketch from day 3 into a quick set of wireframes. This let me estimate object sizes and finalize layout.
In doing so, I realized that my initial choice to let users swap out items was too much like the existing solutions that don't use kits. I removed this option and choose to focus on listing complete kits.
Clear Call-to-action
The focus is to sell new kits. The home page has one primary call-to-action button guiding the use to shop for new kits.
Research indicated users get overwhelmed. I simplified the process by providing step-by-step decisions regarding their style, which room they are decorating, and what kits they would like to shop for.
Give them one decision at a time
Room configuration
From there, users upload an image of the room they're decorating. Once complete, kit selection is made by seeing how the kit will look in the room.
Checkout
The checkout page provides a summary of the room they're decorating and the kit chosen for that room.
Day 5 - Test
Test Summary
Four out of five test participants had a room that needed decorating. All five participants liked the idea and wondered if I came up with it myself. I told them, unfortunately no. It feels good working on a project idea people value.
4/5 test participants were engineers. The engineers had opinions on the UX and technical details of the pages. The non-engineer had the most novel insights. The simple prototype helped her capture the vision of what we're trying to accomplish. Her insights showed there are more ways to think about the design than the nine I initially sketched. Her insights could lead to improvements in the initial design and follow on features beyond an MVP.
This shows it's important to have a good mix of users when testing your ideas.
Just like when we write sales pages for the four basic personality types:
Dominant Red
Planner Blue
Charismatic Yellow
and Stable Green
We should look to test our checkout processes with all four personality types.
Action items
Have one clear CTA on the main page, remove explore kits
Add back buttons to most of the pages.
On the room details page add a default name and make it editable.
Add a checkbox to use the same shipping address for shipping address
Change the kit selection list from a grid to a horizontal table, so the user can use up and down arrows to quickly navigate.
For the kit summary images, arrange the pictures in the images in the same way.
Conclusion
Go for it!
The intent of a design sprints is to quickly decide if you have a viable solution and if you should
move forward with it or go back to the drawing board.
All five users said they liked the idea and would use this feature.
Please checkout the final version of the prototype here. Please check it out and give it a try.