Photo

Mermaid Collection

A responsive Shopping website designed and developed for a pearl jewellery brand.

Overview

The Challenge

The need was to design and develop a responsive shopping website for ‘Mermaid Collections’ a popular pearl ornament brand established in Thiruvananthapuram. An aesthetically pleasing user interface has to be designed which will engage the users with the website, and provide a pleasant shopping experience for the users.

Objectives

  • To set up an online store for a popular pearl jewellery brand
  • To provide information about types of pearls.
  • To provide a hassle free shopping experience for the users.

Project Scope

Responsive Website Design & Development

Tools Used

Role

Duration

2 weeks

Research

A basic research was conducted. Similar websites and apps were observed. User interviews were conducted. User Personas were created and analysed. Talks were conducted with the Managing Director of Mermaid Collections.

User Interviews

Talks were conducted with participants whom I considered to be potential users about their preferences, shopping habits, concerns etc. These data helped me to arrive at conclusions and helped me in the design process.

Conclusions:

● Clients are concerned about privacy policies.

● Clients are interested to read reviews and view other customer ratings of the products.

● A clean user interface which is easily understandable is desired.

● Clients had concerns about the warranty and replacement policies of the product.

● An easy, hassle free payment method was a necessity.

User Pain Points

Product Quality

The quality of products are not ensured while purchasing

Privacy Policy

Clients are concerned about the privacy policies in the website.

Replacement

Prefer easy user flow for replacement and exchange process.

Payment Methods

Availability of more than one payment mode was desirable.

User Persona

Information Architecture

Based on my research and the persona representations, I tried to categorize and structure the informations collected, on the basis of expected features and concerns of the users. 

Sitemap

Design

Task Flow

A simple Task Flow was prepared, so that an idea will be obtained about how a user will browse through the website to achieve a specific task. Here, consider a customer browsing the website to purchase a pearl ornament.

 

User Flow

Analysing the different task flows, a user flow was created to generate an idea about the way users will interact with the website.

Low Fidelity Wireframes

Low Fidelity Wireframes was created before creating the Responsive UI wireframes. Wireframes of the key pages are shown here.

Responsive Wireframes

Considering the Task Flows, User Flow and sketches, responsive wireframes were created. This will ensure a consistent experience  for the users in different devices (Desktop, Tablet, Mobile).

Home Page

Shop Page

Responsive UI Design

After creating a Responsive Wireframe, suitable styles were applied and the Responsive UI Design of the website was created.

Home Page

Shop Page

UI Kit

UI Kit includes the typography and the different colours used in the design created for the website.

Final Thoughts

The goal was to design and develop a responsive shopping website for ‘Mermaid Collections’ a popular pearl ornament brand established in Thiruvananthapuram. Thus a responsive website interface was designed, so as to provide an easy shopping experience for the users.

View Other Works