Metricss Brand Manual A visual idendity guide for metricss company
CREATION DATE : NOVEMBER 2016
ISSUE 01 CORPORATE DESIGN MANUAL
01/1
a perfect guide for creative companies
THEME BRANDING GUIDELINES AND MANUAL TEMPLATE
CREATED FOR : METRICSS LONDON
MADE WITH LOVE BY: EGOTYPE DESIGN BERLIN
Metricss Brand Manual Table of Contents
MADE WITH LOVE BY: EGOTYPE DESIGN BERLIN
Brand Manual 3 // 56
SEC. 00
|
INTRODUCTION
04
SEC. 01
|
CORPORATE LOGO AND CONSTRUCTION
06
SEC. 02
|
CORPORATE TYPOGRAPHY
12
SEC. 03
|
CORPORATE COLOR SYSTEM
20
SEC. 04
|
CORPORATE STATIONERY
22
SEC. 05
|
SOCIAL MEDIA GUIDELINES
26
SEC. 06
|
GRID SYSTEMS
32
SEC. 07
|
WIREFRAME SYSTEM
40
SEC. 08
|
MOODBOARD AND INSPIRATION
42
SEC. 09
|
IMAGES AND BLENDING MODES
44
SEC. 10
|
ICONOGRAPHY
48
SEC. 11
|
SUMMARY AND CONTACT
50
SEC. 12
|
DOWNLOADS AND IMPRESS
52
Brand Manual 4 // 56
Intro:duction Welcome aboard THANK YOU BEING A PART OF OUR COMPANY. WELCOME ABOARD. INTRODUCTION OF OUR PRESIDENT:
Tequis magnam everunt re volupti ntiusament at et omnimo totatin venimus anturis explaut alique quatem qui utemquia dolo erum soluptas alite tet id qui utempor esequis evelesc iaecabor re conseque qui officab orruntota cus ium rempedi gendandus veniscidus erum as ut idebit, toremporias ea conet volo blantia plaborepel is natqui officil magnihi. Octotasseque eosapit dolest explit ped ma sit modipsam ventio tem. Et earum volo voluptibus. Dandunte voluptaqui nias re voluptate occust, tet id qui utempor esequis evelesc iaecabor re, occabor itatem et fuga. Nem faccaeptiae expliae core prorporepera ipicte sinvele stectis modis num re sandant. Quas dolentiur? Et ut mo beate nobis autendenihil iducias adit quostrum accus et aut et rem quidipsa quam recus. quatem iur? Velenes de plab il imenim fugitatent voloreh enisquis et arunt venihitin cus et rero beatet experrum faccupti tecus volupta tatatem aces volo officipsunto omnist ommodi dolupta desciatur,
sediorio qui doluptatem dipsus moditat inctia voluptat odicim exerum fugit, sam as re, ea voluptas earcia quas quundanda natur sitionectent asincit, core esciminit asimolut quia quatet essimus eum eatempedi dus dendige niminul luptae vendae sandem que que vollesenime oditat. Sent odipsum etureic to que et duciunt magni inctur autento rporese dicidi corem quas dolupti untiam, incidun tionsequae rem eos vendae natqui susae doluptis dolores molor sum fuga. Nam quossi inverum nectatem nusam qui sim comnim quatest landusame omnienda nimagnihic to blaborr ovidunt aspid quo et aut apis velestibus inis diciis vid que voles aut fugitios sae rerferi tiatur magnimus etur minvereriate net, utecte velescilit enist vit, ipis magnienda core preptasi quae pratur? Quia sit et rempos volupti ariti sum hiliqui omnihit atquia quistruptum nonsequati to cus magnate ctecum et aut aute lit, opta aut restia quianti orrovides alique nime iligend ictota nem. Nem quis seque dolorem fugia que voluptatus eictem eum qui que praepel lorerchit modi officaborio bla pel isincit aditis destis excepre rnatemo eius.
Brand Manual 5 // 56
01/1 Liquatem iur? Velenes de plab il imenim fugitatent voloreh enisquis et arunt venihitin cus et rero bevolupta tent voloreh enisquitent voloreh enisquitatatem aces volo officipsunto omnist ommodi dolupta des.
01/1
a perfect guide for creative companies
Brand Manual 6 // 56
Corporate Logotype Our Logo is the key building block of our identity, the primary visual element that identifies us. The signature is a combination of the the symbol itself and our company name – they have a fixed relationship that should never be changed in any way. The Metricss Agency´s Masterbrand or Corporate Logo comprises two elements, the logo symbol and logo type. The Logo Symbol is a powerful image evoking the culture of design services - the connection between the strength of communication and the different points that influence. It has a particular relationship with the Agency´s name. The Logo Type has been carefully chosen for its modern and yet refined, highly legible style, which has been further enhanced by the use of upper case letters. The typeface is Montserrat Bold and has also been chosen to compliment and balance perfectly with the logo symbol.
The corporate logo is presented through the use of colour as well as shape and form. The two corporate colours are Yellow and Grey. It is a fresh and appealing blend of colours chosen for their strong combination - modern - classic - timeless. The Colours have been selected according to international standards as shown below and are easily implemented.
Brand Manual 7 // 56
Full Logotype
Full Metricss Logo
Logo
Logotype
Single Logotypes
THE LOGO SYMBOL
THE LOGO TITLE
Consists of a powerful element evoking the culture of design services and a grey square backround.
Carefully chosen for its modern and yet refined, highly legible style, which has been further enhanced by the use of upper case letters in gray tone of the chosen corporate color. The font that is used here is Montserrat Bold.
The main logo is the dark logo used on white or colored backround. For darker backrounds you will find an alternatives following in this manual.
Brand Manual 8 // 56
Logo Construction, Clearspace and Computation It is important to keep corporate marks clear of any other graphic elements. To regulate this, an exclusion zone has been established around the corporate mark. This exclusion zone indicates the closest any other graphic element or message can be positioned in relation to the mark.of the the symbol itself and our company name – they have a fixed relationship that should never be changed in any way.
Clearspace x x
DEFINITION Whenever you use the logo, it should be surrounded with clear space to ensure its visibility and impact. No graphic elements of any kind should invade this zone.
x
COMPUTATION To work out the clearspace take the height of the logo and divide it in half. (Clearspace = Height / 2).
x
x
Brand Manual 9 // 56
x
x
Logo Construction
1x
x x 1x
Logo Backrounds
Logo Dos and Don‘ts
PLEASE READ CAREFULLY THE DOS AND DON’TS
1. Do not place the logo type on 2 lines 2. Do not invert the logo symbol 3. Never change the proportions of the logo vertically or horizontally or alter the appearance in any way
4. Do not alter the logo type style 5. Do not change the size relationship between the logo symbol and logo type. 6. Do not alter the logo symbol
Brand Manual 10 // 56
Guideline for Logo Placement
Brand Manual 11 // 56
Correct Logo Placement
THE LOGO PLACEMENT Explanation: To place the Metricss Agency´s logo in the correct way please use one of the approved styles that are shown on the right. To place the Metricss Agency´s logo in other ways is not allowed.
Parameter Example Logo Placement 297 x 210mm DIN A4
Brand Manual 12 // 56
Corporate Typography 01
Bold
Regular
The corporate Fonts and typography Figures Typography plays an important role in communicating an overall tone and quality. Careful use of typography reinforces our personality and ensures clarity and harmony in all Metricss Agency´s communications. We have selected Playfair and Montserrat, which helps inject energy and enthusiasm into the entire Metricss Agency´s communications, as the primary and secondary corporate typefaces.
Characters
Brand Manual 13 // 56
A
B
C
D
E
F
G
H
I
J
K
L
N
O
P
Q
R
S
T
U
V
W
X
Y
a
b
c
d
e
f
g
h
i
j
k
l
n
o
p
q
r
s
t
u
v
w
A
B
C
D
E
F
G
H
I
J
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
Corp. Font 01
a
b
c
d
e
f
g
h
i
j
k
l
m
Playfair Display
n
o
p
q
r
s
t
u
v
w
x
y
x
M m
y
K
Z z
L
M
z Primary Font :
0
1
2
3
4
5
6
7
8
9
0
Playfair -
!
“
§
$
¡
“
¶
«
∑
€
%
&
¢ ®
/
[ †
(
] Ω
)
| ¨
=
{ ⁄
? }
ø
` ≠
π
•
;
:
Designer :
¿
‘
Claus Eggers Sørensen
±
‘
-
Brand Manual 14 // 56
Corporate Typography 02
Bold
Regular
Corp. Font 02 Montserrat Primary Font :
Designer :
Montserrat
Julieta Ulanovsky
-
-
Figures
Characters
Brand Manual 15 // 56
A
B
C
D
E
F
G
N
O
P
Q
R
S
T
a
b
c
d
e
f
g
n
o
p
q
r
s
t
A
B
C
D
E
F
G
N
O
P
Q
R
S
T
a
b
c
d
e
f
g
n
o
p
q
r
s
t
0
!
1
“
2
§
3
$
¡
“
¶
«
∑
€
4
%
®
†
i
u
K
L
M
W
X
Y
Z
j
k
l
m
w
x
y
z
I
J
K
L
M
U
V
W
Y
Z
h
i
j
v
w
u 6
(
k x
y
z 0
` ≠
π
m
9
? }
ø
l
8
= {
⁄
X
7
)
| ¨
J
v
H
] Ω
V
h
/
[
I
U
5
&
¢
H
; ¿
•
: ‘
±
‘
Brand Manual 16 // 56
Typo and Text Hierarchy
Bold
Regular Typographic hierarchy is another form of visual hierarchy, a sub-hierarchy per se in an overall design project. Typographic hierarchy presents lettering so that the most important words are
Figures
displayed with the most impact so users can scan text for key information. Typographic hierarchy creates contrast between elements.
Characters
There are a variety of ways you can create a sense of hierarchy. Here are some of the most common techniques for Metricss´ layouts.
Characters
Brand Manual 17 // 56
Caption Text
Source Sans Pro Regular 6 pt Type / 9 pt Leading
Metricss Agency Typo
Copy Text
Source Sans Pro Regular 8 pt Type / 11 pt Leading
Metricss Agency Typo
Headlines Copytext
Montserrat Regular - Capital Letters 10pt Type / 10pt Leading
METRICSS AGENCY TYPO
Sublines Sections
Montserrat Bold - Capital Letters 16pt Type / 16pt Leading
Metricss Agency Typo
Big Headlines and Title
Montserrat Bold - Capital Letters 34pt Type / 30 pt Leading
Metricss Titles
Sequencer and Title for Marketing
Montserrat Bold - Capital Letters 48pt Type / 48 pt Leading
Metricss
Brand Manual 18 // 56
Metricss Brand Manual
Colors are one important thin brand to the cu
e of the most ngs to transfer a ustomers.
Brand Manual 19 // 56
Brand Manual 20 // 56
Corporate Color System THE PRIMARY COLOR SYSTEM AND COLOR CODES.
PRIMARY COLOR
PRIMARY COLOR
-
GOLD
GREY
Color plays an important role in the Metricss Agency´s corporate identity program. The colors below are recommendations for various media. A palette of primary colors has been developed, which comprise the “One Voice” color scheme. Consistent use of these colors will contribute to the cohesive and harmonious look of the Metricss Agency´s brand identity across all relevant media. Check with your designer or printer when using the corporate colors that they will be always be consistent.
PRIMARY COLOR
PRIMARY COLOR
GOLD
GREY
-
-
COLOR CODES
COLOR CODES
CMYK : Pantone : HKS : RGB : Web :
CMYK : Pantone : HKS : RGB : Web :
C000 M020 Y100 K000 297C 02K R000 G000 B000 #000000
C000 M020 Y100 K000 297C 02K R000 G000 B000 #000000
Brand Manual 21 // 56
Secondary Color system
Color Usage
Explanation: The Secondary colors are complementary to our official colors, but are not recognizable identifiers for Metricss Agency´s company. Secondary colors should be used sparingly, that is, in less than 10 percent of the palette in one piece.
Use them to accent and support the primary color palette.
Color Codes CMYK : Pantone : HKS : RGB : Web :
C020 M000 Y000 K080 442C 98K R000 G000 B000 #000000
Color Codes CMYK : Pantone : HKS : RGB : Web :
C020 M000 Y000 K080 442C 98K R000 G000 B000 #000000
Color Codes CMYK : Pantone : HKS : RGB : Web :
C020 M000 Y000 K080 442C 98K R000 G000 B000 #000000
Color Codes CMYK : Pantone : HKS : RGB : Web :
C020 M000 Y000 K080 442C 98K R000 G000 B000 #000000
Brand Manual 22 // 56
The Company Letterhead This shows the approved layouts with the primary elements of the Metricss Agency stationery system for the frontside of the letterheads.
Parameter Dimensions 210 x 297 mm Weight 90g/m Uncoated white Print CMYK
USAGE The letterheads will be used for all official contact and communication of Metricss Agency´s company. Insert the message of Metricss Agency´s into the letterhead and send your documents throughout the world.
Brand Manual 23 // 56
The Company Business Cards This shows the approved layouts with the primary elements of the Metricss Agency´s stationery system for business cards. Business Card Frontside
Parameter Dimensions 85 x 55 mm
Business Card Backside
USAGE The business cards will be used for official contact and communication of Metricss Agency´s company. Place your data into Metricss Agency´s business cards and feel free to give them to your customers and partners.
Weight 400g/m Uncoated white Print CMYK
Brand Manual 24 // 56
The Company Envelope This shows the approved layouts with the primary elements of the Metricss Agency stationery system for the front- and backside of the corporate envelopes.
Envelope Frontside
Parameter Dimensions 210 x 105 mm Weight 85g/m Uncoated white Print CMYK
USAGE
Envelope Backside
The envelope will be used for all official contact and communication of Metricss Agency´s company. Insert the Metricss Agency´s letterhead and send your documents throughout the world.
Brand Manual 25 // 56
The Company Presentation Folder This shows the approved layouts with the primary elements of the Metricss Agency´s stationery system for company folder.
Parameter Dimensions 9 x 12 inch closed
USAGE The presentation folder will be used for all official contact and communication of Metricss Agency´s company. Insert the informational stuff what you will give away and do not forget to include a business card.
Weight 400g/m Uncoated white Print CMYK
Brand Manual 26 // 56
Social Media Guidelines
Rules of Engagement
HERE YOU WILL FIND INFORMATION ABOUT THE SOCIAL MEDIA POLICY OF METRICSS COMPANY. INTRODUCTION TO OUR SOCIAL MEDIA POLICY:
Social media is changing the way we work, offering a new model to engage with customers, colleagues, and the world at large. We believe this kind of interaction can help you to build stronger, more successful business relationships. And it’s a way for you to take part in global conversations related to the work we are doing at Metricss and the things we care about. These are the official guidelines for participating in social media for Metricss. If you’re an Metricss employee or contractor creating or contributing to blogs, wikis, social networks, virtual worlds, or any other kind of social media, these guidelines are for you. They will evolve as new social networking tools emerge, so check back regularly to make sure you’re up to date.
Participation in social computing on behalf of Metricss is not a right but an opportunity, so please treat it seriously and with respect. If you want to participate on behalf of Metricss, get your manager’s approval, complete the Social Media@Metricss training, and then send your account handles to the Social Media Center of Excellence. Please know and follow the Metricss Code of Conduct. Failure to abide by these guidelines and the Metricss Code of Conduct could result in discipline up to and including termination. Contact social. media@metricss.com for more information. Please also follow the terms and conditions for any third-party sites.
Brand Manual 27 // 56
1. Disclose
2. Protect
3. Use Common Sense
Your honesty—or dishonesty—will be quickly noticed in the social media environment. Please represent Metricss ethically and with integrity.
Make sure all that transparency doesn’t violate Metricss’s confidentiality or legal guidelines for commercial speech—or your own privacy. Remember, if you’re online, you’re on the record—everything on the Internet is public and searchable. And what you write is ultimately your responsibility.
Perception is reality and in online social networks, the lines between public and private, personal and professional, are blurred. Just by identifying yourself as an Metricss employee, you are creating perceptions about your expertise and about Metricss. Do us all proud.
Be transparent: If you make an endorsement or recommendation about Metricss’s products/technologies, you must disclose that you work for Metricss. If you do not have an “Metricss” handle, then use “#work4metricss” in your postings. Using a disclaimer in your bio or profile is not enough per the FTC. Be truthful: If you have a vested interest in something you are discussing, be the first to point it out and be specific about what it is. Be yourself: Stick to your area of expertise; only write what you know. If you publish to a website outside Metricss, please use a disclaimer like this one: “The postings on this site are my own and don’t necessarily represent Metricss’s positions, strategies, or opinions.” Be up-to-date: If you are leaving Metricss, please remember to update your employment information on social media sites.
Don’t tell secrets: Never reveal Metricss classified or confidential information. If you are posting your job description on LinkedIn, be sure not to reveal confidential product information. If you’re unsure, check with Metricss PR or Global Communications Group. Off-limit topics include litigation, non-published financials, and unreleased product info. Also, please respect brand, trademark, copyright, fair use, and trade secrets. If it gives you pause—pause rather than publish. Don’t slam the competition: Play nice. Anything you publish must be true and not misleading, and all claims must be substantiated and approved. Don’t overshare: Be careful out there—once you hit “share,” you usually can’t get it back. Plus, being judicious will help make your content more crisp and audience-relevant.
Add value: There are millions of words out there—make yours helpful and thought-provoking. Remember, it’s a conversation, so keep it real. Build community by posting content that invites responses—then stay engaged. You can also broaden the dialogue by citing others who are writing about the same topic and allowing your content to be shared. Don’t make claims: We must use FTC mandated disclaimers in all communications when benchmarking or comparing processors. So stay away from saying our products are smarter/ faster/ higher-performing in your social media postings. Leave that to the experts. Did you screw up? If you make a mistake, admit it. Be upfront and be quick with your correction. If you’re posting to a blog, you may choose to modify an earlier post—just make it clear that you have done so.
Brand Manual 28 // 56
Social Media Guides 01
Facebook Page Profile Image: • Must be at least 180 x 180 pixels • Photo will appear on page as 160 x 160 pixels • Photo thumbnail will appear throughout Facebook at 32 x 32 pixels This is the photo representing you or your brand on Facebook. This square photo will appear on your timeline layerd over your cover photo. It will also appear when you post to other walls, comment on posts or when you´re searched with Facebook´s Open Graph.
Facebook Media Guidelines Explanation: Here you will find the social media guidelines for Facebook. This will help you to prepare your Posts in correct way and give you the best possibilities to provide images and media links to your audience. This will help you to have the most effective interaction with your social media fans or visitors.
Brand Manual 29 // 56
Cover Image: • Appear on page at 851 x 315 px • Anything less will be stretched • Minimum size of 399 x 150 px • For the best results, upload an RGB JPG file less than 100 kb • Images with a logo or text may be best as a PNG file
Shared Image : 1200 x 900 px • Appear on page at 851 x 315 px • Anything less will be stretched • Minimum size of 399 x 150 px • For the best results, upload an RGB JPG file less than 100 kb • Images with a logo or text may be best as a PNG file
Shared Link : 1200 x 627 px • Recommended upload size at 1200 x 627 px • Rectangular Photo: Min. 470 x 246 px in feed • Rectangular Photo: Min. 484 x 252 px on page
Highlight Image : 1200 x 717 px • Appear on page at 843 x 504 px • Choose a higher resolution at that scale for a better quality
Brand Manual 30 // 56
Social Media Guides 02 Google+ Media Guidelines Explanation: Here you will find the social media guidelines for Google+. This will help you to prepare your Posts in correct way and give you the best possibilities to provide images and media links to your audience. This will help you to have the most effective interaction with your social media fans or visitors.
Google+ Page Profile Image: • Must be at least 250 x 250 px • Minimum size 120 x 120 px • Maximum 5000 x 5000 px • Use Jpg, Gif or Png images You upload your image in a square format and then going render it into your page as a circle, so make sure you choose a photo doesn´t cut out your best side.
Brand Manual 31 // 56
Cover Image : 1088 x 608 px • Recommended 1088 x 608 px • Minimum 480 x 270 px • Maximum 2120 x 1192 px The Google+ cover image is the biggest photo on your page, so choose your photo wisely! It is a great opportunity for you to showcase a product or service your brand offers.
Shared Image : 497 x 373 px • Appears in home stream an on page at a width of 426 px (height is scaled) • Minimum width of 497 px (will scale the height for you) • Maximum upload 2048 x 2048 px • Shared link - 150 x 150 px (thumbnail)
Shared Image : 150 x 150 px Shows in the feed and on page as 150 x 150 pixels (pulls in the photo from linked website)
Brand Manual 32 // 56
Corporate Grid Systems
THE GRID SYSTEM Explanation: The grid serves as an armature on which a designer can organize graphic elements (images, glyphs, paragraphs) in a rational, easy to absorb manner. A grid can be used to organize graphic elements in relation to a page, to other graphic elements on the page, or relation to other parts of the same graphic element or shape.
In graphic design, a grid is a structure made up of a series of intersecting straight (vertical, horizontal, and angular) or curved guide lines used to structure content.
Parameter Example Grid System for DIN A4 297 x 210mm
Brand Manual 33 // 56
A4 Vertical Grid System Examples
Parameter Example Grid System for DIN A4 297 x 210mm
Brand Manual 34 // 56
Web Design & Development THE LOGO PLACEMENT Explanation: To place the Metricss Agency´s logo in the correct way please use one of the approved styles that are shown on the right. To place the Metricss Agency´s logo in other ways is not allowed. Parameter Example Logo Placement 297 x 210mm DIN A4
Brand Manual 35 // 56
iPad Vertical Grid System Examples
SCREEN HORZONTAL GRID SYSTEM EXAMPLES Explanation: This shows an approved layout with a typography grid for a iPad Screen of Metricss Agency. This will be used for Company mobile websites.
Brand Manual 36 // 56
Mobile Design & Development THE LOGO PLACEMENT Explanation: To place the Metricss Agency´s logo in the correct way please use one of the approved styles that are shown on the right. To place the Metricss Agency´s logo in other ways is not allowed. Parameter Example Logo Placement 297 x 210mm DIN A4
Brand Manual 37 // 56
iPad Vertical Grid System Examples
SCREEN HORZONTAL GRID SYSTEM EXAMPLES Explanation: This shows an approved layout with a typography grid for a iPad Screen of Metricss Agency. This will be used for Company mobile websites.
Brand Manual 38 // 56
Screen Design & Development
HEADLINE ONE
HEADLINE ONE
HEADLINE ONE
HEADLINE ONE
Tequis magnam everunt re volupti ntiusament at et omnimo totatin venimus anturis explaut ea conet volo blantia plaborepel is natqui officil magnihi.
Tequis magnam everunt re volupti ntiusament at et omnimo totatin venimus anturis explaut ea conet volo blantia plaborepel is natqui officil magnihi.
Tequis magnam everunt re volupti ntiusament at et omnimo totatin venimus anturis explaut ea conet volo blantia plaborepel is natqui officil magnihi.
Tequis magnam everunt re volupti ntiusament at et omnimo totatin venimus anturis explaut ea conet volo blantia plaborepel is natqui officil magnihi.
Octotasseque eosapit dolest explit ped ma sit modipsam ventio tem. Et earum volo
Octotasseque eosapit dolest explit ped ma sit modipsam ventio tem. Et earum volo
Octotasseque eosapit dolest explit ped ma sit modipsam ventio tem. Et earum volo
Octotasseque eosapit dolest explit ped ma sit modipsam ventio tem. Et earum volo
Brand Manual 39 // 56
Grid Example 1
Grid Example 1
Screen Grid Systems
Grid Example 1
Grid Example 1
Grid Example 1
SCREEN HORZONTAL GRID SYSTEM EXAMPLES -
Grid Example 1
Grid Example 1
Grid Example 1
Explanation: This shows an approved layout with a typography grid for a 16:9 Screen of Metricss Agency. This will be used for Company presentations in Powerpoint or Keynote.
Brand Manual 40 // 56
Wireframe System
A website wireframe, also known as a page schematic or screen blueprint, is a visual guide that represents the skeletal framework of a website. Wireframes are created for the purpose of arranging elements to best accomplish a particular purpose.
Brand Manual 41 // 56
Grid Two columns
Grid Three columns
Grid Four columns
Grid Five columns
Team Page Overview
Landing Page One Page Design
Blog Page Single
Blog Page Overview
Portfolio Page 3 columns
Portfolio Page Grid based
Shop Products Overview
Shop Product Single Page
Brand Manual 42 // 56
Mood Board & Inspiration
Mood boards can be a great way to convey your design idea
pitches and get an early sign-off. Follow our expert advice o how to create them.
Be inspired. Be glad. Be glorious. Be individual.
a, win
on
Brand Manual 43 // 56
Brand Manual 44 // 56
Corporate Images 01 Dark Images THE METRICSS AGENCY CORPORATE IMAGE : DESCRIPTION Corporate Images are responsible to transfer the values of Metricss Agency´s to our customers or our potential customers. It is a composite psychological impression that continually changes with the firm’s circumstances, media coverage, performance, pronouncements, etc. Metricss Agency use various corporate advertising techniques to enhance their public image in order to improve their desirability as a supplier, employer, customer, borrower, partner, etc.
THE METRICSS AGENCY CORPORATE IMAGE : DARK IMAGES Requirements: - desaturate colours - high contrast - sharp images - minimalistic look - modern and businesslike
Brand Manual 45 // 56
02 Light Images
Requirements THE METRICSS CORPORATE IMAGE : LIGHT IMAGES Requirements: - desaturate colours - high contrast - sharp images - minimalistic look - modern and businesslike
Brand Manual 46 // 56
Images and Blending Modes How to How to create Blending modes
Dark Images
1) use it in image in black and white mode 2) use a placeholder with a corporate background 3) adjust the layer style to “multiply�
Light Images
Brand Manual 47 // 56
How to add the blending modes to corporate images
THE METRICSS AGENCY BLENDING MODES FOR IMAGES Image effects and blending modes raise the concision and the recognizability of a brand. Also they are able to divide content and other graphical elements that are used in layouts. In the same way the support statement of the used images and raise application possibilities.
Brand Manual 48 // 56
Corporate Iconography THE ICONOGRAPHY PALETTE
THE CORPORATE ICONOGRAPHY OF METRICSS AGENCY An icon is a pictogram displayed on a screen or print layout in order to help the user navigate through the content in a easier way. The icon itself is a small picture or symbol serving as a quick, “intuitive” representation of a software tool, function or a data file.
Brand Manual 49 // 56
Corporate Icon Construction
1. Setup
2. Your Icon
3. Upscale
4. Downscale
-
-
-
-
Create a square background in corporate color
Choose your icon from corporate icon range
Scale the chosen icon up to the size of your square background
Downscale the chosen icon with a value of 46 % and center
Used Icon Backgrounds Dark Background
Light Background
Brand Manual 50 // 56
Summary & Contact THANK YOU FOR YOUR ATTENTION TO THIS BRAND MANUAL GUIDE SUMMARY
Tequis magnam everunt re volupti ntiusament at et omnimo totatin venimus anturis explaut alique quatem qui utemquia dolo erum soluptas alite tet id qui utempor esequis evelesc iaecabor re conseque qui officab orruntota cus ium rempedi gendandu qui utempor esequis evelesc iaecabor re s veniscidus erum as ut idebit, toremporias ea conet volo blantia plaborepel is natqui officil magnihi. Octotasseque eosapit dolest explit ped ma sit modipsam ventio tem. Et earum volo voluptibus. Dandunte voluptaqui nias re
voluptate occust, tet id qui utempor esequis evelesc iaecabor re, occabor itatem et fuga. Nem faccaeptiae expliae core prorporepera ipicte sinvele stectis modis num re sandant. Quas dolentiur? Et ut mo beate nobis autendenihil iducias adit quostrum accus et aut et rem quidipsa quam recus. quatem iur? Velenes de plab il imenim fugitatent voloreh enisquis et arunt venihitin cus et rero beatet experrum faccupti tecus volupta tatatem aces volo officipsunto omnist ommodi dolupta desciatur, sediorio
Brand Manual 51 // 56
Contact & Support CONTACT Company: Metricss
Contact:
inctia voluptat odicim exerum fugit, sam as re, ea voluptas earcia quas quundanda natur sitionectent asincit, core esciminit asimolut dendige niminul luptae vendae sandem que que vollesenime oditat. Sent odipsum etureic to que et duciunt eos vendae natqui susae doluptis dolores molor sum fuga. Nam quossi inverum nectatem nusam qui sim comnim quatest landusame omnienda nimagnihic to blaborr. Ovidunt aspid quo et aut apis velestibus inis diciis vid que voles aut fugitios sae rerferi
tiatur magnimus etur minvereriate net, utecte velescilit enist vit, ipis magnienda core preptasi quae pratur? Quia sit et rempos volupti ariti sum hiliqui omnihit atquia quistruptum nonsequati to cus magnate ctecum et aut aute lit, opta aut restia quianti nem. Nem quis seque dolorem fugia que voluptatus eictem eum qui que praepel modi officaborio bla pel isincit aditis destis excepre rnatemo eius.
Company President Mark Anderson E: manderson@metricss.com P: +01.132.4567.890 Vice President Dean Michaels E: dmichaels@metricss.com P: +01.132.4567.890 Marketing Director Mark Anderson E: manderson@metricss.com P: +01.132.4567.890
Brand Manual 52 // 56
Downloads & File System Metricss Logo
THE CORPORATE DESIGN OF METRICSS, DOWNLOAD LINKS OF THE SINGLE DESIGN ITEMS
Metricss Stationery
Explanation: For quick help and faster project development you will get the download links to the several brand guidelines and the editable data. To download the single items please scan the QR-codes or follow the given hyperlink. You will also find the complete Brand Manual as a PDF file for sending this to responsible agencies or person that need your guidelines.
Metricss Iconography
Metricss Full Manual
Brand Manual 53 // 56
CONTACT Web link Link : http://www.metricss.com/cd/logo.zip
Company: Metricss
Contact: Web link Link : http://www.metricss.com/cd/stationery.zip
Company President Mark Anderson E: manderson@metricss.com P: +01.132.4567.890
Web link Link : http://www.metricss.com/cd/icons.zip
Vice President Dean Michaels E: dmichaels@metricss.com P: +01.132.4567.890 Marketing Director Mark Anderson
Web link Link : http://www.metricss.com/cd/fullmanual.pdf
E: manderson@metricss.com P: +01.132.4567.890
Brand Manual 54 // 56
Agency & Impress METRICSS AGENCY SUMMARY
Tequis magnam everunt re volupti ntiusament at et omnimo totatin venimus anturis explaut alique quatem qui utemquia dolo erum soluptas alite tet id qui utempor esequis evelesc iaecabor re conseque qui officab orruntota cus ium rempedi gendandu qui utempor esequis evelesc iaecabor re s veniscidus erum as ut idebit, toremporias ea conet volo blantia plaborepel is natqui officil magnihi. Octotasseque eosapit dolest explit ped ma sit modipsam ventio tem. Et earum volo voluptibus. Dandunte voluptaqui nias re
voluptate occust, tet id qui utempor esequis evelesc iaecabor re, occabor itatem et fuga. Nem faccaeptiae expliae core prorporepera ipicte sinvele stectis modis num re sandant. Quas dolentiur? Et ut mo beate nobis autendenihil iducias adit quostrum accus et aut et rem quidipsa quam recus. quatem iur? Velenes de plab il imenim fugitatent voloreh enisquis et arunt venihitin cus et rero beatet experrum faccupti tecus volupta tatatem aces volo officipsunto omnist ommodi dolupta desciatur.
Brand Manual 55 // 56
IMPRESS Agency: Metricss.Inc
Creative Director Mark Anderson Marketing
Contact:
E: info@Comma,.tv P: +01.132.4567.890
Executive Director Mark Anderson Marketing Metricss
Art Director 1 Mark Anderson Marketing Comma,
E: info@metricss.com P: +01.132.4567.890
E: info@metricss.com P: +01.132.4567.890
www.metricss.com
CREATION DATE :
M.
Thank you for being a part of our brand.
NOVEMBER 2016
CREATED FOR : METRICSS LONDON
MADE WITH LOVE BY: EGOTYPE DESIGN BERLIN