Guide For Applications and Services - Prometric Brandprometricbrand.com/documents/PrometricSupplementalStandardsManual...Prometric 3 Our Logo: Core Elements The Prometric logo is the

Prometric Supplemental Standards Manual 2015

Version 1.0 : January 2015

Guide For Applications and Services

Aid for Web Designers and DevelopersA more comprehensive Corporate Standards Manual

may be found at www.prometricbrand.com

2

Introduction: Our Logo

The Prometric brand identity system is composed of several core

elements which include (but are not limited to) the company name,

the corporate logotype, the color palette, the approved typographic

palette and certain design parameters. All of these elements work

together within a wide range of integrated marketing materials.

CORE ELEMENTS

Prometric’s core elements include the logo (company, corporate

logotype, the “Radiance” mark), the approved color palette, and

a defined set of fonts. They also can include the brand descrip-

tor for use in special cases. The graphic standards defined in this

manual should be applied to all digital programs.

Trusted Provider of Market Leading Test Development and Delivery Solutions

INTEGRATED BRAND IDENTITY SYSTEM

BRAND DESCRIPTOR

The words Trusted Provider of Market Leading Test Development

and Delivery Solutions make up the corporate identity descriptor

and support our brand essence. They allow us to illustrate our unique

position in the testing and assessment market. The logo and descriptor

have been set in a special configuration. It is unacceptable to alter the

size, proportions, kerning or any other characteristics of the typeface.

Prometric 2015 Supplemental Standards Manual

3

Our Logo: Core Elements

The Prometric logo is the graphic representation of our brand essence. It is the most visible element of our brand. Proper use of the logo is essential for maintaining brand integrity. Used consistently, the logo builds brand equity and reinforces the most positive aspects of our brand.

The name element of the Prometric logo is typeset in Anziano

Caps, and represents strength and stability. Much like the chiseled

type on a bank building or on ancient Roman remains, Anziano

Caps says “solid.” The corporate color for the name element is black.

We refer to the graphic element of our logo as the “Radiance”.

Symbolized by circles of decreasing size, the Radiance emanates

from the company name and represents the creativity and leader-

ship we bring to our market, as inspired by our vision, mission

and values (VMV). The corporate color for the Radiance

element is Green HEX: 8CC63F.

The logo is registered with the US Patent and Trademark

office and exists as an entity. It must always be used as one

complete element. Detailed rules for use of the logo appear on

the following page.

LOGOTYPE ELEMENT

GRAPHIC ELEMENTTHE LOGOTYPE

THE GRAPHIC ELEMENT

INTEGRITY OF THE MARK


®

®

4

Our Logo: Rules and Restrictions

+ The current version of the logo bears a ® symbol at the bottom of the Radiance. Do not reproduce the logo without the appropriate trademark ®.

+ Do not separate the Logotype Element from the Radiance.+ Do not use any portion of the Radiance as a design element without prior and specific

written approval from the Global Marketing department.+ Do not alter the aspect ratio (heigh:width) of the logo to make it taller shorter, wider or

narrower than it appears in its normal ratio.+ Do not alter the order of the elements (i.e., place the Radiance before the Logotype).

+ The logo may be reversed out of Black ONLY, the Radiance should remain green if possible, white if printing black only.

+ Do not use the logo in an email signature block or on any unofficial forms or documents.

The Prometric Logo is proprietary intellectual property of the Prometric, Inc. The following rules and restrictions have been established to ensure auniform presentation of the Prometric brand and to protect the Trademark against misuse or infringement by other parties. Variations from theserules are permitted only with prior and specific written approval from the Global Marketing department.


+

5

Our Logo: Correct & Incorrect Usage

Use the Prometric logo on a solid

white background or on a very light screen of Black (not to exceed

10% of the background color’s value).

IN ONE COLOR Use the Prometric logo in Black and Grey, as

specified in the logo restrictions above. Do not print the logo in

alternate colors, even monochromatically.

The logo may be reversed out of Black ONLY.

Do not reverse the logo out of other colors, even if those colors

exist in the approved corporate palette.

Do not interchange the logo colors.

Do not stretch or scale the logo to fit into a

desired picture window or print applications. The logo must always

be used proportionally, without manipulation of its aspect ratio.

POSITIONING OF LOGO ELEMENTS Do not change the relative

position of the logo elements.

SCALING OF LOGO ELEMENTS Do not scale any of the elements

independently, including type or graphics.

REVERSE ON ACCENT COLORS Do not use the logo on any accent

color background.

ON WHITE OR LIGHT GREY

ACCEPTABLE

UNACCEPTABLE

REVERSED

INTERCHANGING COLORS

STRETCHING / SCALING

ACCEPTABLE

UNACCEPTABLE


A complete list of regulations and restrictions for use of the Prometriclogo appears on the previous page. We have provided these graphicexamples to illustrate some of the appropriate and inappropriate usesof the logo.

®

6

Our Logo: Staging

The preferred placement for Prometric’s logo is in the upper

right-hand corner of an application header. This is particularly

important as it has consistency with corporate documentation

branding.

MIDDLE LOWER

Login Screen Login Screen

Secondary Screen Secondary Screen

TABLET

MOBILE

DESKTOP

DESKTOP

DESKTOP

DESKTOP

This position allows for staging on multiple platforms both in

horizontal and vertical positioning on tablets and mobile devices.

Lower left staging should only be used when an application

uses a secondary left navigation panel and the upper right

corner is unavailable.

LOWER LEFT

UPPER RIGHT CORNER


7Prometric 2015

Typography: Headers and Sub-headings

Prometric uses san-serif typefaces Arial and Avenir font families in

web and application design. As both font families come in various

weights they can be used for headers and sub-headings and also text

bodies. They are a versatile selection of fonts, some of which are

presented on this page.

Prometric uses a serif typeface Times New Roman. It can be used

in running bodies of text. It is an industry standard and is highly

legible.

SANS SERIF TYPEFACES FOR HEADERS AND SUBHEADINGS

ARIAL BOLD

Prometric, a wholly-owned subsidiary of ETS, is a trusted provider of market-leading test development

and delivery solutions.

ARIAL REGULAR

Prometric, a wholly-owned subsidiary of ETS, is a trusted provider of market-leading test development

and delivery solutions.

ARIAL NARROW

Prometric, a wholly-owned subsidiary of ETS, is a trusted provider of market-leading test development and delivery solutions.TIMES NEW ROMAN BOLD

Prometric, a wholly-owned subsidiary of ETS, is a trusted provider of market-leading test development and delivery solutions.

Prometric, a wholly-owned subsidiary of ETS, is a trusted provider of market-leading test developmentand delivery solutions.

AVENIR

TYPEFACES

If another typeface is required please seek approval from the

Global Marketing Team.

SANS-SERIF TYPEFACE

SERIF TYPEFACE SERIF TYPEFACES FOR RUNNING TEXT BODIES

TIMES NEW ROMAN REGULAR


Supplemental Standards Manual

TIMES NEW ROMAN ITALIC


8

Typography: Menus and Buttons

Arial and Avenir typesfaces are to be used when developing

applications and are suited to menus and buttons for clean

and clear legibility. They also have condensed versions within

their font families for use where text weight is an issue. These

are free fonts that do not require a license.

TYPEFACES FOR MENUS AND BUTTONS

MICROSOFT SAN SERIF


FONT USE WITHIN APPLICATIONS

Prometric, a wholly-owned subsidiary of ETS, is a trusted provider of market-leading test development and delivery solutions.ARIAL REGULAR

ALTERNATIVE TYPEFACE FOR MENUS AND BUTTONS

Prometric, a wholly-owned subsidiary of ETS, is a trusted provider of market-leading test development and delivery solutions.AVENIR MEDIUM

ALTERNATIVE TYPEFACE

Microsoft San Serif typeface is an alternative to the above

typefaces and is approved to use for buttons and menus.

Do not use too many fonts within a single application. By doing

so you can create inconsistency. Always use the same font for

menus and buttons.

Button

Button

Button

TYPEFACES FOR MENUS AND BUTTONS


9

Brand: Color Palette

CORPORATE BRAND COLORS

Prometric’s brand colors are Black and Green.

The secondary color palette is comprised of all shades of gray

(6 sample shades are shown to the left) and cream, orange and

white. It is limited with purpose - a restricted secondary palette

allows our Corporate Brand Colors and the use of imagery or

graphical elements to clearly stand out. Do not add colors to the

Prometric Color Palette

PROMETRIC GREEN RGB: 140.198.63

PROMETRIC BLACK RGB: 0.0.0

DARK GREYRGB: 98.99.102HEX: 626366

MEDIUM GREYRGB: 147.149.151HEX: 939597

ORANGERGB: 239.96.49HEX: EF6031

LIGHT GREYRGB: 198.200.202HEX: C6C8CA

CREAMRGB: 222.217.178HEX: DED9B2

WHITERGB: 255.255.255HEX: FFFFF

COLOR USE IN MENUS

When selecting a color for a menu header use 30% of the color

value to highlight an item in a menu selection.

SECONDARY COLORS


CORPORATE BRAND COLORS

SECONDARY COLORS

HEX: 000000 HEX: 8CC63F

Cut Score%

Score ReportUpdate

Client

Results

Tutorial

Finance

Test Centre

View Reports

Ap

Applications

TestDevelopment

Configuration

Candidate

Chart Analyitics

10

Iconography: Custom Application Icons

PROMETRIC ICONS

The use of icons within Prometric applications should

clearly represent their intended function. They should

also aid in enhancing the user experience.

ICON CONTRUCTION

GENERIC ICONS

The use of generic icons can create inconsistencies in

our applications and should be avoided unless they are

native to the operating system (OS). Some OS

environments like iOS and Windows 8 restrict the use of

customizable icons to retain their own individual visual

style.

Almost all Prometric icons are vector based to allow

for scaling without loss of image quality. All icons can

be requested in various formats including .eps, .ai, .psd

.svg, .png, .jepg and .bmp. A full list of icons will be

available by application upon request to Global Marketing.


11

Show StatusReport

Item Item Bank Account Manual

DetailedReport

SummaryReport

Save

No PermissionsAssociated



Back

References Save

Rationale Comments Submit

Select Deselect Upload

Delete

12

ICON STATES

All icons can also have various states depending

on their use. Use only from the Prometric color

palate for state changes.



Operating System

Web Browser

IP Address

Javascript

Cookies

Screen Resolution

Browser Size

Color Depth

Flash Version

IP

13



14

Design Consistency:

TM

TM

TM TM

TM

Web, Desktop and Mobile Applications

Having design consistency in our applications and services serves not only ourselves within Prometric but also clients and candidates. It should

flow from our VMV and end up in all aspects of our daily contribution to

constantly improve the technologies, systems and processes we use.


15

Layout: Color Layout Guide

TABLET

MOBILE

DESKTOP LAYOUTWEB LAYOUT

Use our primary colours for the web application header,

always Prometric Black as header and Prometric Green

as a menu holder or divider with the rest of the real estate.

Use Dark Grey for application background and white for

active real estate. The footer should be as shown with a

divider of Prometric Green also.

WEB APPLICATIONS

DESKTOP APPLICATIONS

Use our primary colours for the web application header,

always Prometric Black as header and Prometric Green as

a menu holder or divider with the rest of the real estate.

Use dark, medium or light grey for side navigation panels

and white for active real estate. The footer, if used, can be

Prometric black or dark grey as shown.

TABLETS AND MOBILE DEVICES

Design as close to our standard Prometric style as possible

within the native parameters of the operating system.

Allow for the responsive nature of such devices.


16

Layout:

ApplicationLogo

Place Holder 1Menu Blank Menu Blank Menu BlankMenu Blank Menu Blank

Place holder 2BLANK 1 - Description Blank

Blank

BLANK 2 - Description Blank



Copyright 2014 Prometric, Inc. All Rights Reserved.c

Blank Blank Blank Blank Blank Blank

Desktop ApplicationsWeb Applications |

APPLICATION LAYOUT


17

Layout: Menus and Buttons

Menu 1MyItemWriterMyPublisherMyDesigner Wizard

BrainRaider


BrainRaider


BrainRaiderDSST ApplicationDSST Application DSST Application

DROP DOWN MENU

Drop 1 Drop 2 Drop 3

Button

Button

Blank Button

Blank Button

Button Button

Button

Blank Button

Button

Blank Button

Button

Button

Button

When designing menu controls use simple and clean

controls that compliment the overall styling of the

application. Use the same font for all menus throughout

the application. Be careful not to overpower the branded

header of the application. Use one color for all menus.

MENUS

BUTTONS

Use either flat buttons or buttons with a 2px radius. Never

use both within the same application. Use the same font

for all buttons and give text enough padding within

buttons. Never stretch text to fit or have differing button

heights in the application.

BUTTONS STATES

Using button states interactively helps the user in making

a decision. It indicates an action from the user to proceed.

STATES

INACTIVE

HOVER

ACTIVE


Documents

Guide For Applications and Services - Prometric Brandprometricbrand.com/documents/PrometricSupplementalStandardsManual...Prometric 3 Our Logo: Core Elements The Prometric logo is the