BRAND
MANUAL
NEX
04 The brand main logotype simplified version
08 The typography logotype text
14 The colours brand application on backgrounds
18 The correct usage 26 Credits
BRAN
THE
This is the main version of the logo and it should always
be used if possible with a light clean background. This composition is indivisible, it should always be used as it appears above. Altough there are some exceptions that we will see as we follow along the manual.
5
The main logo
There is no max size for the main logo.
100px wide / 35mm wide. Min size of the main logotype.
The main version of the logo should never be used in smaller sizes than 100px wide or 35mm wide.
6
The simplified version
100px wide / 35mm wide. Max size of the simplified logo.
50px wide / 10mm wide. Min size of the simplified logo.
The simplified version of the logo should never be used in a bigger size than 100px wide or 35mm.
And it should never be reproduced smaller that it appears here, 50px wide (or 10mm wide).
There is a simplified version for smaller sizes, when the logo needs to be used in a smaller size than 100px wide in the screen or it needs to be printed out smaller than 35mm wide, we need to use this simplified version.
7
graph
typo
THE
PUNCHIN TRUDY
The words ‘PUNCHIN TRUDY‘ written in TREND SANS ONE font.
The original main logotype.
TREND SANS ONE is the font that was used to develop
PUNCHIN TRUDY’S logotype. The TREND FONT FAMILY is a key element in the identity of this brand. It should be used in the headings in any kind of digital or printed publication of this brand.
9
TREND SANS ONE ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]*
TREND SANS FOUR ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]*
TREND SANS FIVE ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]* 10
TREND SLAB ONE ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]*
TREND SLAB FOUR ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]*
TREND SLAB FIVE ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]* 11
MAKE SURE TO USE TREND IN HEADINGS And Sansation in the body text for any digital or printed publication of PUNCHIN TRUDY’s brand. Don’t use any other font as a general rule. Why does it matter? It is really important to develop a clear, strong and consistent brand. Over the time it should follow the same rules and principles, and typography is a fundamental element.
But what about the web? None of this fonts are web safe fonts. Yeah, you’re right. But fortunately nowadays there is no problem to safely use any font you like in the web. With the rule @font-face in CSS3 we can import and display any font in our web and the user will see it with no problem.
SANSATION font for body text. Sansation is the comple-
mentary font of this brand. Together with Trend font family, Sansation is the font in which the content of the publications should be set. As an example, the body text of this manual is using Sansation font.
12
SANSATION REGULAR ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]*
SANSATION BOLD ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]*
SANSATION ITALIC ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789()!?#$&”’+-=/.:;<>{}[]* 13
OUr
COL
THE
PMS 802 CMYK (56, 0, 66, 13) RGB (171, 255, 0)
White CMYK (0, 0, 0, 0) RGB (255, 255, 255)
Black CMYK (0, 0, 0, 100) RGB (0, 0, 0)
Green, white and black are the colour components of this
brand. The logo can never bee used in any different combination of colours. There are different variants of the logo whose aim is to achieve the highest effectivity possible when being used in different conditions.
15
Light background logo versions
The three available variants of the main logo when it is used against light backgrounds. *Note that you canâ&#x20AC;&#x2122;t exchange this variants with the ones on the right page as some outlines or shapes will be missing.
The two available variants of the simplified logo when appearing on a light background. Reproduced here at their maximum size (100px wide). There is no color version of the simplified logo.
16
Dark background logo versions
The three available variants of the main logo when it is used against dark backgrounds.
The two available variants of the simplified logo when appearing on a dark background.
17
usag
THE correc
What is the most appropriate option?
You should always pay attention to the background in
which you are going to use the logo. You should ask yourself: Is it dark enough to use the negative version of the logo? Your decision may not only depend in the concret background but in the rest of the elements of your design as well, as a whole. You should also be careful when reproducing the logo in small sizes, there are some rules about when to use the simplified version and when the original one.
19
The main version of the logo doesnâ&#x20AC;&#x2122;t have a maximum size.
20
100px / 35mm
The minimum size in which the main logo can be used.
100px / 35mm
The maximum size in which the simplified logo can be used.
50px / 10mm
The minimum size in which the simplified logo can be used.
The logotype, composed with TREND SANS ONE font.
The symbol, a graphical representation of a “punch“, with the shape of a star composed by two triangles.
The logotype and the symbol can only be used indepen-
dently from each other as an exception. Most of the times (if not always), the logo will be used as the composition of both of them, in one only possible way, the way it appears several times along this manual. To understand it better, in the next pages there are some examples of how the logo should be used and how it can’t be used.
21
The correct usage
Make sure to leave enough margin around the logo. The optimal margin size is 1/10 of the width of the logo. In this example, weâ&#x20AC;&#x2122;ve represented the margin in green. When the logo width is 75mm we set a margin of 7.5mm around the logo.
75mm
7.5 mm
Be sure that youâ&#x20AC;&#x2122;re chosing the appropiate version of the logo when you need to place it in a given background. Try to achieve the maximum possible contrast between the colors of the logo and the background. Any of the versions above could be used in a neutral gray background.
22
You should never...
Rotate the logo in any direction.
Reflect the logo in any direction.
Scale the logotype disproportionately.
23
You should never ever...
Apply a drop shadow or any other kind of effect. The logo should always be used as it is.
Use the simplified logo in a bigger size than 35mm/100px wide. Remember: this version has been designed only for very tiny sizes.
PUNCHIN TRUDY
Literally write “PUNCHIN TRUDY“ using TREND or in any other font and use that composition instead of the logotype.
24
Convert the logo into “grayscale” or print it out in black and white. Use the ready logo versions in black and white for this purpose
You really shouldnâ&#x20AC;&#x2122;t...
Create a different composition with the logotype and the symbol. If as an exception you need to use one of this two elements, do it separately, use only one of them: the logotype or the symbol.
Change the colors of the logo in any way. You should always use the existing variations of the logo with no color alteration on it.
Use the colored logo in a background with a similar green.
25
The brand PUNCHIN TRUDY punchintrudy.com trudy@punchintrudy.com
The designer Pisto Casero pistocasero.com contact@pistocasero.com
Trend font family Daniel HernĂĄndez Paula Nazal Selaive Latinotype â&#x20AC;&#x201C; latinotype.com
Sansation font family Bernd Montag dafont.com/bernd-montag.d1610 berndmontag@gmx.de
26
credit
THE