FABRICATE
Case Study
A clothing retailer making the transition online.
Objective
Fabricate is a successful clothing retailer looking to expand their online presence by developing a responsive ecommerce site as well as updated branding.
Solution
Capitalizing on users familiarity of retail website patterns and ontology, we designed a very straightforward checkout flow that is quick and intuitive to navigate. For extra convenience, we used our physical retail locations to our advantage by offering same day pick up, in addition to a shipping discount. We know shoppers are often concerned about not being able to try clothing on, so we tried to reassure shoppers by prioritizing clear return policies, reviews and extra sizing information.
Challenge
Online shoppers require a convenient and efficient shopping experience. Moving online has different struggles than physical retail stores. We'll need to determine the best way to support and enhance their customers online experience to help drive customer loyalty.
Background
Since 1994, Fabricate has grown to become a successful global clothing retailer. Reaching over 400 brick and mortar locations despite a minimal online presence. They have built a reliable brand by concentrating on customer service. Their mission is to make clothing accessible to everyone.
Research/Empathize
Secondary Research, Competitive Analysis, Interviews
Goal
Our research goals were to discover the pain points of online retail customers and identify users un-met needs.
Process
Beginning with market research, we searched for common trends and challenges within the online apparel industry. We then researched both direct and indirect competitors, noting their strengths and weaknesses and identifying current standards. To understand customer motivations further we performed three in person interviews. The interviews will us identify a persona and begin empathizing with potential users.
Research Deliverables
Results
• Most clients shop on a tablet or phone
• Shoppers want efficiency
• Reviews are trusted by shoppers, often more than descriptions
• Clients have come to expect free shipping
• Online customers hesitate when they are not fully confident about a purchase
• Unsatisfied customers can quickly take money elsewhere when shopping online
Pain Points
Un-Met Needs
• Endless searching
• Fit/sizing is hard to determine online
• Returns are a hassle
• Out of stock
• Immediate pop-up promos
• Product not matching customer expectations
• Purchases made with confidence
• Simple search/filter options
• Help identifying proper search terms
• More detailed reviews
Define
Using the information and motivations discovered during research, we developed a persona and empathy map to help futher define the archetype and keep the customers priorities top of mind.
Persona
Empathy Map
Now that we have a better understanding of the what users value, we used this information to define the product goals and prioritize features.
Product Goals
Feature Requirements
To gain insight into the user's thought process and how best to organize categories we performed a card sorting exercise with four participants.
Card Sorting
Now that we have clearly defined the priorities of both our client and customers, we began fusing these requirements together by developing the content strategy. Starting with the site map, we began creating the information architecture.
Site Map
We then created shoppers task flow and then a user flow focusing on the checkout process.
Define Results Summary
Task Flow
User Flow
• Utilizing a familiar checkout flow pattern, would benefit the customer and speed up the users experience
• The interface must be responsive, since the trend is to shop on the go
• We must provide detailed reviews, advanced filters, and explore new sizing solutions to alleviate the struggle of online shopping
• The ability to pick-up a purchase on the same day is a benefit not all online retailers can provide and is an extra level of convenience Fabricate can offer.
• Clearly displaying company policies will help ease customers fears of dissatisfaction, making them more confident and willing to move forward with a purchase.
If the user believes they received value for their money and had a pleasant and convenient ordering experience. They are more likely to become a loyal customer.
Branding
Before starting to layout the site, we created a new branding strategy and UI kit. Aiming to keep with the current company initiative of inclusivity, we chose a subdued color palette with neutral tan and blue hues. These colors bring feelings of loyalty, quality and comfort. This palette has a strong accent color that can be used for important elements, driving visual hierarchy when necessary.
We developed a horizontal logo featuring the new brand colors and included variation options in the branding standards so future projects can easily comply. Two complimentary typefaces were paired and examples of product photos were displayed.
Branding Deliverables
Design
Now that we had a brand strategy, it was time to design the user interface. Referencing the previously created checkout flow, we first developed wireframes. Then turned these into high fidelity designs, including responsive pages.
Wireframes
High Fidelity Designs
Responsive Designs
Testing
Using Invision, we created an interactive prototype then performed usability testing with four participants and analyzed the results.
Goal
Our testing goals were to discover any parts of the user flow that cause users frustration or confusion. We also wanted to identify the elements or features that positively or negatively attract the users attention. And obtain overall feedback/insights specifically on navigation, flow and design elements.
Process
We did in person usability testing, asking the participants to complete the task of purchasing a womens plaid top. We asked them to walk us through their thoughts out loud and wrote notes as well as recorded the users screen for reference.
Findings
We achieved a 100% completion rate. Overall we received very positive feedback on the site design, branding and layout. users liked the clean , simple interface and were able to easily navigate through the tested flow. Users quickly noticed the free shipping and in-store pick up promotions as well as the featured items.
Based on feedback the adjustments to be reviewed are - unclear text over photo on homepage, prioritize how to find a store, sizing of filters, checkout button prominence on shopping cart page.
Affinity Map
Conclusion Summary
Overall we were able to identify users frustrations with the current online retail shopping methods and make adjustments to create an improved shopping experience. After making the small revisions discovered during testing, the next steps would be to focus on either the customer reviews or sizing features. Researching and developing these products further since they are huge factors in creating successful retail experience and customer loyalty.