ODSIL sunglasses
Adaptive design of an e-commerce website
The project is an adaptive design for an e-commerce business, presenting sustainable wooden sunglasses. The company is a local-family one located in Italy and wants to broaden its customer base to all of Europe.
Problem statement for ODSIL business owner
Our business was a family-owned shop in Italy. They are interested in sustainable products, and with this mindset, they design and sell wooden-frame sunglasses. Until recently, they were focused on local customers and arranged their business in their shop in Venice. With the increase in their business, they have decided to invest in an e-commerce website for their products and sell them to other European customers. Their goals for this investment are: to increase their online sale, build the trust of their customers, and attract new customers who cannot trust online shopping for unknown sunglasses brands.
My roles
Lead UX designer, UX researcher, and UI designer
My responsibilities
User research, wireframing, prototyping, usability testing, A/B testing, presenting to stakeholders
Project duration
3 months
Design process
Survey and research
For the research purpose, we designed a survey, consisting of 16 questions and distributed it among potential users in Europe to find their needs, 43 participants replied to our questionnaire, including 11 men and 32 women.
In the next step, we had over 9 direct interviews, 7 women, and 2 men from different nationalities, residing all over Europe, to eliminate possible biases. Then we extracted the affinity diagram and empathy maps to understand the potential users and their needs.
A primary user group was identified as working adults, interested in fashion design and also considering sustainability and protecting the environment.
Persona and her story
User journey
Competitive analysis
Based on competitive analysis of direct and indirect competitors, we found about potential success opportunities in market and necessary design features in our final product.
Design features
List of design features was created after user research and discussed with stakeholders. Finalized features was prepared base on user needs and stakeholder capacity.
-
Adding face scan feature
-
Focus on classic designs
-
Emphesize on comfort of glasses
-
highlighting sustainable and eco-friendly material
Mood board
UI Kit
Paper wireframes and crazy eights
For the main screen of the desktop website, we used the Crazy-8 method in the team to find the best design and information architecture for our website. The card sorting was performed through competitive analysis with direct and indirect businesses.
Digital wireframes
As the initial stage of design goes on, we make sure that the user has easy access to the main design features, including the face scan option and bestsellers to see the sunglasses designs, also Business needs for introducing their value propositions at the first glance on the website.
On the product page, the user has easy access to the available items, also the possibility to refine their selection based on color, frame, price, and size of glasses.
Iterations
In the final version, we created the CTA for men and women categories in hero images instead of pictures. Also, the face scan option is not included in the navigation bar, which gave the wrong impression of lower importance in the process.
Change in hero image
Change in Scan face feature
Change in colors and card design
