## Palette de couleurs

### Couleurs primaires

**Arrière-plan**

- Couleur : `#f2f2f0`

- Description : Blanc cassé clair et neutre, épuré et minimaliste

- Utilisation : Tous les arrière-plans de diapositives sans exception

**Texte et lignes principaux**

- Couleur : `#2B2B2B` ou `#1A1A1A`

- Description : Gris très foncé, presque noir

- Utilisation : Tout le contenu textuel, les lignes de séparation des en-têtes, les contours géométriques, les contours des caractères

### Couleurs d'accentuation

**Bleu éclatant**

- Couleur : `#5B7FFF` (alternative : `#4D6FE8`)

- Description : Bleu moyen-brillant avec énergie

- Utilisation : Nœuds circulaires sur des formes géométriques, vêtements/écharpes de personnages, remplissage de boutons, points décoratifs

**Or mat**

- Couleur : `#C9B568` (alternative : `#D4C17A`)

- Description : Ton moutarde/doré chaud

- Utilisation : Nœuds circulaires sur des formes géométriques (alternant avec du bleu), accents décoratifs

### Règles d'application des couleurs

- L'arrière-plan est TOUJOURS `#E8E6E3`

- Le texte est TOUJOURS `#2B2B2B`

- Le bleu et l'or sont UNIQUEMENT utilisés pour les nœuds circulaires et les accents de caractères.

N’utilisez jamais le bleu ou l’or pour de grands aplats ou des couleurs de texte.

- Maintenir un contraste élevé entre le texte et l'arrière-plan

## Système typographique

### Familles de polices

**Police d'affichage principale : Roca Two (ou une police à empattements épaisse similaire)**

- Caractéristiques : Police à empattements audacieuse et conviviale, aux formes arrondies

- Poids : Gros/Lourd

- Utilisation : Tous les titres de diapositives, les titres principaux, les titres de section

- Conserver la même police

**Police secondaire : Poppins (ou Inter)**

- Caractéristiques : Police sans empattement moderne et épurée offrant une excellente lisibilité

- Poids : Régulier (400) pour le corps, Moyen (500) pour la mise en valeur

- Utilisation : Tout le texte courant, les sous-titres, les légendes, les numéros de page, le texte du logo

- conserver la même police

### Hiérarchie des tailles de police

**Titres extra larges** (Diapositives de couverture, séparateurs de sections principales)

- Police de caractères : **Roca Two**

- Taille : 72-96 pt

- Couleur : `#2B2B2B`

- Utilisation : « Titre principal », « Remerciements », « Ordre du jour »

**Titres principaux** (Titres des diapositives de contenu)

- Police de caractères : **Roca Two**

- Taille : 48-60 pt

- Couleur : `#2B2B2B`

- Utilisation : « Notre vision », « Positionnement de la marque », « Qu'est-ce qui vous préoccupe ? »

**Corps du texte** (Paragraphes, descriptions)

Police de caractères : Poppins Regular

- Taille : 18-24 pt

- Couleur : `#2B2B2B`

- Hauteur de ligne : 1,6-1,8

- Usage : Tout le contenu des paragraphes, descriptions

**Petits caractères** (Numéros de page, pied de page, légendes)

Police de caractères : Poppins Regular

- Taille : 16-18 pt

- Couleur : `#2B2B2B`

- Utilisation : « Page X », URL de sites web, adresses e-mail

**Texte du bouton/de la pilule**

Police de caractères : Poppins Regular ou Medium

- Taille : 20-24 pt

- Couleur : `#2B2B2B`

- Utilisation : Texte à l’intérieur des boutons ronds

### Règles de typographie

Ne mélangez jamais les polices à empattement ; utilisez uniquement **Roca Two** pour l’affichage.

- N'utilisez jamais d'empattements pour le corps du texte - seulement Poppins

- Maintenir une hauteur de ligne constante (1,6-1,8) pour une meilleure lisibilité

Tout le texte doit être au format `#2B2B2B`, sans exception.

- Espacement généreux entre les paragraphes (24-32 pt)

## Système de mise en page

### Structure de l'en-tête global

**Diapositive de couverture uniquement (page 1) :**

**Élément d'en-tête gauche :**

- Logo

- Taille : diamètre 32-40 pt

- Couleur : Contour noir `#2B2B2B`

- Position : à 60-80 px du bord gauche, à 60-80 px du haut

- Espacement : 12 à 16 px entre le logo et le texte

**Élément d'en-tête droit :**

Police : Poppins Regular, 16-18 pt

- Couleur : `#2B2B2B`

- Position : à 60-80 px du bord droit, à 60-80 px du haut

- Alignement : Aligné à droite

**Séparateur d'en-tête :**

- Ligne horizontale fine

- Poids : 1-2 pt

- Couleur : `#2B2B2B`

- Position : Sous les éléments d’en-tête, occupant toute la largeur avec les marges

- Marge à partir des bords : 60 à 80 px à gauche et à droite

**Diapositives de contenu (pages 2 à 4) et diapositive de clôture (page 5) :**

- Pas de logo YouMind

- Texte de la page X uniquement

- Position : Coin supérieur droit, centre inférieur ou autre emplacement discret

- Pas de ligne de séparation d'en-tête

- Plus d'espace vertical disponible pour le contenu

### Système de marge

**Marges standard :**

- Haut : 60-80 px (sous le séparateur d'en-tête, ajoutez 40-60 px supplémentaires)

- Bas : 60-80 px

- Gauche : 80-100 px

- Droite : 80-100 px

**Zone de contenu :**

- Après prise en compte de l'en-tête et des marges, la zone de contenu mesure environ 1200-1280px de large × 600-680px de haut (pour un format 16:9 à 1920×1080).

## Éléments visuels

### Formes géométriques dessinées à la main

**Conception de base :**

- Style : Imparfait, rectangles et carrés dessinés à la main

- Poids de la ligne : 2-3 pt

- Couleur : Noir `#2B2B2B`

- Qualité : Biologique, lignes légèrement ondulées (pas parfaitement droites)

- Connexion : Lignes reliant des formes à différents angles

**Nœuds circulaires :**

- Forme : Cercles parfaits

- Taille : diamètre 24-40 pt

- Remplissage : Couleur unie - soit `#5B7FFF` (bleu) soit `#C9B568` (or)

- Position : Aux points de connexion et aux angles des formes géométriques

- Motif : Alterner le bleu et l'or pour plus de variété

**Règles de placement :**

- Position dans les coins des diapositives (en haut à gauche, en haut à droite, en bas à gauche, en bas à droite)

- Ne jamais chevaucher le contenu textuel

- Maintenez une distance de 40 à 60 px par rapport aux zones de contenu.

- Créez un équilibre visuel : si le côté gauche comporte des formes, le côté droit devrait en avoir aussi.

- Agencement typique : 2 à 4 rectangles connectés avec 3 à 6 nœuds circulaires

### Boutons de pilule arrondis

**Spécifications techniques :**

- Forme : Rectangle arrondi (forme de pilule)

- Bordure : 2 pt noir uni `#2B2B2B`

- Remplissage : Transparent ou `#E8E6E3` (identique à l’arrière-plan)

- Rayon de bordure : Rayon de hauteur totale (pilule parfaite)

- Marge intérieure : 16 à 24 px horizontalement, 12 à 16 px verticalement

- Texte : Poppins Regular, 20-24 pt, `#2B2B2B`

**Usage:**

- Éléments de navigation sur les diapositives de l'agenda

- Boutons d'appel à l'action

- Étiquettes de section

- Toujours un contour, jamais rempli de couleur

**État de survol/actif (si interactif) :**

- Remplissage : `#5B7FFF` (bleu)

- Texte : Blanc `#FFFFFF`

- Bordure : `#5B7FFF`

### Grilles à points décoratives

**Caractéristiques:**

Points : Petits cercles de 3 à 4 points de diamètre

- Couleur : `#2B2B2B`

- Motif : Grille régulière, espacement de 12 à 16 px

- Agencement : grille 6×6 ou 8×8

- Position : Coin supérieur droit, à 100-150 px des bords

- Utilisation : Accent facultatif, ajoute un intérêt visuel sans surcharger la vue.

### Icônes (Utilisation minimale)

**Style:**

- Dessin au trait uniquement, sans remplissage

- Poids : 2-3 points

- Couleur : `#2B2B2B`

- Taille : 48-64 pt

- Exemples : Icône œil (vision), cible/réticule (mission)

- Utilisation : Avec parcimonie, uniquement pour renforcer des concepts spécifiques

## Système d'illustration des personnages

### Spécifications de conception des personnages

**Structure de base :**

Illustration minimaliste dessinée à la main, représentant un personnage humanoïde blanc. Ce personnage a une tête arrondie et allongée, deux petits points noirs pour les yeux et un nez pointu proéminent. Il n'a ni doigts ni orteils définis. Il porte une épaisse et longue écharpe bleue unie [optionnel : écharpe jaune moutarde] enroulée autour du cou, la queue retombant le long de son cou. Le style graphique utilise des contours épais et texturés au feutre noir et des aplats de couleur sans ombrage, sur un fond blanc cassé uni. Le personnage est [ce qui convient au contexte].

**Accent bleu (CRITIQUE) :**

- Élément : Écharpe, chemise ou vêtement

- Couleur : `#5B7FFF` (bleu vif)

- Style : Formes organiques fluides dessinées à la main

- Couverture : 15 à 25 % des caractères

- Objectif : Identité de marque, intérêt visuel, mouvement

**Cohérence du style :**

- Toujours dessiné à la main (lignes organiques et imparfaites)

- Toujours inclure un élément d'accentuation bleu

- Conserver la même épaisseur de trait pour tous les caractères

- Conserver des proportions constantes d'une pose à l'autre

### Directives pour l'illustration minimaliste

**La simplicité avant tout :**

- Veillez à ce que toutes les illustrations soient extrêmement simples et minimalistes.

- La hauteur des caractères ne doit PAS dépasser 120 pt (environ 10 à 12 % de la hauteur de la diapositive).

Les éléments géométriques doivent être petits et confinés aux angles uniquement.

- La surface totale des illustrations ne doit pas dépasser 15 % de la surface de la diapositive.

- Évitez les dessins complexes ou détaillés

**Espace et liberté de mouvement :**

- Conservez un espace blanc généreux tout au long de la diapositive.

- Le texte ne doit occuper que 50 à 55 % de la zone de contenu (généralement à gauche).

Le côté droit doit rester majoritairement vide pour une meilleure aération visuelle.

- Marges larges de tous côtés : minimum 100 px, de préférence 100 à 120 px

- Illustrations limitées au coin inférieur droit, à au moins 100 px des bords

**Équilibre de la mise en page :**

- Le centre de la diapositive doit être propre et vide.

- Évitez d'encombrer ou de remplir tout l'espace disponible

- Utilisez l'espace blanc de manière stratégique pour créer de la concentration et de la clarté

- Moins, c'est plus : supprimez les éléments visuels inutiles

- Privilégier la lisibilité et l'espace à la décoration