May - June 2019
My team and I focused on enhancing the customer experience when shopping in-person. Specifically, we chose to focus on the store Forever21. In the end, our team of three created a kiosk prototype that helps shoppers find sizes for the clothes they liked as well as find clothes that fits their style.
- User Research
- Competitive Analysis
- Physical and Digital Prototyping
- User Testing and Iterating
The problem statement that we came up with was:
"Shoppers at Forever 21 need an efficient way to navigate through the vast selection of clothes because it is easy to miss clothes that they might like."
This informed the opportunity we found, which was to create a kiosk at Forever 21 that will enhance a shopper’s experience by helping them find clothes that they are interested in easier. By doing this, we will make the store more approachable for the shoppers while directing them to their areas of interest, which will help drive sales for the store.
"What are keywords you associate with KOTX?"
"Approachable, inclusive, diverse, fun"
"Why do you want to create a website?"
"We use Facebook for information and it can be confusing and hard to find details like how to become a member or upcoming events"
"What is the primary audience for the website?"
"New and returning students, as well as potential sponsors or people looking to book KOTX for performances."
We interviewed people from the different audiences that KOTX was targeting, and created personas for each group:
We conducted a competitive analysis with four key competitors based on branding, functionality, content, site architecture, navigation, and design. See the competitors and our thoughts on their websites in the embedded Google Slides below:
Here is a summary of our findings and key takeaways:
We each created our own paper prototype, then consolidated our ideas into one paper prototype that became the basis of our further iterations.
Initial Digital Prototypes
We created a low-fidelity digital prototype for both desktop and mobile using Figma. We used Figma because it allows for real-time collaboration and most of us were familiar with it. The prototypes were in black and white other than the images we used, which we copied from the KOTX Facebook page.
Landing screen has relevant image and motto for people new to KOTX
Contact info at the bottom of every page
Upcoming event links for prospective/returning members
Navigation is easy to understand
We wanted the styling and theme of the KOTX website to be fun and approachable. We also wanted to set ourselves apart from other dance organizations, since the K-pop aspect is unique to them. Lastly, we also wanted to keep the existing color scheme of KOTX, which uses primarily purple and pink. We each created style tiles in order to settle on the visual language of the website.
We sent these to KOTX staff members, and a majority voted for the bottom left style tile. Our team also voted for this one because we thought it had the most character and conveyed the feeling of a K-pop group the best.
We used this information as well as data from user testing to create our final prototype. These were the changes in content that we made.
Made the difference between being a member and a non-member easier to understand
People said it was hard to find contact information, so we created a contact page where people can fill out an email form
Made staff categories a drop-down so people can find the people they are looking for easier
This project was very fun and insightful for me. It was nice to be able to dedicate around two months for this project, unlike some other classes that I've taken. Working with a client that we chose ourselves was also insightful in terms of what it's like to work with real people, and balancing their needs with the needs of the website visitors. Communication was key in order to be on the same page with our clients and with each other.