Mint+Julep+Mockup.jpg

Mint Julep

E-commerce prototype site

 

Mint Julep

E-commerce prototype site for a local boutique.

Mint Julep Mockup_v2.jpg

Mint Julep is a women’s clothing boutique with locations in Brookline and Cambridge, Massachusetts. These neighborhood shops offer a wide selection of clothing, jewelry, and accessories. Each piece is carefully selected, so what you’ll browse is a well-edited collection of our favorite items from many different designers. The loyal customers of Mint Julep wanted a way to shop their collections online when not able to make it to their stores.

Timeline: Two weeks

Tools: Axure, Optimal Sort, Paper & Pen

Project: Conceptual e-commerce web design with a focus on Information Architecture, Individual work


OVERVIEW

The Problem

Mint Julep needs the ability to sell products online because customers would like to be able to shop their collections online if not able to make it to their stores.

The Solution

E-commerce interactive prototype.

Mint Julep Screen Record_1.gif
Mint Julep Screen Record_2.gif

FLOW 1: Product Discovery

FLOW 2: Checkout


RESEARCH

Contextual Inquiry 

To learn more about Mint Julep and its customers, I talked to a store associate. I discovered that their customers are women between the ages of 17-70. Given this expansive range, Mint Julep carries collections that fall into all price points. Knowing this, I created a clean design with a navigation menu that is intuitive for all.

Open Card Sort

 
P2 Dendrogram.jpg

Dendrogram

  • Three participants in an online open card sort

  • 100 products sorted into 28 different categories

  • Some categories were variations of each other and needed to be culled down before moving onto a closed card sort

 

Closed Card Sort

IMG_8758.jpg
  • Two participants

  • The categories formed for closed card sorting were based on the trends I identified in the results of open card sorting and industry standards I found through competitive analysis

  • Based on the closed sorting results, I tweaked the secondary navigation and combined a few primary navigation buckets for a less broad set

Competitive Analysis

I focused my competitive analysis on my users’ favorites sites, Zara, Madewell, and Free People. I also analyzed a boutique, Shop Cathy B., that is more comparable in size to Mint Julep.

 
Zara_Logo.png
Madewell_logo.png
freepeople logo.png
Cathy B Logo.png
 
 

Heuristic Analysis

Before beginning the design process, I used Jakob Nielsen's 10 Usability Heuristics to evaluate Zara, Madewell, Free People, and Shop Cathy B’s sites. This helped me to use the strongest aspects of each site in my design for Mint Julep.

 
P2 Heuristics Table.jpg
 

DESIGN

Sitemap

Map of hierarchy of pages on proposed site based on card sorting.

 
P2 Sitemap.jpg
 
 

User Flows

 

Checkout Flow

Product Selection Flow

 
 
check_out_flow.jpg
product_discovery_flow.jpg
 

Sketches

 
Home

Home

Product Category

Product Category

Product Detail

Product Detail

Shopping Cart

Shopping Cart

 
 
Sign In

Sign In

Shipping Information

Shipping Information

Payment Information

Payment Information

Final Confirmation

Final Confirmation

 
 

Iterations

checkout_-_shipping_w__address_v3.jpg
checkout_-_shipping_w__address.jpg

Users found it frustrating to scroll to the top of the page to continue the checkout process. Based on this feedback, I moved the button to the bottom of the screen to seamlessly continue checkout.

 
order_confirmation.png

After placing order, there was no confirmation that order had been placed successfully. Users wanted to know that their order was complete.

 
Add to Bag Screen_Circle.jpg

Added pop-up option to see your bag after adding an item to bag. Users did not like being automatically directed to the shopping cart after adding a product to their bag.


REFLECTIONS

 

What I Learned:

This project taught me how to build a site with a focus on information architecture. It reminded me that I am not the user and to listen to my research findings instead of what I would want to see.

Next Steps:

  • Build out a hi-fi prototype, incorporating Mint Julep’s existing brand identity

  • Redesign the cart layout to accommodate for a large order