Home Depot DIY App
This project was a two week sprint in a team of four designers.
Our goal was to create a mobile app that will help Home Depot's customers brainstorm, plan, track, and document their DIY experience.
Designing, researching, and interviewing were shared roles among my team. My specific contributions to the project were:
- Performing contextual inquiry during the research phase
- Analyzing and synthesizing the research to determine our user's problem
- Ensuring that the features we wanted to develop were within the scope of the project
- Creating the visual design/stylesheet for our app to be used with Sketch
- Encouraging users to continue using the app through the design of a timeline and using humor to elicit an emotional response from the user
POP by Marvel, Sketch, InVision
User Interviews and Questionnaires
The first task in our discovery process was to ask users about their DIY process. We sent out a questionnaire on a DIY Reddit forum. We received 138 responses. The questionnaire was comprised of eight questions with a measurement scale, two questions asking if the users shop online or in store, two questions asking where the users do their shopping for DIY projects, and two open-ended questions.
- What do you love about the DIY process?
- What is painful about the DIY process?
We affinity mapped the responses from the open-ended questions in addition to the data we received from our 5 user interviews to find the common themes. We discovered that our users were not completing DIY projects due to the following:
15.2% Unable to find the time to complete project
10.1% Lack of tutorials
8.7% Unable to find the right tools for the project
7.2% Making multiple trips to the store
7.2% Making mistakes
It's also important to know that 29.7% of the users loved doing DIY projects because it gave them a sense of pride and accomplishment.
The best way for me to learn about how customers currently use the app was to observe a couple shopping in Home Depot. The couple wanted to replace their shower head. I followed them throughout their shopping trip and took notes. These were my findings:
- They routinely used Home Depot's app to locate products in store.
- Often the product locator would generate a blank map of the store so they were unable to find the product.
- The product locator was illegible during certain points of the process.
We took our research findings and developed a persona.
Andy broke his drying rack.
Andy would like to build a new drying rack; but he's not sure if he will be able to do it. He's been frustrated by DIY projects in the past for the following reasons.
Lack of quality tutorials
Unable to properly plan for his DIY project
Andy finds the new DIY feature on Home Depot's app.
Andy was researching how to build a drying rack when he came across Home Depot’s new DIY mobile app feature. He finds a project that has all the tools, materials, and tutorials needed. He is excited to begin his project.
Andy finishes his project.
Andy feels accomplished thanks to Home Depot's DIY feature. The app was able to keep him on track by encouraging him to continue on with his project. He also likes that it provided him with a tools and materials list along with well written tutorials.
Users do not complete their DIY projects because they lack the proper tutorials, materials, and tools.
Finding a Solution
I encouraged my team to bring their craziest ideas to the table to help solve our users' problems. When deciding which features should be prioritized, I ensured that any feature the team proposed had to answer one of these questions.
Does this help Andy stay on track?
Does this help Andy plan?
Does this help Andy document his DIY?
Does this help Andy brainstorm?
If the proposed feature could not answer yes to at least one question it was eliminated.
Project Preview Screen
Our users felt that the "+" sign on the "Add Project" screen was not clear as to what that meant. This was changed to a button that said "Add to Projects". Also a user was not sure what the camera icon did. He thought, "If I click on that, is it going to start recording me?" We changed this to have the "play" icon overlay the thumbnail video.
Users were confused because the app had the items pre-checked for the user to say "this is what you need". The idea being that the user would uncheck the items that they already had in their possession. Even as I write this, I think it's a confusing process. This was changed to be a list.
Final Project Screen
I wanted to give the user a pleasant experience as they complete their tasks to encourage them to keep going. I thought by having them press a button that said "Done!" wasn't encouraging enough. I always try to come up with clever ideas to make our users happy and so I came up with "Nailed It!" to replace the former. It goes with the theme of the app, provides some humor, and elicits an emotional response from the user in hopes that they will continue using the app because it was a good experience.
Steal like an Artist
While searching for design inspiration for how to keep our users on track with their project, I opened my Amazon app and this screen popped up. I told my teammates that this would be a great idea to display the progress of the DIY project. Also it would "save" the users place in the project. It would prevent users from missing a key step.
Let's watch how Andy finds his drying rack project.
Let's watch Andy complete Step 6 of his project.
Let's watch how Andy finds his materials.
Let's watch Andy add a note to his scratchpad
Let's watch Andy review his drying rack project by viewing his photo gallery.
One more thing...
After doing final usability testing, we felt that we did accomplish the goals of providing a way for users to brainstorm, plan, track, and document their DIY projects. Users were able to navigate through the app easily and able to complete the user scenarios that were developed to test the app.
However, due to time constraints, we never got to dive further into the materials list dilemma. This was one area where I wasn't satisfied with that screen. We tried many iterations and could never "nail" one down. (I really like my puns). If we were going to continue this project, I would have liked to try out one more iteration of the screen. I had this idea to use the "Tinder" method for the materials list. The concept being swipe right if you need to purchase the item for the project and swipe left if you don't need to purchase the item. I'm not sure how intuitive this would be for users but would like to explore the idea.
Special thanks to my team: