Jade Temple Jewelry

Online Jewelry Shop – eCommerce Web App

Overview

The goal of this project was to design an eCommerce online webshop for a startup jewelry company.

Problem

The design requirements are a jade theme, according to the name of the company and a slight touch of brutalism design. The main color feeling should still be bright and clear. All content should be easily expandable, because a lot of content is following soon.

Solution

I created a design with big UI elements and big fonts. I decided to put not too many whitespaces between the elements and played in addition with unusual wide margins and paddings. 

Users

The main persona is an adult between 26 and 42, is currently in a serious relationship or has already a fiance. He or she works in an upper office job and likes to spend money on accessories. Quality and uniqueness is very important to this person.

Key Features

The design is very unique and resembles quality and elegance. I created a small design system which was built in a way, that everything is interchangeable and can be mixed seamlessly.

My Contribution

  • Researching personas
  • Define and create user flow
  • Wireframes
  • Prototyping
  • Feedback analysis
  • User interface design
  • Mockups

User Flow Diagram

I created user flows based on the brief, several user stories and a comprehensive research of personas.

Wireframes

After analysing similar apps and identifying the focus of the design, wireframes were created.

Moodboard

STYLE GUIDE

Color Palette

I used monochromatic jade colors according to the name of the company and the theme requirements.

Typography

Cormorant SC was an excellent choice for an elegant and high quality jewelry shop. I chose Raleway as body text because of it’s fine lines and slightly swirly face. Together they fit very well into the theme.

Heading

H1 Cormorant SC Medium, 64px

H2 Cormorant SC Medium, 48px

H3 Cormorant SC Medium, 36px

H4 Raleway Bold, 24px

Body Text

P1 Raleway Medium, 18px

I learned about serif and sans serif typefaces,
about varying the amount of space between
different letter combinations, about what makes
great typography great. It was beautiful.

P2 Raleway Medium, 24px

I learned about serif and sans serif typefaces,
about varying the amount of space between
different letter combinations, about what makes
great typography great. It was beautiful.