2. About the Product:
True Spirit is an internet retailer for schools and parents who want a modern
school uniform for K-12 children. It offers updated uniform fashion including
pants for girls and zip-up hoodies, provides a “must-haves” checklist from the
school’s administrator for each school year, and recommends accessories
allowed by the school’s dress code. Unlike traditional suppliers such as Lands
End and True Grits, True Spirit encourages visitors to express their tastes–with
some limits.
!
About the Project:
This project consisted of developing a prototype for a mock uniform website called
True Spirit. The goals were to provide a clear way to find your school, browse and
purchase on the website. I was looking to create an appropriate experience for our
mock persona John (the persona information was provided by the instructional team).
5. Research
Method: !
I researched a variety of !
e-commerce websites. (Gap, Lands End,
French Toast, Target, Walmart, Warby
Parker, Anthropologie ).!
!
Findings: !
There is definitely a market for trying to
provide hip and modern school uniforms.
Opportunities Identified: !
!
6. 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 of my True Spirit website.!
!
AWARENESS
Awareness of the product!
!
SET UP AND FIRST RUN
CORE PRODUCT EXPERIENCE!
Opportunities Identified: !
!
!
7. Design Iteration 1
Method: !
I began with sketches for the homepage, a category page and product
detail page. !
Findings:
LE
P
AM
S
It 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.!
!
!
8. Design Iteration 2 - Hypothesis
Method: !
I updated my design in electronic format.
Findings:
LE
MP
SA
!
Opportunities Identified: !
!
!
9. Prototype
Method: !
I created a prototype in OmniGraffle and InVision
that captured the screen-based version of the
experience. !
!
AWARENESS
Awareness of the product!
AM
S
LE
P
!
SET UP AND FIRST RUN"
First time experience
- searching for school checklist information
CORE PRODUCT EXPERIENCE!
Finding school checklist information!
Viewing product category and detail page!
Adding to bag!
Checking out
!
11. High Level Features
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!
!
!
!
!
!