Canvas
Le Canvas est un espace illimité où vous placez librement notes, formes, images, flèches, dessins et bien plus. C’est l’outil le plus polyvalent de H-Board, idéal pour le brainstorming, le mind mapping, les schémas d’architecture, les moodboards ou les ateliers collaboratifs.
📷 [IMAGE — Canvas complet] Capture d’un Canvas riche : notes colorées, formes, flèches, images, colonnes, dessin libre
1. Découvrir l’interface
Section titled “1. Découvrir l’interface”📷 [IMAGE — Layout général du Canvas] Capture annotée : zone centrale infinie, toolbar en bas, header en haut, mini-carte en bas-droite
| Zone | Contenu |
|---|---|
| En-tête | Nom du projet, breadcrumb (si sous-tableau), avatars des collaborateurs, bouton partager, bouton export |
| Zone centrale | Espace infini où vous placez vos éléments. Pannable et zoomable |
| Barre d’outils (bas-centre) | Outils de création groupés en 3 catégories |
| Panneau de personnalisation (à droite) | Apparaît quand un élément est sélectionné, ou en mode dessin |
| Mini-carte (bas-droite) | Vue d’ensemble avec rectangle de viewport |
| Boutons annexes (bas-droite) | Recentrer, plein écran, grille, annuler/refaire |
Tous les outils de création disparaissent si vous êtes un utilisateur lecture seule — seule la navigation reste disponible.
2. Se déplacer dans le Canvas
Section titled “2. Se déplacer dans le Canvas”L’espace est infini : vous pouvez créer des éléments aussi loin que vous le souhaitez de l’origine.
Pan (déplacement de la vue)
Section titled “Pan (déplacement de la vue)”| Action | Comment |
|---|---|
| Glisser le fond | Cliquez sur le vide et glissez |
| Barre d’espace + glisser | Maintenir Espace puis cliquer/glisser n’importe où |
| Scrollbars | Visibles en bas et à droite, draggables |
| Action | Comment |
|---|---|
| Molette | Roulez la molette de la souris pour zoomer/dézoomer |
| Boutons zoom | Cliquez sur le pourcentage de zoom pour le menu (préréglages) |
| Limites | De 10 % à 500 % |
Recentrer
Section titled “Recentrer”Cliquez sur le bouton Recentrer (icône flèche circulaire) en bas à droite : la vue revient à 100 % et se centre sur le contenu.
🎥 [VIDÉO — Pan / Zoom / Recentrer] Démo : déplacement avec espace, zoom à la molette, clic sur recentrer
Mini-carte
Section titled “Mini-carte”Cliquez sur l’icône carte pour afficher la mini-carte : un rectangle bleu indique votre zone visible. Glissez ce rectangle pour vous déplacer rapidement dans un grand Canvas.
📷 [IMAGE — Mini-carte] Gros plan de la mini-carte avec le rectangle de viewport et plusieurs éléments colorés
Plein écran
Section titled “Plein écran”Cliquez sur le bouton plein écran (icône expand) en bas à droite pour
basculer en mode immersif (l’interface du navigateur disparaît).
Recliquez ou appuyez sur Escape pour revenir.
3. La barre d’outils
Section titled “3. La barre d’outils”La toolbar flottante est positionnée en bas-centre. Elle se divise en trois groupes séparés par des séparateurs visuels.
📷 [IMAGE — Barre d’outils annotée] Capture horizontale de la toolbar avec annotations pour chaque groupe et chaque icône
Groupe 1 — Contenu
Section titled “Groupe 1 — Contenu”Pour ajouter du texte, des médias et du contenu structuré.
| Outil | Raccourci | Description |
|---|---|---|
| Note | N | Carte de texte enrichi avec fond coloré |
| Texte | E | Texte libre sans fond ni bordure (titres, annotations) |
| Image | I | Image importée depuis votre ordinateur |
| Lien | U | Aperçu d’une URL avec favicon |
| Fichier | F | Fichier téléchargeable attaché |
| Tâches | T | Liste de cases à cocher avec barre de progression |
Groupe 2 — Structures
Section titled “Groupe 2 — Structures”Pour organiser le Canvas et créer une hiérarchie.
| Outil | Raccourci | Description |
|---|---|---|
| Colonne | C | Conteneur pour regrouper plusieurs éléments |
| Tableau | G | Petit tableau de données avec colonnes typées |
| Canvas (lien) | B | Lien vers un sous-Canvas |
| Kanban (lien) | K | Lien vers un sous-Kanban |
| Page (lien) | P | Lien vers une sous-Page |
Groupe 3 — Dessin et connecteurs
Section titled “Groupe 3 — Dessin et connecteurs”Pour relier visuellement et annoter à main levée.
| Outil | Raccourci | Description |
|---|---|---|
| Forme | H | Rectangle, cercle, triangle ou étoile |
| Ligne | L | Trait droit avec options de style |
| Flèche | A | Connecteur intelligent entre deux éléments |
| Dessin | D | Mode pinceau à main levée |
💡 Les modes Flèche et Dessin sont des bascules : tant qu’ils sont activés, votre curseur change et chaque clic/trait crée un élément. Appuyez sur la touche correspondante (ou sur
Escape) pour quitter le mode.
4. Tous les types d’éléments
Section titled “4. Tous les types d’éléments”Une carte de texte avec fond coloré. Le format de base est de 300 × 200 pixels mais s’adapte automatiquement au contenu.
- Créer :
Nou clic sur l’outil Note - Éditer : double-cliquez pour entrer en mode édition, tapez votre texte
- Formater : la barre d’édition apparaît au-dessus de la note (gras, italique, couleurs, listes, liens, blocs de code, etc.)
- Personnaliser : couleur de fond via le panneau latéral droit
📷 [IMAGE — Note avec barre de formatage] Gros plan d’une note en édition avec menu flottant de formatage visible
Variante de la Note sans fond ni bordure. Idéal pour :
- Des titres flottants dans le Canvas
- Des annotations ou commentaires libres
- Des étiquettes attachées à un schéma
Créer : E. Le même éditeur riche que la Note est disponible.
Une zone qui affiche une image.
- Créer :
Iou drag-drop directement depuis votre explorateur - Importer : cliquez sur la zone vide ou glissez-déposez. Formats
acceptés : tous les formats image (
image/*). Taille max : 20 Mo avant compression - Compression : les images sont automatiquement converties en WebP (qualité 80 %, max 1920 × 1920) pour réduire la taille
- Lightbox : double-cliquez sur une image pour l’agrandir en plein
écran (
Escapeou clic pour fermer) - Personnaliser : couleur de fond et arrondi des coins
🎥 [VIDÉO — Drag-drop d’une image] Démo : glisser une image depuis l’explorateur de fichiers vers le Canvas
Affiche un aperçu d’une URL avec son favicon.
- Créer :
U - Configurer : ouvrez le panneau latéral pour saisir l’URL et un titre (optionnel). Le favicon est récupéré automatiquement
- Ouvrir : clic sur l’icône externe → ouvre l’URL dans un nouvel onglet
Fichier
Section titled “Fichier”Un fichier téléchargeable attaché à votre Canvas.
- Créer :
F - Ajouter : cliquez sur la zone pour ouvrir le sélecteur de fichier. Un icône-type s’affiche (PDF, Word, image, etc.)
- Télécharger : clic sur l’élément → le fichier est téléchargé par les utilisateurs autorisés
Tâches (Todo)
Section titled “Tâches (Todo)”Une liste de cases à cocher avec progression.
- Créer :
T - Ajouter une tâche : bouton + en bas de la liste
- Cocher : clic sur la case
- Éditer un libellé : double-clic
- Réorganiser : glissez l’icône de poignée à gauche de chaque tâche
- Supprimer une tâche : icône poubelle à droite
- Barre de progression : automatique, affichée en haut (X / Y cochées)
📷 [IMAGE — Élément Tâches] Capture d’une liste Todo avec 5 tâches dont 3 cochées et barre de progression à 60 %
Colonne
Section titled “Colonne”Un conteneur vertical qui regroupe d’autres éléments. Largeur fixe (350 px), hauteur variable.
- Créer :
C - Y placer des éléments : glissez-déposez des éléments dedans — ils deviennent enfants de la colonne
- Déplacer la colonne : tous ses enfants suivent automatiquement
- Replier : flèche en haut pour cacher visuellement les enfants
- Titre : éditable en haut de la colonne
Les colonnes sont la manière de grouper des éléments dans un Canvas.
Tableau
Section titled “Tableau”Une grille éditable (à ne pas confondre avec le projet de type Database).
- Créer :
G. Crée un tableau 3 colonnes / 4 lignes par défaut - Types de colonnes : texte, nombre, case à cocher, date, liste déroulante
- Éditer une cellule : clic
- Ajouter / supprimer ligne ou colonne : clic droit dans le tableau, ou panneau latéral
- Redimensionner une colonne : glissez sa bordure
📷 [IMAGE — Tableau Canvas] Capture d’un tableau avec colonnes typées (texte, dates, cases à cocher)
Rectangle, cercle, triangle ou étoile.
- Créer :
H - Choisir le type : panneau latéral
- Personnaliser : couleur de fond, couleur et épaisseur de bordure
- Redimensionner : poignées aux coins (sans contrainte de ratio)
Un trait droit, avec ou sans tête de flèche.
- Créer :
L. Crée une ligne horizontale par défaut - Étirer : glissez les extrémités
- Label : double-clic pour ajouter un texte sur la ligne
- Style : solide, pointillée ou en tirets (panneau latéral)
- Flèches : activer/désactiver les têtes au début ou à la fin
- Connexion : si vous étirez l’extrémité sur un élément, la ligne s’y rattache visuellement
Flèche
Section titled “Flèche”Connecteur intelligent entre deux éléments. Voir la section dédiée.
Dessin
Section titled “Dessin”Tracé à main levée. Voir la section dédiée.
Sous-tableaux (Canvas / Kanban / Page)
Section titled “Sous-tableaux (Canvas / Kanban / Page)”Un lien cliquable vers un autre tableau. Voir la section dédiée.
5. Manipuler les éléments
Section titled “5. Manipuler les éléments”Sélection
Section titled “Sélection”| Action | Comment |
|---|---|
| Sélectionner | Clic sur l’élément |
| Sélection multiple | Ctrl (Cmd sur Mac) + clic pour ajouter ou retirer |
| Boîte de sélection | Glissez sur le vide → un rectangle entoure tout ce qu’il touche |
| Tout désélectionner | Clic sur le vide ou Escape |
Un liseré bleu entoure les éléments sélectionnés.
Déplacement
Section titled “Déplacement”- Glisser-déposer simple : maintenez et bougez
- Sélection multiple : tous les éléments sélectionnés se déplacent ensemble, en conservant leur disposition relative
- Snap à la grille : si la grille est activée (bouton en bas à droite), les éléments s’alignent automatiquement sur des pas de 8 pixels
Redimensionnement
Section titled “Redimensionnement”- Poignées de coin : carrés bleus aux 4 coins quand un élément est sélectionné
- Glissez une poignée pour redimensionner
- Limites : chaque type d’élément a des tailles minimales et maximales (par exemple, une Note ne peut pas être réduite en-dessous de 200 px de large)
🎥 [VIDÉO — Sélection multiple et déplacement] Démo : tracé d’un rectangle de sélection autour de 4 éléments, déplacement groupé, redimensionnement d’une note
Ordre de superposition (Z-index)
Section titled “Ordre de superposition (Z-index)”Faites un clic droit sur un élément pour ouvrir le menu contextuel :
| Commande | Effet |
|---|---|
| Mettre au premier plan | L’élément passe au-dessus de tous les autres |
| Avancer d’un niveau | Passe au-dessus de l’élément immédiatement supérieur |
| Reculer d’un niveau | Passe en-dessous de l’élément immédiatement inférieur |
| Mettre à l’arrière-plan | Passe en-dessous de tous les autres |
Si plusieurs éléments sont sélectionnés, leur ordre relatif est préservé.
Verrouillage
Section titled “Verrouillage”Un élément verrouillé ne peut plus être déplacé ni redimensionné, mais reste cliquable et lisible. Utile pour fixer un fond, un cadre ou une image de référence.
Supprimer
Section titled “Supprimer”- Sélectionnez l’élément, appuyez sur
Suppr(ouBackspace) - En sélection multiple, tout est supprimé d’un coup
Ctrl + Zannule la suppression
6. Le panneau de personnalisation
Section titled “6. Le panneau de personnalisation”Le panneau latéral apparaît dès que vous sélectionnez un élément, ou dès que vous activez le mode dessin.
📷 [IMAGE — Panneau de personnalisation] Capture du panneau ouvert sur une Note sélectionnée, avec options de couleur, fond, formatage
Selon le type d’élément sélectionné, vous trouverez :
| Type sélectionné | Options disponibles |
|---|---|
| Note | Couleur de fond + formatage texte (gras, italique, taille, couleur, alignement) |
| Texte | Formatage texte seul |
| Image | Couleur de fond, arrondi des coins |
| Forme | Fond, couleur et épaisseur de bordure, type (rectangle / cercle / triangle / étoile) |
| Colonne | Couleur de fond |
| Ligne | Style (solide / pointillé / tirets), épaisseur, couleur, flèches début/fin |
| Flèche | Ancrage début/fin (9 positions), type de tracé (droit / courbe / coude), têtes, animation, label |
| Lien | URL, titre, couleur de fond |
| Fichier | Couleur de fond |
| Sous-tableau | Couleur de fond, icône |
| Tâches | Couleur de fond |
| Tableau | Options des colonnes (alignement, type, valeurs de liste), style d’en-tête |
| Dessin (mode actif) | Pinceau (épaisseur, couleur), outil (pinceau / gomme) |
7. Connecter avec des flèches
Section titled “7. Connecter avec des flèches”Les flèches sont des connecteurs intelligents qui restent attachés à leurs éléments source et destination, même quand vous les déplacez.
🎥 [VIDÉO — Création d’une flèche] Démo : activation du mode flèche, hover sur élément (apparition des ancrages), clic source, clic destination, déplacement d’un élément (la flèche suit)
Tracer une flèche
Section titled “Tracer une flèche”- Activez le mode flèche :
Aou clic sur l’outil Flèche - Survolez l’élément de départ → 9 points d’ancrage apparaissent (4 côtés + 4 coins + centre)
- Cliquez sur le point d’ancrage souhaité
- Survolez l’élément d’arrivée → idem
- Cliquez sur le point d’ancrage de destination
- La flèche est créée et reste connectée
📷 [IMAGE — Points d’ancrage] Gros plan d’un élément survolé en mode flèche avec les 9 points visibles
Types de tracé
Section titled “Types de tracé”Sélectionnez la flèche puis ouvrez le panneau latéral :
- Droit : ligne directe d’un point à l’autre
- Courbe : courbe de Bézier élégante (recommandée pour les schémas conceptuels)
- Coudé : angles droits, type schéma d’organisation
Styles et apparence
Section titled “Styles et apparence”- Style de trait : solide, pointillé, tirets
- Couleur et épaisseur
- Têtes : début et fin indépendants (aucune, triangle, triangle plein, losange, cercle, barre)
- Animation : option animé pour un effet visuel de flux
- Label : double-cliquez sur la flèche pour ajouter un texte centré sur le tracé
📷 [IMAGE — Variantes de flèches] Capture présentant côte à côte 4 flèches : droite, courbe, coudée, animée
Changer un ancrage
Section titled “Changer un ancrage”- Drag direct : glissez l’extrémité de la flèche vers un autre point ou élément
- Panneau latéral : sélecteur des 9 positions pour chaque extrémité
Si l’élément lié est supprimé
Section titled “Si l’élément lié est supprimé”La flèche est automatiquement supprimée — vous n’avez pas à nettoyer manuellement les connecteurs orphelins.
8. Dessiner à main levée
Section titled “8. Dessiner à main levée”Le mode Dessin vous permet de tracer librement sur le Canvas, comme avec un stylo.
🎥 [VIDÉO — Dessin à main levée] Démo : activation mode dessin, choix d’épaisseur et couleur, tracé de cercles et flèches manuelles, gomme
Activer le mode
Section titled “Activer le mode”Appuyez sur D ou cliquez sur l’outil Dessin. Le curseur devient une
croix, et le panneau de personnalisation s’ouvre pour vous laisser
choisir :
- Outil : pinceau ou gomme
- Couleur
- Épaisseur
Tracer
Section titled “Tracer”Cliquez-glissez sur le Canvas pour tracer. Relâchez : votre tracé est enregistré comme un élément Dessin.
Tant que le mode est actif, vos clics ne sélectionnent pas les éléments existants — vous pouvez dessiner par-dessus sans les déplacer.
Continuer un dessin existant
Section titled “Continuer un dessin existant”Si un dessin est sélectionné quand vous tracez à nouveau, le nouveau trait s’ajoute au même élément. Cela permet d’enrichir progressivement une annotation sans empiler 50 éléments séparés.
Effacer
Section titled “Effacer”Basculez l’outil sur Gomme : passez sur les traits pour les effacer. La gomme découpe les tracés (un long trait coupé en deux devient deux dessins séparés).
Sortir du mode
Section titled “Sortir du mode”Appuyez sur D à nouveau ou sur Escape.
Manipuler un dessin une fois créé
Section titled “Manipuler un dessin une fois créé”- Déplacer : sélectionnez puis glissez (mode dessin désactivé)
- Redimensionner : poignées de coin — tous les points sont mis à l’échelle proportionnellement
9. Sous-tableaux et navigation
Section titled “9. Sous-tableaux et navigation”Le Canvas peut contenir des liens vers d’autres tableaux (Canvas, Kanban ou Page). C’est la manière de structurer un grand projet.
🖼️ [VISUEL — Hiérarchie de tableaux] Schéma arborescent : un Canvas principal “Projet” qui pointe vers sous-Kanban “Tâches”, sous-Canvas “Schémas archi”, sous-Page “Spec”
Créer un sous-tableau
Section titled “Créer un sous-tableau”| Raccourci | Type créé |
|---|---|
B | Sous-Canvas |
K | Sous-Kanban |
P | Sous-Page |
Une icône représentative est placée sur votre Canvas. Le nouveau tableau est vide et automatiquement rattaché au Canvas courant.
Naviguer vers un sous-tableau
Section titled “Naviguer vers un sous-tableau”Cliquez (ou double-cliquez) sur l’élément sous-tableau : vous êtes redirigé vers ce nouveau tableau.
Le fil d’Ariane (breadcrumb)
Section titled “Le fil d’Ariane (breadcrumb)”En haut de la page, un fil d’Ariane affiche votre position dans la hiérarchie :
Projet > Sous-Canvas > Détails architecture- Cliquez sur un parent pour y revenir
- Le dernier élément (votre position actuelle) n’est pas cliquable
📷 [IMAGE — Breadcrumb] Capture du haut de l’écran avec un breadcrumb à 3 niveaux et le dernier nœud surligné
Bonnes pratiques
Section titled “Bonnes pratiques”- Un Canvas principal qui sert de carte mentale, avec des sous-Canvas, sous-Kanban et sous-Page pour chaque grand axe
- Évitez d’aller au-delà de 3-4 niveaux d’imbrication (au-delà, naviguer devient pénible)
- Utilisez des noms explicites : le breadcrumb ne montre que les noms
10. Raccourcis clavier
Section titled “10. Raccourcis clavier”Création d’éléments
Section titled “Création d’éléments”| Touche | Action |
|---|---|
N | Nouvelle Note |
E | Nouveau Texte |
I | Nouvelle Image |
U | Nouveau Lien |
F | Nouveau Fichier |
T | Nouvelles Tâches |
C | Nouvelle Colonne |
G | Nouveau Tableau |
H | Nouvelle Forme |
L | Nouvelle Ligne |
B | Nouveau sous-Canvas |
K | Nouveau sous-Kanban |
P | Nouvelle sous-Page |
A | Activer / désactiver le mode Flèche |
D | Activer / désactiver le mode Dessin |
Sélection et manipulation
Section titled “Sélection et manipulation”| Raccourci | Action |
|---|---|
Ctrl + clic | Sélection multiple |
Suppr / Backspace | Supprimer la sélection |
Espace + glisser | Pan du Canvas |
Escape | Désélectionner / quitter un mode |
Annuler / refaire
Section titled “Annuler / refaire”| Raccourci | Action |
|---|---|
Ctrl + Z (Cmd + Z) | Annuler |
Ctrl + Y (Cmd + Y) | Refaire |
Édition de texte (dans une Note ou un Texte)
Section titled “Édition de texte (dans une Note ou un Texte)”| Raccourci | Action |
|---|---|
Ctrl + B | Gras |
Ctrl + I | Italique |
Ctrl + U | Souligné |
Enter | Nouvelle ligne |
Escape | Quitter l’édition |
💡 Les raccourcis de création ne fonctionnent pas si vous êtes en train d’éditer du texte — c’est normal, vos lettres iraient dans le texte au lieu de créer des éléments. Appuyez d’abord sur
Escapepour sortir de l’édition.
11. Annuler, refaire, supprimer
Section titled “11. Annuler, refaire, supprimer”H-Board enregistre vos actions dans un historique local au Canvas.
| Action | Raccourci | Bouton |
|---|---|---|
| Annuler | Ctrl + Z | Bouton ↶ en bas-droite |
| Refaire | Ctrl + Y | Bouton ↷ en bas-droite |
L’historique couvre :
- Création d’éléments
- Suppression
- Déplacement et redimensionnement
- Changement d’ordre (z-index)
- Modifications de contenu
⚠️ L’historique est local au Canvas et à votre session : il est effacé si vous rechargez la page. Pas de panique cependant — toutes vos modifications sont déjà enregistrées en continu sur le serveur.
12. Collaboration en temps réel
Section titled “12. Collaboration en temps réel”Quand plusieurs personnes ouvrent le même Canvas, vous travaillez simultanément sans risque de conflit.
🎥 [VIDÉO — Collaboration temps réel] Démo split-screen : deux navigateurs côte à côte, modifications visibles instantanément, curseurs et sélections colorés
Ce que vous voyez
Section titled “Ce que vous voyez”- Avatars des participants dans l’en-tête
- Curseurs distants : flèches colorées qui suivent les mouvements de souris des autres, avec leur nom
- Sélections distantes : un liseré coloré entoure ce que les autres sélectionnent — chaque utilisateur a sa propre couleur
- Modifications instantanées : les éléments créés/déplacés/édités par les autres apparaissent en temps réel
Indicateur de connexion
Section titled “Indicateur de connexion”Un petit indicateur en haut affiche l’état :
- 🟢 Connecté : tout va bien
- 🟡 Synchronisation… : envoi en cours
- 🔴 Hors ligne : connexion perdue (vos modifs locales seront poussées au retour)
Pas de conflit
Section titled “Pas de conflit”H-Board utilise une technologie de synchronisation (CRDT) qui fusionne automatiquement les modifications de chacun. Vous n’avez jamais à choisir entre “ma version” et “la sienne”.
13. Exporter un Canvas
Section titled “13. Exporter un Canvas”Vous pouvez exporter un Canvas pour le partager hors ligne ou l’archiver.
Procédure
Section titled “Procédure”- Cliquez sur le bouton Exporter dans l’en-tête (icône téléchargement)
- Choisissez le format
- Cliquez sur Télécharger
Formats disponibles
Section titled “Formats disponibles”| Format | Usage |
|---|---|
| PNG | Capture image du Canvas (pour insérer dans une présentation) |
| Rendu pages (impressions, archivage formel) | |
| JSON | Données brutes du projet (pour ré-importer plus tard, voir Premiers pas § Importer) |
📷 [IMAGE — Modal export] Capture du modal d’export avec choix de format et bouton Télécharger
Limites
Section titled “Limites”- L’export PNG/PDF capture l’état actuel du Canvas dans sa zone visible. Pour un très grand Canvas, faites plusieurs captures partielles
- Les éléments lourds (beaucoup d’images haute définition) allongent le temps d’export
- L’export JSON ne contient pas les partages, commentaires ni l’historique
14. Permissions sur un Canvas
Section titled “14. Permissions sur un Canvas”Selon votre rôle sur un Canvas partagé, les actions disponibles diffèrent :
| Action | Lecteur | Éditeur | Admin |
|---|---|---|---|
| Voir le contenu | ✓ | ✓ | ✓ |
| Naviguer (pan, zoom) | ✓ | ✓ | ✓ |
| Exporter | ✓ | ✓ | ✓ |
| Voir les curseurs et avatars | ✓ | ✓ | ✓ |
| Créer / déplacer / supprimer des éléments | ✗ | ✓ | ✓ |
| Modifier le contenu (texte, images…) | ✗ | ✓ | ✓ |
| Annuler / refaire | ✗ | ✓ | ✓ |
| Voir la barre d’outils | ✗ | ✓ | ✓ |
| Partager / gérer les membres | ✗ | ✗ | ✓ |
| Supprimer le Canvas | ✗ | ✗ | ✓ (et propriétaire) |
Si un élément spécifique est verrouillé (cadenas), même un Éditeur ne peut pas le bouger — il faut le déverrouiller d’abord.
Voir le guide Partage (à venir) pour la gestion des invitations et des rôles.
15. Astuces et bonnes pratiques
Section titled “15. Astuces et bonnes pratiques”Pour un Canvas lisible
Section titled “Pour un Canvas lisible”- Utilisez des couleurs pour signifier (rouge = urgent, vert = validé…) plutôt que pour décorer
- Groupez les éléments liés dans des colonnes : ils restent ensemble quand vous réorganisez
- Espacez suffisamment : un Canvas trop dense devient illisible. Préférez plusieurs sous-tableaux
Pour la performance
Section titled “Pour la performance”- Au-delà de 200 éléments sur un même Canvas, la fluidité commence à se dégrader. Découpez en sous-Canvas
- Les images lourdes sont compressées mais restent significatives — limitez aux essentielles
- Les dessins très longs (plusieurs centaines de points) sont simplifiés automatiquement, mais préférez des traits nets
Pour collaborer efficacement
Section titled “Pour collaborer efficacement”- Avant un atelier, partagez le Canvas et organisez l’espace : zones par thème, code couleur
- Pendant l’atelier, chacun voit les sélections des autres — utilisez cette indication pour ne pas se marcher sur les pieds
- Utilisez les flèches pour expliciter les liens entre idées : c’est plus clair que la proximité visuelle
Mind mapping
Section titled “Mind mapping”- Note centrale avec le sujet
- Sous-thèmes disposés en étoile, reliés par des flèches
- Couleurs différentes par branche
- Quand une branche devient riche, créez un sous-Canvas
🖼️ [VISUEL — Exemple de mind map] Schéma type d’une mind map H-Board : 1 note centrale, 5 branches colorées, sous-notes
Schéma d’architecture
Section titled “Schéma d’architecture”- Formes pour les composants (rectangles = services, cercles = utilisateurs)
- Flèches coudées entre composants
- Labels sur les flèches pour préciser le type de relation
- Couleurs par couche (front, back, base de données)
16. Questions fréquentes
Section titled “16. Questions fréquentes”Mes modifications sont-elles sauvegardées automatiquement ? Oui, en continu. Aucune action manuelle n’est requise.
Pourquoi ma barre d’outils n’apparaît-elle pas ? Vous êtes probablement en mode lecture seule. Vérifiez votre rôle dans le modal de partage. Si vous êtes le propriétaire et que la toolbar manque, rechargez la page.
Comment annuler mon dernier mouvement ?
Ctrl + Z (ou cliquez sur le bouton ↶ en bas-droite). Cela couvre
déplacements, suppressions, modifications.
Une flèche est restée en place alors que j’ai supprimé son élément cible, est-ce normal ? Non : les flèches sont supprimées automatiquement quand un de leurs éléments liés disparaît. Rechargez la page ; sinon contactez le support.
Puis-je copier-coller des éléments entre deux Canvas ? Cette fonctionnalité n’est pas disponible actuellement. Astuce : créez un sous-Canvas et déplacez les éléments dedans, ou exportez/réimportez le projet entier.
Comment commenter ou annoter sans modifier le contenu ? H-Board ne propose pas (encore) de fil de commentaires natif. Astuce : utilisez des Notes avec une couleur spécifique (par exemple jaune fluo) dédiées aux commentaires.
Mon Canvas est très lent, que faire ? Vérifiez le nombre d’éléments (au-delà de 200, prévoyez un découpage). Sinon : fermez les autres onglets gourmands, réduisez le zoom, ou créez des sous-Canvas pour réduire la charge visible.
Puis-je exporter une partie seulement du Canvas ? Pas directement. Astuce : zoomez/recentrez sur la zone voulue, prenez une capture d’écran de votre système, ou faites un export PNG après recadrage.
Les images uploadées sont-elles publiques ? Non. Elles sont stockées avec les mêmes restrictions d’accès que le Canvas — seuls les membres autorisés y ont accès.
Le mode plein écran ne fonctionne pas, pourquoi ?
Certains navigateurs (notamment en mode privé) bloquent l’API plein
écran. Essayez en mode normal, ou utilisez F11 du navigateur en
alternative.
Documentation H-Board v2 — Canvas · Juin 2026