LL Flooring
Redesigning the e-commerce site navigation to improve usability and increase engagement with the brand’s products and services.
Made with Rive
Goals
Optimize find-ability for 3 customer groups
Simplify the path to product finding
Clearly promote the brand’s value props
My Role: UX Design Lead
Team: Senior UX Designer, UI Design Director, Senior UI Designer, UX Research Consultant
The LL Flooring e-commerce experience supports three customer groups at each stage of their flooring purchase journey. The site navigation was under performing. I led the redesign process that focused on achieving three high-impact goals.
Process
Stakeholder Interviews: Understanding the business needs and challenges.
UX Heuristic and Baymard Audit: Identify opportunities by evaluating the existing experience against UX and E-commerce best practices.
Competitive Audit: Gain insights by comparing competitor’s experiences.
Analytics Analysis: Evaluate and prioritize user engagement
Requirements Gathering: Understanding the product, services and development constaints.
Rather than run straight into design with the client-provided goals, our discovery process built trust and alignment by validating their intent, uncovering new perspectives, and shaping a clear design strategy. This process gave us a deep understanding of the problem space that I used to guide the design team and leveraged to facilitate decision-making with the stakeholders.
Discovery
Do your homework
Sample of Discovery Findings
Design Strategy
Focus your efforts
An important skill that I’ve developed is the ability to distill the discovery findings into key areas of focus that will warrant the most impact. This takes thoughtful consideration, experience with the process, and collaboration with cross-functional stakeholders while advocating for exceptional experience design. We presented the evidence and design strategies that would focus our efforts on maximum impact.
Samples of Design Strategy
-
![]()
Employ standard menu conventions
LL Flooring’s desktop navigation relied on a two-layered horizontal list. A redundant "Categories" dropdown was added to address the usability issues, but this conflated the cognitive load and made subcategories difficult to find.
Employing a standard menu design would improve usability, help users find what they're looking for, and improve their understand the full catalog.
-
![]()
Reduce overall cognitive load
The density of information and visual clutter was leading to cognitive overload and leading adding to the difficulty of navigating the site.
To help users find what they need, it's important to keep the header content concise and the display minimal. Additional content is often overlooked and can cause distractions and banner blindness.
Improvements we focused on to achieve our goals
Employ standard menu conventions
Reduce overall cognitive load.
Prioritize links based on what is getting the most engagement and what users are searching for.
Create clear paths to the top use cases for each customer group.
Reduce redundant and excess links.
Reduce the amount of copy and other visual noise.
Create consistent sub-menu formats.
Convert specialty terms to layman’s terms when possible.
Use concise and consistent category naming that is easy to understand.
Design Iterations
Bring everyone (including users) together
It was important to facilitate design reviews and collaboration with cross-functional stakeholders, including the leaders of e-commerce and marketing. This meant collecting a lot of feedback and collaborative conversation to ensure all perspectives were understood and considered. We advocated for exceptional UX, provided clear guidance for best practices, and facilitated a decision-making process. As Design Lead, I partnered with our Project Manager to guide everyone through this process, keeping us focused on our goals, driving progress, and inspiring excitement in what we are achieving.
An important part of my role as UX Design Lead was to bring everyone together in the process. This is key to impactful results. It started with providing the design team with the insights and guidance to gain a deep understanding of the problem space and design strategies. Then the magic began, with creative, thoughtful solutions by a seasoned design team, pushed further by fostering a culture of ego-less, inspired collaboration. But that’s only 1 part of the formula for success.
Process
Menu Concept Design: Exploring navigation paradigms
Interaction Design: Considering all use cases
UI Design: Applying brand styles and refining usability through visual cues.
User Testing: Using evidence to guide insightful design solutions and decisions.
Samples of Design Iterations
-
![Desktop Navigation Concept 1]()
Desktop Navigation Concept 1
-
![Desktop Navigation Concept 2]()
Desktop Navigation Concept 2
-
![Desktop Navigation Concept 3]()
Desktop Navigation Concept 3
-
![]()
Concept 2 Pros and Cons
-
![]()
Design v1 for Testing - Desktop
-
![]()
Design v2 for Testing - Desktop
-
![]()
Design v1 for Testing - Mobile
-
![]()
Design v2 for Testing - Mobile
User Testing
Use evidence to guide decisions
User feedback was a important part of our design iteration process. Partnering with a UX Research consultant, we developed a test plan that focused on our goals. We leveraged the results to refine our designs, guide decision making, and validate our design decisions.
Process
Test plan: Defining test goals and methodology that illicits the correct insights.
Prototypes: Creating functional designs in Figma
Result Analysis:
Recommendations: Applying the insights to design strategy and solutions.
Solutions
Mobile
Desktop
Hand-off & Development
Thorough design files are not enough to achieve quality user experiences. As UX Design Lead, I built a positive rapport with the LL Flooring development team, which led to our design team becoming part of their process.
Having experienced the benefits of integrating the design and development teams, we worked with LL Flooring to become a more integrated cross-functional team despite being an outside agency.
We did this by facilitating regular design/development team syncs to discuss our design intentions and development capabilities. While our primary goal was to validate the feasibility of the designs, the conversations were guided by our intent to build rapport and trust.
So, when we advocated continuing these syncs through the development sprints of the navigation redesign, the team could clearly see the benefit. From there, we were also integrated into the QA process.
The result was a more efficient process overall. And we achieved a higher quality product, faster.
Process
Detailed design files covering all use cases
Functional and responsive design annotations
Motion design examples
Design/development collaborations
Design QA
As a Design Lead, I bring empathy, curiosity, and an eagerness to learn to any collaboration I’m a part of.
As a Design Lead, I bring empathy, curiosity, and an eagerness to learn to any collaboration I’m a part of.
Impact
-
Increased Online Conversion
Improving the navigation usability allowed customers to quickly narrow their search to more relevant products. This increased engagement and user satisfaction, which led to increased conversion.
-
Increased Sales through Services
Analytics showed that customers who engaged in LL Flooring's services were more likely to make a purchase. The navigation redesign increased engagement with services and led to increased sales.