TRUESPIRIT
Desktop Web Design • March 2014
BRIEF
OVERVIEW
• Worked as sole UX Designer
• Project assigned by General Assembly San Francisco during User Experience Design Immersive program
• Timeline: 2 weeks
OBJECTIVES
• Create a desktop web experience for TrueSpirit, an online school uniform retailer.
• Use existing personas and brand identity to inform design process.
CHALLENGES
• Incorporating aspects of TrueSpirit brand identity into every aspect of the design -- from aesthetics to functionality.
• Creating a more modern and dedicated experience for buying school uniforms than competitors had to offer.
• Designing with a highly diverse audience in mind.
Competitive Analysis: Feature Breakdown
Competitive Analysis: Site Breakdown
Personas
Competitive Analysis: Feature Breakdown
THE COMPANY & COMPETITION
TrueSpirit's main aim is to offer updated uniform fashion that allow for freedom of expression (with a few limits). In addition to that, they also want to be an online platform for school administrators to set up dress codes that parents/students can browse and purchase from directly. TrueSpirit's brand identity emphasizes fresh and modern appeal, a sense of curation, friendliness, support, and openness.
Before beginning the design process, I analyzed the content and offerings of seven different competitors. Some of these retailers were purely dedicated to school uniforms, whereas some of them were larger retailers that happened to sell school uniform items. I came to the conclusion that the companies with good user experiences did not specialize in school uniforms, and the companies that did specialize in school uniforms all had outdated/unsatisfactory user experiences. It became readily apparent that TrueSpirit needs to offer both a dedicated selection of uniforms and a modern and delightful online shopping experience.
RESEARCH
DESIGN
Designing TrueSpirit involved a lot of sketching -- in both analog and digital formats. This was immensely helpful in getting my ideas into the open to allow for quick feedback. By jotting down many possible user flows, sketching up multiple types of navigation schemas, and simply playing around with possible site layouts on paper and on screen, I was able to come up with ideas for the TrueSpirit design that I may not have come up with otherwise.
To create the easiest product navigation experience possible, I created a real-time product filter system for browsing the site's products. By allowing users to start at a high-level (e.g., boys' tops) and filter down to lower-level specificity (e.g., blue polo shirts available in size large), I hypothesized that users would be able to more quickly navigate the site and have a better sense of where they are and how they got there.
I strived to maintain the gestalt of TrueSpirit's brand throughout the design -- and I believe that the company's fresh, modern, and friendly aspects came across most clearly.
Sketching #1
Sketching #2
Simulating Interactivity
Sketching #1
FINAL DELIVERABLES
Click any image to enlarge