Notre charte graphique

De La documentation de La Raffinerie
Révision datée du 3 octobre 2025 à 06:04 par Jef (discussion | contributions) (mise à jour charte)
Aller à :navigation, rechercher

Définition Wikipédia : la charte graphique, dont la dénomination correcte est cahier des normes graphiques, est un document de travail qui contient l’ensemble des règles fondamentales d’utilisation des signes graphiques qui constituent l’identité graphique d’une organisation, d’un projet, d’une entreprise. Le terme vient du latin charta qui signifie «papier» et qui en français a pris le sens de «loi, règle fondamentale».

But et intérêts de la charte graphique

Le but de la charte graphique est de conserver une cohérence dans les réalisations graphiques de La Raffinerie, quels que soient les différent(e)s intervenant(e)s de la production.

L’intérêt de réaliser une charte graphique est double :

- L’identité graphique reste intacte quelles que soient les réalisations qui l’utilisent, afin que l’association (qui est une somme d’individualités) parle «d’une seule voix». Les anglophones parlent de corporate design (littéralement : dessin de l’entreprise).

- La charte graphique permet au récepteur d’identifier facilement l’émetteur et, par habitude si la cohérence est respectée, de se repérer visuellement dans les différentes réalisations graphiques et au sein même d’un même support (ce qui facilite la lecture).

Notre logotype et sa base line

logo

Le logo sera utilisé dans un cartouche qui rappelle notre enseigne à l'Hermitage, pour les affichettes, programmes et toutes les communications d'ateliers ou permanences.

logo La Raffinerie dans son cartouche

Bouton download.jpg Le logo et son cartouche

Les polices de caractères :

Les critères de sélection des polices de caractères que nous utilisons sont :

- leur gratuité d’utilisation pour tout types de documents

- la présence des caractères spéciaux (@%ù etc.)

Pour tout les documents (externes et internes) de La Raffinerie, nous nous appliquerons à utiliser les quatre typographies suivantes :

Typos 2025.jpg

Variante pour les titrages

Pour les gros titres nous utiliserons la police SUPER NORMAL mais son signe "&" n'est pas très lisible ni joli, il sera remplacé par celui de la police SUPER CARAMEL (présente dans la liste des polices en téléchargement).

&-titrage.jpg

Pour la réalisation des fiches tutos nous utiliserons les polices suivante :

typos fiches tutos

Bouton download.jpg Toutes les polices de La Raffinerie

Visuels Atelier et Permanence

Format instagram et évènement facebook

visuel instagram

Référence-Permanences-Atelier-Bichro.jpg

Visuel event FB

Référence-Permanences-Atelier-BichroFB.jpg

Dans le fichier référence se trouve une page modèle en 1200 x 628 pixels pour les évents Facebook et une page en 1200 x 1350 pixels pour Instagram.

Toute les communications de La Raffinerie sont en bichromie.

Les couleurs retenues pour les ateliers et permanences sont :

Orange riso.jpg Orange_riso

code couleur hexadécimale #ff6c2f

C : 0, M : 69, J : 81, N : 0.

Blue riso.jpg Blue_riso

code couleur hexadécimale #0078bf

C : 85, M : 45, J : 0, N : 0.

Mode d’emploi du fichier de référence :

Dans illustrator :

- afficher la fenêtre «Calques».

- quatre calques présents.

- bloquer les calques sur lesquels on ne travaille pas avec le verrou.

Un calque fixe «cache»

Un cache qui intègre les éléments fixes (logo et pied de page). Il permet de régler de la taille du visuel et de faire son cadrage facilement.

Il n’a pas besoin d’être déverrouillé.

Trois calques sont modifiables :

Calque «visuel» >> possibilité de déplacer, recadrer, remplacer la photo. Toujours veiller à avoir une définition suffisante.

ATTENTION  les visuels doivent être préalablement traitée en bichromie (tuto à venir).

Bouton download.jpg Fichiers photoshop prêts à l'emploi ou modifiable au besoin

Calque «cartouches et textes» >> possibilité de déplacer le bloc texte/dates verticalement. Penser à bloquer à l’aide de majuscule, ou bien sélectionner et utiliser les flèches du clavier.

Les filets des blocs textes sont réglés à 3pt, pensez à les vérifier une fois les changements de taille de blocs effectués.

Calque «date» >> L’idée est de justifier visuellement en largeur le jour, le mois (sauf mars, mai et juin), les horaires (ce qui modifie leur taille) et d’adapter la taille de la date en conséquence pour que visuellement nous ayons un cartouche équilibré.

Exemples-dates.jpg

- Une fois les modifications effectuées, que vous êtes content.e de votre travail, enregistrer le fichier Illustrator.

- Créer le fichier JPG >Fichier > Exporter > Enregistrer pour le Web (ctrl + maj + alt  + s).

Bouton download.jpg Le fichier référence

Visuels chantiers participatifs

Pour les chantier nous communiquerons à l'aide de visuels génériques sans date.

Une "banque" de 8 visuels déclinés en Instagram et en Event FB au format JPG est disponible et s'agrandira au fur et à mesure.


Exemple de visuel event Facebook

Chantier-participatif eventFB générique04.jpg

Exemple de visuel Instagram

Chantier-participatif insta générique04.jpg

Bouton download.jpg Banque de visuels chantier

Pour celles ou ceux qui voudraient faire leur propre visuels un fichier illustrator est à disposition

Bouton download.jpg Fichier générique pour les chantiers participatifs

Les couleurs retenues pour les chantiers sont :

Fluorescent pink riso.jpg Fluorescent_pink_riso

code couleur hexadécimale #ff48b0 / C : 5, M : 79, J : 0, N : 0.

Blue riso.jpg Blue_riso

code couleur hexadécimale #0078bf / C : 85, M : 45, J : 0, N : 0.

Affiches et communication évènementielle

Affichettes 2025.jpg

Black_riso

code couleur hexadécimale #1d1d1b / C : 0, M : 0, J : 0, N : 100.

Burgundy_riso

code couleur hexadécimale #914e72 / C : 43, M : 75, J : 29, N : 14.

Green_riso

code couleur hexadécimale #00a95c / C : 79, M : 0, J : 80, N : 0.

Medium_blue_riso

code couleur hexadécimale #3255a4 / C : 88, M : 68, J : 0, N : 0.

Bright_red_riso

code couleur hexadécimale #f15060 / C : 0, M : 80, J : 50, N : 0.

Purple_riso

code couleur hexadécimale #765ba7 / C : 64, M : 70, J : 0, N : 0.

Couleurs-riso-Raffinerie.jpg

Rédaction de la suite de la charte en cours

Bouton download.jpg Lien vers les logos partenaire en gris

Bouton download.jpg Fichier Illustrator des logos partenaires en Monochrome