2020
UX/UI DESIGN
GREEN TEA YARN
Green tea yarn is a strong ethos startup, they have various categories of products, because of this the users often get lost on the home page. Their new navigation and interface design give users a new way to access products. Easy, Fast and refreshing interface.
Project Goal:
(1)Optimise product navigation which including:
-
Prioritized product lines and categories.
-
Added a smart search bar, which can access website products easier.
-
Created a product theme, it would reduce the number of products featured and give clients inspiration and focus when they get lost in various options.
(2) Add currency converter
(3) Show fibre Informations
.png)
DESIGN EXPLORATION
For those customers who are not only searching for the yarn weights but also searching for the yarn palette ideas, we gave customers a colouring journey, let them have chance to explore the different yarns with stories behind.
ADD CURRENCY CONVERTER
Insert a Currency Converter API & cooperate with an engineer.
Based on the website visitors analytic, the report collects the findings that the end-users come from Australia, UK, USA. In an E-commerce website, a currency convertor would be a must for users from different countries.
Wix is a website that is not allowed to add currency code on the website, so I need to design a specific currency converter API for this website. Also, there is a functional limit for Wix when you want to add currency code in your shop, instead of telling my client it's not possible, I decided to find another solution for my client, I cooperated with my engineer friend and try to fix this from the backend.
REDUCE THE NUMBERS OF CATEGORIES
Using Miller’s theory on information processing, between 5 - 9 items presented at one go is optimal for users to cope.
By combining a few categories to the colour themes, it allows the brain to process the information better.
IMPROVE VISUAL PRESENTATION & TEXT SPACING
Based on the content in Web Content Accessibility Guidelines (WCAG) 2.1,
There is specific colour ration for the visual presentation of text and images of text. Even text spacing as well. To build an all user-friendly eCommerce website, I want to make sure all the contents are easy to read in the right font size, spacing, and colour contrast.
