An ecommerce site for customizable punk merchandise.
Role: UX research and design
Tools: Adobe XD and Photoshop
The punk ethos is all about DIY, or "Do it yourself." This applies to everything from making music to making t-shirts. But what if you don't have access to the resources and materials needed to DIY?
Understanding our Users
As a UX researcher, I knew I was coming into this project with biased opinions based on my own history as a punk fan. Of course, relating to your users is not all bad. It can help to create empathy and may offer unique insights. However, it can also obscure insights and cloud perception, so it was important to make sure that I interviewed potential users to gain a less biased perspective on their pain points and needs.
Insights from User Surveys
The survey was conducted remotely, with 47 respondents from a diverse set of backgrounds. Most respondents were from the western part of the U.S. Findings were consistent across age, gender, race, and location.
Participants were asked to share their experiences of both websites that sell punk merch and websites that sell custom merch. (No direct competitors selling custom punk merch have been identified.) The following figures summarize a synthesis of responses to multiple choice, likert scale, and short answer questions.
The majority of respondents felt that existing websites that sell punk merch feel "too commercial."
Most respondents felt that items marketed as "punk" do not match their personal idea of punk.
Respondents who had tried custom t-shirt making websites felt overwhelmed by the length of the process and number of choices.
"Not enough choices"
Many respondents expressed frustration with being unable to choose a desired size, fit, or color when buying merch.
Based on surveys and follow up interviews with 3 participants, I developed a persona to help keep in mind the users I am designing for.
Max is a person who wants to make his own t-shirts, pins, and hats, but lacks the resources needed.
From Insights to Ideation
Understanding potential users allowed me to define a clear goal for the project:
Create a website that allows users to create custom punk merch in a way that feels easy, fun, and true to the punk ethos.
Next, I needed to envision the user's journey. How would they go about making merch through the website?
Outlining the user's journey revealed key opportunities to meet the user's needs.
After outlining the basic user journey, I was ready to create a site map.
To prepare for the first round of usability testing, I created some basic desktop and mobile wireframes.
I conducted a remote usability study with 5 participants from diverse backgrounds. These are the top insights from the study.
Less words, more pictures
Users do not want to read instructions on how to make merch. Ideally, the process would be explained in pictures, or it would be so intuitive that instructions are not needed at all.
Clear steps feel good
Users felt overwhelmingly positive about the experience of being led step-by-step through the merch making process. It was always clear what to do, and they didn't feel overwhelmed by needing to make multiple decisions at once.
One step checkout, please
Interestingly, users did not want the step-by-step experience to extend into checkout. They wanted everything on one screen. Enter your information, get a confirmation, and bam- your merch is on its way.
Insights from the usability study were incorporated into the high fidelity prototype.
Impact on Users
I conducted a survey of users who self-identify as consumers of punk merch to see how well the final design meets the product goal of being "fun, easy, and true to the punk ethos."
95% of users agreed that the merch making process was fun.
100% of users agreed that the merch making process was easy.
76% of users agreed that the merch making process felt "punk," which is pretty impressive if you consider the audience!
As a designer, I need to offer users a "just right" quantity of choices to avoid overwhelm. When lots of choices need to be made, breaking the process down into concrete steps is essential.
As a designer, I need to consider the culture of the intended users in addition to their needs. Slick and glossy designs are repellent to some users.
As a designer, I should strive to create designs that can be understood without long textual explanations. The FAQ or "How it Works" page can be made available to those who need it without forcing all users to start there.