• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
True spirit presentation
 

True spirit presentation

on

  • 414 views

Here is the slide show from project 2: True Spirit web design

Here is the slide show from project 2: True Spirit web design

Statistics

Views

Total Views
414
Views on SlideShare
394
Embed Views
20

Actions

Likes
0
Downloads
0
Comments
0

2 Embeds 20

http://livealiceb.tumblr.com 18
http://safe.txmblr.com 2

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    True spirit presentation True spirit presentation Presentation Transcript

    • a design by Alice Barton Student Project: General Assembly UXDI 2013
    • About the Product True spirit is a school uniform shopping site for parents who want to quickly find a school uniform that passes a school’s dress code and is in their child’s correct size. True Spirit allows parents to do all this in a few quick steps without the hassle of spending hours searching through hundreds of different clothing. It quickly shows you the most fashionable items or collections that fit both the requirements of the school and the student. About the Project True spirit is a project developed in General Assembly’s UXDI class to challenge students to create a e-commerce website. We were given two personas of parents shopping for school uniforms and given the task to create a website to fulfill their needs. My goals were to create an interface that makes finding the perfect clothes as easy and fast as possible.
    • Given Personas Note: These personas were not made by me Sarah: 
 Gets an email from her administrator and wants to just get the best outfit for her son that are within the guidelines of the school’s dress code.
 John: 
 Goes to the website already knowing that his school is signed up and wants to buy the best outfit for his daughter for the best price. ! ! Opportunities Identified: Create an easy way for users to find clothes that are approved by a school. ! The website should base it’s schema on the following principals: 1. Easily find clothes approved by the school 2. Easily find clothes that fit the student 3. Users can easily select the items they want and checkout in just a few steps
    • Key Features The Landing Page Users only have the option to sign up or sign in ! Rationale: It gives users a personalized experience and eliminates the confusion of “Are the clothes I’m looking at within my school’s dress code? Are they in my child’s size?” The Collections Page Users can look at a picture of students and select any individual items they have on ! Rationale: This is one thing that frustrates me about other clothing sites. Ex. “I love that hat that she’s wearing! I want to get it!”
    • http://invis.io/AUKSTG8N
    • Case Study
    • Scenarios How the user gets through their given tasks Method: ! I ideated and sketched out possible user scenarios. 
 
 - Receiving an email from an administrator
 - Going to the site’s homepage and getting good clothes for a good price.
 And came up with the flowing user journeys: ! ! AWARENESS 
 From the first page, users should be aware that the site makes it very easy for users to find the right uniform for their child.! ! SET UP AND FIRST RUN
 Sarah will receive an email from her school’s administrator directing her to the site. John goes to the site on his own. In both instances, they will be guided to the landing page, where they will be directed to set up an account and enter their child’s size, etc. The site will then show them the best clothes for their child. ! ! CORE PRODUCT EXPERIENCE! 1. Easy access! 2. Fast way to find perfect clothes! 3. Elegant display of clothing that gives users the impression that quality is ensured
 ! !
    • Design Iteration 1 Method: ! I created a site map by categorizing the company’s products into 3 main categories: girls, boys, and “swag”. I then created a basic wireframe in omnigraffle to show how users might navigate through the site and view their product information. ! ! Findings: 
 After reviewing several other student’s websites (all of which had at least 1 brilliant iteration), I compiled my favorite ideas together and adjusted my site as appropriate.! ! Opportunities Identified: ! I decided that a unique way to shop would be to view clothes as collections, where users can click on individual pieces in a collection and buy them separately. Alternatively, users can also search by categories such as tops, bottoms, and accessories.! ! Also, I found that a good alternative user experience would be to require them to make an account before entering the site. This will ensure that users are getting a personalized experience every time they enter the site. ! ! !
    • Design Iteration 2 Method: ! I carefully analyzed the works of my fellow colleagues as well as my instructor and adjusted my site plan accordingly. I was most inspired by Shamezo’s ideas of having collections, and the instructor’s fake website “Bingo” as an example of creating a landing page with just one option: to sign up. 
 Findings: 
 People liked the idea of shopping in collections, and landing pages with a signup option can be a great way to personalize a website. ! LE MP SA ! Opportunities Identified: ! I used these ideas to create a site where users have to sign up to view clothing. They must enter a child’s fit and school, as well as make a simple username before viewing clothing. The next page will be the collections page, where popular styles, as well as promotional items can be advertised. The difference here is that users can click on clothes within these collections and go straight to buying them. ! ! !
    • User Testing METHOD:! ! I tested the prototype with a variety of users and made adjustments to the interface based on my findings. ! ! CHANGES 
 
 • • • I made sure that users could still enter the site and buy clothes without finding their school listed! I put school results on the same page of the wizard as the entry to make it clear when they have found the right school.! I changed the viewing for individual products to show thumbnails instead of buttons to make the “add to bag” button stand out more
    • Thank you for your time. ! You are all wonderful people. Remember: “Design isn’t just what it looks like. Design is how it works.” –Steve Jobs