Build a design system | Case Study

Build a design system | Case Study

Step One | Design a logo

Step One | Design a logo

Step Two | Colour palette

Step Two | Colour palette

Large

Medium

Small

Modura: Logo concept one

Modura: Logo concept one

Large

Medium

Small

Modura: Logo concept two

Modura

M

m

M

m

Step Three | Typography

Step Three | Typography

Modura | Style Tile

Icon Set

#004d40

#00796B

#10201D

#39796b

#21B099

#D9E0DF

Primary


Lighter

Variant

Lighter

Variant

Darker

Variant


Darker

Variant


Secondary


Primary Palette

Neutral Palette

Secondary Palette

#00251a

#004C40

#F5F5F5

Modura Header

Modura sub-header

This is the Modura body text.

Hero | Large

Logo

Typographic Hierarchy

Keywords

Color Palette

Photography Style

Logo, nav, main CTA buttons.

Secondary buttons, actions, CTAs.

Background, text.

Wordmark | Medium

Logomark | Small

Cart

Close

Like

Chat

Save

Home


Button

Button

PingFang HK

Medium 28px

PingFang HK

Regular 22px

PingFang HK

Light 20px

Trendy

Youthful

Affordable

Business casual

Fashion-forward


Clothing focused, neutral background, fresh, youthful.

Step Four | Style Tile

Step Four | Style Tile

Step Five | High fidelity wireframes

Log In

Sign Up

10:29

Log in or create an account to access exclusive discounts, favorites, and more.

No Thanks

Account

Textured Work Shirt

$150

Add to bag

Select a size

XS

S

M

L

10:29

Contemporary unisex shirt made from certified organic cotton, featuring subtle detailing and signature Modura motif on cuff.

People Also Viewed

“Jackets”

Search

Filter

Sort

Showing 46 results for “jackets”

Rusty cord jacket

$180

Green cord jacket

$180

Rusty puffer

$160

Ribbed zip up

$177

Rusty cord jacket

$180

Rusty cord jacket

$180

10:29

“Jackets”

Search

Filter

Sort

Showing 46 results for “jackets”

Rusty cord jacket

$180

Green cord jacket

$180

Rusty puffer

$160

Ribbed zip up

$177

Rusty cord jacket

$180

Rusty cord jacket

$180

10:29

Iterations:

Iterations:

Back to top of page