House2Home
July 2023
1 Week
Roles
User research & User interface design
Project Type
Design sprint project at Springboard
Problem
House2Home is a startup dedicated to helping users decorate their homes or apartments immediately after moving in. We offer "starter kits" that include a curated selection of home décor items tailored to the users' preferences and needs. Our products are affordably priced, recognizing that users have just made significant moving expenses.
Constraints
It has to be a website design (desktop or laptop).
It has to help decorate the house with little items.
Prices range from $10 - $50.
Research
Before beginning the design process, we received valuable information about our users, including user quotes and a persona of a woman named Ally. This information is crucial for identifying the issues that need to be addressed and understanding what users want from the application.
User Research
"I moved into a new apartment and it was sooo empty, so 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"- Maria
"I know the 'look' I want, and how I want to feel when I walk in... I just don't really know what products to buy to pull it off."- Deena
"So many items look great in the staged photos - but will they look good in MY living room? You don't really know until you order them and see how they look in the space."- Anna
Persona
Ally
23 Years Old
Chicago, IL
Goals:
Ally wants to find decorative items in her budget that will give her apartment the look & feel she wants.
Ally wants to give a quick "facelift" to her apartment, without needing to shop for lots of individual items.
Behavior
Ally graduated college one month ago, and now lives in a small studio in Chicago.
She was really excited to decorate her “own” apartment.
Ally browses Pinterest for ideas on how to decorate her apartment.
Ally puts time aside to shop for decorations but often gets overwhelmed.
Frustrations:
Ally hesitates to buy appealing small items because she's unsure how they'll fit her space.
How can she get a similar look of the inspirations she sees, on a budget?
Ally knows the desired "look" but isn't sure which items to buy for her apartment to achieve it.
Ally wants impactful décor for her apartment without major changes like painting or renovation.
Design Sprint
This project was a design sprint aimed at testing our time management and design capabilities under tight deadlines. Given existing user research, our primary focus was on designing the product. Additionally, we had to adhere to specific content and pricing constraints provided to us.
1
Map
Gather information and identify the problem. Create end-to-end experience for users.
2
Sketch
Conduct lightening demos. Create Crazy 8 sketches. Design a solution sketch.
3
Decide
Create 5-15 sketches also with solution sketch to create a storyboard.
4
Prototype
Create the prototype for the project in Adobe XD.
5
Test
Interview and test 5 users using the prototype.
6
Tidy Up
Not part of the design sprint, but a day to incorporate feedback and criticism back into the prototype.
Day 1: Identifying the Problem
On the first day, our goal is to identify the problem we are addressing. In this case, we need to create an application for new homeowners that provides curated starter kits. We observed that new homeowners often face various challenges that prevent them from decorating their homes as they wish. Here are some of the issues we aim to solve:
How might we help users visualize their homes with the items?
How might we help users find the perfect starter kit?
How might we help users decide what to put in their homes?
How might we help users find inspiration for interior design?
Possible end-to-end user experience
Day 2: Scoping out Inspiration/Competition
On the second day, we analyze our competitors and create sketches. We start with Crazy 8 sketches, producing eight one-minute sketches each. Next, we create a critical screen that displays one of our most important screens and the screens leading up to it. With the problems established, we now have a clearer visual of what we want to incorporate into our application.
Competition
Havenly
This website has more luxurious and expensive items.
It has a style quiz and explore section where users can test which style best fits them.
The ability to consult a designer and ask them for their opinion.
IKEA Planning/Kreativ
IKEA is well-known budget friendly brand that many new young homeowners use.
The IKEA Planning is used to book appointments with a designer.
IKEA Kreativ uses augmented reality where users can scan a QR code to access the app.
They offer an interior design service to help with interior design.
Has a large collection of images to use as inspiration.
Community driven with comments and collections.
Ecommerce is integrated into the website where users can sell their own products.
Crazy 8 Sketches
For the next step in day 1, we were given eight minutes to create eight different sketches, challenging our ability to work under pressure and within a tight timeframe. These sketches illustrated various functions of our website, including augmented reality, an AI assistant, and both curated and custom starter kits, among other features.
Critical Screens
The next step on day 2 involved creating three critical screens, presented as three panels, to highlight the most essential aspects of our application. We spent about a minute on each sketch, testing our ability to work quickly. These panels showcased our key features: augmented reality, curated starter kits, and custom starter kits.
Day 3: Creating the Story
Moving on to day three, we focus on creating the story. Using the user flow, we develop a storyboard with 10 sketches. These sketches provide a visual representation of the user flow and illustrate how each page will eventually look. The storyboard helps us visualize different options and features, and how they interact with each other within the application.
Day 4: Sketches Come to Life
Moving on to day four, we bring the story to life by creating high-fidelity wireframes that address the previously identified problems. This is our first time working with Adobe XD, adding another layer of challenge due to the time constraints. These wireframes represent the first round of designs, incorporating all the ideas and features we have planned for the application.
Your very own curated kit
Question: How might we help users find the perfect starter kit?
Extensive list of starter kits based on themes, moods, color, and other factors.
Personalized list of items displayed to help make a decision.
Picture it in your home
Question: How might we help users visualize their homes with the items?
Uses Augmentative Reality to help display the different items in the room.
Users can use an AI to help create a kit or they can create their own.
Users can the Augmented Reality page to quickly decide and add items without wasting much time.
Extensive but Affordable
Question: How might we help users find the perfect starter kit?
Large inventory of items and categories.
Many starter kits, based on emotions, themes and anything else the users can think of.
Items are affordable, perfect for new home owners.
Indecisive? It's Okay, We're Here
Question: How might we help users find inspiration for interior design?
Curated starter kits that are interchangable.
Large inspiration section, gathering ideas from all over the internet.
Create custom kits using A.I.
Day 5: The Last Stretch
Usability Testing
On the fifth day, we conducted usability testing with five users, each representing a diverse range of ages, careers, and levels of technological knowledge. Our goal was to ensure the application was accessible to everyone, regardless of their stage in life. We also aimed to identify any necessary changes based on user feedback. We assigned a few tasks to the users and observed as they navigated through the application, noting their experiences and challenges.
Users
Anthony Liang
Category menu or something that helps navigate
Struggle to see some pages because there is no navigation to pages (category).
Evan Liu
Hard to navigate throughout page and it is a little confusing
Took time on each page to try and look at what to click
Maybe add back button
Sabrina Wong
Add a back button
Confusing on what to click, maybe something that can help better (easier buttons and sections)
Add a menu for everything and easy navigation
Irvin Sutton
No sense of direction when navigating through pages
Make pages more clear
Have back button
Henry Garcia
Add a back button
Fix the title that leads to interactive and not custom
Maybe add a small menu either next to cart and profile or under header like clothing pages.
Tasks
Change picture frame in interactive page
Move to inspiration page
Add Custom Kit to cart
Find 4th object in kit
Navigate to Custom Kit page
Navigate to Cart
Feedback and changes
Participants encountered difficulties accessing specific pages and experienced challenges navigating the entire website.
Participants also discussed having a back button where they can click to navigate to the previous page.
Some other edits were to eliminate the stenciled background and replace it with a solid color.
Takeaways and Reflection
Simpler is better sometimes
From our last project, we aimed to incorporate more artwork, but sometimes, excessive visuals can distract users from key features. Maintaining a balance is crucial for creating an optimal project.
There needs to be flow or sense of direction.
Users may feel disoriented when using an application or website, leading to frustration, which is undesirable. It's crucial for pages to guide users effectively through text, images, and other forms of communication. Our aim is to create a user-friendly experience to ensure convenience in achieving their goals or tasks.
Prototype
Brand Guidelines
Presentation