Style Guide Example- Leonid Systems

3,530 views
3,322 views

Published on

This is a style guide for enterprise software company Leonid Systems, originally posted as an example of a style guide in support of this post:
http://www.alexandercowan.com/create-a-style-guide/

Style Guide Example- Leonid Systems

  1. 1. Brand IdentityGuidelines
  2. 2. Leonid Systems Guidelines / Look & FeelMay 2012 2Brand Brand Vision Brand ValuesVisual Identity Leonid Logotype Wordmark Symbol Brand Elements Color Typography Applications Business Card Letterhead WebsiteTable of ContentsBrand GuidelinesThis guide is intended to protect and enhanceLeonid Systems. Following the suggestions and styleguidelines will help people recognize and rememberour brand.Our brand is more than just a logotype, tagline orsymbol. It’s a system of parts that work together toexpress our personality and create a memorableimpression. Expressing who we are consistently andaccurately, differentiates ourselves and creates astrong connection with customers.
  3. 3. Leonid Systems Guidelines / Look & FeelMay 2012 3Brand
  4. 4. Leonid Systems Guidelines / Look & FeelMay 2012 4BrandBrand VisionBrand ValuesVisual IdentityBrand ElementsApplicationsBrand VisionBrand ValuesLeonid takes the dull, often mediocre business ofenterprise software and creates outstanding, modernsolutions. We really care about what people in cubiclesdo all day and we want to make them better at it.friendly but not sillysmart but not snootyinstructive but not pedantic
  5. 5. Leonid Systems Guidelines / Look & FeelMay 2012 5VisualIdentity
  6. 6. Leonid Systems Guidelines / Look & FeelMay 2012 6Leonid Logotype / Symbol / WordmarkBrandVisual Identity Logotype Wordmark Symbol ProductsBrand ElementsApplicationsLogotypeSymbolWordmarkThe logo system consists of an iconic symbol based on theJapanese symbol for “can” or “san”. The strong wordmark ispowerful as a stand alone mark as well as having a balancingpresence with the by helping convey the full Leonid brand.
  7. 7. Leonid Systems Guidelines / Look & FeelMay 2012 7Leonid Products - Logo / SymbolBrandVisual Identity Logotype Wordmark Symbol ProductsBrand ElementsApplications
  8. 8. Leonid Systems Guidelines / Look & FeelMay 2012 8BrandElements
  9. 9. Leonid Systems Guidelines / Look & FeelMay 2012 9Primary Color PaletteBrandVisual IdentityBrand Elements Color TypographyApplicationsPantone 7459 CC M Y K 64 11 13 0R G B77 179 208Pantone BlackC M Y K 00 00 00 100R G B000 000 000Pantone 316 CC M Y K 95 55 50 30R G B0 80 90Pantone 5467 CC M Y K 85 65 60 75R G B0 31 34Pantone 8201 CC M Y K 43 18 15 0R G B146 182 199Pantone 5455 CC M Y K 13 5 5 0R G B219 229 234Main Identity Supporting ColorsBlackThe Leonid primary color palette consists of the core identitycolor of blue and a supporting range of blues to reinforce themain identity color. These colors should lead in all corporatebrand communications.
  10. 10. Leonid Systems Guidelines / Look & FeelMay 2012 10Product Color PaletteBrandVisual IdentityBrand Elements Color TypographyApplicationsThe Leonid secondary color palette balances the brighter colorsof the primary palette. These colors should be used to supportthe primary colors and represent the individual products.Loki PortalsPrometheusLokiProvisioningLoki BusinessProcessManagementPantone 322C M Y K 87 35 45 10R G B0 124 133Pantone 186C M Y K 5 100 85 0R G B229 25 55Pantone 7494C M Y K 35 10 47 0R G B168 195 153Pantone 484C M Y K 20 100 100 10R G B179 32 23Pantone 180C M Y K 10 80 100 0R G B217 83 30Pantone 123C M Y K 00 15 100 0R G B255 210 4Pantone 165C M Y K 00 60 100 0R G B246 132 40
  11. 11. Leonid Systems Guidelines / Look & FeelMay 2012 11TypographyBrandVisual IdentityBrand Elements Color TypographyApplicationsabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 !@#$%^&*()+={}<>…?:;”/|The quick brown fox jumps over the lazy dogabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 !@#$%^&*()+={}<>…?:;”/|The quick brown fox jumps over the lazy dogabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 !@#$%^&*()+={}<>…?:;”/|The quick brown fox jumps over the lazy dogabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 !@#$%^&*()+={}<>…?:;”/|The quick brown fox jumps over the lazy dogabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 !@#$%^&*()+={}<>…?:;”/|The quick brown fox jumps over the lazy dogabcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 !@#$%^&*()+={}<>…?:;”/|The quick brown fox jumps over the lazy dogProxima Nova LightProxima Nova RegularProxima Nova BoldProxima Nova Light ItalicProxima Nova Regular ItalicProxima Nova Bold ItalicLeonid’s primary typeface is Proxima Nova.It can be used in the light, regular, and bold weights.Proxima Nova was chosen based on the followingqualities: it’s clean, sophisticated, universal and easyto read.
  12. 12. Leonid Systems Guidelines / Look & FeelMay 2012 12BrandVisual IdentityBrand ElementsApplications Website xxxWebsite

×