Design by: Zoe Fisher Student Project. General Assembly UXDI Winter 2013

About the ProductTrue Spirit is an online e-commerce website specializing in selling modern, fashion forward uniforms. The True Spirit team strives to improve the experience of uniform shopping by encouraging clean design and allowing more freedom of expression. !!!About the Project

This project designed while I was enrolled in the UXDi Immersive course at General Assembly. My goal was to develop a prototype for a mock uniform website and provide a clear way to find your school, browse and purchase uniforms. I chose to base my user flow on John Bean; a single father looking to shop for his eleven year old daughter Asha. (The True Spirit company and persona information were provided by the instructional team).

https://projects.invisionapp.com/d/main#/projects/583520/screens

CASE STUDY

Research

Method !I researched a variety of e-commerce websites to get an understanding for common practices associated with online shopping and uniform shopping. Some of the companies that I researched included: Gap, Lands End, French Toast, Target, Walmart, Warby Parker, and Anthropologie ). !Findings !There is a great need to improve the e-commerce experience. Most sites are unattractive to browse through and cluttered. Opportunities Identified!Create a layout that is clean, simple and easily adaptable to mobile and tablets.!

Scenarios

Method !I was provided 3 personas by the instructional team. Two parents; Sarah, and John and one administrator; Kim. I began with a task flow to identify what steps would need to be taken to purchase clothing on a uniform website. My next step was to create a site map to identify the areas of need for my website. !Awareness !Stay true to brand identity!!Set Up and First Run !Core Product !Opportunities Identified!!!!

Design Iteration 1

SAMPLE

Method I began with sketches for a homepage, category page and product detail page. !FindingsIt was challenging to identify what information I should include in the website. The True Spirit brand promoted a modern and open feel and I tried my best to incorporate that feel in to my design. !Opportunities Identified Design a website that would be easy to convert to mobile or table application in the future. This would allow for a more open feel to the website. !!

Design Iteration 2 - Hypothesis

SAMPLE

Method I updated my design in electronic format.

Findings The footer was stronger as a large section at the bottom of the page.!Opportunities Identified The long scroll would be a more effective method of browsing through the homepage content. !

Prototype

SAMPLE

Method I created a prototype in OmniGraffle and InVision that captured the screen-based version of the experience. !Set Up And First Run Searching for school checklist information

Core Product ExperienceFinding school checklist information Viewing product category and detail page Adding to bag Checking out

!

CASE STUDY

Thoughts

John John wanted a shopping experience that was efficient, detailed and easy to navigate. !Features Clear global navigation Large ‘Find Your School’ search graphic’ The ability to save for later (John had limited amount of time to purchase today) The ability to navigate to your checklist quickly !

THANK YOU Zoe Fisher zoe.fisher3@gmail.com

0.0Home

2.1Find School

2.0Left Header

2.2Sign Up

2.3Account

2.1.1School

Checklist

2.4Bag

2.4.1Checkout

1.1Search Results

1.0Search

1.1Search Results

5.1Tops

5.0Girls

5.1.1Products

5.2Bottoms

5.2.1Products

5.3Outerwear

5.3.1Products

5.4Accessories

5.4.1Products

4.1Tops

4.0Boys

4.1.1Products

4.2Bottoms

4.2.1Products

4.3Outerwear

4.3.1Products

4.4Accessories

4.4.1Products

3.0School

Merchandise6.0

New Arrivals7.0

Shop Collections

3.1iPhone Case

3.2Logo T Shirt

3.3Logo Headband

3.4Mascot Toy

3.4Backpack

8.1Store Data

8.0Sign Up for Emails

9.2Services

9.0Global Footer

6.1Products Page

7.1Products Page

9.3Customer Service

9.4Policies

9.1Company

9.1.1Our Story

9.1.2Scholarship Program

9.1.3TrueSpirit Careers

9.2.1Gift Cards

9.2.2Embroidering / Monogramming

9.2.3Hemming

9.3.1Contact Us

9.3.2FAQs

9.3.3Returns / Shipping

9.3.4Manage & Track Orders

9.4.1Privacy

9.4.2Security

9.4.3Cal Transparency Act

Sarah’s Task Flow

Email Link

Homepage

View all uniform styles

Boys

Choose Styles

Product Details

Continue Shopping Checkout

Add to Bag

John’s Task Flow

Home

Girls

View all uniform styles

Choose Styles

Product Details

Continue Shopping Checkout

Add to Bag

Style Results

Style Results