Uniqlo Product Description Page

This design task was given to me as part of an interview. I was asked to create a Product Description Page (PDP) for a retailer of my choice. I decided to choose Uniqlo as I love their current website, minimalistic styles and use of colour.

gallery/ai2
gallery/ae

Background

Brief : Design Challenge

Applications Used : 

gallery/xd

To begin this design I started by researching into the different User Interfaces of current fashion Retail applications currently available on the Appstore. Taking note into how each of them use Type and Colour to display the information needed for the user.

Project

The Retailer I chose to create the PDP for was Uniqlo, the reason behind this was Because they don’t currently have an application available. Below is screenshots of the current Uniqlo UK Desktop and Mobile website.

gallery/un_research
gallery/un_site

I then began to create initial sketches of the page I was looking to create, trying to fit each of the required features onto the page. My first thought was to make the page scrollable although this later changed during development.

gallery/un_sketch
gallery/un-style

Having chosen the retailer I started to find colour and a similar typeface to the Uniqlo Brand. Next I started to create assets for the different buttons and icons that will be used throughout using the current branding as inspiration.

Next I built the wireframe design in Illustrator and started to explore different layout design. Item size selection was added to the page reflecting the style that Uniqlo have used on their mobile version of the website.

gallery/un_wire

The final layout was seperated into two screens the first being the item and the second the details. This keeps all information to buy the item fast accesible and the detailed information of the item available if required. Although this more work for the user, research indicated that not all consumers will look at the details before purchasing the item.

gallery/un-deets
gallery/un_final

Finally I added images of the product including the different views of the fit. I also created a size selection page and add to bag screen, that shows the user other items that they have previously viewed.