COMPANY NAME THE STORY BEHIND THE NAME. In a story, chapters one and two establish plot and setting. Chapter Three is when the action begins.

Transcription

1 /STYLEGUIDE

2 COMPANY NAME THE STORY BEHIND THE NAME In a story, chapters one and two establish plot and setting. Chapter Three is when the action begins.

3 LOGO FULL COLOR LOGO PMS COATED CMYK UNCOATED BLACK 6C 319 C 7474 C C0 M0 Y35 K100 C52 M0 Y19 K0 C86 M10 Y33 K10 PMS UNCOATED RGB BLACK 6U 319 U 7474 U R0 G0 B0 R113 G203 B210 R3 G94 B99 CMYK COATED ONE COLOR C0 M0 Y35 K100 C60 M0 Y20 K0 C98 M7 Y30 K30

4 LOGO LOGOTYPE / LOGOMARKS BLACK / LOGOTYPE WHITE / LOGOTYPE LOGOMARKS

5 BRAND ASSETS PRIMARY COLOR PALETTE PRIMARY / PANTONE COATED PRIMARY / CMYK COATED BLACK 6C 319 C 7474 C 021 C C75 M68 Y67 K100 C60 M0 Y20 K0 C98 M7 Y30 K30 C0 M68 Y100 K0 PRIMARY / PANTONE UNCOATED PRIMARY / CMYK UNCOATED BLACK 6U 319 U 7474 U 021 U C75 M68 Y67 K100 C52 M0 Y19 K0 C86 M10 Y33 K10 C0 M45 Y86 K0 PRIMARY / RGB R0 G0 B0 R113 G203 B210 R3 G94 B99 R245 G94 B0 # #71CBD2 #035E63 #F55E00

6 BRAND ASSETS WEB COLOR PALETTE #E5E5E5 #00A4AF #303C42 #838A8E #C1C3C5 #EAEBEC #F55E00 #7FD2D7 #1A272E #5A6368 #A2A7AA #D5D7D9 #F7F7F7

7 BRAND ASSETS TYPOGRAPHY TYPE Typography is an important component of the Chapter Three identity. Consistent, yet purposeful, usage reinforces our distinctive graphic voice. The primary font for Chapter Three is Gotham Narrow Light. USAGE Appropriate use of type standards with approved colors. Sizes are based on 8.5 x 11 page layout and can be scaled proportionately. PRIMARY FONT Gotham Narrow Light ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !@#$%^&*()?- Gotham Narrow Medium ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !@#$%^&*()?- Gotham Narrow Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !@#$%^&*()?- HEADLINE SECONDARY TERTIARY HEADLINE Intro copy Body copy SIDEBAR HEADER Sidebar body copy CHART HEADER or Gotham Narrow Bold All Caps Font sizes: 27pt and up Tracking: 0, Optical Gotham Narrow Bold All Caps Font sizes: 27pt and up Tracking: 0, Optical Gotham Narrow Medium All Caps Font sizes: 15pt Tracking: 50, Optical Gotham Narrow Book Font sizes: 15pt Tracking: 0 Gotham Narrow Light Font sizes: 10pt Tracking: 0 Leading: 22pt Leading: 15pt Gotham Narrow Medium All Caps Font sizes: 12pt Leading: 18pt Tracking: 50 Gotham Narrow Light Font sizes: 12pt Gotham Narrow Medium All Caps Font sizes: 8pt Gotham Narrow Bold Font sizes: 9pt Leading: 18pt

8 BRAND ASSETS PAGE LAYOUT SAMPLES

9 BRAND ASSETS TAKO

10 BRAND ASSETS INFOGRAPHICS STRATEGY BEAUTIFUL DESIGN SUPPORT PRO JEC T LIFECYCLE AMAZING WEBSITES TRAINING DESIGN MEANINGFUL CONTENT ROCK SOLID DEVELOPEMENT DEVELOPEMENT

11 BRAND ASSETS INFOGRAPHICS DEVELOPMENT DESIGN TRAINING STRATEGY SUPPORT WORK TIME 0% PROJECT LIFE CYCLE 100%

12 ABOUT CHAPTER THREE COMPANY VALUES DO EXCELLENT WORK We take pride in our work. We push ourselves to go the extra mile. We obsess over details that make the difference between good and great. BE FUTURE MINDED We focus on sustainability in everything we do including our code, site designs, office culture and management style. BUILD A BETTER INTERNET We don t just build websites; we build the technology that shapes the future. Sites that fuse great content, design, and user experience enhance our lives and improve how we experience the world. FIND BETTER WAYS TO SOLVE PROBLEMS We constantly evaluate our process and find ways to become more effective. We seek out new tools and methods to improve the way we deliver results. EVERYONE S IDEAS COUNT Each team member has a voice at Chapter Three. There is always room for good ideas and we empower everyone to solve problems. SHARE WHAT YOU KNOW We foster collaborative teaching and learning, both internally and throughout the larger Drupal community. PUSH YOUR LIMITS Great work happens when people break out of their comfort zones. We encourage self-improvement on all levels. BE TRANSPARENT We encourage open, honest communication. The best decisions are made when all the information is on the table. CODE WANTS TO BE FREE We make our code publicly available and benefit from others who do the same. This lets us deliver more value by buliding on previous solutions. IT S ALL A WORK IN PROGRESS We can always do better and will never stop trying.

13 PHOTOGRAPHY SAN FRANCISCO / LANDSCAPES / ASPIRATIONAL

14 PHOTOGRAPHY NATURAL LIGHT / SHALLOW DEPTH OF FIELD / NATURAL / CANDID

15 PHOTOGRAPHY APPLICATIONS HERO Images should be of aspirational landscape or focused work enviroments with clear focal point and shallow depth of field. THUMBNAILS Images should be a quick visual reference of project.

16 ABOUT CHAPTER THREE BRAND VOICE & ATTRIBUTES BRAND VOICE ATTRIBUTES CONCISE Say as much in as few words as possible. Keep in mind that our audience is busy. TELL A STORY Use blogs and case studies to tell a story and promote Chapter Three services. COMMUNAL/COLLABORATIVE/PERSONAL We use the word We often when describing something we believe in or our process. TRANSPARENT Professional Hip Approachable Smart High Integrity Flexible Contemporary Fun Trustworthy Positive We believe in sharing our processes. We often post blogs sharing new techniques and artifacts for other web professionals to use.

17 WRITTEN VOICE GUIDELINES COMPANY NAME Always title case Chapter Three in writing without abbreviation to strengthen company name recognition and brand. APOSTROPHES Use for possessives. Do not use for plurals except with single lowercase letters. Yes: Chapter Three No: Chapter 3, Chapter three, C3, Ch3 DASHES NUMBERS One through ten should be spelled out. 11 and higher can be numerical. PUNCTUATION Avoid excess punctuation. Use standard punctuation in body text or text with multiple sentences. BULLETS Capitalize first word unless the bullets form a sentence with the lead-in. Try to limit bullets to single phrases or sentences. Omit terminal punctuation. HYPHENS Hyphenate compound words (both nouns and adjectives) Exceptions: open source (as a noun), startup (as a noun) Do not substitute two hyphens for a em-dash. Em-dash keyboard shortcut is Alt+0151 for PCs and Shift+Option+Hyphen for Mac. COMMAS No Oxford/serial commas ( Tom, Dick and Jane not Tom, Dick, and Jane ). Avoid parenthetical commas (opt for parentheses). CAPITALIZATION Use standard capitalization. Do not use capitalization for emphasis. PROPER NOUNS Capitalize by default. For companies, product names, and brands, consult corporate communications materials for the entity in question (e.g. Twitter not twitter) when in doubt. See Yahoo word list for additional exceptions

18 WRITTEN VOICE GUIDELINES (CONT.) ACRONYMS Use all caps Use lowercase without hyphens for plurals, conjugation, etc. (e.g. IPs, IMing) MISCELLANY Use Drupal, not drupal Use DrupalCon, not Drupalcon or drupalcon Use Internet, not internet AVOID REDUNDANT PHRASING Examples: Added bonus End result Basic fundamentals Connect together Brief summary

19 BRAND VOICE EDITORIAL GUIDELINES / CASE STUDIES CASE STUDIES Be detailed. Don t assume that the audience understands our industry jargon. Tell a story. Be concise. Share the most compelling pieces of the project. Supplement all points with visuals when relevant. Put the most important keywords in the first two words of a paragraph or header, especially if your copy is describing a pic next to the text. STRUCTURE Introduce who the client is and what they do Define the problem we set out to solve for them Project goals & audience Explain how we did it Show visuals to support each solution step. Show analytics documenting success Include a client testimonial if there is one

20 BRAND VOICE EDITORIAL GUIDELINES / BLOGS BLOGS Vocalize your opinions. Be provocative. This generates discussion Share techniques on how to do something Attach artifacts or links to downloadable files that people can use when relevant Reference the opinions of thought leaders to support or complement your blog Excite people to take action (use our technique) Respond to comments

21 BRAND VOICE EDITORIAL GUIDELINES / PROFILE BIOS PROFILE BIOS One sentence describing what you do at Chapter Three One paragraph describing your relevant work history, and a bit more about what you do at Chapter Three and what you re passionate about One sentence describing what you like to do with your free time

22 COPY SAMPLE ABOUT ABOUT We create a better Internet by focusing on strategy, design, and scalable Drupal development. We are passionate about doing excellent work and finding new ways to solve problems. DRUPAL IS OUR DNA Our team of Drupal developers are seasoned experts. We lead technical trainings, organize community events and contribute code and design back to Drupal.org. UNDER ONE ROOF We do almost all of our work under one roof in San Francisco. Having our technical, design, and strategic talent together in one place lets us capitalize on cross-disciplinary collaboration to fuel success. HERE FOR YOU LONG TERM We partner with smart clients to create sustainable solutions that grow businesses. Our support team maintains long-term relationships with clients and ensures the continuing success of the sites we build.

23 COPY SAMPLE SERVICE DESCRIPTIONS STRATEGY Our content analysis and research process let us create a custom website that s tailored to your workflow and resources. DESIGN We integrate beautiful design with strategic functionality, creating dynamic projects that work well and look stunning DEVELOPMENT We love wrestling with complex problems. Our custom development projects enable us to push boundaries and grow Drupal. TRAINING Customized training gives our clients the skills and resources to thrive after launch and make the most of their Drupal site. SUPPORT Our Drupal experts provide remote, hands-on support for anything from maintenance and site audits to training and development.

24 COPY SAMPLE WHY YOU WANT TO WORK HERE We have a down-to-earth, unconventional company culture that empowers our team. We embrace those with a passion for doing excellent work. Have a great idea? We support team members who bring strong ideas to the table and run with them. We re looking for innovators who want to build their skills and grow with our Internet A-team.

25 THANK YOU