Project overview
The product:
SNEAK Tees is a streetwear company that only sells t-shirts. The main focus is helping consumers match their sneakers to their t-shirts. The demographic is men, women, and preteen/teens ranging in age from 10-50 years old.
Project duration:
August 2021 - September 2021
The problem:
Individuals want the ability to design customized t-shirts that match their shoes, highlight streetwear style and reflect their personality.
The goal:
To design an efficient and enjoyable flow to create one of a kind customized t-shirts.
My role:
UX Designer designing SNEAK Tees from conception to delivery.
Responsibilities:
Creating personas, conducting interviews and usability studies, paper and digital wireframes, low and high-fidelity prototyping, accounting for accessibility, and iterating on designs.
User Research
Summary
I conducted interviews, developed personas, and created journey maps to understand the users I am designing for and their needs. A primary user group was conducted to find consumers who were sneaker heads and really wanted clothing to reflect their unique style and personality.
I love sneakers and was a sneaker head back in the day. The research I conducted showed how elevated streetwear culture has become and how individuality is the greatest component with styling.
Pain Points
Color accuracy
The colors on site are different than what the customer actually wants.
Lack of Variety
Many websites have bland designs and don’t cater to streetwear.
Experience
Many customization websites are time consuming and poorly designed.
Problem Statement
Jermeer is a busy company owner and family man who needs clearly outlined design customizations and color choices because he wants accurate purchases and online shopping to be time conducive.
User journey map
I created a user journey map to highlight the areas of improvements needed when creating a flow for customized designs.
Sitemap
I wanted to make information architecture that was easy and customer friendly for designing custom t-shirts.
Paper Wireframes
I created paper wireframes that emphasized the pain points of limited color choices, in addition to highlighting the variety of designs and making the user experience quick and fun. I created mockups for the phone and tablet to ensure that the site would fully responsive for users.
Digital Wireframes
I addressed the pain points and improved the user experience by highlighting how efficient and easy the customization process would be. I used many images to emphasize the type of designs that users could create.
Usability study: findings
The low fidelity prototype was utilized to complete the usability study. The overall consensus of the usability study was the design flow was good but the following pain points needed to be addressed to ensure efficiency with customization.
Color selection - Customers want to select more than one color in addition to the color description box.
Form location - Customers were split on the location of the form placement. Two users wanted the form to be at the top while two users concluded the form was fine at the bottom of the page.
Sneaker model number - The ability to upload the sneaker is good but knowing the model number helps with identifying the exact colors.
Interaction - The call to action text in the header was difficult for some users to recognize.
Accessibility considerations
Navigation has a clear flow task with easy to locate call to action buttons.
I used hierarchical headings to order elements on the site.
The site colors meets color and contrast accessibility.
Mockups
The header was redesigned including the search and sign in features. The drop down menu was also added to allow an additional route to locating customized designs. The order form allows for more than one color selection in addition to the color choice question moving up the form to continue color choice elaboration, if necessary.
BEFORE
AFTER
BEFORE
AFTER
Mockups for all screen sizes
STYLE GUIDE
High-fidelity prototype
My high-fidelity prototype emphasized user feedback from the usability study and highlighted the entire customization design flow.
View the high-fidelity prototype.
Takeaways
Impact:
Our users stressed how important the customization choices were in addition to the collaboration with the designers. The users also liked the idea of creating shirts specifically based upon their sneakers.
What I learned:
I learned the importance of users being able to create their own clothing with a variety of customization options utilizing an easy to navigate website. Streetwear has always been based upon originality and styling clothing to the user’s unique taste. The creation of this website really reflected the true nature of creating your own streetwear that compliments sneakers.