• I am currently working on new case studies. In the meantime, please feel free to look around!

Mattress Firm

Mattress Finder Guided Selling Tool
Mattress Firm has been growing rapidly over the past year, acquiring many companies along the way and dramatically increasing their footprint making them the largest mattress retailer in the country. They have grown from a traditional brick and mortar store to a competitive e-commerce company. They hired UpTop to help “re-tool” their first attempt to an online store and improve their e-commerce presence.
I designed a Mattress Finder guided selling tool built to provide a seamless online buying experience. It is a feature that makes it easy for a customer to find the right mattress for them based on a series of steps and filtering questions.
Research, UX/UI Design, Prototype

DISCOVERY And Analyzing the data

First, I met with our user researcher to get a baseline understanding of user problems and the website's performance. Soon after, I met with our partners and client to discuss the current data and business needs.  Next, I met with the team to recap, align our notes and plan for the next steps. With enough information on expectations, constraints and scope of work, we were able to get started immediately. 
Competitive Analysis

Creating Personas, Competitive Analysis

At this point, in order to come up with a solution, I needed to understand who the users were, what specific things they looked for, how they made purchases online and so forth. Based on the data from behavior analytics, I created user personas to help understand and align our design strategy to their target market. I also researched similar features on competitors' websites to use as a guideline to design the new type of tool that would assist in online purchases.
User Personas

Generating Ideas For Deeper Level Screens

The next step was to dive deeper into the functionality of the Mattress Finder tool. I created a filtering system that narrowed down the best-suited mattress for a user based on their response to a series of questions. Therefore, I had to come up with all the questions that would help guide them through this filtering process from start to finish.

Exploring Deeper Level Screens
I created and reviewed wireframe concepts with the project manager and developer to discuss functionality before designing high fidelity comps. 
Blade Functionality Exploration

Establishing Design Direction

After conducting more internal testing, I was able to narrow down to one layout based on the best practices. To further validate the design, I created a prototype to present to users for testing.
InVision Prototyping 

Reiterating The Wireframes

The crucial feedback from users enabled me to fine-tune the design and build out high fidelity comps to review .
High Fidelity Comps with Annotations

Building the Results Page

At the core of it all, the goal of the Mattress Finder tool was to surface the ideal bed mattress the user is looking for. The results page helped give more meaning to what the customer really needed and was easy to review and understand.
Results Page

Annotated Comps

After the final design was approved, I created fully annotated comps for handoff to the development team.
High Fidelity Desktop Comps
High Fidelity Mobile Comps
© 2020 Johnny Terlaje. All rights reserved.