top of page
HEYWEAR Redesign
Project : HEYWEAR mobile store Redesign Role : UX research, UX Design, Prototyping, Usability testing, Visual Design Duration : 3. 2022 - 5 2022
Project Vision
This case study focused on HEYWEAR's mobile site, which was redesigned to make it more accessible.
Assumption
HYWEAR is an eyeglass company with three stores in New York City, but they found that their website and mobile site did not have good accessibility for their users. So we explored their pain points and gained insights for the redesign.
User Interviews
research method : Online Interviewing 25 - 45 years old women 5 people
.png)
We interviewed a person who lives in the U.S. and already has poor eyesight and wants to buy new glasses or sunglasses.
Insghts User'sPainpoints
1.Need to use more big margins. Because some users are difficult to read this mobile site because they have poor eyesight.
3. Need to use a more popular font .
2. The buttons are hard to find, so please improve accessibility.
4.It was difficult to find the product page (no product page in the menu).
5. Need to make this mobile site more trustworthy. Need to be more clean, hero image, more picture less text.
Persona
Jon (42)
Living in New York
Has a son
Need to buy new glasses
Love to research new startups
The margins are too small and the font is too peculiar to read.
I just want to see the products, but I can't see the product pages from the menu.
I wanted to see brand images in photos and GIFs, but the top page has too much text.
Buttons are hard to find and I would like to be more accessible.
I looked at Instagram and YouTube, but they don't seem to have good social media management (although I doubt this is the real official page since there is only one video on YouTube).
Lauren
(38)
Senior Technical Recruiter
Living in New York
Single
Need to buy new glasses
Fashion, foodie, social media lover
I like the look book because it is stylish, but since it is a unisex product, I would like to see two different photos, one for men and one for women.
I already need to buy new glasses so it is hard to read their text (font, less margins).
It was hard to find the product page (there is no product page in the menu).
Information Architecture
Paper wireframe / Lo-Fi prototype
_HEIC.png)
User Test
-
Unmoderated Research 3 people
-
Moderated Research 3 people
Key Insight
1.Users want to know HEYWEAR's strong points quickly. So we had better make a website which has a simple hero image which has strong points, originality.
2. Users want to see HEYWEAR's products quickly. It is difficult to find their products page from the presence website.
3.It is difficult to read a lot of text in the homepage to explain their service for users, so I need to use popular fonts, less text, use graphics, more spaces, good hero images, and good accessibility buttons.
Challenge 1.
Using roboto font, more spaces, less text on homepage. Using more visuals. They have unisex products. So using female and male models.
Good accessibility buttons.
Challenge 2.
For the trustworthy, using their strong point to the home page."Including eye exam $99" "You can buy new glasses in 30 minutes." "Just walk in"
Challenge 3.
Making product page and it on the menu page.Because some users want to buy only sunglasses.
Before and After
.png)
.png)
.png)
.png)
.png)
Final Product
Illustration, GIFS
.png)
.png)
.png)
.png)
Takeaway
Gaining and keeping users’ trust and confidence is crucial to achieving and maintaining user retention.
Throughout their journey around your website, visitors are continuously analyzing whether or not they believe what you’re saying, trust what you’re offering, and ultimately whether or not they want to stay or leave the site altogether. While every individual begins their journey with various amounts of skepticism, few crucial traits will either increase or decrease your trustworthiness.
So, while unique fonts and artistic visuals are fine for a fashion magazine, a mobile site for a company with an online store must first have a "trustworthy" feel. Therefore, clean images, appropriate fonts, and proper margins should be used, following Material Design guidelines.
bottom of page