UX Case Study — Lowe’s Information Architecture

Jaclyn
jaclynrm
Published in
10 min readSep 25, 2017

Product: MVP prototype of the Lowe’s responsive website with reorganization to the information architecture
My Role: UX Researcher, UX Designer, Information Architect, Visual Designer
UX Research Team: Myself, Anneliese Klein, Anne Porter, and Erika Shields
Duration: 2.5 Weeks

Lowe’s has long been strong in the DIY market for homeowners, while rival Home Depot has leaned heavily toward the pro market. Lowe’s splits their customers into two separate groups — the professional customer and the retail customer. The professionals (or pros) account for 30% of Lowe’s sales, and they are looking for products to complete projects for other customers (i.e. interior designers and building contractors). The pros use a website, lowesforpros.com, that is particularly tailored to them.

The retail customer accounts for 70% of Lowe’s sales, and they are looking for products and services for a home improvement projects. These are divided into two subcategories — the do-it-yourself (DIY) customer and the do-it-for-me (DIFM) customer. Through our research, we’ve found that majority are do-it-yourself (DIY) first, then will resort todo-it-for-me (DIFM) depending on the speciality of the project. These customers shop both in-store as well as online using lowes.com. For our responsive web redesign, we will focus on Lowe’s retail customers.

Research — Exploration

During the first week, the research portion of this project, we continued to expand on our UX learning and research methods that we can add to our tools. We successfully completed the following research for Lowe’s throughout the week:

  • Demographic research
  • A competitive analysis which included feature comparison, element analysis, market positioning, as well as a competitive matrix
While Lowe’s has many competitors, these are a few that our team found the most valuable comparisons
  • A screener survey with 67 responses
  • An in-store contextual inquiry
Photos during our team’s visit to Lowe’s for the in-store contextual inquiry
  • 6 user interviews
  • Affinity mapping
  • 3 rounds of card sorting (2 closed with 10 participants and 8 participants; 1 open with 6 participants)
  • 6 usability tests (3 on desktop; 3 on mobile)
  • Key Performance Indicators (KPIs) on the usability tests
  • Lowe’s website heuristics
As a team, we went through lowes.com to assign scores to various aspects of their current website
  • A site map
  • A task flow for both Lowe’s desktop and mobile as well as Home Depot’s desktop and mobile
  • Revising the two 5-year old personas the company had given us using the research we had collected

This experience was awesome for our research team as we really got to dive into the project head first and learn much more about a company and about their digital and physical products than we imagined possible. We learned many new research skills and methods beyond user research and interviews that will certainly help us in future UX projects and in our careers.

Synthesis — Compilation

During the synthesis phase, our team’s first question was ‘What do we actually do with all of this research?’ We took a deeper look into all of the research we had just collected and began to synthesize. First taking our user interviews, we created an affinity map which we were all familiar with from doing in the past, and then we created “I” statements which embody the Lowe’s user. We noticed these statements has some similarities as well as some clear divides. This helps us when editing our primary and secondary personas — the savvy customer and the novice customer.

A venn diagram separating the “I” statements that describe the savvy Lowe’s customer to the more novice customer

Using the user interviews and the “I” statements we then edited the two 5-year old personas that Lowe’s had provided to us. Some of the main highlights that were changed were their ages, technology they were using, and some of the pain points that they had because a few were outdated and had already been approved upon by Lowe’s.

Updated primary persona for Lowe’s
Updated secondary persona for Lowe’s

Another major step we took during the synthesis stage was looking at the results from our card sorting. We used a tool called Optimal Workshop to run 2 closed card sorts using the 23 department categories and 100 products from the Lowe’s website as well as 1 open card sort in which the participants created their own category names using the 100 products. We found a lot of valuable information from the open card sorts as we sat with each of the users as the performed the activity. During the open card sorts, many people gravitated toward the hunch to sort by room. It was also found that users grouped items into these category names the majority of the time: Paint, Flooring, Holiday, Cleaning, Kitchen Appliances, and Garden. During this process we also kept in mind all that we have learned about information architecture throughout the course thus far.

Photos during our team’s process of synthesizing the card sorting data
Some of the decisions and changes made to the global navigation using the card sorting data

Next, we used a spreadsheet to collect KPIs on the 6 usability tests we performed — 3 on desktop and 3 on mobile. The results from the usability tests were consistent between the desktop and mobile in that 100% of users resorted to using the search feature after the first task. Also, the more errors that users encountered increased the chances in their success to complete the task.

KPIs from the usability tests on the current Lowe’s website

When proceeding to the next phase of the project, the solo design phase, I considered and used the majority of the research when creating my designs but some pieces of the research naturally pushed the final design further than others. Using all of the research and synthesis our team collected, we came up with the following problem statement for Lowe’s current desktop and mobile websites.

Problem Statement: Due to complex product categorization on the Lowe’s website, customers have difficulty finding the items they need. How might we improve upon Lowe’s current design to make product navigation more consistent and intuitive to the customer?

Ideate + Design — Conception

After defining the problem statement, our team divided and began re-designing the mobile and desktop websites solo. My main focus moving into the design phase was keeping the persona Daniel in mind to create consistency from page-to-page within the Lowe’s website as well as limit the number of items and categories for each page so he could easily and quickly find the products he needed for his home improvement projects. I also wanted to create a top global navigation that would allow users to find and navigate quickly to all content of the website including ideas & how-tos, a new shop by room section, the installation services, and deals and offers. All of this content is currently buried and mainly found in the footer of the website.

To begin the design process, I began by defining product goals that would help solve the problem statement, as well as the features that could be incorporated to achieve these goals.

Goals:

  1. Make all content available from the home page
  2. Create consistent and familiar experience for users that they want to return to
  3. Allow users to find products they are looking for quickly without having to think too much

Features:

  1. Add “Ideas & How-Tos” and “Deals & Offers” into global navigation
  2. Create similarities between desktop and mobile as well as consistent placement of navigation
  3. Add consistent local navigations throughout all department landing pages

With these goals defined, I then began sketching my initial ideas out and then I moved these initial sketches into the program Sketch to create the first round of digital mid-fidelity wireframes. When creating these wireframes, I had to keep in mind the designs for both desktop as well as mobile.

One example of the initial mid-fidelity desktop and mobile wireframes for the new Lowe’s website

Next, I moved these wireframes, both desktop and mobile, into the prototyping tool, Invision. After importing the wireframes into Invision, the result was a functioning product that is similar to Lowe’s current desktop and mobile platforms but with the new global navigation and features integrated.

Usability + Usefulness

Next, I used both the desktop and mobile prototypes to conduct two separate rounds of five usability tests. Using a script with set scenarios and tasks as a guideline, I tested users on both prototypes using separate tasks and scenarios for each. Using separate tasks and scenarios on each platform allowed for me to test the familiarity between the desktop and the mobile while still seeing if task completion was possible for the user.

After each user completed all of the scenarios and tasks, I concluded by asking them a few open ended questions about the process they went through. This is where I believe some of the most valuable information to be found as they would give extra thoughts that we as the testers may not have thought about asking.

Findings + Iteration

After each round of five usability tests, I synthesized the notes from each of the users. With these notes, I found common themes or pain points throughout all of the users. We then broke these into two categories: usability and usefulness. Below are the findings from this process.

Utility:

  • 60% of users are drawn to and attempt using “Shop by Room” section to complete tasks
  • 50% of people try going through “Smart Home” to complete a task
  • 60% of users attempt going through “Doors & Windows” when searching for cabinet knobs

Usability:

  • 30% of users mention the desire to filter by price when on product page
  • 50% of users mention positive remarks about the global menu being straightforward and concise
  • 60% of users are confused after tapping add to cart

While keeping these findings in mind, I added, recreated, and edited the current mid-fidelity wireframes within Sketch and updated the prototype. After doing this process once, I iterated on the designs and then performed a second round of usability tests. Then, I reiterated on the designs once again with the information collected from the second round as well as began to create a higher-fidelity wireframes. Some of the changes made included adding permanent price and review filters on all of the product search pages, moving the description and review section up closer to the product on the item page, and figuring out how to successfully show users that an item was added to the cart on the mobile site. I noticed during the second round of usability tests that there were not nearly as many issues thanks to our first iterations, but there were still a few improvements to be made.

Iteration to bring the item description and reviews closer to the product so it can be seen without scrolling
Iterations made to the mobile version after adding an item to the cart

To view the final prototype after two rounds of usability tests and two rounds of design iterations, click here for desktop and here for mobile.

Conclusion + Next Steps

I found this extremely rewarding, and it is something that I would love the opportunity to continue researching and improving upon. It was nice to perform all of the research with a team as I do not think I would have been able to successfully find as nearly as much information alone. It was also interesting to then move into the design process solo after working with the team for the first portion. While I enjoyed having full control over the creative process, but I did miss my team member’s ideas and input. It was interesting to see how they continued with the project and their designs and presentations in the end to see how we used the same research.

Although our research was all the same and we did come up with some similar solutions, it was interesting to see how the implementations in the final designs were still different and unique in their own way. Our research team did decide together in the end that we would love to combine all of our ideas into one as we think it would create the strongest and best solution for Lowe’s responsive web design.

A list of design phases and next steps for the client

Some of my next steps would include organizing and rebuilding the “Ideas & How-Tos” sections, add products to the cart straight from the “Ideas & How-Tos” articles and lists, as well as performing some additional research. This research would include revisiting subcategories and perform card sorting for condensing and reorganizing them, perform tests on the current filters used for each category, and use Lowe’s sales numbers to perform decisions on which categories or items should be prioritized on each landing page.

--

--

Jaclyn
jaclynrm

An adaptable travelin’ soul that believes any food w/ an egg makes breakfast. Loves: my dog, weekend trips w/ friends, outdoor venues, hiking, and yoga