Crush Boutique
E-COMMERCE MID-FIDELITY PROTOTYPE

Summary

In this two week project, I designed a clickable prototype around an online shopping experience. I was able to apply my background in eCommerce to ideate and execute an online shopping store for a local Boston-based business.

The store I chose to work with is Crush Boutique, which provides customers with a well-curated collection of the best in women’s contemporary fashion. They are known for offering a personal stylist type experience that customers love. Currently, Crush Boutique does not have an eCommerce platform and I knew this would be a fun challenge to take on. 

Objective

Create a clickable prototype around an online shopping experience based on a sample selection of 100+ products. The design should meet the goals of the users, the business, and the brand, and should be tested by users and follow information architecture heuristic best practices.

My Role

Individual Designer

Duration

2 Weeks

Tools

Axure, Sketch, Optimal Workshop

Process

Research & Discovery

I visited the store and spent time talking to the sales associates and customers. I learned about the store’s history, owners, brand, customer base, and mission. I also inquired about their inventory and how owners categorize their products.

Contextual Inquiry

I visited the store and spent time talking to the sales associates and customers. I learned about the store’s history, owners, brand, customer base, and mission. I also inquired about their inventory and how owners categorize their products.

User Interviews

Three interviews were conducted based on the results of a screener survey. The goal of these interviews was to gain a better understanding of online shopping behavior. During my inquiries, I asked the participants to complete various tasks on competitive eCommerce site and observed to help identify the existing pain points on the site. I then selected four other more successful eCommerce sites and conducted a comparative feature analysis to help determine which key features the existing site was lacking.
“I love shopping at boutiques but never use websites because I like the personal experience when visiting the store.”

“I only buy clothes online when I can trust that the fit and quality descriptions are accurate.”

Affinity Mapping

I used the method of affinity mapping to synthesize the data I gathered during the user interviews. After this process, I was able to identify the major points I need to focus on in my design.

Competitive Analysis

Doing a competitive analysis to see how online large name bands and local competitor sites helped to demonstrate the importance of UI conventions and information architecture in designing good experiences for users.

Feature Prioritization

Taking into condiseration the business needs, my user research and competitive analysis, I completed a feature prioritization in order to narrow my scope as well as avoid featuritis.

Personas

Based on my research, I developed two personas that represent the current customer-base:

Problem Statement & Hypothesis

Problem Statement

Customers love the designer products and the personal experience they receive at Crush Boutique, however, they can’t always get to the brick and mortar location and there currently no eCommerce option.

Hypothesis

I believe that an eCommerce platform that allows customers to shop at Crush Boutique without losing the personal experience or trust in the products. I will know this to be true when customers can successfully shop online from various locations.

Ideation

Sketching

Once my research was complete, I began sketching out the different possibilities and built a paper prototype. I tested the prototype and iterated on my sketches and discovered some interesting findings.

Below are some initial sketches and iteration notes:

Narrowing Scope & Structure

Information Architecture

In order to better determine the best structure for this eCommerce platform, I used 100 products as a guide and had two users participate in a closed card sorting activity on Optimal Workshop.

Sitemap

Following the closed card sort, I developed a site map that would that would be intuitive for users and scalable for the products that Crush Boutique has to offer.

User Flows

Following sketching, I conducted several user tests to ensure I was narrowing my scope according to what the users actually need. I created three user flows based on my findings and sitemap:

1. Customer discovers the product.
2. Customer checkout process.
3. Customer writes a product review.

User Flow 1: Product Discovery

User Flow 2: Write Product Review

User Flow 3: Write A Product Review

Wireframes

Following sketching and iterations, I built a mid-fidelity wireframe in Axure. Realizing my research, theories, and drawings into the digital medium made it easy to start testing.

The design of the platform is intended to be minimalistic, appear high-end, and provide a similar personal shopping experience that customers are used to in store. The information architecture allows for intuitive navigation and customer satisfaction.

Below is a sample of the main screens:

Prototype

Click the image below to be directed to an Axure prototype:

Usability Testing

In order to test the prototype, I created a structured usability test plan that allowed me to collect quantitative data on participants’ performance.

Measurable Goals

Below are the tasks the participants attempted. I set measurable requirements for each task in order to determine whether or not the participants completed the tasks successfully.

Next Steps & Reflections

Next Steps

  • Add visual design elements.
  • Build out category landing page filters.

Reflections

This was one of my favorite projects! With my eCommerce background, I was able to push myself to not only take the business goals and user needs into consideration, but also take the backend management system into consideration. I am passionate about customer shopping behavior and maintaining a clean, intuitive and intimate shopping experience.

© 2018 ALLIE GEORGE