U MG G E R
L VO Y T R
S
E ING D I EV
O
VO
S M R I F TH
G IN GROW D A |
LE ION ’SUBAT
W RO | INC R O ON TI
MA TO UC
D |E NG I N D IO
IL AT BUSPIR IN
1
YES!Index YES!Index YES!Delft in words YES!Logo YES!Pay-off YES!Logo YES!Logo and Pay-off YES!Logo and Pay-off YES!Colors YES!Color distribution YES!Typefaces YES!Pattern Crystal YES!Pattern Midnight YES!Pattern & Pay-off YES!Pattern Triangle Cut YES!Footers YES!Business card YES!Headers YES!Letterhead & example report YES!Compliment Card YES!Ribbon YES!Brochure YES!Flyer YES!Poster YES!Photography YES!Photos & Text YES!Arrows YES!Logo derivatives YES!Cheat sheet Appendix: YES!Icons Appendix: YES!Tables
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 31 32
2
YES!Delft in words
VIBRANT TECHNICALLY INNOVATIVE SCALABLE
LEADING NETWORK AMBITIOUS
YES!Delft: Building tomorrow’s leading firms
YES!Delft - the Young Entrepreneurs Society – inspires, educates, coaches and supports students, professionals and researchers interested in starting a high-tech company or further developing an early stage high-tech company.
3
YES!Logo LOGO All communication materials should include the basic logo.
ON BLACK
ON BLUE
SOLID
4
YES!Pay-off FONT SIZE Font size ratio is 3/4
ON BLACK
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
ON BLUE
BUILDING TOMORROW’S LEADING FIRMS
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
INSPIRATION | EDUCATION | INCUBATION | GROWTH
SOLID
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
5
YES!Logo
SIZE&COMPOSITION MINIMAL SIZE Width: 16,5 mm Height: 8,5 mm
WHITESPACE Keep enough whitespace around the YES!Logo so as to let it stand out.
HORIZONTAL Align the top of the body text with the top of the “Y” of the YES!Logo. LORUM IPSUM, C. Ala nordica viri, facioravo, Catus occhucivis, nonihil icustris, que res nerorus, a dis postaridiem facie pl. Nihiciptis bonsum inatus nostre aperum esimus acem suntum nite audesulto.
VERTICAL Align the left side of the body text with the left side of the “Y” of the YES!Logo. LORUM IPSUM, C. Ala nordica viri, facioravo, Catus occhucivis, nonihil icustris, que res nerorus, a dis postaridiem facie pl. Nihiciptis bonsum inatus nostre aperum esimus acem suntum nite audesulto morem unum, cullemque.
6
YES!Logo and Pay-off HORIZONTAL Text: left aligned. Keep horizontal spacing between logo & pay-off
VERTICAL, LEFT ALIGNED Text: left aligned. Keep vertical spacing between logo & pay-off
COMPLETE LOGO, COMPOSITION
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
COMPOSITION The YES!Logo and YES!Pay-off together form the complete logo. The preferred composition is horizontally, but it can also be used vertically, or centered when it’s not possible to use the horizontal version. When this complete logo is used, always use one of these three compositions.v
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
VERTICAL, CENTER ALIGNED Text: center aligned. Keep vertical spacing between logo & pay-off
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
7
YES!Logo and Pay-off
DO NOT USE THE FOLLOWING LOGO TREATMENTS
What not do with the Yes!Logo / YES!Pay-off.
COLOR CONTRAST Use the right logo / pay-off with enough contrast.
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
RMS ING FI
D ROWTH S LETA ’ N|G W O I O ORR CUBA
TOMCATION | IN G N I BUILD TION | EDU
ROTATION Do not rotate the YES!Logo / YES!Payoff.
A
INSPIR
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
SCALE Do not scale without constraining the proportions.
COMPOSITION Do not change the composition of either the YES!Logo or the YES!Pay-off.
8
YES!Colors
C100 M35 Y0 K35 R0 G102 B161 #0066A1
C85 M5 Y0 K0 R0 G169 B224 #00A9E0
C65 M0 Y0 K0 R61 G183 B228 #3DB7E4
C35 M0 Y0 K0 R163 G219 B232 #A3DBE8
LIGHT & COOL Lighter colors are based on the original blue of the logo
DARK & WARM Darker colors are slightly more magenta C100 M85 Y0 K35 R0 G39 B118 #002776
C100 M65 Y0 K0 R14 G77 B166 #0E4DA6
C90 M50 Y0 K0 R22 G120 B196 #1678C4
C75 M35 Y0 K0 R76 G158 B234 #4C9EEA ICE VARIATIONS Pure greyscale ice colors
C0 M0 Y0 K65 R89 G89 B89 #595959
C0 M100 Y0 K0 R242 G41 B153 #F22999
C0 M0 Y0 K35 R166 G166 B166 #A6A6A6
C0 M70 Y100 K0 R247 G140 B45 #F78C2D
C0 M0 Y0 K15 R217 G217 B217 #D9D9D9
C0 M25 Y95 K0 R255 G220 B79 #FFDC4F
C0 M0 Y0 K0 R255 G255 B255 #FFFFFF
C40 M0 Y100 K0 R183 G216 B29 #B7D81D
ACCENT COLORS To be used in graphics, illustrations, charts, etc.
LOGO COLORS The originals C0 M0 Y0 K100 R0 G0 B0 #000000
C100 M0 Y0 K0 R0 G185 B255 #00B9FF
9
YES!Color distribution DISTRIBUTION This chart captures the color essence of the YES!Pattern. You can use the color distribution as a starting point to generate new graphics. ACCENT COLORS As a rule of thumb, accents colors generally have the same usage percentage as the magenta color.
6.25%
12.5%
12.5%
6.25%
6.25%
12.5%
12.5%
6.25%
12.5%
25%
25%
one of these: 5%
8.75%
8.75%
1.5%
1%
12.5%
10
YES!Typefaces ORIGINAL TYPEFACE Frutiger
WEB TYPEFACE Tahoma
Frutiger black condensed LT STD Frutiger condensed LT STD Frutiger Roman LT STD Frutiger Light LT STD
Tahoma bold Tahoma
Header in Frutiger black condensed and size in 13pt. / leading 16pt.
Header in Tahoma bold and size in 13pt. / leading 16pt.
Subheader 1 in Frutiger condensed and size in 11pt. / leading 13pt.
Subheader 1 in Tahoma and size in 11pt. / leading 13pt.
Basic text in Frutiger Roman and size in 9pt. / leading 13pt. Lorem ipsum dolor sit amet, consectetur.
Basic text in Tahoma and size in 9pt. / leading 13pt. Lorem ipsum dolor sit amet, consectetur.
Subheader 2 in Frutiger condensed and size in 9pt. / leading 11pt. Basic text in Frutiger Roman and size in 7.5pt. / leading 11pt. Lorem ipsum dolor sit amet, consectetur.
WHEN TO USE WHICH FONT Whenever possible, use the Frutiger typeface. For websites, or for documents that are passed between multiple computers that don’t have Frutiger, installed you can use the Tahoma typeface.
Subheader 2 in Tahoma and size in 9pt. / leading 11pt. Basic text in Tahoma and size in 7.5pt. / leading 11pt. Lorem ipsum dolor sit amet, consectetur. This is a footnote text in Tahoma and 7pt. / leading 11pt.
This is a footnote text in Frutiger Light and 7pt. / leading 11pt.
11
YES!Pattern Crystal MAIN PATTERN The YES!Pattern is a distinctive graphic shape which is the core of the look & feel for the YES!Delft identity. ACCENT COLOR Magenta is the only accent color here, do not use different accent colors. CONVERGENCE POINT Always make sure that the main convergence point is visible. HOW TO USE Use as a striking graphic to fill up relatively large spaces.
MEANING In an abstract way, it depicts a futuristic formation, where, on the ‘surface’ of the colors of YES!Delft itself, sometimes valuable ‘magenta material’ is formed (successful technostarters). The convergence point shows that it all starts with YES!Delft, after which entrepreneurs are on their own.
MAIN CONVERGENCE POINT
12
YES!Pattern Midnight HOW TO USE Use this pattern when a more subtle texture is needed. For example, in combination with photos or text. CONVERGENCE POINT Always make sure that the main convergence point is visible.
MAIN CONVERGENCE POINT
13
YES!Pattern & Pay-off
MS ADING FIR OW’S LE | GROWTH UBATION TOMORR BUILDINATGION | EDUCATION | INC INSPIR
G FIRMS ’S LEADIN OWTH MORROW CUBATION | GR ILDING TO UCATION | IN
BU
HOW TO USE The YES!Pay-off can be placed on backsides of business cards, with compliments cards, flyers, etc. COLOR The complete YES!Payoff on the YES!Pattern is white, to give it enough contrast.
N | ED
INSPIRATIO
PAY-OFF HAS SAME SIZE
SIZE Do not scale the text blindly together with the YES!pattern, as the text could lose its subtlety. Either choose for subtle text, or for big text that would have visual impact. In this example, the text has the same size, even though the pattern dimensions differ. ROTATION Make sure the YES!Pay-off has the same rotation as the upper line of the magenta triangle. Give it a little bit of whitespace underneath.
14
YES!Pattern Triangle Cut HOW TO USE The YES!Pattern Crystal has the most impact when used to fill a complete surface (like the back of a business card, for example). Sometimes it’s not possible to fill up a complete surface, therefore the pattern can also be cut off in a triangle. Note that the pattern is deliberately cut off, as to give it an impression of being an ‘interesting zoom-in on the endless surface of YES!Delft’. This is different than the custom footers, which can be seen as ‘the borders of the surface’. CONVERGENCE POINT You can make an interesting cut out yourself, as long as the main convergence point stays visible.
15
YES!Footers
Right aligned
Left aligned
FOOTER The footers are derived from the YES!Pattern, and have been customized to provide nice baseline graphics. It shows a link to the YES!Pattern where completely filled surfaces can not be used. HOW TO USE Can be used to give a design a solid base. Depending on the contents, you can pick a variation. Please keep in mind that the total composition (with the rest of the graphics) is in balance.
Center aligned
Center aligned
Center aligned 16
YES!Business card
FRONT & BACK SIDE FOOTER A right aligned footer is chosen as to balance the ‘visual weight’ of the total front side.
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
WOUTER DE BRUIJNE T +31 (0)6 49761197 WOUTER@YESDELFT.NL MOLENGRAAFFSINGEL 12–14 2629 JD DELFT T +31 (0)15 2782816 | F +31 (0)15 7440102 INFO@YESDELFT.NL | WWW.YESDELFT.NL
MS ADING FIR OW’S LE | GROWTH UBATION TOMORR BUILDINATGION | EDUCATION | INC INSPIR
17
YES!Headers HEADERS Headers can be used in documents, reports or other visuals where more attention should be given to the contents of the YES!Header than to the YES!Logo itself.
HEADER Center aligned, with logo.
TITLE IS HIGH CAPS, 32PT. Sub title is low caps, in 24pt.
HEADER Left aligned, with logo.
TITLE IS HIGH CAPS, 32PT. Sub title is low caps, in 24pt.
18
YES!Letterhead & example report
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
TITLE IS HIGH CAPS, 32PT. Sub title is low caps, in 24pt.
MOLENGRAAFFSINGEL 12–14 2629 JD DELFT T +31 (0)15 2782816 | F +31 (0)15 7440102 INFO@YESDELFT.NL | WWW.YESDELFT.NL
19
YES!Compliment Card
FRONT & BACK SIDE FOOTER A centered footer is chosen as to balance the ‘visual weight’ of the total front side. BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
MS ING FIR LEADION | GROWTH ORROW| ’S INCUBAT ING TO| M UCATION BUILDPIR ATION ED INS
20
YES!Ribbon TYPOGRAPHY Title and subtitle font size ratio = 3/4 BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
BUILDING TOMORROW’S LEADING FIRMS
JAARVERSLAG 2010 MET EEN SUBTITEL
Text lines all are on the same baseline. Rotation degrees on portrait A4 is: 54.737º USAGE Used for presenting a title of a document or brochure. Centered, either horizontally or diagonally. Note: the grey stroke is not part of the graphic.
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
JAARVERSLAG 2010
IN
BU
SP ILD IRA IN TIO G N TO |E M DU O CA R TIO RO N W | IN ’S CU L BA EA TIO D N ING |G RO FIR W M TH S
JA
AR
VE
RS
LA G
20
10
INSPIRATION | EDUCATION | INCUBATION | GROWTH
JAARVERSLAG 2010
21
YES!Brochure
FRONT & BACK SIDE FRONT ELEMENTS 1. A photo, preferably in warm tints, as to contrast nicely with the blues of the YES!Pattern. Make sure the photo fills the triangle completely.
G
20
10
2. The YES!Ribbon, rotated diagonally. Make sure the ribbon is centered both horizontally & vertically.
IN UIL SP D IRA IN TIO G N TO |E M DU O CA R TIO RO N W | IN ’S CU L BA EA TIO D N ING |G RO FIR W M TH S
JA
AR
VE
RS
LA
3. The YES!Pattern Midnight. Make sure the convergence point of the pattern is visible and the pattern fills the triangle completely
B
BACK ELEMENTS The back consists of the solid YES!Delft color and the YES!Pay-off to ‘conclude’ the document.
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
22
YES!Flyer
FRONTSIDE VARIATIONS FRONT ELEMENTS 1. YES!Logo 2. Attention grabber, in magenta.
ATTENTION GRABBER IS CENTERED AND 48PT.
ATTENTION GRABBER IS CENTERED AND 48PT.
3. Incentive & call to action. 4. YES!Pay-off. 5. YES!Pattern 6. Sticker, for extra incentive.
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
YOUR OM CUST X TE T
YOUR OM CUST X TE T
23
YES!Poster FRONT ELEMENTS 1. YES!Logo
ATTENTION GRABBER IS CENTERED, 48PT.
2. Attention grabber, in magenta. 3. Photo, wide. 4. Incentive & call to action. 5. YES!Pay-off. 6. Sticker, for extra incentive. BACK ELEMENTS 1. YES!Logo 2. Text
YOUR OM CUST TEXT
3. YES!Pattern Crystal Triangle Cut.
INCENTIVE IS HIGH CAPS, 32PT. Call to action is low caps, in 24pt.
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
24
YES!Photography CORPORATE: COMMUNICATION FROM THE ORGANISATION Photos show only groups of people.
IMPROVEMENT OF EXISTING PHOTOS
STAFF PHOTOGRAPHER YES!Delft works with a staff photographer: Jorrit Lousberg, www.lightatwork.nl PHOTOS TONE General rule for the tone of the photos: Professional, smart, sophisticated, energetic. PHOTO COLORS Generally the colors should be warm, as to contrast nicely with the YES!Colors. To avoid an overly ‘cold’ look & feel, don’t use the same Yes!Blue hue in the photos.
TECHNOSTARTERS: COMMUNICATION FROM THE COMPANIES Photos show the product in the foreground (people in the background)
Don’t use people in the foreground and products in the background
Improving by making a relevant cutout. It’s more focused on the product now.
Improving by transforming the colors. These warmer colors complement the YES!Colors nicely.
25
YES!Photos & Text
Subheader 1 in Frutiger condensed and size in 11pt. / leading 13pt.
Subheader 1 in Frutiger condensed and size in 11pt. / leading 13pt. Basic text in Frutiger Roman and size in 9pt. / leading 13pt. Lorem ipsum dolor sit amet, consectetur. Aliquam ut dui accumsan metus malesuada ultrices sed at sapien. Donec nec risus dolor. Donec semper eleifend elit, sed ultricies tellus convallis in. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam vulputate urna a odio ultrices ut dapibus nulla elementum. Maecenas in augue eget sem cursus sollicitudin nec non mauris. Nulla at interdum nunc. Sed quis libero odio, sit amet placerat mi. Sed volutpat luctus elit vitae tempor. Nulla vitae nunc ut neque bibendum cursus a ut magna. Integer euismod mauris libero, consectetur vulputate quam. Nulla aliquam viverra justo, in tempor neque fringilla non. Donec ac metus a dolor venenatis ultrices eu eget est. Morbi vehicula enim ut quam ornare sit amet tempor leo suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ac volutpat libero.
Subheader 2 in Frutiger condensed and size in 9pt. / leading 11pt. Basic text in Frutiger Roman and size in 9pt. / leading 13pt. Lorem ipsum dolor sit amet, consectetur. Aliquam ut dui accumsan metus malesuada ultrices sed at sapien. Donec nec risus dolor. Donec semper eleifend elit, sed ultricies tellus convallis in. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam vulputate urna a odio ultrices ut dapibus nulla elementum. Mae-
cenas in augue eget sem cursus sollicitudin nec non mauris. Nulla at interdum nunc. Sed quis libero odio, sit amet placerat mi. Sed volutpat luctus elit vitae tempor. Nulla vitae nunc ut neque bibendum cursus a ut magna. Integer euismod mauris libero.
Basic text in Frutiger Roman and size in 9pt. / leading 13pt. Lorem ipsum dolor sit amet, consectetur. Aliquam ut dui accumsan metus malesuada ultrices sed at sapien. Donec nec risus dolor. Donec semper eleifend elit, sed ultricies tellus convallis in. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam vulputate urna a odio ultrices ut dapibus nulla elementum. Maecenas in augue eget sem cursus sollicitudin nec non mauris. Nulla at interdum nunc. Sed quis libero odio, sit amet placerat mi. Sed volutpat luctus elit vitae tempor. Nulla vitae nunc ut neque bibendum cursus a ut magna. Integer euismod mauris libero, consectetur vulputate quam. Nulla aliquam viverra justo, in tempor neque fringilla non. Donec ac metus a dolor venenatis ultrices eu eget est. Morbi vehicula enim ut quam ornare sit amet tempor leo suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus ac volutpat libero.
USAGE OF PHOTOS & TEXT Photos are plotted on the grid of the layout. In this case, a sixcolumn grid is used, with spacing of 4mm. Make sure all photos fill their designated rectangular areas. For a professional look, a wide photo can be used that is stretched along the text column. For high impact photos, a square placed over more than one column can be used. For less important photos, the photos can be scaled to fill one column of the grid. Photos don’t need extra visual treatment or graphic effects, as long as they are consistently placed on the grid. The complete result gives a professional look.
26
YES!Arrows ARROWS Arrows can be used to zoom in on illustrations, or to highlight certain things. When used with text, use long arrows like the black ones below.
50%
50%
50%
50%
50%
50% 50%
50%
50% 50%
27
YES!Logo derivatives
POWERED BY
VRIENDEN VAN
POWERED BY
‘POWERED BY’ Technostarters can use this logo to communicate that their company is supported by YES!Delft. ‘VRIENDEN VAN’ Supporters of YES!Delft can use this logo in their communications.
VRIENDEN VAN
28
YES!Cheat sheet p.3
IN WORDS VIBRANT TECHNICALLY INNOVATIVE SCALABLE LEADING NETWORK AMBITIOUS
p.8
LOGO & PAY-OFF
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
p.9
COLORS & DISTRIBUTION
C0 M0 Y0 K100 R0 G0 B0 #000000
STYLE GUIDE CD
C100 M0 Y0 K0 R0 G185 B255 #00B9FF
C0 M100 Y0 K0 R242 G41 B153 #F22999
C0 M70 Y100 K0 R247 G140 B45 #F78C2D
TYPOGRAPHY
p.11
C0 M25 Y95 K0 R255 G220 B79 #FFDC4F
C40 M0 Y100 K0 R183 G216 B29 #B7D81D
PATTERN
p.12
DERIVATIVES
p.28
Header in Frutiger black condensed and size in 13pt. / leading 16pt. Subheader 1 in Frutiger condensed and size in 11pt. / leading 13pt. Basic text in Frutiger Roman and size in 9pt. / leading 13pt.
POWERED BY
VRIENDEN VAN
Design: Booreiland.nl
BUILDING TOMORROW’S LEADING FIRMS INSPIRATION | EDUCATION | INCUBATION | GROWTH
Appendix: YES!Icons
Education
Growth
Incubation
Inspiration
ICONS Icons are used to depict the subdivisions of YES!Delft. They can be used on stickers or stand-alone. The accent colors are used to emphasize the subdivisions. Therefore, please be consistent in the use of colors. STICKERS Stickers can be used to give attention to certain text.
YOUR OM CUST TEXT empty sticker
incentive sticker
31
Appendix: YES!Tables TABLES & ALTERNATIVE TABLES For normal tables, use the YES!Delft main colors, for alternative tables use accent colors (and icons) for headers.
Table title (13pt) value (9pt)
value
value
value
highlighted
value
value
value
value
value
value
value
Table Education
Table Incubation
value
value
value
value
value
value
value
value
highlighted
value
value
value
highlighted
value
value
value
value
value
value
value
value
value
value
value
Table Growth
highlighted
Table Inspiration
value
value
value
value
value
value
value
value
value
value
highlighted
value
value
value
value
value
value
value
value
value
value
32