Responsive website & logo design

Mirror is a hypothetical sustainable clothing store that required a new logo and a fast responsive e-commerce website to get in the game of digital transformation.



Team

Personal project

Scope

UX research, UX/UI design, Branding, Usability testing

Tools

Figma, Notion, Maze, Whimsical, Zoom, Optimal Workshop, Google Forms

Prototype

Preview



About the Project

Mirror started as a UK sustainable clothing store and is now quite successful offline. However, being late to the world of online e-commerce, they have now decided to move into online selling.

Mirror’s pain points include missing opportunities for more sales across the UK and abroad as many customers prefer online shopping. Mirror has also an issue with remaining inventory which could be shifted more easily via an online store. Regarding the brand, Mirror has a very outdated logo that they are looking to re-do.
‍
Design Goals

Design a logo for the company that is modern and neutral enough to attract all types of people and styles.
Design a fast responsive e-commerce website that is easy to use and allows customers to efficiently browse through all products and content and check out in a timely manner.

Empathise

My aim was to research and develop an understanding of customer’s motivations, needs and pain points when online shopping to create a desirable and usable shopping experience for Mirror. This also included learning more about direct competitors and how they solve the problem.

I started off with market research and competitive analysis followed by user interviews & surveys.

Highlights from user interviews - pain points of online shopping

I learnt that...

Users shop online more than ever before. Despite some areas of frustration, online shopping is still a more convenient and time saving option for many.

User expectations included a seamless shopping journey from discovery to delivery, aesthetic & trustworthy site as well as accessible customer service.

Plus ethical & sustainable fashion is on the rise!

Customers increasingly value those brands that have committed towards transparency and sustainability practices. Apart from products, they want to see the story behind them and the brand.

Persona

Based on my findings, I was able to distinguish two different personas that represented typical Mirror users.

Anna and Max were created to help me form an empathetic connection with target users and see how Mirror fits into their lives.
‍

Define

With business and user needs in mind, I put together a rough content hierarchy and mapped out flows as guides on possible interactions. It's been helpful to visualise the main decision points and figure out a realistic roadmap for the project.

Ideate

I revisited many competitor websites to look for best design patterns and started sketching out some ideas followed by wireframes and various iterations. The goal was to ensure the product is intuitive and satisfies common business and user goals.

Once the first set of wireframes was finished, I began adding in & iterating some textual content to get a general feel for the content hierarchy.

‍

Branding + UI

The next step was a visual exploration that aligned with Mirror's brand keywords - neutral, modern, fresh and clean. This included a moodboard, logo development and UI kit followed by full scale UI designs.

After brainstorming ideas for the best logo, the clear winner was a modern and balanced take on the mirror symbol put together with a youthful yet elegant grotesque sans serif.

‍

Testing + Iterations

With my built prototype, I conducted a series of unmoderated and moderated usability tests to uncover any assumptions and errors that could have been overlooked.
‍

Following user insights, I have adjusted my prototype and prioritised the most important changes so there is a further room for improvement.

View the original prototype

