French Toast

E-COMMERCE WEBSITE

THE CLIENT: French Toast logo

ABOUT: French Toast is a company that sells school uniforms for K-12. They partner with schools to coordinate a selection of garments to meet each dress & uniform code requirements. They were interested in a site redesign that would work well both for those browsing the entire site, but also parents who were sent an email checklist of specific types of clothes.

ROLE: UXA

METHODS USED Heuristic evaluation, card sorting, site map, user flows, sketching, prototyping, wireframing, and usability testing.

OVERVIEW

overview

RESEARCH AND FINDINGS

PERSONAS: The bulk of French Toast users are parents with various nuances. I was given a few personas that demonstrated French Toasts typical users. With that information, my surveys, and interviews, and synthesis I uncovered insights:

1) Users view this type of experience as a task rather than pleasurable.

2) Users want things to be effortless (no barriers).

3) Users want to get things done FAST!

card sorting

CARD SORTING: I asked for a list of all the products to be sold on the True Spirit site and began card sorting with users. This was beneficial both for the categorization of products and creating my site map.

GO WITH THE FLOW

SITEMAP: For ease of searching and loading new pages home page/product gallery is a single scrolling page. Now users can casually view everything at once or filter their search through the side navigation.

sitemap
home page

HOMEPAGE: Many of the schools will send emails to parents with link(s) to specific garments that fit their dress code. Those who click on a school link will be taken to a curated landing page that only shows the products deemed acceptable by the school. For ease of searching and less loading of pages I made the product gallery a single page.

process
product page

PRODUCT PAGE: I wanted to limit the steps between finding a product and buying it. In doing this I made the site simpler with less opportunities to get lost. I endeavored to make the entire site a 3-step process.

1. Find product(s)
2. Select size & color
3. Checkout

steps to purchase
checkout

CHECKOUT PROCESS

checkout process

NAVIGATION: Making minimal site with various routes requires an appropriate level of navigation.

checkout process
profile

ACCOUNTS: My audience are young parents, busy parents who, in interviews, mentioned not wanting more accounts to manage. I was curious what social platforms were most common amongst the users. Most everyone I surveyed had either a Facebook or Gmail account. With that, implemented an option to use an existing Gmail or Facebook account instead of creating a new unique account. This worked well in User Testing.

Next Steps