Bringing the look and feel of a boutique store to your computer screen
Decade Redesign
Decade is a small vintage store in Denver, CO with an eclectic inventory and cozy feel. Like so many stores struggling to keep the lights on during a pandemic, Decade's e-commerce site is more important to their profits than ever before. For this project, I investigated the current state of Decade's website, updating the look, feel, and user experience to better match the in-store vibe.
team:
solo project
role:
UX designer
timeframe:
two weeks
tools:
Competitor Analysis, User Testing, Affinity Mapping, Wireframes, Prototyping, Usability Testing, UI Design
Competitor Analysis
In order to better understand e-commerce websites with a similar inventory to Decade, I performed a Feature Inventory focused on three of the store’s competitors: Etsy, society6, and ModCloth. All three, like Decade, have a fun, quirky aesthetic and unique products.
Clearly, Decade’s website is missing many of the features that their competitors offer. But not all features are necessary or desired by customers, so I needed to interview users to see what they really want in an online gift store.
What Do Shoppers Want and Need?
User interviews uncovered four major insights.
Users...
So the new design will...
Want to shop local
Highlight the store's role in the community and its support of local artists
Shop on Amazon more than any other online store
Ensure the shopping experience at Decade is familiar and easy
Want to find unique and personal gifts
Focus on the store's one-of-a-kind products
Need to see ratings and reviews to build trust
Provide ratings and reviews for all products
Decade's inventory already appeals to customers. A few simple changes could help Decade stand out against larger companies.
Current Site Usability
Next, I conducted usability tests with four users. They gave general feedback on Decade's current online store and were tasked with finding a particular product and completing the checkout user flow.
"This looks cool! This looks like a place where I'd shop!"
Finding a particular item by category took 1, 4, or 5 tries
"The big picture at the top of the page is distracting. It feels unnecessary."
"There needs to be a search bar."
The feedback was consistent:
Users loved Decade's inventory, but found the site confusing to use.
Defining Our User
Based on this research, I created a persona to represent the particular consumer I’d be designing for. Lizzie loves her friends and is dedicated to finding them the right gift — but not at the expense of time spent navigating a confusing new website.
Our user has a problem, and Decade’s website can solve it by providing fun, quirky products, an easy to understand organization of inventory, and a simple shopping and checkout process.
Information Architecture
Based on usability tests, I knew I needed to find a better way to organize inventory. I set up a card sort where people organized products from the Decade website into groups that made sense to them. Four categories emerged:
Bath & Body
Clothing & Accessories
Fun & Games
Household
The total number of categories dropped from
22
to
4
This will reduce cognitive load by
making the store easier to navigate.
Updated Site Map
Creating First Round Wireframes
With Lizzie in mind and with a new content hierarchy, I created a wireframe and prototype for the new site.
The site should act like a concierge, walking the user through the store and helping her find that one special item she didn't know existed ...and didn't know she needed.
Testing It Out
I asked four users to test this first iteration of the redesign. They uncovered a few small, but important, concerns, including the fact that the search bar was hard to find at the bottom of the page and that the checkout process was still not as familiar as it could be.
I like these categories. Everything feels very well organized.
The checkout process feels seamless to me.
The search bar feels a little out of place in the footer.
I prefer when I buy a product that it shows up in my cart and lets me go to my cart or continue shopping.
Using UI to Evoke an Artisan Boutique Vibe
Based on research and my user persona, I knew the site should mimic the experience of walking into a small local gift store. I used the words “warm”, “inviting”, “colorful”, and “unique” to inspire my moodboard and color palette.
I looked for a typeface that reflects the sign on the physical storefront. I selected Futura, a modern and approachable font, for the store name and headings with Domine, a vintage serif font, for the body text.
The Final Design
Next Steps:
-
Create a responsive version of the website for tablets and mobile to give customers the option of making purchases on other devices.
-
Analyze sales data to see how the updated site design impacts revenue.
Learnings:
-
Continuous iteration is challenging, but crucial. Steps that seem obvious to me using my mental models in the design don't always align with the steps users take on the site.
-
While Amazon is a monolithic e-commerce site, shoppers are willing to consider other online stores as long as the design and experience feel right.