top of page

PROJECT

Responsive Website

​

CLIENT

Noiir Squared London (luxury home decor start up)

​

GOAL

Design a responsive e-commerce website that was sleek, modern and minimalistic, giving off a luxury feel. Founder wanted the website to contain products to be sold, a gallery of in public interiors as well as payments/shipping system.

20959125.jpg
COMPETITOR RESEARCH
To understand what needs to be delivered for a home decor website, I've carried out extensive competitor research on what other home decor websites look like and what they had in common. I also wanted to get some inspiration on how I wanted to portray Noiir Squared London to give it a luxury feel.
 
The following common features in the below competitors websites:
  • The use of white space
  • Sans serif fonts consistently, occasional decorative font as a title
  • The use of the colour black and white, to represent sleek, modern and give luxury feel
  • Not too colourful, lets colours of interiors/homeware speak for itself
  • Square displays for layouts of products and rectangular buttons used throughout
​
Competitors: www.stevensonshome.co.uk, www.luxdeco.com, www.houseology.com, www.livertylondon.com, www.tobiasoliverinterior.com
USER STORIES
With inspiration for Noiir Squared London in mind, I began to structure out the necessary screens needed for potential customers in a User Flow using the following User Stories:  
​
As a customer, I...
​

  • Want to be able to browse various products the company sells that are organised by different categories.

  • Want to view the product that I have select and see the details (sizes and colours available, material, etc.).

  • Want to view the latest collections from Noir 

  • Want to add selected products to my basket and view them.

  • Want to be able to visit the gallery to see what Noiir's products look like in different interiors 

  • Want to view the returns & refunds policy as well as shipping information

r.jpg
177.jpg
LOW & MID-FIDELITY WIREFRAMES
Now that I had established the information architecture of the app, I was ready to sketch the low-fidelity wireframes by hand and turn them into black and white mid-fidelity wireframes using Sketch using the mobile-first approach:
HIGH FIDELITY WIREFRAMES & STYLE GUIDE
To create the high-fidelity wireframes, I needed to made a decision on: the visual design principles/trends, colours, imagery, typography, shapes & icons.
​

I first created a mood board which is a collection of luxury home decor/interior inspiration and design pieces that established NOIIR's mood. The founder wanted a clean and minimal yet stylish design so I wanted to remain consistent with the colours black and white. TI made the following design decisions:

Screenshot 2021-06-01 at 07.35.56.png
After putting all of my design decisions together, I set up the SEO search engine for NOIIR SQUARED LONDON in order for it to be searchable on Google. I also set up the shipping, payments system and created some social media content for the founder to use on the launch day.