13
STYLE GUIDE Version 5 - 11/19/2013 ©John Wiley & Sons, Inc. 2013. All Rights Reserved

STYLE GUIDE - Wiley EL · STYLE GUIDE Version 5 - 11/19/2013 ... Lorem ipsum sit dolar get amet. Short Display Headline ... Paragraph Text = “y” Height

  • Upload
    buitram

  • View
    216

  • Download
    0

Embed Size (px)

Citation preview

STYLE GUIDEVersion 5 - 11/19/2013

©John Wiley & Sons, Inc. 2013. All Rights Reserved

Wiley Efficient Learning 2

Introduction

This document works as the central platform for defining the Wiley Efficient Learning™ style, and as the starting point for messaging, identity, and other customer-facing expressions. It aims to provide a consistent framework for developing a wide range of tactical product and marketing materials that flow from the same source, even if their specific executions vary.

The business case for this brand

Wiley Efficient Learning™ is a new ecommerce hub linking to updated courseware intended to harmonize the user experience for Wiley’s business, finance and accounting exam prep and elearning products. The intent is to keep students motivated and focused by breaking down sections into easily digestible bite-sized lessons and to keep them abreast of their progress at every step along the way. The offering will help to synchronize the look of both online and offline materials and to ensure their consistency as stu-dents move from the learning interface to text books, audio materials, flash cards and other learning mediums.

What you’ll see in this document

With the introduction of this new platform we’ve introduced a new logo, typeface and color palette for Wiley Efficient Learning™ at the platform and product level -- beginning with the CPA and CMA product franchises. As part of the rollout, the legacy CPAexcel and Wiley CPA suites have been merged and the CMA suite re-titled. The new suites are:

- Wiley CPAexcel (WileyCPAexcel.com)- Wiley CMAexcel (WileyCMAexcel.com)

Wiley Efficient Learning 3

Logo

The Efficient Learning™ logo is text set in the font Akzidenz Grotesk Bold. This is the only font styling that should be used to reproduce the logo.

Product Logos

Akzidenz Grotesk Bold is the only font that should be used to reproduce the logos for the individual products.

Wiley Efficient Learning 4

Typeface

The Efficient Learning™ platform uses Source Sans Pro as the primary font with Arial as an accent font. The use of these fonts establishes a unique, contemporary, and consistent look for all product and marketing material.

Source Sans Pro

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz 1234567890 !@#$%&(){}?

Source Sans Pro Styles

Source Sans Pro Extra LightSource Sans Pro Extra Light ItalicSource Sans Pro LightSource Sans Pro Light ItalicSource Sans Pro RegularSource Sans Pro ItalicSource Sans Pro SemiboldSource Sans Pro Semibold ItalicSource Sans Pro BoldSource Sans Pro Bold ItalicSource Sans Pro BlackSource Sans Pro Black Italic

Wiley Efficient Learning 5

Font Usage

The font Source Sans Pro should be used for product and marketing in the following ways. The basic proportions for fonts is that the text size is double or tripled for Sub-headlines or Headlines. This is general rule of thumb for design but more liberty can be taken if it enhances the design. Typography styling should be kept to a minimum. Drop shadows and strokes around characters should not be used. In most cases the text should be left justified. This will present the brand in the cleanest and most straight forward way.

Lorem ipsum sit dolar get amet.

Short Display Headline

Hiliquiat. Odicaes enditatem ipsumque consenis exerovit volupta nimet essi natem ut doluptiori ut rate num endam aut quidem abor sintem dolorio rectenis aligenet lant quodi viducim illautasit, vollupt atatis quatem eatemporer.

Display Headline = “3y” Height

Sub-headline = “2y” Height

Paragraph Text = “y” HeightLeft Justified

Wiley Efficient Learning 6

Colors

A large color palette was developed for Wiley Efficient Learning™ to be used for web and print applications. The strategy surrounding color use will evolve more with the addition of new products. Colors for CMA, CPA and CIA have been defined in this document. The colors should be used at full strength and never faded or altered in any way. Colors can be incorporated into pieces of art where there is more liberty but these should follow the example of the book cover shown on page 9.

Wiley Efficient Learning 7

Color Use

The global color for Wiley Efficient Learning™ is a dark cool gray and the range of products are associated to the global platform by the introduction of the multi-colored band found in the header. When a connection is needed to the Wiley Efficient Learning™ plat-form as with the marketing website and applications the cool gray band can be carried through. When promotions are focused on a specific product suite, the color bar is used in combination with a block of color representing the product.

Wiley Efficient Learning 8

Color Band Treatment

The color band that represents the multitude of products under the Wiley Efficient Learning™ platform can be used on marketing at the top of the page when it’s connected to the Wiley Efficient Learning™ gray and logo, or at the very bottom of the page. It should not be used in the middle of a page, as a separator, or vertically for any reason. It should not be faded and the colors should not be altered in any way.

For top of marketing pieces use color bars with logo and gray band

For bottom of marketing peices use color bars only

Wiley Efficient Learning 9

Color Use

The intent is for each product suite to have its own color palette (CMA is represented below as an example). The specific individual colors for each brand are based on their relationship to a primary color. For CMA the color is a medium teal color. Each product will have its own unique palette.

Primary Secondary Tertiary

Wiley Efficient Learning 10

Images

The images used for Wiley Efficient Learning™ are business and finance centric. People should be shown using the products in a setting. The products don’t need to show but there should be an indication of them through the device the person is holding.

Wiley Efficient Learning 11

Product Images

Product can be represented in one of two ways. If generally speaking about an exam product, you should use the basic graphic product images. When speaking about a specific product bundle, you should use the more refined product images.

REVIEW C OURSE

AUDREVIEW C OURSE

BEC

REVIEW C OURSE

Wiley Efficient Learning 12

Icons

Icons have been developed that are flat and simple. These are being used on marketing and in the user interface for the different products. Only approved icons should be used.

Wiley Efficient Learning 13

Application of Styles to UI Elements

Akzidenz Grotesk Logo Text Akzidenz Grotesk Logo Text

Product Specific Color Treatment

Branded Global Header Colors