EMBO Brand Guidelines by Pauline Capote

Visual Brand Guidelines For the usage and reproduction of the EMBO logo, identity system, and print and web applications.

EMBO // Visual Brand Guidelines

1.0 Introduction Background 1.01

Project overview

1.02

Theme

Target audience

Key adjectives

Brand comparison

1.03

2.0 Visual identity Logo

Colour

2.01

Logo improvements

2.06

Primary colours

2.02

Primary logo

2.07

Secondary colours

2.03

Secondary logo

2.08

Tertiary colours

2.04

Single colour logo

2.09

Grayscale

2.05

Clear space

2.10

Usage

EMBO // Visual Brand Guidelines

3.0 Graphic system Typography

Supporting elements

3.01

Typeface + features

3.06

Iconography

3.02

Type hierarchy

3.07

White space

Photography 3.03

Primary style

3.04

Secondary style

3.05

Background

4.0 Applications Website 4.01

Overview

Miscellaneous 1

4.05

EMBO Encounters

Corporate branding

4.02

Stationery package

4.03

Brand swag

4.04

PowerPoint template

EMBO // Visual Brand Guidelines

1.0 1.0

Introduction

Introduc EMBO // Visual Brand Guidelines

1.0

Introduction > Background

Background 1.01 Project overview Thepurposeoth feEMBOcorporatedesignrefreshitsore-establishaconsistenrte,cognizable a,ndcurrenstylethactomplementE sMBOm s’ ission T.hid socumensthableusedaa sguidetoreinforcethenewvisuastlyle.

1.02 Theme To stay consistenw t ith EMBOm s’ ission th,e visuastlyle musfo tlow a particulatrheme thactan be identifiable throughouab tlranded applicationT s.he theme siupported by key adjectivetshasthould appeatolutrargeatudience.

Target audience

Key adjectives

What we aren’t

Life Science Community

Expert

Bossy

EMBO Members

Approachable

Pretentious

General public

International

Imposing

Ambitious

Bureaucratic

Prestigious

Principled

Connected

Stuffy Moodboard

EMBO // Visual Brand Guidelines

1.0

Introduction > Background

1.03 Brand Comparison Iistmportanto tvisualycompareourbrandtothoseaastimilarcaliberW . emusftindabalancebetweenfitinginandstandingouIn t.ordertodosow , einvestigatelogofso,ntcs,oloura s,ndgraphicstylea spplied.

VARIOUS ACADEMIC LOGOS

MOSTLY BLUE / BLACK

Notehath tere are a loostfimilab rrandtshafatbletween the black to blue colousrpectrum with few in green and a slightly greaten rumbein rred.

EMBO // Visual Brand Guidelines

1.0

Introduction > Background

EMBO // Visual Brand Guidelines

1.0

Introduction > Background

EMBO // Visual Brand Guidelines

1.0

Introduction > Background

EMBO // Visual Brand Guidelines

1.0

Introduction > Background

EMBO // Visual Brand Guidelines

1.0

Introduction > Background

EMBO // Visual Brand Guidelines

2.0

Visual identity

2.0

Visual identity EMBO // Visual Brand Guidelines

2.0

Visual identity > Logo

Logo 2.01 Logo improvements Ou o lrgd ioenfte iu th o ssw eo m irsd lt’ioportacn th otia ntfd ienry tlepresen u o tso sn au flm rarken tim gaterW a isl.d eecd iertd oefresh ouprrevo iu o lsgra oth ,ethracn aompe lrtebranb decausw eaerecn h t’angn ioguco rrveau lIn es.teaw d,w eaa n top tpe m a toalorm eodern aude incw eb hseltin id igenfta ibae lnk deepn in ign m itd hm ead n iea n isuthreme. o

y 15

Previous logo

New logo

• Helveticaisanoverusedtypefacewithoutuniquefeatures

• UsesGotham,amodernandapproachablefont

• TheplasmidistoolargeinsizeandthininweightcomparedtothewordEMBO

• Theweightoftheplasmidisproportionaltheweightoftheletterforms

• Partsofthebackbonegettoothinatsmallersizes

• Theplasmidslessdramatictransitionfromthicktothinisstilldynamicyetlegible

• Coloursaredifficutloworkwithbecausetheyclashandvibratewithcertainbackgroundcolours

• Coloursareflexibleandeasytoworkwithonbothdarkandlightbackgrounds

• Thelogohasbeenaroundforalongtimeunchanged

• Itisacleanerlookwithanoverallmorebalancedfinish

EMBO // Visual Brand Guidelines

2.0

Visual Identity > Logo

2.02 Primary logo In moin ststanceth s,p erimary logo below w ishaw tbilu esed U.fsoie tfrul-colouarpplicationosn ,importandtocumenatsn ,d whereveE rMBO needto m s aka e statemew n Itt.orkb sew sthen thera h ie sigh contrab stackground le sio ig tibla end prominent.

Positive logo • Usedonwhiteorlightcolouredbackgroundswithhighcontrast • Colour codes: Hex: f5ac00 RGB: 245, 172, 0 CMYK: TBD Hex: 222222 RGB: 34, 34, 34 CMYK: 72, 66, 74, 72

Reversed logo • Usedondarkcolouredbackgroundswithhighcontrast • Colour codes: Hex: f5ac00 RGB: 245, 172, 0 CMYK: TBD Hex: ffffff RGB: 255, 255, 255, 255 CMYK: 0, 0, 0, 0

EMBO // Visual Brand Guidelines

2.0

Visual identity > Logo

2.03 Secondary logo Wh eava en atlernao ltegw ohen wcean ut’so eup rrimaro lygT oh .m is ab yfe oerxampb e lecausw ea erim le ited withow mancyoo lurw scean usd eutp o erin retstriction ow sr, a era eppy lin ta oitg notheb rrand m s’ arketinm g ateriaw sl herth eeh yavsetrricu te losn how thew youd liktd o eispa lity .

Positive logo • Usedonwhiteorlightcolouredbackgroundswithhighcontrast • Colour codes: Hex: 222222 RGB: 34, 34, 34 CMYK: 72, 66, 74, 72 45% transparency

Reversed logo • Usedondarkcolouredbackgroundswithhighcontrast • Colour codes: Hex: ffffff RGB: 255, 255, 255, 255 CMYK: 0, 0, 0, 0 45% transparency

EMBO // Visual Brand Guidelines

2.0

Visual Identity > Logo

2.04 Single colour logo Infewcases,suchaswithscreenprinting,wemaybelimitedtousingonlyonecolourwithouttransparencies.Inthisscenario,weusethelogobelow.

Positive logo • Usedonwhiteorlightcolouredbackgroundswithhighcontrast • Colour codes: Hex: 222222 RGB: 34, 34, 34 CMYK: 72, 66, 74, 72

Reversed logo • Usedondarkcolouredbackgroundswithhighcontrast • Colour codes: Hex: ffffff RGB: 255, 255, 255, 255 CMYK: 0, 0, 0, 0

EMBO // Visual Brand Guidelines

2.0

Visual identity > Logo

2.05 Clear space Ww e on at’low typography oo rthed ristracting elemenin tsvadtehsepacseurrounding thle ogT o.h1 e5 X .bordeernsureth sath tle ogo maintainvsisibilty andistinctiotn eIfx.gtoed sirectly abovo eb relow thle ogop , ticaly align with thleeftdgo eth fp elasmid.

1.5 X

.5 X wide

1.5 X border • X Itifh se heighoth fe ltefrormfsrom the word EMBO X p,lu5 .X swide (15 .Xsh )able the bordesrize around the logo T.ha isrea shanlobte disrupted.

EMBO // Visual Brand Guidelines

2.0

Visual Identity > Colour

Colour 2.06 Primary colours Thcehosen standou ptrm i arcyoo lo u sin rth esahtow psasso ih na,ppn ieasn s,rd m esia lIb tety il.ntasy lm ti ua ln tiagn,cdompp esleopth o e ln ia kna d Tch t.esaerth ereason w shw yfn ie“d EMBO yeo lw b toga ”ereraetpresentao tin w ofhw oaeO re.ubra lu csik seo dften ioutecirx ot,nograph an y,b dackground Tsh .sea trsio enb gaa lncb eetween thtw eo.

EMBO yellow

Black

• Usedfor:primarylogo,rulelines,iconaccents,photoaccents,backgrounds • Used for: text, backgrounds, iconography, • Colour codes:

• Colour codes:

Hex: f5ac00

Hex: 222222

RGB: 245, 172, 0

RGB: 34, 34, 34, 34

CMYK: TBD

CMYK: TBD • Noth ebsa it’en tsto tuts1 e00% ba lco kn both prin atnd web appiclation Tsh s.aig lsishig tlyhtebra lctk ha m t akm eitsorceomfortabo e ln theyeasgainsastatrw khb iteackground

EMBO // Visual Brand Guidelines

2.0

Visual identity > Colour

2.07 Secondary colours Wheo nn oy lnce oo lau p sirpcilaE be M l, BO yeo lw shoum d l osfe tb n u ese bd h tu,eta reo reccaso in w shem reocre oo lnu siercesa Trh m y.siab y beecauh tseea rem reancy ae tgorh teirsa eq tusrieparao itT w n sh i.siheh tre secondarp yaecle tom Tn ieh s.ecse oo luw rsorw kod n elarakng ild b ha tckgrounW ds.hep nrn ie thdea ,(se o lnw gE h tiMBO yeo lw sh)oub d lveb iraa nn tn dw otasheo du.t

Red

Orange

Green

• Usedfor:ulelineisc,onaccentp s,hotoaccentb s,ackgrounds

• Colour codes:

Hex: d02c17

Hex: e87203

Hex: 80a629

RGB: 208, 44 23

RGB: 232, 114, 3

RGB: 128, 166, 41

CMYK: TBD

EMBO // Visual Brand Guidelines

2.0

Visual Identity > Colour

2.08 Tertiary colours Tertiary coloura sre used in addition to primary and secondary colourw s hen there a islrgen rumbeo rite fmtso categorize osreparate F.oe rxample a p,ie charw t ith more than 4 sectiono sa rcoloucroded lisw t ith more than 4 items.

Cool green

Blue

Violet

Magenta

• Colour codes:

Hex: 009475

Hex: 0096af

Hex: 4e327c

Hex: 992065

RGB: 0, 148, 117

RGB: 0, 150, 175

RGB: 78, 50, 124

RGB: 153, 32, 101

CMYK: TBD

EMBO // Visual Brand Guidelines

2.0

Visual identity > Colour

2.09 Grayscale Grayscap lelaya lsrgreoile n thE eMBO coloup raleu istIese.d in photographty,pographicyo,nographayn ,d soim sn It.portan to kteep in mind thw eidreango eufsago en thd eark to ligh sp tectrum So .metimeh sigh contran istecessarayn ,d othetim rb esit’seteto b rm e orseubtle.

Black to white • Used for: backgrounds, typography, iconography, photography

EMBO // Visual Brand Guidelines

2.0

Visual Identity > Colour

2.10 Usage Withalargecolourpaleteistm , portanto tknowwhenw , herea,ndhowtouseA it.goodruleotfhumbitsouseo itnito swnandsparingly T.omaintainconsistency b,elowarexampleo sh fowtoandnoto tuseit:

• Logo displayed in primary colour

• Logo displayed in secondary colour

• Logo displayed in tertiary colour

EMBO // Visual Brand Guidelines

2.0

This is an ordinary headline

Visual identity > Colour

• Headlineandbodyinblack(orwhiteifdarkbackground) • Rule line in colour

Thisanexampleob fodytexL t.oremipsumdolorsa itmect,onsectetueradipiscingelsite , ddiam.

This is an ordinary headline

• Headlineincolour(unlessspecialdisplaysizedcircumstances) • Rule line in black

Thisanexampleob fodytexL t.oremipsumdolorsa itmect,onsectetueradipiscingelsite , ddiam.

This is an ordinary headline Thisanexampleob fodytexL t.oremipsumdolorsa itmect,onsectetueradipiscingelsite , ddiam.

This is an example of display text

This is an example of display text 25

• Body text in colour • Rule line in black

• White text on a coloured background • Can be 100% or transparent

• Black text on a coloured background • Can be 100% or transparent

• Colouredtextonacolouredbackground

EMBO // Visual Brand Guidelines

2.0

Visual Identity > Colour

• A single icon with single colour

• A single icon with multiple colours

• Anytimewherethecolourforthecategoryisestablisheda,a lccenteditemsmatch

This is a PowerPoint slide

This is an icon

• Any time where the coloufrotrhe category e isstablished b,uth te corresponding accentd sonm t’ atch

This is a PowerPoint slide

This is an icon

EMBO // Visual Brand Guidelines

2.0

Visual identity > Colour

• Asinglephotographwithcomplementaryaccentsinonecolour

• Asinglephotographwithcomplementaryaccentsinmorethanonecolour

EMBO // Visual Brand Guidelines

3.0

Graphic system

3.0 EMBO // Visual Brand Guidelines

3.0

Graphic system > Typography

Typography 3.01 Typeface + features Oup rrimary tpefacN ie sotcor,eated by Googw Ile t.orkw se in b loth prinatnd web application leisIg ts.ibla estizleasn ,d haa lsrgfeamily thaintcludeseria fsnd sanserN ifs.oto haa lsrgle ibrary ofofreign characterw shich v isery importanaa tsn internationa olrganization.

Aa Noto Sans Regular

ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmno pqrstuvwxyz 1234567890

Aa Noto Serif Regular

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890

EMBO // Visual Brand Guidelines

3.0

Graphic system > Typography

Aa Noto Sans Bold

ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmno pqrstuvwxyz 1234567890

Aa Noto Serif Bold

ABCDEFGHIJKLM NOPQRSTUVWXYZ abcdefghijklmno pqrstuvwxyz 1234567890

EMBO // Visual Brand Guidelines

3.0

NotoSansCondensed

Graphic system > Typography

ABCDEFGHIJKLMNOPQ RSTUVWXYZ abcdefghijklmnopqrst uvwxyz 1234567890

Aa Noto Serif Italics

ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmnop qrstuvwxyz 1234567890

EMBO // Visual Brand Guidelines

3.0

Graphic system > Typography

3.02 Type hierarchy Atlhough thN eoto famih y lassuch b ailb grim a isrity,portan to ntoth eow and when to useach soW rt.u esca eombination o bfoth thS eanSsea rifnd Sanvsersionbsu m t oostften wu esS eanB sod lfoh readilneasnd SeR rifegua lfo rb rodty eT xth . era era edditonu alsceaseth satrd eispa lyed beo lw.

Main header

Thtishe body copy texTt.hfisonptrovidefsoe rasy legibilty while feeling smaratnd contemporarim sIy t. portanto tconsistently use the typefacelisted fotrheisrpecifid cuties.

Body text

• Noto Sans Bold • Colour: #222222 or #eeeeee

• Noto Serif Regular • Colour: #222222 or #eeeeee

Display text THIS IS AN ARTICLE TAG

Display text • Noto Sans Bold • ColouA r:ny from the primarsye,condaro y,g rrayscale coloup ralete

Web Tag • Noto San Bold, all caps • Colour: #eeeeee • Background: #222222

This is an example of a quote. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.

EMBO // Visual Brand Guidelines

Quotation • Noto Serif Italics • Colour: #222222 or #eeeeee • Quotes are in icons folder

3.0

Graphic system > Photography

Photography 3.03 Primary style Phoo tgrap on siu ry h b p oe sa g rh y tlp im y n Ie rm si.a o fry m pho ,a m o trp esa o eo trfsn o ftco n b lre h stju e a cy lo tem b d ejctaen trn ad ro T b rta h iry se h .yo b n u a b ila d cle k n w dhgch io eta in ,n rh taP d g sn ,q Itih u oy a to .ilshu o B sa p ela c,k n W dah d etu ijsm tae n n B d ,trgihn taen sCd on arta du stjso m p ftcsa o ten ltio rfe td n u m th be ackgro nu efcIn eb sh d b tu a le .a ryc,kgrouh n o ftep cd e lu vsem nP oh reo a .co tresmpelmene w tdco h tilure gd eom sheca rtip an erstoa d h tk ce astnu ta h p ta sp h eo tw e foco stcre h a n lm itgoa itn ex d ectm ih ctoem o w h rfn teh steip T oih stn iea .p a rm erh ictb e sin d e y ta ’n g oetd fn ,veh p a trlp h ea on o tw dsp T h e a th e icx e.amb peo lsw rm a form eh w tlu eistrco e h b tsb o iu etm se rito x frpan h o h sftiro n tew a o m tW h b trcu a ik sr.th e fo n v ch ilse,le g d iom ah n tcn o rih b d teu k a v o e y d itsx fe!

NoT teh :ce oo lurep doro tin hsav m aeup tiley lfebcth uge trasy castrelokh esav n aeormoap lacty i.

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

3.04 Secondary style Ah tlougb h ala ck nw dh pe th ioo tgrap h th e srim yh a tsry tea lrs,e rcenaw ro ishew nneesh eo td ow h tem cn ioo lT u m h rs.ia b sy ce a m in csifa tu atih gsn eaeth eo td gih sgislp hcetoco iflurecao d rO e u tib a d lE rse n .MBO Encounse itu rw sehearen n d riteocumb sre tcy o a iltn a cfk tnw dh pe th iog o treo stpv e a ite nb d ca ob n rtIiero g.keu n b m pyakn ih te fga eu tm ireab n igalea ck nw dh bh teu ieh tn su epporn itsm gm ia elracg n F ioe co lsro .lre m idah tg saem s,ru a ee p lp w eilshem reu p ite a lid y ge oro fsme sh rtcisapaen ssrtd okce ab sn ae dded.

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

3.05 Background Wh pelirm i aa rynsd econdasry telp dhoa tok sh tfo eerefro bn a,tckgrounp dhoo tgrap u n a jh seity cesA arh ty l.ougo hu n iao trepn tp fo iitrsein m aroa re a n scceh tna fo ta n p cao b ln ia,tckgrounm idageh ryep closmpe h tlce to empoo sitO nu n .ire tn u o tsitcse inn m cfitciroscom p iciagee ta ry x su tara nlv d siu n ia e tW lres.thea n gp a rew p sia cila tirb a o e ty e a h tld ,e teesg h tio tsn u ebm ejcata slon a ’Itp e trp .oru tn io ty tciu ld h tceo emmun ay tinh tdp erihoo tgraph recisearch.

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

EMBO // Visual Brand Guidelines

3.0

Graphic system > Typography

Supporting elements 3.06 Iconography Iconasra u esefu tolo tre lpresen atn idea withou utsinw gordTs.hiceon styw leh eavoisente hv a ise try sharp cle,an u,niform (even in strokw eeigh atn ),d sometimeosfse w tith thceolouo ritsefspectivlo ecation Th .g eeometrlin cw eork relateto sha eccenu tssed in thp ehotographsictyle.

Offset with colour These are examples from main overview pages of the website, therefor in colour

Offset with white transparency TheseareexamplesfromagroupoficonsonthehomepageR . atherthanoffsew t ithcolourt,hecolourisusedinthebackgroundandtheyarecomplementedbyawhitetransparencya3 t0%

No colour Basiciconsdisplayedatasmallsizeshouldn’tbeaccentedwithcolour.Theseareexamplesthatappearnexttoclickablebuttonsonthewebsite

EMBO // Visual Brand Guidelines

3.0

Graphic system > Photography

3.07 White space Thu eso w efhsitepac(o eermptsypacaisreitc)caolmponen tg otivinth gE eMBO brand thm e odercne l,aa nn ,d ee lgan o lto ditk eserve W s. hsitepach eep lth sv eiewegruidth eeeiryreatheth ran bombaw rd itith om o uch concteisrn Iitctk a ot.e lep thin m is ind when designinfg obroth prin atnd web materiasl.

Poster design example Thisdesign(takenfromtheinternet),isagreatdemonstrationofusingemptyspacetohelpgroupitemstogetherandcreatehierarchybetweenthesectionsofinformation

EMBO // Visual Brand Guidelines

4.0

Applications

4.0

Applicati ons EMBO // Visual Brand Guidelines

4.0

Applications > Website

Website 4.01 Overview Thewebsiteirsedesignedtobeuser-friendln y,avigablea,ndmorecurrento tpresend taywebexperienceT s.heUeIlemenstpeca sreavailableinaseparatedocumentitled“Web_Style_Guidep . df”.

Homepage

EMBO // Visual Brand Guidelines

4.0

Applications > Website

Funding overview page

Postdoctoral Fellowships detail page

EMBO // Visual Brand Guidelines

4.0

Applications > Website

News listing page

Research and policy affairs overview page

EMBO // Visual Brand Guidelines

4.0

Applications > Corporate branding

Corporate branding 4.02 Stationery package Thestationerypackageshallbeusedasatemplateforallstaffforcommunicationpurposes.*Tobeproducedstill*

Letterhead Business card (front)

Business card (back)

Envelope

EMBO // Visual Brand Guidelines

4.0

Applications > Corporate branding

4.03 Brand swag Theseitemsaremeanttobegiventostaffandthecommunity.TheyshallbeaproudrepresentationofEMBOandthenewstyle.

EMBO // Visual Brand Guidelines

4.0

Applications > Corporate branding

4.03 PowerPoint template ThePowerPointemplateincludesalargeassortmeno tsflidetypesforstaftfoediatndstayconsistentotheEMBObrandB.elowareinitiaid l easb,uthefinavlersionistobeproducedstil.

EMBO // Visual Brand Guidelines

4.0

Applications > Miscellaneous

Miscellaneous 4.02 EMBO Encounters TheEncounterp sublicationwb ilereleasedmultipletimea snnualD y.ependingonthenewneedtsh ,itsemplatecanchangeT.heseareconceptuaid leacsreatedinthetestingphaseoth febrandrefresh.

Cover options • Background coo lurtosotab teetween ilgh atndark • Hg ihg ilch oto lu rtorstah terougp hrm i araynsd econdarcy oo lu praelte

Inside spreads • Strongfocusonuseow f hitespace • Usecolourstoseparatesections

EMBO // Visual Brand Guidelines