Interstate Batteries

®

Brand Standards

Interstate Batteries

Our brand begins with a promise: For people who place a value on keeping things running, Interstate Batteries® is the Outrageously Dependable® portable power solution that always delivers.

A brand is more than words. It's more than a logo. Interstate's brand represents the set of ideas, principles and values that materialize at every mention or appearance of our name. Everything our brand represents depends on how we deliver our promise to our stakeholders. It's a promise we strive to deliver in every point of contact, whether it's a printed piece, an email, website, a phone call or a face-to-face interaction.

We designed this brand standards guide to help us keep the Interstate Batteries brand consistent across all media. The best brands are those that are recognizable and endearing, and consistency is the best way to stay in the minds of our customers. Exceptions can and do exist, so use your best judgment when deciding whether to break from any of these guidelines. If in doubt, ask the Marketing director.

Brand Voice

Friendly Confidence. An Interstate Batteries representative should be a caring, likeable, trustworthy expert with a whatever-it-takes attitude, and that persona should be reflected in our writing. Use friendly, positAn Interstate Batteries representative should be a caring, likeable, trustworthy expert with a whatever-it-takes attitude, and that persona should be reflected in our writing. Use friendly, positive language with a conversational tone. Don't be afraid to mix in a little personality. If you can make someone smile or laugh when looking at our communications, you've earned your keep. But don't overdo the humor, as it can distract from the intended message.ive language with a conversational tone. Don't be afraid to mix in a little personality. If you can make someone smile or laugh when looking at our communications, you've earned your keep. But don't overdo the humor, as it can distract from the intended message.

Keep copy concise and to the point. Use facts, not assertions. Use active voice. Imagine you're writing a note to a good friend, and all you have is the back of a business card: Every word counts. Headlines should be short and impactful. Be clever if you can, but don't go overboard.

DON'T: Interstate batteries are the best in the market.

DO: Interstate Batteries is recommended 5-to-1 by automotive technicians over the next leading brand.
(Be sure to reference the source either in copy or in a footnote.)

Avoid lines that are too similar to the tagline as they can distract from our brand message. “Outrageously Dependable” cannot be modified, and it should always carry the ® on first reference. Use “outrageous dependability” in internal communications only. Don't use the word “outrageously” with other words in the copy. Remember, the most important word in our tagline is “dependable,” not “outrageous.”

DON'T: Outrageously Innovative.

DO: Powerful Innovation.

Voice Examples

Use these examples as guidelines of the brand voice.

The Company

Interstate Batteries is our public-facing name. The official name of our enterprise is Interstate Battery System International, Inc. We also have several business units that carry their own name and logo:

Interstate Batteries - Outrageously Dependable

Interstate Batteries. Use this only when referring to the distribution system the company was built on. Associate this name with the “legacy” side of the business, and you'll be fine. Copyright notices will generally use this name, and it looks great in 6 point legal type.



Interstate All Battery Center®. Use when referring to our system of retail battery stores. Most products inside carry the Interstate Batteries® brand name. Remember: Interstate All Battery Center is the store, and it sells Interstate batteries. For brand standards specific to Interstate All Battery Centers, go here.



Interstate PowerCare®. Use when referring to the business unit that sells stationary (critical) power solutions and motive power solutions.

Business Units

Some business units use their name under the Interstate Batteries logo.



Specialized Logos:

Interstate Batteries isn't our only recognizable brand. Here are a few sub-brands and their logos.

  1. Cycle-Tron®
  2. ED-18®3
  3. Recycling Green Standard
  4. Mega-Tron® II, Mega-Tron Plus®
  1. Nationwide®
  2. PowerFast®
  3. PowerVolt® (One word)
  4. Workaholic®

International

As Interstate Batteries becomes more global, keep the following brand standards in mind.

Clean and Green. It's still our look, no matter the language.

Tagline. For Spanish, use “Excesivamente Confiables™” under the logo because “Outrageously Dependable” doesn't translate perfectly. For French, use “Excessivement Fiable™” under the logo. Both have TMs. “Interstate Batteries” does not get translated.


Spanish tagline under logo.

French tagline under logo.


Logo Guidelines

Placement. Our logo should be in the bottom right sign-off position or centered.

Minimum Sizes. Our logo must be large enough to read clearly. In print, the logo should be no smaller than 1 1/16” wide. For logos smaller than 2 1/2” wide, consider making the ® larger so it doesn't look like a small dot. For large format mediums, consider making the ® smaller, based on viewing distance. Online, the logo should be no smaller than 125 pixels wide. If it must go smaller, don't go below 65 pixels wide and remove the tagline.


Partners. If using a partner logo alongside the Interstate Batteries logo, our logo anchors the bottom right side of the ad.

® or TM. Interstate Batteries and Outrageously Dependable both use the ® mark. If you see a ™, you're using the wrong logo.

A Healthy Glow. When the logo is over a dark or PMS 368 background, you may use a small glow behind the art. The glow looks good in both print and online communications. If the glow isn't appropriate for a particular piece, use the logo with a thicker white border.

The Truth in Black and White. “Outrageously Dependable” should be black in most applications,including when the logo is on a PMS 368 background. If on a darker background where the black tagline would be illegible, use the version of the logo with the white tagline.

Space Requirements. The example below illustrates the correct logo space requirements. Maintaining consistent space around our logos keep them clean and easily distinguishable from a distance.

Keep a clear area around the logo equal to the height of “Interstate Batteries.” The words,“Interstate Batteries,” should be in the center, following the rule of thirds. This means that the space above, below and on each side is equal to the height of the words, “Interstate Batteries,” which includes the red outline. Apply this rule to type and imagery, but not backgrounds.

T-shirt Design. Use only the Interstate logo on the front of a shirt. If a second logo is needed, place on the sleeve. If the shirt has a particular theme, it should always have the Interstate logo represented.

Inappropriate Use. Don't float the logo over a busy background or do any of the following:

Brand Look

Clean and Green. All Interstate Batteries ads and flyers share a common look with common elements:

  • A “smile” like the ones used in the Smile section.
  • Large, double-justified all cap headlines
  • Liberal use of white space

We'll describe each of these elements in the following pages. Make sure every piece falls within this established look. Make sure all exceptions are approved by the Marketing director. Remember, although we are a large company with several business units, we are one unified brand.

The Smile

The smile serves as the anchor of our branding. Our preference is to use the “road” smile/logo lockup. We offer several variations of the smile so that you may choose the one that looks best in your layout. For a subtle concept, consider the gradient smile. More direct? Use the solid white smile.





Smiles can go at the top, bottom or sides, and they can be happy or inverted. They can run vertical and have either left or right orientation. The wide end of the smile should be anchored on one side of the page. An exception is on the Web, where the smile doesn't have to anchor to a side.


smile_gradient_white_green.ai
smile_solid_white_green.ai

smile_gradient_green_white.ai
smile_gradient_green_white.ai


The smile can be used with or without positive/negative circles. But don't use the positive/negative circles in both green and white in the same piece.

smile_gradient_inverted_white_green.ai
smile_solid_inverted_white_green.ai


smile_gradient_inverted_green_white.ai

smile_solid_inverted_green_white.ai
don't use plus/minus circles on both green and white

smile_gradient_B&W.ai

smile_solid_inverted_B&W.ai

smile_gradient_green_green.ai

smile_vertical_treatment.ai
(Place image in left shape)


smile_vertical_gradient_
green_white.ai


Typography

The official Interstate Batteries typeface is IBS Akzidenz Grotesk, a variation of the Berthold foundry's Akzidenz- Grotesk. This proprietary font was specially customized and licensed for Interstate Batteries and available only with approval for use in our communications. For more information, please contact the Marketing group: press@interstatebatteries.com.

If this font isn't available (we're looking at you, web designers), acceptable standard font substitutes are Helvetica, Futura and Arial.

Need a serif font for your design? Use Serifa, Calvert or, in a pinch, Times New Roman.


Headlines.For print, set all headlines uppercase, double justified in IBS Akzidenz Grotesk Extrabold. Make each line of the headline a different point size to justify. Don't mix point sizes within the same line. Don't run words in different directions. Don't mix vertical words in a horizontal headline.

As a general rule, headline leading should be less than the point size. If punctuation is needed, periods, commas, colons and semicolons should hang outside the justification. Question marks, parenthesis and exclamation marks go inside the justification. (If it's tall, justify it, if it's short, hang it.) Use guides and enlarge the view so you can make sure the headline is exactly justified.

Don't change point size within same line.

Don't mix vertical lines with horizontal.

Justified type with hanging period.

Justified type with question mark inside justification.


Writers should create headlines with this treatment in mind, taking care to emphasize the most important words. Designers: If making the important words larger becomes challenging to justify, work with the writer to change the copy.

Good word emphasis

Bad word emphasis


Punctuation. Headlines generally don't need punctuation. When the headline contains more than one sentence, use your best judgment.

Headline Color. Choose one color for the whole headline. Typically, the headline is green PMS 368 on a white or light background; white on a green or dark background. If you have a green background, headline copy can be white or 80% to 90% black (with Multiply effect.) For a black-and-white piece, use solid black or white, not gray scale. If you add a drop shadow to a white headline on a green background, use one of the following settings.


Screenshot

Heavier drop shadow

Screenshot

Softer drop shadow


Body Copy Styling. Set body copy in IBS Akzidenz Grotesk Regular or Condensed. Aim for 11 point text, but go no smaller than 10 point. To emphasize certain sentences, phrases or words, use IBS Akzidenz Grotesk Bold or Extrabold. If you don't have these fonts, see page 20 for acceptable substitution fonts.

Kerning and Leading. Kern headlines and subheads. In ragged-right body copy, make the lines alternate short/long/short/long. (Or you can use justified text.) Don't overlap letters. Our typeface tends to have too much space between the words and sometimes too much space between letters. If in doubt, print it out and turn it upside down so you can view the individual letters as objects and not letters. Visually, you should fit the same number of “marbles” between each letter. Make everything visually balanced.

Good example of kerned type.

Red “x” indicates bad kerning.


Visuals

One Focal Point. Make sure every piece of communication has one central focal point so it's not too busy. Sometimes, that focal point is the headline.

White Space is Your Friend. Keep your design clean and simple. White space allows the eye to breathe, which means the main visual message you want to convey will be more prominent. A soft, grey vignette can be used around the edges of a white space (right).

Stock Photography. Take the time to find the right shot. Select pictures that have good lighting and aren't flat. Environmental shots and photos of people should appear authentic and unstaged. If you can't find the perfect image on iStockphoto®, try other stock houses such as Veer®, Gettyimages®, Jupiterimages® or Corbisimages®.

Still can't find a shot? Try combining images or using original photography.

Example of good stock photo that's unposed and has good lighting.

Example of bad stock photo that's posed and has bad lighting.


Original Photography.If the image doesn't exist, or you can't create it by combining existing images, shoot new photography. Make sure you have an approved layout before you schedule the photo shoot. Stage the photo with an obvious light and obvious shadow side. Don't aim for flat catalog lighting; that's not as interesting. Explore multiple angles and always include a low-angle “hero” shot. Retouch realistic drop shadows on objects if the shadows are not created in-camera.

If your desired photo includes people, remember our goals of authenticity and diversity. Don't make them look fake and posed; make them look comfortable in a very natural and believable position. They should have honest expressions, not fake smiles. Try to capture a moment in time as if the models aren't even aware of the camera.


Example 1

Obvious light and obvious shadows.

Example 2

Natural expressions in photography.


Illustration. As a general guideline, don't use illustration as the main visual. If you need to show supporting elements like diagrams or icons, illustration is acceptable.

Combining Stock and Original Photography. Sometimes the perfect shot can be achieved by combining several shots.


Example 1

Stock shot of landscape.

Example 1

Added stock shot of camper and color-corrected image.

Example 1

Added stock shot of stump.

Example 1

Added original photography of battery.


Glow Behind Masked Objects. You may add a soft glow behind a single object to separate it from a solid color background. Leave the glow off the shadow side.

Example 5

No glow behind the shadow.


Color Palette

Corporate Colors. Interstate Batteries corporate colors are PMS 368 (green), PMS 485 (red), black, white and gray. If you choose other colors, make sure they complement our brand green. Using a photograph? Pull a color from the photo to tie things together. In certain circumstances, our PMS 368 green has been substituted with PMS 362 to accommodate specific mediums. Any deviation from PMS 368 should be approved by press@interstatebatteries.com.

PMS 368
CMYK: 65, 0, 100, 0
RGB: 98, 187, 70
HEX: 62BB46
PMS 485
CMYK: 0, 100, 95, 0
RGB: 237, 28, 41
HEX:ED1C29
RICH BLACK
CMYK: 60, 40, 40, 100
RGB: 0, 0, 0
HEX: 000000
BLACK
CMYK: 0, 0, 0, 100
RGB: 0, 0, 0
HEX: 000000
WHITE
CMYK: 0, 0, 0, 0
RGB: 255, 255, 255
HEX: FFFFFF

The percentage of black should be determined by what is around it. For subheads, 40% or 50% is a good place to start. If you're printing spot, Cool Gray 7 is good on a white or light background. Typically, body copy is 100% black (not rich black since that makes the dot pattern look jagged in small type).

Logo Colors


Web and Email

Brand and style elements contained within this document are compliant with Web Content Accessibility Guidelines (WCAG 2.0 AA) as defined by the World Wide Web Consortium and the color combinations approved by the Americans With Disabilities Act (ADA). All content created for any Interstate Batteries digital properties should adhere to these standards. Apply these styles according to the directions provided for each element.

Colors. See color swatches and guidelines below.

Glow. When the logo is on a field of green, use a glow behind it.

Graphics Resolution. Use 72 ppi or 96 ppi.

Logo Placement. For Web, the Interstate Batteries logo lives at the top of the page, either in the top left or in the middle. For email, the Interstate Batteries logo should always appear in the top left or center in mobile view.

Graphic Effects. YYou may use reflections on graphical elements as appropriate, but don't overdo it. Using the logo in motion? Follow the same rules as in the video section, making sure the final frame renders the logo in 2D in the appropriate colors and shape.

Smile. Use our iconic smile in email templates, but not on Web pages.

Web Typography. For external websites, use Arial for display and body copy. The Google font Oswald (Bold 700) is acceptable for display also.
On our intranet site (Intercom), the default is Verdana, but Arial is also acceptable. Making a graphic out of text? Use IBS Akzidenz-Grotesk as you would for print headlines. Follow the color guidelines below to be ADA compliant.

Video. Videos we host should be saved in .mp4 format. If it's not crucial we host the video, use YouTube or a similar video service with that site's generated embed code.

Email Templates. Set templates to maximum 600 - 700 pixels wide.

WEB Primary Color Palette

#181818
#707070
#F4F4F4
#27AC14
#0A8A00
#26831D
#086E00
#6C648A
#BF1722
#98121B
#181818
  • How to use: Default color for all page text that is not hyperlinked. Tag examples: <p>, <span>, <li>, <td>, <label>, etc.
  • Font Sizes: 10px normal or larger.
  • As Font Color: Use background color between (#FFFFFF - #F4F4F4).
  • As Background Color: Use font color (#FFFFFF, #27AC14 or #F4F4F4).
#707070
  • Guidelines: Text color on captions, input fields, by-lines, dates and other forms of supporting copy.
  • Font Sizes: 10px normal or larger.
  • As Font Color: Background color must be (#FFFFFF).
  • As Background Color: Not recommended.
#F4F4F4
  • Guidelines: Background or border color for page elements, such as: images, ads, callouts, quotes, sidenote messages, etc.
  • Font Sizes: 10px normal or larger.
  • As Font Color: Use a background color between (#4E4E4E - #181818).
  • As Background Color: Use a font color between (#4E4E4E - #181818).
  • Use consistently and sparingly.
#27AC14
  • Guidelines: A design element that reinforces the brand. (i.e. ads, banners, important messages, etc.)
  • Not recommended as a font color. If used, font size must be (19px Bold - 23px Bold, 24px normal/Bold or larger with a (#FFFFFF) background.
  • As Background Color with text: Font color must be (#FFFFFF) and same font sizes as above.
  • Do not use (#27AC14) for text links or input buttons.
  • Use consistently and sparingly.
#0A8A00
  • Guidelines: For font color on text links with larger font sizes (i.e. headers, titles, sub-headings) and input buttons.
  • Font Sizes: Must be 19px Bold - 23px Bold, 24px normal/Bold or larger.
  • Input Buttons Use (#0A8A00) as the background color of input buttons with (#FFFFFF) font color and proper font size.
  • As Background Color: Font color must be (#FFFFFF or between #1E1E1E - #181818).
  • Do not use (#0A8A00) font color for text that is not linked.
#26831D
  • Guidelines: Default font color for inline text links when surrounding non-linked text is (#181818).
  • Font Sizes: 10px - 19px normal.
  • Do not use as a background color or font color for non-linked text.
#086E00
  • Guidelines: Default hover color for all text links. Includes inline links when surrounding non-linked text is (#181818). Also, background color for input buttons when hovered (button text #FFFFFF).
  • Font Sizes: All.
  • Do not use as a background color or font color for non-linked text.
#6C648A
  • Guidelines: Only used as the font color for all text links that have been visited (clicked previously).
  • Font Sizes: All.
  • (#6C648A) should not be used for a background color, non-linked text, or on input buttons.
#BF1722
  • Guidelines: Primary background color for input buttons (i.e. Checkout) and font color option for error and alert messages.
  • Font Sizes: All.
  • As Font Color: Use on a (#FFFFFF or #F4F4F4) background color.
  • As Background Color: Only used on certain input buttons and should have a (#FFFFFF or #F4F4F4) font color for button text.
#98121B
  • Guidelines: Background color for input buttons when hovered. Could also be used for error and alert messages.
  • Font Sizes: All.
  • As Background Color: Only use (#FFFFFF or #F4F4F4) color font on a (#98121B) background.

Input Buttons

Green Button - Normal State



Background: #0A8A00
						
<style>	
.greenBtn {
	background-color: #0A8A00;
	border: none;
	border-radius: 5px;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	padding: 7px 20px 8px 20px;
}
</style>	
<input class="greenBtn" value="Sample Button" type="button" />

Red Button - Normal State



Background: #BF1722
						
<style>	
.redBtn {
	background-color:#BF1722;
	border: none;
	border-radius: 5px;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	padding: 7px 20px 8px 20px;
}
</style>	
<input class="redBtn" value="Sample Button" type="button" />

Green Button - Hover State



Background: #086E00
						
<style>							
.greenBtn:hover {
	background-color:#086E00;
	text-decoration: underline;
	cursor: pointer;
}
</style>



Red Button - Hover State



Background: #98121B
					
<style>	
.redBtn:hover {
	background-color:#98121B;
	text-decoration: underline;
}
</style>						
					


Images and Text Combined

All web graphics that combine text and some type of background color, image, design or video must meet the WCAG2.0 color contrast requirements. Background elements may include people, places, objects, solid or patterned backgrounds and/or videos.

This rule applies whether the text and graphics combine as one flat image or the text is created in HTML and lays over some portion of that background.

WCAG2.0 color contrast can be checked at http://dasplankton.de/ContrastA/ or http://webaim.org/resources/contrastchecker/

Video

Good video starts with good planning. Here's what to keep in mind:

Lighting. Use plenty of it, and keep it clean. Faces should be free of dark circles under their eyes. Use backlighting to separate a person or object from the background. This is critical, especially for green screen shoots, to avoid the subject from being darker than the electronic background. Consider avoiding white as an electronic background.

Audio. Use a lavalier (tie-clip) microphone or a boom mic from overhead. Audio must be clean and undistorted.

Resolution and Exposure. Shoot videos in HD at 1920x1080 and 60 frames per second (fps). Use lighting and exposure settings to see detail without being too dark or too bright.

Editing. Set your timeline and video format to 1920x1080 and 60 fps unless needs dictate something different.

Transitions. Primary transition is “dissolve” for supers and “cuts” for video, unless design element of the project requires “motion” or “cuts.”

Exporting. For simple videos with a single talking head such as Connection videos, consider exporting video to 720x480, 4x3, standard definition. If multiple people are on camera, then export video in your timeline to wide frame, 16x9. As a general rule, export video in your timeline to 16x9, either standard or HD.

Video Elements

Videos must attempt to match the same brand standards as print and Web pieces whenever possible. However, there are a few notable exceptions:

Text. Set supers uppercase IBS Akzidenz Grotesk Condensed Bold. Try to double-justify, but don't sacrifice readability. You may also use upper/lower case if all caps are too hard to read. Make sure text on the screen is large and clear enough to read in the context in which it is being viewed. Placement of name and supers should be in the lower thirds, unless design element requires specific placement. Use dissolves to transition for text unless accomplished by motion fx.

Graphics. Submit graphics as a Photoshop (PSD) file at 1920x1080, 150 ppi with RGB color. PNG and JPG is acceptable in some cases if artwork is final.

Music. Use only royalty-free music or music we have consent to use for any project that will be seen online or in the general public. You may use copyrighted music for videos viewed internally or to an invited audience not for profit.

Copyright. Use the following language at the end of any video that needs a copyright tag: This has been an Interstate Batteries® video production. ©201x

Logos. Same brand standards apply as in print. Logos appear in 3D when in motion, but at rest they must look like the 2D version.

Campaign Examples

Now that you know the guidelines for maintaining a consistent brand image, take a look at the following pages for a few good examples of that image in action. Use your best judgment when deciding to vary from our brand standards.

Print


Online


Out of Home

Billboards must be easily absorbed by the reader. Consider that your audience may be driving by at 65 mph. Best practice is to use six words or fewer, and make the finished product clever and memorable. Try to double-justify, but don't sacrifice readability. You may also use upper/lower case if all caps are too hard to read.

NASCAR/Racing Elements

Use of Interstate Branded NASCAR,® JGR images, names and marks require approval by Interstate Batteries and Joe Gibbs Racing before anything is printed or reprinted. For approval needs, please contact press@interstatebatteries.com All materials require copyright information with accurate trademark representation, which will be provided when you email your request for approval.

Addendum

Trademark Kerning. When you use the registered trademark symbol at the end of a sentence, kern the period so it's directly underneath the registered mark.

Example of period underneath registered mark.®

Legal Copy. Legal copy may be small, but it's important. Use 6 point IBS Akzidenz Grotesk Condensed or Regular. If that's not available, use an acceptable substitute listed on page 20. If we're translating collateral, the copyright should be translated, too.

Use this copyright note on projects:

©Interstate Batteries

Use this copyright note on all All Battery Center and PowerCare projects:

©2016 Interstate Batteries

Printed pieces contain some more information after the copyright:

©Interstate Batteries | Printed in the USA | XYZ0123 | AAA M/YR | PN123456

(Here, use call-outs to show that XYZ0123 refers to project number, AAA refers to designer's initials, M/YR refers to date of project, and PN123456 refers to part number.)

The copyright notice is slightly different for Latin America:

©Interstate Batteries. All rights reserved.

Our copyright contains even more meat for training manuals, DVDs and other material used internally and for our Distributors:

© Interstate Batteries. All rights reserved. Information contained is confidential and proprietary. Any reproduction without express written consent is prohibited.

Export your video files using the following formats:

Presentations. For Powerpoint: Windows media (WMV), 853 x 480.
For Keynote: Quicktime (MOV) or mp4 at 1280 x 720.

Web. Use Flash (FLV) If we're hosting on our own servers. Resolution: up to 640 x 380. Uploading to YouTube or another online service? Use Quicktime (MOV) or mp4 at 1280 x 720.

DVD. Use Quicktime HD (MOV, 1280x720), down-converted to MPEG2 (720x486)

Live Events. Use QuickTime (MOV), 1280x720.