homedepotbanner.png

Project Planner for Home Depot

My Role: UX Design Consultant — Duration: 2 Weeks — Platform: iOS Native
Tools: Sketch, Invision, OmniGraffle, Adobe CC, Google Forms


Project overview

For a class project, my team was presented with the challenge of creating a feature within Home Depot’s existing mobile app. In support of Home Depot’s strong DIY philosophy, we wanted to create a feature that would provide users assistance in DIY projects in all stages: brainstorming, planning, tracking, documenting, and budgeting. 


research


Interviews

Through our social and professional networking channels, we recruited potential users via a Google Form survey. We chose 8 out of 55 respondents to interview, culling our list from those who had completed a DIY project in the last two years (so that they could recall details of the experience) and were comfortable with a use of mobile technology and apps.


Synthesis

Compiling our interview findings into a standard affinity map, patterns and trends emerged to inform potential functions of our feature:

  • DIYers go to YouTube to get guidance, and, in some case, warnings:
    “I watch the videos to find out what I shouldn’t do.”

  • DIYers encounter roadblocks in the middle of their projects and aren’t sure of next steps:
    “I got stuck so I had to call a plumber.”

  • Having all materials on hand and right away was a genuine concern:
    “It’s annoying to have to delay a project because what I need isn’t available.”

  • Adhering to a budget and/or tracking expenses is a must:
    “I keep an excel spreadsheet of my budget.”

partial-composite.jpg

problem statement

Passionate about completing their home improvement projects, DIYers are inconvenienced by having to constantly shop to get more materials, and frustrated when they encounter a problem and can’t proceed.

How might we empower DIY’ers with “how-to” solutions during all stages of their home improvement process while also ensuring they are able to acquire the right materials when they need them?


Personas


research to design


Research design 

How "I statements" point directly to features and design elements

“I learn from experts.”
→ How-to-videos are an essential tool for DIYers before and during their project.

“I need materials all the time.”
→ Suggest materials for the specific project being planned, and those materials will be placed immediately into the Shopping Cart.

“I am conscientious of my resources.”
→ Provide a means to track budgets and download breakdowns or totals into another platform, such as Excel.

“I’m frustrated when I can’t get the materials I need.”
→ An integrated calendar function that allows scheduling, delivery of materials, and changes needed throughout the process.


Feature prioritization

Taking into consideration user needs, functionality, and profitability objectives


design


Design Studio:
Sketching + Concepting

designstudiocombo.jpg

Usability testing: methodology

We tested our prototypes in an informal office setting with DIY enthusiasts in the 25–50 age range. Testers were asked to perform 3 tasks using the prototype on mobile devices:

  1. For a cedar shingle roof replacement, find how-to videos and view suggested materials for your project.

  2. Change a scheduled flooring materials delivery date.

  3. Download a spreadsheet with total proposed project budget information.


Usability testing:
first round

Roofing Task: 3 out of 5 attempted to use the Search bar to start (once within the Planner app, 4 out of 5 were successful).

Problem: No clear path to start the process and access “How-To” info

Solution: Revised icon to contain the phrase “DIY”, then added explanatory text to the Home Screen banner.

Additionally, we redesigned the first Project Planner screen to draw attention to Start New Project:

Rescheduling Task: 3 out of 5 began the task by clicking on the Accounts icon; upon reaching dead ends, backed up and found the Planner icon, then restarted and completed the test.

Problem: Confusion over how to change delivery date

Solution: Added an additional screen with an event bubble with a clearly labeled edit button:

revisions2.png

Usability testing:
second round

Roofing task: 5 out of 5 successful, with only 1 attempting a start via Search and another

Rescheduling task: 3 out of 5 successful, with some confusion with click locations

Budget Download Task: 4 out of 5 began by looking for information in the Accounts screen, then backed out and checked within the planner to complete the task successfully. We made no alterations at this stage, to see if the problem persisted.

Problem: Users attempt to access budget from Account screen

Solution: Include access to DIY Planner Projects screen from Account

revisions3.png

High-fidelity screens

Our next and “final” set of screens was designed to mimic the brand and visual design of the Home Depot native app itself.

With high-fidelity screens came the addition of color, an important factor in clarifying the hierarchy of features on the home screen and in the calendar screens.


Final user testing

  • Roofing task: 6 out of 6 successful

  • Calendar task: 6 out of 6 successful

  • Budget task: 3 out 6 were able to complete; going forward, our team needs to ideate additional design solutions until this task is completed successfully


Next steps

Our recommendations to Home Depot comprise the following:

Initial roll-out:

  • UX team to collaborate with Home Depot Development team to integrate new feature design into existing app

  • Home Depot coordinate permission for embedded videos (featuring only vetted experts) with YouTube and other media outlets

Future roll-outs:

  • Implement a Chat feature for instant online help with a project

  • Add exportable project instruction manuals

  • Create partnerships with respected companies and experts to provide specialized video content