15
L’image de marque et les constantes graphiques Novembre 2012

L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

L’image de marque et les constantes graphiques Novembre 2012

Page 2: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

2. L’image de marque et les constantes graphiques Octobre 2012

L’importance de ce guideC’est avec fierté que Société en commandite Stationnement de Montréal vous présente ce guide des normes graphiques de l’image de marque de P$ Service mobile, un nouveau service qui met en lumière le dynamisme de notre Société. Le logo qui a été développé en permet l’identification immédiate, quelle qu’en soit la déclinaison (sur support électronique ou papier, ou encore sur nos équipements).

Nous vous invitons à participer à la notoriété de P$ Service mobile en vous assurant que l’image de marque soit en tout temps utilisée de manière adéquate. Le respect des normes d’utilisation et l’uniformité sont le gage d’une crédibilité accrue et reconnue.

Pour plus d’information, veuillez communiquer avec :Sophie Charette, directrice adjointe – Communications514-868-3795 ou [email protected]

Page 3: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

3. L’image de marque et les constantes graphiques Octobre 2012

La promesse de marqueC’est en quelque sorte le bénéfice objectif ou subjectif suggéré aux utilisateurs du service par l’ensemble des images et des messages qui seront véhiculés. Une représentation visuelle simple qui se décode facilement tout en affirmant le sérieux du service traduit bien cette promesse. C’est pourquoi nous devons assurer que les images et les messages utilisés sont compréhensibles.

Faciliter le paiement d’une place de stationnement en offrant une application mobile accessible, fonctionnelle et conviviale.

Page 4: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

4. L’image de marque et les constantes graphiques Octobre 2012

L’architecture de la marqueL’architecture de la marque P$ Service mobile comprend deux logos et un bloc signature.La combinaison des éléments graphique (symbole) et descriptif (dénomination avec ou sans endossement) compose l’identification visuelle. Le bloc signature doit en tout temps accompagner le logotype.

Chacun de ces éléments a une fonction et une utilisation précises (voir page suivante).

© 2012 Stationnement de MontréalAll rights reserved

Powered by TC.Media

© 2012 Stationnement de MontréalTous droits réservés

Propulsé par TC.Media

Logo (symbole et dénomination) Bloc signature Logo avec endossement (symbole, dénomination et endossement)

Page 5: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

5. L’image de marque et les constantes graphiques Octobre 2012

L’utilisation de la marqueLes composants des logos (avec ou sans endossement) sont indivisibles. Le symbole (pastille avec le P$) doit toujours être employé avec la dénomination. Le rapport de taille et de positionnement entre le symbole, la dénomination et l’endossement sont immuables.

Le logo avec endossementIl est employé en ouverture d’application suivi des logos sans endossement et lorsque le support ne porte pas le logo « Stationnement de Montréal ».

Le logo sans endossementIl est utilisé sur un support qui porte le logo « Stationnement de Montréal » (site Internet, dépliant, etc.) ou après l’utilisation le logo avec endossement.

Le bloc signature Utilisé en « pied de page », il est situé au bas de la page d’accueil de l’application ou au bas d’une annonce, affiche ou autre. En règle générale, le bloc signature n’apparaît qu’une seule fois.

La dénomination dans un texteLorsqu’elle est utilisée dans un texte suivi, l’appellation P$ Service mobile doit toujours être composée de majuscules et de minuscules et être en italique (comme illustré). Le corps et la taille du caractère typographique ne doivent pas différer de ceux du texte qui la précède et la suit.

© 2012 Stationnement de MontréalTous droits réservés

Propulsé par TC.Media

© 2012 Stationnement de MontréalAll rights reserved

Powered by TC.Media

P$ Service mobile P$ Mobile service

Page 6: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

6. L’image de marque et les constantes graphiques Octobre 2012

Les différentes versionsDes versions verticale et horizontale ont été développées afin de faciliter l’utilisation du logo. La proportion des composants du logo (symbole et dénomination) de la version horizontale est différente afin de s’assurer que la dénomination, et particulièrement l’endossement, soient toujours lisibles dans des utilisations où l’espace en hauteur est restreint.

Logo vertical

Logo horizontal

Logo horizontal avec endossement

Logo vertical avec endossement

Page 7: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

7. L’image de marque et les constantes graphiques Octobre 2012

Les couleurs de la marqueLes couleurs de l’image de marque sont inaltérables. Elles permettent l’identification immédiate du service. De plus, l’utilisation de ces couleurs officielles vient renforcer la notoriété cognitive de cet environnement transactionnel.

Recettes CMJN (CMYK) Recettes RVB (RGB)

1 . Bleu cyan C100-M0-J0-N0 R0-V174-B239

2 .Noir C0-M0-J0-N100 R0-V0-B0

3 .Gris très foncé C0-M0-J0-N90 R25-V25-B25

4 .Gris foncé C0-M0-J0-N70 R76-V76-B76

5 .Gris clair C0-M0-J0-N30 R178-V178-B178

6 .Gris très clair C0-M0-J0-N5 R242-V242-B242

7 .Blanc C0-M0-J0-N0 R255-V255-B255

1

2

3

6

4

7

5

Page 8: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

8. L’image de marque et les constantes graphiques Octobre 2012

L’utilisation de la couleurL’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence le bleu du logo P$ Service mobile. Le bleu cyan doit être utilisé avec parcimonie afin que le logo conserve tout son impact au premier coup d’œil. En noir et blanc, le logo est toujours utilisé sur un fond blanc (couleur du papier).

6

6

5

5

4

4

3

3

Page 9: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

9. L’image de marque et les constantes graphiques Octobre 2012

L’utilisation sur fond de couleurL’utilisation d’une zone blanche est nécessaire si le logo est placé sur un fond de couleur qui diffère de sa palette habituelle afin de l’isoler des couleurs ou des éléments qui pourraient nuire à sa lisibilité ou à sa reproduction.

Le format de la zone blanche est déterminé par la même règle que celle de la zone de neutralité (page 10).

Page 10: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

10. L’image de marque et les constantes graphiques Octobre 2012

La zone de neutralitéPour que la marque soit clairement visible, une zone minimale de neutralité ou « espace libre » doit être conservée tout autour du logo, et ce, peu importe le support. La lettre « M » de la dénomination sociale est utilisée comme élément de mesure afin d’établir la zone de neutralité.

Il faut donc préserver un espace libre correspondant au minimum à 1½ fois la dimension du « M ».

Page 11: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

11. L’image de marque et les constantes graphiques Octobre 2012

La typographieLa typographie est un élément important dans la diffusion d’une image de marque uniforme et distinctive. Afin d’assurer l’uniformisation des différentes pièces ou documents, il est recommandé d’utiliser la police typographique officielle d’accompagnement du logo.

La police UNIVERS est la police utilisée dans l’ensemble des informations et instructions que l’ont retrouve sur le mobilier (bornes et panonceaux) de Stationnement de Montréal.

Univers 45 Light

abcdefghijkLmnOpqrstuvwxyz abcdefghijklmnopqrstuvwxyz 0123456789

Univers 57 Roman

ABCDEFGhIJKLMNoPqRStUVwxYz abcdefghijklmnopqrstuvwxyz 0123456789

Univers 65 Bold

aBCdefGhijkLmNopqrStuvwxyz abcdefghijklmnopqrstuvwxyz 0123456789

Page 12: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

12. L’image de marque et les constantes graphiques Octobre 2012

Les applications de la marque | téléphones intelligents

Afin d’assurer la bonne reconnaissance de la marque, nous conseillons d’exploiter au maximum la palette de couleurs du logo pour les différentes applications numériques. Les fonds foncés permettent de mettre en évidence le bleu du logo P$ Sevice mobile et de faire un rappel avec la borne de paiement et le panonceau. La « texture grise » doit être utilisée comme couleur de fond pour les pages d’accueil des différentes applications (téléphone et web).

AT&T 12:34 PM

S’inscrireQu’est-ce que P$ Service Mobile ?

Mot de passe oublié?

Mot de passe

Identifiant

ServiceMobileStationnement de Montréal

Montréal

Entrer

Propulsé par

AT&T 12:34 PM

Données du compte

*Les frais standards s’appliquent.

Alertes de fin de stationnement

Langue Français

Non

Oui

Simon Champlain

Par courriel

Par texto*

Courriel [email protected]

No de cellulaire (555) 442-1817

ProfilProfilDéconnexionDéconnexion ModifierModifier

AT&T 12:34 PM

HistoriqueHistorique

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

AT&T 12:34 PM

AutreAutre

Conditions d’utilisation

Politique de vie privée

Contact

FAQ

AT&T 12:34 PM

S’inscrireQu’est-ce que P$ Service Mobile ?

Mot de passe oublié?

Mot de passe

Identifiant

ServiceMobileStationnement de Montréal

Montréal

Entrer

Propulsé par

AT&T 12:34 PM

Données du compte

*Les frais standards s’appliquent.

Alertes de fin de stationnement

Langue Français

Non

Oui

Simon Champlain

Par courriel

Par texto*

Courriel [email protected]

No de cellulaire (555) 442-1817

ProfilProfilDéconnexionDéconnexion ModifierModifier

AT&T 12:34 PM

HistoriqueHistorique

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

AT&T 12:34 PM

AutreAutre

Conditions d’utilisation

Politique de vie privée

Contact

FAQ

Fichier « textureP.jpg »

Fond blanc et contour noir 40 % (R167-V169-B172)

Noir 100 % (R0-V0-B0)

Blanc (R255-V255-B255)

Noir 100 % (R0-V0-B0)

Noir 80 % (R88-V89-B91)

Dégradé noir 20 % (R209-V211-B212) à noir 4 % (R244-V244-B244)

Noir 80 % (R88-V89-B91)

Noir 4 % (R244-V244-B244)

Noir 4 % (R244-V244-B244)

Noir 60 % (R128-V128-B128)

Page 13: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

13. L’image de marque et les constantes graphiques Octobre 2012

Les applications de la marque | web mobile

AT&T 12:34 PM

Qu’est-ce que P$ Service Mobile ?

S’inscrire en 3 étapes faciles

ServiceMobileStationnement de Montréal

S’inscrire

Courriel ou N° de cellulaire

Mot de passe

Stationnement de MontréalStationnement de Montréal

Google

Ouvrir une session

AT&T 12:34 PM

ServiceMobileStationnement de Montréal

Accueil

Stationnement de MontréalStationnement de Montréal

Google

Payer une place

Profil

Historique

Fermer la session

AT&T 12:34 PM

Prénom : Simon

Nom : Champlain

N° de cellulaire : 5554421817

Courriel : [email protected]

Langue : Français

Données du compte

Modifier

ProfilProfilAT&T 12:34 PM

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

U252Du : 2012-11-01 08:17Au : 2012-11-01 11:00

HistoriqueHistorique

Noir 80 % (R88-V89-B91)

Noir 4 % (R244-V244-B244)

Noir 4 % (R244-V244-B244)

Blanc (R255-V255-B255)

Dégradé noir 30 % (R188-V189-B192) à noir 20 % (R209-V210-B212)

Dégradé noir 20 % (R209-V211-B212) à noir 4 % (R244-V244-B244)

Noir 20 % (R209-V211-B212)

Noir 20 % (R209-V211-B212)

Cyan 100 % (R0-V174-B239)

Page 14: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

14. L’image de marque et les constantes graphiques Octobre 2012

Les applications de la marque | web

Noir 100 % (R0-V0-B0)

Noir 100 % (R0-V0-B0)

Fichier « textureP.jpg »

Blanc (R255-V255-B255)Noir 80 % (R88-V89-B91) Noir 80 % (R88-V89-B91)

Noir 95 % (R50-V47-B49) Noir 60 % (R128-V128-B128)

Dégradé noir 20 % (R209-V211-B212) à noir 4 % (R244-V244-B244)

Cyan 100 % (R0-V174-B239)

Noir 60 % (R128-V128-B128)

Page 15: L’image de marque et les constantes graphiques Novembre 2012 · L’utilisation d’une palette de couleurs pour les fonds, de gris pâle à gris foncé, permet de mettre en évidence

15. L’image de marque et les constantes graphiques Octobre 2012

Les utilisations incorrectestoute modification à l’image de marque et à ses composants, aussi bien au niveau des couleurs que des proportions, est interdite. Voici quelques exemples non exhaustifs de modifications à proscrire.

Composition modifiée

Couleurs modifiées

Proportion modifiée

typographie modifiée

Symbole seul

Ajout d’un élément graphique

Dénomination et endossement seuls

Déformation

Dénomination seule

Utilisation de la couleur et zone de neutralité

Mobile

Mobile