📅 Guide de l'élève

FriseChronoFacile — Éditeur de frises chronologiques pédagogique

Collège · 11–15 ans

🗺️1. Introduction

Qu'est-ce qu'une frise chronologique ?

Une frise chronologique est un outil qui représente des événements sur une ligne du temps. On place des dates et des informations sur un axe horizontal, du passé vers le futur, pour mieux comprendre l'ordre dans lequel les choses se sont passées.

Par exemple, on peut créer une frise pour montrer les grandes étapes de la Révolution française, les découvertes scientifiques importantes, ou encore les événements de ta propre vie !

À quoi sert FriseChronoFacile ?

FriseChronoFacile est un outil web qui te permet de :

  • Créer ta propre frise chronologique avec des événements, des périodes et des annotations
  • Ajouter des images, des couleurs et des descriptions pour rendre ta frise plus belle
  • Déplacer et modifier facilement les éléments
  • Exporter ta frise en PDF pour l'imprimer ou la remettre à ton professeur
  • Sauvegarder ton travail dans un fichier pour le reprendre plus tard
L'outil fonctionne directement dans ton navigateur web (Chrome, Firefox, Edge…), sans installation et sans connexion internet requise.

🖥️2. L'interface

L'écran de FriseChronoFacile est divisé en quatre parties principales :

La barre du haut

Boutons de la barre du haut

  • Nouveau — crée une frise vide
  • Ouvrir — ouvre un fichier .json précédemment sauvegardé
  • Sauvegarder — enregistre ta frise dans un fichier .json
  • Paramètres ⚙️ — accède aux réglages de l'application
  • Exporter (bouton bleu) — exporte en PDF, ZIP, JSON ou Draw.io

Les trois panneaux

Panneau gauche

  • Titre, dates début/fin, échelles
  • Ruptures temporelles
  • Bouton Appliquer
  • Formulaires Événement / Période / Texte libre

Panneau central (la frise)

  • Axe horizontal avec ticks et dates
  • Cartes d'événements
  • Barres de périodes
  • Textes libres (annotations)
  • Boutons de zoom en haut

Panneau droit

  • Liste de tous les éléments
  • Bouton ✎ pour modifier
  • Bouton ✕ pour supprimer
  • Compteur d'éléments

Barre de la frise

  • Boutons − et + (zoom)
  • Bouton ⊡ (ajuster la vue)
  • Affichage du % de zoom
  • Cases à cocher Grille / Labels

⚙️3. Créer et configurer ta frise

Avant d'ajouter des événements, il faut définir les paramètres de base de ta frise.

Étapes pour configurer ta frise

  1. Dans le panneau gauche, repère la section "Paramètres de la frise"
  2. Dans le champ Titre, écris le nom de ta frise (ex : La Révolution française)
  3. Dans Date de début, écris l'année de début (ex : 1789)
  4. Dans Date de fin, écris l'année de fin (ex : 1799)
  5. Choisis l'échelle principale selon la durée de ta frise
  6. Choisis l'échelle secondaire pour avoir des tirets intermédiaires
  7. Clique sur Appliquer pour mettre à jour la frise

Choisir la bonne échelle

SièclePour des frises très longues (plusieurs millénaires)
DécenniePour des frises de plusieurs siècles
AnnéePour des frises de quelques dizaines d'années
MoisPour des frises d'une ou quelques années
JourPour des frises très courtes (quelques semaines ou mois)

📍4. Ajouter un événement

Un événement est un moment précis dans le temps. Il apparaît comme une carte reliée à l'axe par un trait pointillé.

  1. Dans le panneau gauche, clique sur l'onglet Événement
  2. Remplis le champ Date : 1789 (année seule), juillet 1789 ou 14 juillet 1789
  3. Écris le Titre de l'événement (ex : Prise de la Bastille)
  4. Ajoute une Description optionnelle (Markdown supporté : **gras**, *italique*)
  5. Pour ajouter une image : colle une URL ou clique sur l'icône 🖼 pour choisir un fichier
  6. Choisis une couleur parmi les carrés colorés ou utilise la roue de couleurs
  7. Choisis la position : Automatique, Au-dessus ou En-dessous de l'axe
  8. Clique sur Ajouter l'événement
Dans la description, tu peux utiliser du Markdown : **texte** pour mettre en gras, *texte* pour l'italique, ***texte*** pour les deux !

📏5. Ajouter une période

Une période représente un intervalle de temps entre deux dates. Elle peut apparaître comme une barre colorée sur l'axe ou une carte avec des liens d'accroche.

  1. Dans le panneau gauche, clique sur l'onglet Période
  2. Remplis le champ Début (ex : 1789)
  3. Remplis le champ Fin (ex : 1799)
  4. Écris le Titre (ex : Révolution française)
  5. Choisis une couleur
  6. Choisis un motif de fond parmi : Aucun, Hachure simple, Hachure double, Pointillé, Inclinées droite/gauche
  7. Choisis le mode d'affichage : barre sur l'axe, carte externe, ou les deux
  8. Clique sur Ajouter la période

✏️6. Ajouter un texte libre

Un texte libre (annotation) est un bloc de texte flottant. C'est pratique pour ajouter un titre, une légende ou un commentaire sur la frise.

  1. Dans le panneau gauche, clique sur l'onglet Texte libre
  2. Écris ton texte (le Markdown est accepté)
  3. Choisis la taille de police (10px à 28px)
  4. Choisis une couleur pour le texte
  5. Choisis la position : Centré horizontalement ou Libre (déplaçable librement)
  6. Clique sur Ajouter le texte
Si tu choisis "Libre (déplaçable)", tu pourras ensuite faire glisser ton texte n'importe où sur la frise.

7. Modifier un élément

Méthode 1 : Cliquer sur la carte dans la frise

  1. Clique directement sur la carte (ou la barre de période) dans la frise centrale
  2. L'élément est sélectionné — un cadre blanc apparaît autour
  3. Le formulaire dans le panneau gauche se remplit automatiquement
  4. Modifie ce que tu veux, puis clique sur ✎ Enregistrer les modifications

Méthode 2 : Bouton ✎ dans le panneau droit

  1. Dans le panneau droit, trouve l'élément dans la liste
  2. Clique sur le bouton (crayon) à droite de son nom
  3. Le formulaire se remplit dans le panneau gauche
  4. Modifie puis clique sur ✎ Enregistrer les modifications
Pour annuler une modification en cours, clique sur Annuler l'édition.

🖐️8. Déplacer les éléments

Tu peux déplacer les cartes d'événements, les cartes de périodes et les textes libres par glisser-déposer.

  1. Place ton curseur sur la carte à déplacer
  2. Clique et maintiens le bouton gauche de la souris enfoncé
  3. Fais glisser la carte vers l'endroit souhaité
  4. Relâche le bouton
Pour les événements : si tu déplaces une carte au-dessus de l'axe, elle passe en mode "au-dessus". En dessous, elle passe en mode "en-dessous". Tu peux aussi changer de voie pour éviter les chevauchements.

↔️9. Redimensionner les cartes

Redimensionner une carte d'événement

  1. Clique sur la carte pour la sélectionner
  2. Repère le petit carré coloré dans le coin bas-droit de la carte
  3. Clique et fais glisser : vers la droite pour élargir, vers le bas pour allonger

Redimensionner un texte libre

  1. Clique sur le texte pour le sélectionner
  2. Repère le petit carré à droite du texte
  3. Fais-le glisser horizontalement pour changer la largeur (le texte revient à la ligne automatiquement)

✂️10. Ruptures de frise

Une rupture temporelle te permet de "sauter" une longue période sans événements importants. Elle est représentée par des barres obliques (///) sur l'axe. Cela rend la frise plus lisible en économisant de la place.

Exemple : ta frise va de 1200 à 2000, mais rien d'important ne se passe entre 1400 et 1700 — tu crées une rupture pour compresser cette période.

Ajouter une rupture

  1. Dans le panneau gauche, repère la zone Ruptures temporelles
  2. Dans le champ "de", écris l'année de début (ex : 1400)
  3. Dans le champ "à", écris l'année de fin (ex : 1700)
  4. Clique sur le bouton +

Supprimer une rupture

Dans la liste des ruptures, clique sur le bouton à côté de la rupture à supprimer.

La rupture doit être à l'intérieur de la plage de dates de ta frise et avoir une date de début avant la date de fin.

🔍11. Zoomer et se déplacer

Boutons de zoom

Bouton −Dézoommer — voir plus de la frise
Bouton +Zoommer — voir plus de détails
Bouton ⊡Ajuster automatiquement pour voir toute la frise
Affichage 100%Indique le niveau de zoom actuel

Molette de la souris

Utilise la molette de ta souris sur la frise pour zoommer (vers le haut) ou dézoommer (vers le bas). Le zoom se fait autour de ta position de souris.

Se déplacer

  • Cliquer-glisser sur le fond vide : maintiens le bouton gauche sur une zone sans carte et fais glisser
  • Barre de défilement horizontale : la barre en bas de la zone de la frise

📋12. La liste des éléments

Le panneau droit liste tous les éléments de ta frise.

Actions disponibles

Clic sur un élémentSélectionne et ouvre le formulaire de modification
Bouton ✎Ouvre le formulaire de modification
Bouton ✕Supprime immédiatement l'élément
Bouton ▼/▶Masque ou affiche la liste
Les événements sont triés par ordre chronologique dans la liste. Pratique pour retrouver un événement rapidement !

💾13. Sauvegarder et ouvrir un fichier

Sauvegarder ta frise

  1. Clique sur le bouton Sauvegarder dans la barre du haut
  2. Ton navigateur télécharge automatiquement un fichier .json
  3. Le fichier s'appelle frise-[nom-de-ta-frise].json — garde-le précieusement !

Ouvrir une frise sauvegardée

  1. Clique sur Ouvrir dans la barre du haut
  2. Dans la fenêtre de sélection, navigue jusqu'à ton fichier .json
  3. Sélectionne le fichier — ta frise se charge automatiquement
Pense à sauvegarder régulièrement ! Si tu fermes la page sans sauvegarder, ton travail sera perdu.

📤14. Exporter ta frise

Clique sur le bouton Exporter (bleu, en haut à droite) pour accéder aux options d'export.

📄 PDF

Idéal pour imprimer ou remettre à ton professeur. Format configurable (A4, A3) dans les Paramètres. Rendu haute résolution.

🗜️ ZIP

Archive contenant le fichier JSON et toutes les images intégrées. Parfait pour partager ta frise complète.

📊 JSON KnightLab

Format compatible avec Timeline JS pour afficher ta frise sur un site web. Utile si ton professeur dispose d'un site.

📐 Draw.io XML

Exporte ta frise vers le logiciel Draw.io pour une retouche graphique avancée de chaque élément.

🔧15. Paramètres

Clique sur Paramètres ⚙️ dans la barre du haut pour ouvrir la fenêtre de réglages.

Thème et affichage

Thème Sombre / ClairFond noir ou fond blanc selon tes préférences
GrilleAffiche ou masque les lignes verticales
Pas de grilleEspacement des lignes : auto, 1, 5, 10, 25, 50 ou 100 ans
Labels de datesAffiche ou masque les dates sur l'axe

Format de saisie et polices

Format de dateFrançais ("20 juillet 1969"), Numérique ("20/07/1969") ou ISO ("1969-07-20")
Taille titre des cartes9 à 14 pixels
Taille description8 à 11 pixels
Taille labels d'axe8 à 11 pixels
Format PDFA4 Paysage, A4 Portrait ou A3 Paysage
Marge PDF (mm)De 0 à 30 mm autour de la frise dans le PDF

⌨️16. Astuces et raccourcis clavier

Raccourcis clavier

Touche Action
Suppr ou Delete Supprime l'élément sélectionné (le cadre blanc doit être visible)
Échap ou Escape Désélectionne l'élément actuel (le cadre blanc disparaît)

Conseils et astuces

Sauvegarde souvent ! Après chaque session de travail, clique sur Sauvegarder pour ne rien perdre.
Utilise la position "Automatique" pour les événements. Le logiciel les place intelligemment pour éviter les chevauchements.
Couleurs cohérentes : utilise la même couleur pour les événements d'un même thème (ex : bleu = politique, vert = économie, rouge = guerre).
Si ta frise est trop chargée à l'écran, utilise le bouton ⊡ pour ajuster le zoom automatiquement.
Dans les descriptions, le Markdown te permet d'écrire en gras (**texte**) ou en italique (*texte*).

🎓17. Exemples de sujets pour une frise

📚 Histoire

  • La Révolution française (1789–1799)
  • La Première Guerre mondiale (1914–1918)
  • La Deuxième Guerre mondiale (1939–1945)
  • L'histoire de l'informatique (1940–2024)
  • Les grandes découvertes (1450–1550)
  • L'Empire romain
  • L'Égypte ancienne

🔬 Sciences

  • Les grandes découvertes scientifiques
  • La conquête spatiale (1957–aujourd'hui)
  • L'histoire de la médecine
  • Les grandes inventions
  • Les théories de l'évolution

🌍 Géographie & environnement

  • Les grandes explorations maritimes
  • L'évolution du climat
  • Les grandes catastrophes naturelles
  • L'histoire d'un pays ou d'une région

📖 Littérature & culture

  • Les périodes littéraires françaises
  • La vie d'un auteur (Hugo, Molière…)
  • L'histoire du cinéma
  • L'évolution de la musique
  • Ma propre biographie !