DEVELOPER DELIVERABLES
CREATED BY Sarah Holden
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
CONTENTS BRAND ASSETS .......................... 1 LOGO 2 COLORS & TYPOGRAPHY 3 BUTTONS & FORMS 4 SITE DEVELOPMENT ................... 5 SITE MAP 6 HI-FIDELITY WIRE FRAME 7 WEB ADVERTISEMENTS 8 PROTOTYPE 11
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
BRAND ASSETS
PRIMARY LOGO
2
Brand Assets
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
COLORS BADGER BLACK HEX: #231F20
CLEAN WHITE HEX: #FFFFFF
SLATE HEX: #323439
MINT LEAF HEX: #89DEC5
MINT BADGER HEX: #E1F2ED
3
Brand Assets
TYPOGRAPHY
HEADERS ROBOTO BOLD CONDENSED 52 PT CASE: ALL CAPS SUB-HEADERS ROBOTO CONDENSED 40 PT CASE: ALL CAPS LABELS ROBOTO CONDENSED 24 PT CASE: ALL CAPS Body Copy Roboto Regular 24 PT Case: Normal
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
BUTTONS & FORMS
4
PRIMARY BUTTONS
SECONDARY BUTTONS
COLOR: Mint Leaf TEXT COLOR: Badger Black TEXT SIZE: 18 pt FONT: Bold Condensed KERNING: 140 pt CORNER RADIUS: 5pt
COLOR: Badger Black TEXT COLOR: Mint Leaf TEXT SIZE: 18 pt FONT: Bold Condensed KERNING: 140 pt CORNER RADIUS: 5pt
DISABLED BUTTONS
FORMS
COLOR: HEX #E4E4E4 TEXT COLOR: Badger Black, 30% opacity TEXT SIZE: 18 pt FONT: Bold Condensed KERNING: 140 pt CORNER RADIUS: 5pt
COLOR: HEX #E4E4E4 BORDER: Badger Black, 1pt inner stroke TEXT COLOR: Badger Black TEXT SIZE: 16 pt FONT: Regular CORNER RADIUS: 5pt
Brand Assets
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
SITE DEVELOPMENT
SITE MAP
6
Site Development
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
HI-FIDELITY WIRE FRAME The Hi-fidelity Wire Frame contains call outs regarding certain intended functions within the site. This is an active hyper-link that will open in your default browser. https://xd.adobe.com/view/ed078dae-efe5-470d-5a23-4d1f669830d8-9b36/
7
Site Development
Š MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
WEB ADVERTISEMENTS
LEADERBOARD (728 X 90) PX PLACEMENT: Top of web page, center if possible, above or below site header & navigation
MEDIUM RECTANGLE (300 X 250) PX PLACEMENT: Top left or right of page, below site header, above body copy
8
Site Development
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
WEB ADVERTISEMENTS
HALF PAGE (300 X 600) PX PLACEMENT: Top of page, below site header & navigation, left or right of body copy
LARGE RECTANGLE (336 X 280) PX PLACEMENT: Middle to bottom of page, left or right in-line with body copy
9
Site Development
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
WEB ADVERTISEMENTS
SKYSCRAPER (120 X 600) PX PLACEMENT: Top of page, below site header & navigation, left or right of body copy
10
Site Development
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018
PROTOTYPE The following is the final prototype link for Mint & Badger’s on-line store. https://xd.adobe.com/view/0756a14a-90cc-4a85-46d2-ac81cf0998eb-7167/?fullscreen
11
Site Development
© MINT & BADGER SOAP & SHAVING CO. Developer Deliverables, 2018