search flyout
Helping users navigate through thousands of SKUs.
Helping users navigate through thousands of SKUs.
CLIENT
Marmot
PROJECT DURATION
Oct 2023 - Jan 2024
TEAM
Solo UX Designer
1 Product Manager
1 CRO Lead
1 UX Researcher
OVERVIEW
As the UX designer for this AB testing initiative, I was tasked with creating experiences based off of consumer feedback on Marmot's current search flyout model - Enhancing consumer experience, as well as improving in search to checkout conversion.
OUTCOME
As a result of my work at Marmot, we were able to identify alternative solutions to the current search flyout, and were able to test it in smaller focus groups. The future goal would be to AB test this feature on Marmot's current live site, with public users.
CLIENT
Newell Brands
PROJECT DURATION
July 2023 - Jan 2024
TEAM
Solo UX Designer
1 Product Manager
2 UX Researchers
3 Developers
OVERVIEW
OVERVIEW
As the UX designer for this AB testing initiative, I was tasked with creating experiences based off of consumer feedback on Marmot's current search flyout model - Enhancing consumer experience, as well as improving in search to checkout conversion.
OUTCOME
OUTCOME
As a result of my work at Marmot, we were able to identify alternative solutions to the current search flyout, and were able to test it in smaller focus groups. The future goal would be to AB test this feature on Marmot's current live site, with public users.
CLIENT
CLIENT
Marmot
PROJECT DURATION
Oct 2023 - Jan 2024
TEAM
TEAM
Solo UX Designer
1 Product Manager
1 CRO Lead
1 UX Researcher
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
IDENTIFYING THE ISSUE
IDENTIFYING THE ISSUE
Search isn't optimized to suggest users with appropriate recommendations
A recent study by Marmot revealed that many elements of the current search navigation do not align with industry standards. By optimizing search terms and suggestions, these improvements could help drive more conversions to checkouts.
Currently product suggestions overshadow search results due to lack of callout and lack of visual hierarchy
Having assisted images, tend to hold more visual weight and attention resulting in higher utilization. However, current experience makes it hard to see
Doesn't include relevant categories for easier navigation to related content
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
QUICK FILTRATION SYSTEMS
We need a way for users to quickly understand clothing categorization
Our first goal was to define the category scope, ensuring it featured relevant categories for seamless navigation and quicker access to related content. We explored three variations: one with related iconography, another with sub-filters, and the last with a straightforward link-based approach.
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
THE KEYBOARD CHALLENGE
Open keyboard flyout reduces usable space by 30%
One challenge that emerged during our design exploration was the keyboard appearing while viewing search results. This reduced the available space for product suggestions and category listings, limiting the visibility of important content during the search process. In order to address this we needed to push all important features to the top of the search such as: categories, results, and recommended.
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
CREATING USERTESTING DEMOS
CREATING USERTESTING DEMOS
To test variations effectively, I created an on-the-rail experience that balanced user expectations with practical usability, leveraging iterative testing and feedback to refine product recommendations, and typeahead.
Majority of participants prefer a broad search experience when first looking for items, and then narrowing down further.
The new enhanced design won in comparison tests against current state for being “inclusive to all genders, more comprehensive and visual.”
Most interacted with elements:
Categories -> Search Results -> Product Suggestions (Related)
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
THE SOLUTION
THE SOLUTION
Working alongside cross-functional teams, I refined the search optimization flyout, enhancing the product suggestion experience to make it more intuitive and user-friendly. The key considerations included:
Working alongside cross-functional teams, I refined the search optimization flyout, enhancing the product suggestion experience to make it more intuitive and user-friendly. The key considerations included:
Working alongside cross-functional teams, I refined the search optimization flyout, enhancing the product suggestion experience to make it more intuitive and user-friendly. The key considerations included:
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
Intro
The "Goal" design process is a strategic and goal-oriented approach, commencing with a thorough analysis of objectives and target outcomes. Innovation is key in the ideation phase, where solutions are envisioned and iteratively refined. These concepts are brought to life in the design and development stage, emphasizing both visual appeal and functional effectiveness. Rigorous testing ensures alignment with initial goals and optimal user engagement.
Year
2023
Services
BRANDING / DESIGN
Client
Newell Brands
THE SOLUTION
Working alongside cross-functional teams, I refined the search optimization flyout, enhancing the product suggestion experience to make it more intuitive and user-friendly. The key considerations included:
Currently product suggestions overshadow search results due to lack of callout and lack of visual hierarchy
Having assisted images, tend to hold more visual weight and attention resulting in higher utilization. However, current experience makes it hard to see
Doesn't include relevant categories for easier navigation to related content
IDENTIFYING THE ISSUE
A recent study by Marmot revealed that many elements of the current search navigation do not align with industry standards. By optimizing search terms and suggestions, these improvements could help drive more conversions to checkouts.
Search isn't optimized to suggest users with appropriate recommendations
QUICK FILTRATION SYSTEMS
Our first goal was to define the category scope, ensuring it featured relevant categories for seamless navigation and quicker access to related content. We explored three variations: one with related iconography, another with sub-filters, and the last with a straightforward link-based approach.
We need a way for users to quickly understand clothing categorization
CREATING USERTESTING DEMOS
To test variations effectively, I created an on-the-rail experience that balanced user expectations with practical usability, leveraging iterative testing and feedback to refine product recommendations, and typeahead.
THE KEYBOARD CHALLENGE
One challenge that emerged during our design exploration was the keyboard appearing while viewing search results. This reduced the available space for product suggestions and category listings, limiting the visibility of important content during the search process. In order to address this we needed to push all important features to the top of the search such as: categories, results, and recommended.
Open keyboard flyout reduces usable space by 30%
search flyout
Helping users navigate through thousands of SKUs.
CLIENT
Marmot
PROJECT DURATION
Oct 2023 - Jan 2024
TEAM
Solo UX Designer
1 Product Manager
1 UX Researcher
1 CRO Lead
OVERVIEW
As the UX designer for this AB testing initiative, I was tasked with creating experiences based off of consumer feedback on Marmot's current search flyout model - Enhancing consumer experience, as well as improving in search to checkout conversion.
OUTCOME
As a result of my work at Marmot, we were able to identify alternative solutions to the current search flyout, and were able to test it in smaller focus groups. The future goal would be to AB test this feature on Marmot's current live site, with public users.
Zero-state Trending results, as well as a best seller category
Categories are filtered by most commonly associated keywords
Larger image recommendations, for increased visibility
Let's Talk
© 2024, GUIMALAN
FUELED BY TIRAMISU
© 2024, GUIMALAN
FUELED BY TIRAMISU
© 2024, GUIMALAN
FUELED BY TIRAMISU
© 2024, GUIMALAN
FUELED BY TIRAMISU
© 2024, GUIMALAN
FUELED BY TIRAMISU
Zero-state Trending results, as well as a best seller category
Categories are filtered by most commonly associated keywords
Larger image recommendations, for increased visibility
Majority of participants prefer a broad search experience when first looking for items, and then narrowing down further.
The new enhanced design won in comparison tests against current state for being “inclusive to all genders, more comprehensive and visual.”
Most interacted with elements:
Categories -> Search Results -> Product Suggestions (Related)