DIY Depot App — A UX Case Study

Brief: Do It Yourself projects are a favorite hobby of so many people, and they have many benefits from saving money and saving the planet to keeping the brain sharp and gaining a sense of pride. Currently there is no app exclusively for this group of users, so we decided to create the DIY Depot mobile app as a tool to explore, plan, track, and document DIY projects.

Note: This is a concept our team (Haniyyah Gray, Emma Zigarovich, and myself) created for 0ur project for the General Assembly UX Design Cohort.

Home Depot is one of the world’s largest home improvement retailers established in 1979. Originally gaining success as a brick and mortar business, they have also more recently made strides in the digital world. With a successful and frequently used e-commerce platform, the next step is to provide users even more Home Depot digital support through a DIY project planner.

The current Home Depot app assigns a section to DIY projects, which leads the user to their online website and provides the user with new ideas and tutorials. The current format of the DIY project section of Home Depot website contains the following problems:

  1. Doesn’t enable the user to purchase all the tools and materials with one click
  2. User can’t plan, track, or document their process
  3. Navigation throughout the site to find ideas and inspirations is challenging
  4. Doesn’t let the user to share their projects to social media

We decided to follow IDEO’s Human-Centered Design and Lean UX Design Thinking process to make sure that our design decisions were supported by user research and feedback.

I primarily worked on Interaction/Visual Design teaming with Hanniyah and Emma.

We conducted interviews on a 1 on 1 basis with people who are familiar with DIY projects. We tried to understand their process in DIY projects from exploring ideas all the way to the final product.

We decided to use affinity mapping techniques to organize our observations from our user research. By categorizing the responses and memorable quotes in different categories we were able to identify the similarities and differences in our users behaviors in exploring, planning and tracking DIY projects. The affinity mapping helped us recognize users needs and pain points in DIY projects.

We created a persona to represent the group of people we interviewed using our user research data and our affinity mapping.

  • Ideas/Inspiration: Users lacked resources for quality inspiration, tutorials, and guidance for projects
  • Plan/Track Projects: Most users currently do not have or use any form of progress tracking while doing projects
  • Motivation/Completion: Struggles with project completion due to lack of motivation.

We studied our users needs and pain points carefully, and realized that we need to:

  • Create a tool that allows for users to see steps and track progress
  • Help users to have a higher completion rate of projects
  • Reduce the number of trips the users make to store for materials
  • Create a tool that helps provide inspiration for projects and to complete projects

To solve the problem, we decided to organize the DIY section of the Home Depot DIY Projects and add more features; however, DIY projects are a broad concept, so instead of adding a tab to Home Depot’s existing mobile app, we decided to overhaul the DIY section off the main app and create a sister app that connects to the main Home Depot app via sales advertises and purchasing tools and materials.The goal of our mobile app is to create a tool to help users with brainstorming, planning, tracking, and executing their DIY projects.

Now that we knew what our app should focus on, we drew some sketches to outline our ideas.

The lo-fidelity sketches were only a quick illustration to showcase our direction. We made several major changes to the layouts during wireframing. We used Figma to create the wireframes and designed a Mid-Fidelity Prototype. Below are a few of our Mid-Fi mockups.

We conducted the usability testing with five users, and asked them to complete a series of tasks.

Our findings from usability testing led us to our Hi-Fi prototype. Since we were designing a sister app for Home Depot, we decided to keep the theme on both Home Depot and Home Depot Color app by using the same typography family and color palette. Our goal was to create a familiar platform for current Home Depot app users, and simple enough to attract more users.

Here’s the interactive prototype we used as our design solutions:

We created the DIY Depot App as a tool for the users to have easy access to the world of DIY ideas and step by step tutorials. DIY Depot enables the users to not only to explore ideas, but to plan, track, and document their project. Users are also able to share their process and final projects on their social media. However, the Hi-Fi prototype is just the beginning of an amazing journey. There are so many other steps to take to improve this concept, which was built in a two-week timeline. With more in-depth user research, we will be able to add more features to the app. there are also opportunities to improve some of the interaction design elements of the app.

Thanks for checking out my post! Please feel free to provide comments or feedback below — I’m always looking for ways to become a better designer! You can also shoot me a message at info@golnoosh.me or connect with me on LinkedIn.