WorksExercisesAbout
Web Design

AMEDEO TESTONI

Vist Site
Year
2020
Client
AMEDEO TESTONI
Role
Website UI Designer
Vist Site

What is AMEDEO TESTONI

AMEDEO TESTONI has existed for more than 80 years, bringing luxury footwear and accessories that blend style and craftsmanship to customers.


Along with the change of time, AMEDEO TESTONI started to have its corporate website with online shop functions such as viewing and filtering products, adding products to cart, and checkout.

My Role

User Experience Designer & User Interface Designer

This project took place between September 2020 and February 2021. I worked on this project as a User Experience Designer and User Interface Designer at Linkage Retail Solutions Limited.

I was working on my own as a design team. I was responsible for the wireframe, visual direction, interaction design, prototype design, and producing, all major deliverables for the technical team to develop.

What is the challenge?

Designing a multi-language website


To coincide with the client's budget, they want to build a single design that includes multiple languages. It is a little bit challenging for me because I need to consider many scenarios such as the place of the language switcher, how to accommodate layout changes when a user switches from English to an RTL language, and using culturally appropriate colors, images, and icons.

Technical Concern

We will use the Shopify platform to build the website in this project. Because of the time and cost concerns, our company decided to buy a template and modify it based on my design. It was a big challenge when I completed all the designs and found that some of the functions or interactions are not supported on the platform. This means I have a huge limitation on the function and interface that I can work with. So I need to redesign and thinking another workaround solution to solve this problem.

Discover & Define The Problems

Competitor analysis

The first step to starting this project is doing a lot of research around AMEDEO TESTONI. The more research I put on it into the research process will make me understand which functions are crucial to the foundation of the solution I need to take my eye on it.
Through the competitor analysis, I can easily find strategic insights into the features, functions, flows, and feelings evoked by the design solutions of AMEDEO TESTONI competitors.

User Interviews

I interviewed five users to find out their opinions on the competitors’ apps. The questions were centered on various key points common to fashion e-commerce apps. For example, we asked questions related to:

  1. Browsing for a shoe;
  2. Making a purchase;
  3. Waiting for the delivery;
  4. Receiving the items;
  5. After Sales Service.

Key findings from the interviews:

  1. The website is easy to browse, having no major issues with the navigation;
  2. Using mobile for brows and purchases has become more popular;
  3. Their presentations are messy;
  4. They lack clarity on the delivery options and fees;
  5. Frustration comes from the item does not match with photo;
  6. They lack clarity on the return process.

Card Sorting

Before creating an information architecture of the website, I want to understand more how the customers will navigate and what they expect certain content to be found. At last, I decided to do card sorting for the site.
The result makes me very surprised. Most of the participants sort the cards so similarly; it shows that the categories and grouping are similar to AMEDEO TESTONI's competitor website. Perhaps people are already familiar with this kind of website, so they expect the website structure should be the same.

Design Highlights

Wireframe

Wireframes of: home, side menu, categories, view products, adding products to cart, checkout, sign in, and sign up.

AB Testing with Wireframe version

I chose to do AB Testing earlier in the process to learn if a design will be effective with users once implemented live. It is a valuable method for identifying the best-performing version of my design, making me more confident to do my remaining design process.

Hi-fi prototype

By applying the usability test, I iterated a high-fidelity prototype. The interactive prototype can be viewed on adobe XD.


Deliver

Finally, after I have built the prototype, I need to pass through all of the assets to the developer to see if it can be done or if we have any problems implementing the design. We conducted alpha testing and QA testing after it was ready.

Latest Case Study

Interested working
with me?

Email Me

Interested working
with me?

Email Me