Brand Identity Style Guide 2022
Table of Contents
2
3 01 - Introduction...............4-7 Project Brief Color Palettes Entrance Sign Tablet Version Letterhead Tote Bag Switch Section Signs Open & Closed Signs Business Card Deskmat Switches Container Keyboard Services Sign Folder Design Overview Typefaces Promotional Signs Smartphone Version Envelope Keyboard Carrying Case Logo Design Bathroom Signs CD Cover Directory Sign 02 - Basic Elements.........8-17 03 - Stationery..................18-27 04 - Signage Design........28-41 05 - User Interface...........42-49 06 - Merchandise.............50-55 07 - Credits.........................56-57 • Logo Description • B & W Logo + Ratio • Master Logo • Variations • Restrictions • Clear Space & Minimum Sizing
01 - Introduction
4
Project Brief
Basic Overview
5
Project Brief
More time at home also means more time for new hobbies. Some hobbies that have exploded in popularity over the course of the pandemic have been building PCs and putting together customizable mechanical keyboards. What we have noticed is that the mechanical keyboard market has been saturated with the same old pricey RGB keyboards for what has felt like the past decade now. What we at Purukumi are doing is providing a fresh concept in the tech world and giving people a new option when it comes to keyboards, keycaps, and switches.
Our main goal is to not only help enthusiasts that are in the hobby of keyboards already, but to also introduce newcomers that are interested in the world of keyboards. We strive to create a fun, bubbly, and exciting experience for all involved.
As the keyboard market advances and becomes more refined, the ability to make and customize one’s own keyboard will become more sought after. We aim to provide an easy and pleasing experience for enthusiasts of all kinds, and ultimately, our main goal is to show everyone the beautiful world of keyboards.
6
Design Overview
The goal is to design a logo that would not only reflect our product but our brand and its meaning as well. Purukumi, which means “chewing gum” in Finnish, is a brand that specializes in keycaps and keyboards that have a more bubbly and colorful aesthetic. Our products are popular because, compared to the more neutral and mechanical feel and aesthetic of modern keyboards, ours take a more lighthearted and flavorful approach to the market. The “gummy” and squishy feel of the keycaps is also something that is prevalent in many of our products.
This in turn would reflect in our branding and design as well. We want the “gummy” and bubbly aesthetic to be something that helps us stand out from our competitors. With our choices of color palettes, typefaces, logo designs, and merchandise, we want to be able to visible communicate the brand “Purukumi.”
7
02 - Basic Elements
8
9 Color Palettes Typefaces Logo Design • Logo Description • B & W Logo + Ratio • Master Logo • Variations • Restrictions • Clear Space & Minimum Sizing
Color Palettes
Purukumi as a brand is a fun and bubbly keyboard company. We wanted to incorporate a fun and bright color palette that would stand out from its competitors who usually go for the typically black and grey color palettes.
CMYK: 16, 20, 0, 0
RGB: 209, 200, 227 RGB: 157, 210, 160
CMYK: 40, 0, 47, 0
CMYK: 0, 0, 0, 0
RGB: 255, 255, 255 RGB: 231, 66, 134
CMYK: 3, 89, 15, 0
#ffffff #e74286
10
#d1c8e3 #9dd2a0
Typefaces
The reason why we chose these specific typefaces for this brand is because we wanted something that was fun, yet readable. MADE Mellow was the primary typeface we used in things such as stationery and headers. Although the brand is more on the cute and bubbly side, we still wanted it to still have a sense of quality and professionalism. MADE Tommy was used primarily for signages. It was chosen because it is easy on the eyes and modern. Montserrat was the primary typeface used in online applications, such as in the User Interface design of our brand.
11 MADE Mellow ABCDEFGHIJKLMNO PQRSTUVWXYZ abcdefghijklmno pqrstuvwxyz 0123456789 MADE Tommy ABCDEFGHIJKLMNO PQRSTUVWXYZ abcdefghijklmno pqrstuvwxyz 0123456789 Montserrat ABCDEFGHIJKLMNO PQRSTUVWXYZ abcdefghijklmno
pqrstuvwxyz 0123456789
Logo Description
1 2 4
3
1. The lettering represents the many different flavors of chewing gum, presumably fruit-flavored ones such as cherry. This is seen in some of the serifs in the logo that is taking the form of cherry stems.
2. The star represents the quality of our product and brand.
3. The bubblegum is representative of our brand’s name (translated means “Chewing Gum”) as well display the aesthetic and inspiration we have gotten from gum.
4. The logo is at a slight angle to give it a more dynamic and friendly appearance.
12
13
& White Logo Ratio 5.2x 3.78x 3.03x x 2.77x 0.13x
Black
Master Logo
14
Variations
1. This version primarily focuses on just the outer stroke of the logo. Although purple is used in this example, this version can be used on any color background. It’s most often seen on our merchandise and for things that are transparent.
2. This horizontal layout of the logo puts the focus on the hand-drawn lettering of our logo.
3. A different twist to our logo. This version lets the letters breathe more.
15
Restrictions
The logo’s stroke color CANNOT be another color other than white.
The logo CANNOT be stretched out.
16
Clear Space & Minimum Sizing
17
0.8 in. 1.4 in. 0.3x 0.3x x
03 - Stationery
18
19 Letterhead Envelope Business Card CD Cover Folder
Letterhead
0.34 in.
11 in.
0.46 in. 0.19 in. 0.9 in. 2.13 in. 1.63 in. 0.98 in.
0.56 in.
20
8.5
in.
Envelope
21
9.5 in. 0.6 in. 0.3 in. 0.47 in. 0.8 in. 3 in. 4.125 in. 1.5 in. 4.3 in. 3.76 in. 1.97 in. 0.8 in. 0.7 in. 0.2 in. 0.3 in.
2 in.
0.45 in.
0.64 in.
3.5 in. 1.4 in. 0.76 in.
0.8 in.
0.29 in.
0.3 in. 0.3 in. 0.54 in.
22
Business Card
23 CD Cover 4.75 in. 4.75 in. 4.7 in. 2.5 in. 2.1 in. 1.16 in. 0.22 in. 0.15 in. .73 in. 2.67 in.
24 Folder 9 in.
12 in. 4.4 in. 4.11 in. 2.27 in. 0.5 in. 0.57 in.
25
4
Folder: Inside 18 in.
in.
26
27
04 - Signage
28
29 Entrance Sign Promotional Signs Open & Closed Signs Switch Section Signs Bathroom Signs Charges & Keyboard Services Sign Directory Sign
30
Entrance Sign 6 ft 2.2 ft 2.3 ft 2.2 ft
31
32
Signs Open
Closed Signs 6 ft 4 ft 4.7 ft 0.7 ft 0.17 ft 0.7 ft 3.1 ft 2.5 ft 3 ft 9 in 5 in 3.9 ft
Promotional
&
33
Switch Section Signs
34
6 ft
ft 5 ft 4 ft
ft
2
1.4
35
Bathroom Signs
36
ft 0.8 ft 0.8 ft 4.5 ft 1.2 ft 6 ft
1.2
37
38
6 ft 3 ft 8 in 5 in
Keyboard Services Sign
39
40
6 ft
4
4.3
Directory Sign
2 ft
ft
ft
41
05 - User Interface
42
43
Tablet Version Smartphone Version
Tablet Version
1. Navigation Bar
•used to navigate to different pages, log-in to your account, and access shopping cart
2. Product Showcase
•showcases the products, as well as helps grab the attention of visitors
3. About our Product
•talks about the build quality and design of our products
4. Shop Scroll for Fully-Built Keyboards
•this horizontal carousel is used to quickly look at the types of keyboards that are for sale
44
5. Shop Scroll for New Arrivals
•this horizontal carousel is used to quickly look at the new products that have dropped
6. Scroll Through Articles of Keyboards
•not only is the website a good place to purchase keyboards and keycaps, but it is also a good place to check out the latest news and drops
7. Footer
•Shows info such as how to contact us, location, available hours, and social media links, as well as a sign-up form.
45
Smartphone Version
1. Navigation Bar
•navigate to different pages quickly with the menu icon, log-in to your account, or access the shopping cart
2. Product Showcase
•showcases the products, as well as helps grab the attention of visitors
3. About our Product
•talks about the build quality and design of our products
46
4. Shop Scroll for Fully-Built Keyboards
•this horizontal carousel is used to quickly look at the types of keyboards that are for sale
5. Shop Scroll for New Arrivals
•this horizontal carousel is used to quickly look at the new products that have dropped
6. Scroll Through Articles of Keyboards
•not only is the website a good place to purchase keyboards and keycaps, but it is also a good place to check out the latest news and drops
7. Footer
•Shows info such as how to contact us, location, available hours, and social media links, as well as a sign-up form.
47
48
49
06 - Merchandise
50
51
Keyboard
Deskmat Switches
Tote Bag
Carrying Case
Container
Tote Bag
52
Keyboard Carrying Case
53
Deskmat
54
Switches Container
55
07 - Credits
56
Stationery Mock-up: https://www.freepik.com/free-psd/corporate-identity-mockup-psd-set-business-enterprise_17860610.htm#query=branding%20
Entrance Sign Mock-up: https://www.freepik.com/free-psd/black-sign-mockup-outsideshop_3763826.htm#page=3&query=store%20front&position=17&from_ view=search&track=sph
Storefront Mock-up: https://mrmockup.com/restaurant-storefront-mockup/
In-store Mock-up: https://sgeek.sg/wp-content/uploads/2022/02/Mash-Experience-Store. jpg
Bathroom Mock-ups: https://www.freepik.com/free-psd/wall-with-blank-door-mockup_7046001.htm#query=wall%20with%20blank%20door&position=0&from_view=search&track=sph
https://www.freepik.com/free-psd/wall-with-blank-door-mockup_7045982.htm#query=wall%20with%20blank%20door&position=6&from_view=search&track=sph
Paper Table Tent Mock-up: https://www.freepik.com/premium-psd/paper-table-tent-mockup_25851135.htm#query=table%20tent%20mockup&position=15&from_view=keyword
Directory Mock-up: https://mash.sg/
Tablet Mock-up: https://www.rawpixel.com/image/1217918/digital-tablet-screen-mockup
Smartphone Mock-up: https://unblast.com/free-in-hand-mobile-mockup-psd/
Tote Bag Mock-up: https://www.behance.net/gallery/152451963/Free-Canvas-Bag-Hangingon-a-Tree-Mockup?locale=en_US
Keyboard Carrying Case Mock-up: https://m.media-amazon.com/images/I/81dLyXFwoEL.jpg
Deskmat Mock-up: https://i.imgur.com/zvN2WjC.jpeg
Switches Container Mock-up: https://res.cloudinary.com/kineticlabs/image/upload/q_auto/c_ fit,w_1020/f_auto/v1/api-images/products/switch-container/DSC03180_ litsm5?_a=ATAEtAA0
Pictures used in UI Design: https://opalit.works/
57
Designed By Jimmy Truong
Fall 2022
GRC 420 - 1001