Interface de Création : Le Canva

Le canva est l'interface visuelle qui vous permet de créer et modifier vos scénarios en assemblant des blocs logiques. Cette approche intuitive rend la création d'automatisations complexes accessible à tous.

Accéder au Canva

Le canva s'ouvre automatiquement lorsque vous :

1. Créez un nouveau scénario depuis l'onglet Scénario
2. Éditez un scénario existant en cliquant sur le bouton d'édition

Présentation de l'Interface

L'interface du canva se compose de plusieurs zones :

1. Barre d'outils supérieure

En haut de l'écran, vous trouverez :

• Nom du scénario : Cliquez dessus pour le renommer
• Bouton Enregistrer : Sauvegarde vos modifications dans la base de données
• Bouton Importer : Importe un scénario depuis un fichier
• Bouton Exporter : Exporte le scénario actuel vers un fichier
• Bouton Fermer : Quitte le canva (avec confirmation si non enregistré)

2. Palette de blocs

Sur le côté gauche, la palette contient tous les blocs disponibles, organisés en deux onglets :

Onglet "Logiques"

Contient les 7 blocs logiques fondamentaux :

• SI : Condition logique
• ET : Opérateur logique ET
• OU : Opérateur logique OU
• ACTION : Action à exécuter
• TIMER : Délai temporel
• PARAMÈTRE : Paramètre variable
• ALERTE : Alerte de notification

Onglet "Capteurs"

Affiche dynamiquement tous les capteurs de votre équipement :

• Entrées digitales : États ON/OFF
• Entrées analogiques : Valeurs mesurées
• Entrées PT1000 : Sondes de température
• Sorties digitales : Commandes ON/OFF
• Sorties analogiques : Valeurs de sortie

3. Zone de travail (Canva)

Au centre, la zone de travail où vous assemblez vos blocs pour créer la logique du scénario.

4. Panneau de propriétés

Sur le côté droit, le panneau affiche les propriétés du bloc sélectionné, vous permettant de configurer ses paramètres.

Renommer un Scénario

Pour renommer votre scénario :

1. Cliquez sur le nom du scénario en haut de l'interface
2. Le champ devient éditable
3. Saisissez le nouveau nom
4. Appuyez sur Entrée ou cliquez en dehors du champ pour valider
5. Le nom est mis à jour immédiatement

Astuce

Vous pouvez renommer un scénario à tout moment, même sans enregistrer les autres modifications. Le nom est sauvegardé séparément.

Les Blocs Disponibles

Votre scénario utilise deux catégories de blocs : les blocs logiques et les blocs capteurs.

🔷 Blocs Logiques

Les blocs logiques constituent la structure de votre scénario. Ils définissent les conditions, les actions et le flux d'exécution.

Bloc "SI" (Condition)

• Fonction : Définit une condition qui doit être vérifiée pour exécuter des actions
• Configuration :
  • Sélectionnez un capteur (entrée ou sortie)
  • Choisissez un opérateur de comparaison (=, ≠, >, <, ≥, ≤, entre, contient, etc.)
  • Définissez la ou les valeurs à comparer
  • Possibilité d'utiliser un paramètre variable au lieu d'une valeur fixe
• Exemple : Si température > 25°C

Opérateurs disponibles :

• Égal / Différent de
• Supérieur à / Inférieur à
• Supérieur ou égal / Inférieur ou égal
• Entre / Pas entre (nécessite deux valeurs)
• Contient / Ne contient pas
• Commence par / Se termine par
• Est vide / N'est pas vide

Bloc "ET" (Opérateur logique)

• Fonction : Combine plusieurs conditions - toutes doivent être vraies
• Configuration : Nombre d'entrées dynamique (2 à 5 conditions possibles)
• Exemple : Température > 25°C ET Luminosité < 50 lux

Bloc "OU" (Opérateur logique)

• Fonction : Combine plusieurs conditions - au moins une doit être vraie
• Configuration : Nombre d'entrées dynamique (2 à 5 conditions possibles)
• Exemple : Mouvement détecté OU Porte ouverte

Bloc "ACTION"

• Fonction : Exécute une action sur une sortie
• Configuration :
  • Sélectionnez une sortie (digitale ou analogique)
  • Type d'action : Activer (ON), Désactiver (OFF) ou Définir une valeur
  • Pour les sorties analogiques : définir la valeur à appliquer
  • Possibilité de définir une durée pour les actions temporisées
• Exemple : Activer la sortie 1, Régler la sortie analogique 2 à 50%

Types d'actions :

• SET_ON : Activer une sortie digitale
• SET_OFF : Désactiver une sortie digitale
• SET_VALUE : Définir une valeur pour une sortie analogique

Bloc "TIMER" (Délai temporel)

• Fonction : Ajoute un délai avant d'exécuter l'action suivante
• Configuration :
  • Durée du délai
  • Unité de temps : secondes, minutes ou heures
• Exemple : Attendre 5 minutes avant d'exécuter l'action

Bloc "PARAMÈTRE" (Variable)

• Fonction : Définit un paramètre réutilisable dans tout le scénario
• Configuration :
  • Nom du paramètre
  • Valeur par défaut
  • Description (optionnelle)
• Utilisation : Les paramètres peuvent être utilisés dans les conditions et les actions au lieu de valeurs fixes
• Exemple : Créer un paramètre "Température de consigne" = 21°C

Avantage des paramètres

Les paramètres permettent de modifier facilement les valeurs du scénario sans avoir à éditer chaque bloc individuellement. Parfait pour des seuils ou valeurs qui changent régulièrement.

Bloc "ALERTE" (Notification)

• Fonction : Envoie une alerte/notification
• Configuration :
  • Type d'alerte : Email ou SMS
  • Liste des destinataires
  • Message personnalisé
• Exemple : Envoyer un email à admin@exemple.com avec "Température critique atteinte"

🔌 Blocs Capteurs

Les blocs capteurs représentent les entrées et sorties physiques de votre équipement. Ils sont générés automatiquement en fonction de votre configuration matérielle.

Entrées Digitales

• Fonction : Représentent des capteurs tout ou rien (ON/OFF)
• État : Booléen (Actif/Inactif)
• Exemples : Détecteur de présence, interrupteur, contact de porte
• Icône : 🔘 Toggle

Entrées Analogiques

• Fonction : Mesurent des valeurs continues
• État : Valeur numérique avec unité de mesure
• Exemples : Capteur de luminosité (lux), capteur d'humidité (%), capteur de pression (bar)
• Icône : ⚡ Speedometer
• Configuration : Min/Max configurables selon le type de capteur

Entrées PT1000 (Sondes de température)

• Fonction : Mesurent la température avec haute précision
• État : Valeur en °C
• Exemples : Sonde de température ambiante, sonde de chauffage
• Icône : 🌡️ Thermometer
• Précision : Affichage avec 1 décimale

Sorties Digitales

• Fonction : Contrôlent des équipements tout ou rien
• État : Booléen (ON/OFF)
• Exemples : Relais, électrovanne, contacteur
• Icône : ⚡ Power
• Actions possibles : Activer, Désactiver

Sorties Analogiques

• Fonction : Contrôlent des équipements à variation continue
• État : Valeur numérique avec unité
• Exemples : Variateur de vitesse, vanne proportionnelle, gradateur
• Icône : 🎚️ Sliders
• Actions possibles : Définir une valeur précise (0-100%, 0-10V, 4-20mA selon configuration)

Données en temps réel

Les blocs capteurs affichent les valeurs en temps réel lorsque votre équipement est connecté. Un indicateur WiFi apparaît dans l'onglet "Capteurs" quand les données temps réel sont actives.

Utiliser les Blocs

Changer d'onglet dans la palette

La palette propose deux onglets que vous pouvez alterner :

1. Onglet "Logiques" : Accédez aux 7 blocs logiques fondamentaux
2. Onglet "Capteurs" : Visualisez tous les capteurs de votre équipement en temps réel

Indicateur temps réel : Quand l'équipement est connecté, un badge WiFi 📶 apparaît sur l'onglet "Capteurs" pour confirmer que les valeurs affichées sont en temps réel.

Ajouter un bloc logique au canva

1. Cliquez sur l'onglet "Logiques" dans la palette
2. Trouvez le bloc souhaité (SI, ET, OU, ACTION, TIMER, PARAMÈTRE, ALERTE)
3. Glissez-déposez le bloc sur la zone de travail
4. Le bloc apparaît et peut être positionné librement

Ajouter un bloc capteur au canva

1. Cliquez sur l'onglet "Capteurs" dans la palette
2. La liste affiche tous vos capteurs avec leurs valeurs actuelles
3. Trouvez le capteur souhaité (ex: "Température Salon - 22.5°C")
4. Glissez-déposez le capteur sur la zone de travail
5. Le bloc capteur apparaît avec ses informations

Valeurs en temps réel

Les blocs capteurs dans la palette affichent leurs valeurs en temps réel quand l'équipement est connecté. Cela vous aide à choisir les bons capteurs et à définir des seuils pertinents.

Connecter les blocs

1. Cliquez sur le point de connexion d'un bloc (petit cercle)
2. Maintenez et glissez vers le point de connexion d'un autre bloc
3. Une ligne de connexion apparaît
4. Relâchez pour créer la connexion

Types de connexions

• Entrée/Sortie : Définit le flux d'exécution du scénario
• Données : Transmet des valeurs entre blocs
• Les connexions sont colorées selon leur type

Configurer un bloc

La configuration dépend du type de bloc sélectionné :

Configurer un bloc "SI" (Condition)

1. Sélectionnez le bloc en cliquant dessus
2. Le panneau de propriétés s'affiche à droite
3. Choisissez le type d'entrée/sortie (digital input, analog input, PT1000, etc.)
4. Sélectionnez l'index du capteur
5. Choisissez l'opérateur (=, ≠, >, <, ≥, ≤, entre, etc.)
6. Définissez la valeur de comparaison (fixe ou paramètre)
7. Pour l'opérateur "entre", définissez également la seconde valeur

Configurer un bloc "ACTION"

1. Sélectionnez le type de sortie (digital ou analog output)
2. Choisissez l'index de la sortie
3. Sélectionnez le type d'action :
   • SET_ON : Activer (pour sorties digitales)
   • SET_OFF : Désactiver (pour sorties digitales)
   • SET_VALUE : Définir une valeur (pour sorties analogiques)
4. Pour SET_VALUE, définissez la valeur à appliquer
5. Optionnel : Définissez une durée pour une action temporisée

Configurer un bloc "PARAMÈTRE"

1. Entrez le nom du paramètre (ex: "Température de consigne")
2. Définissez la valeur par défaut
3. Ajoutez une description (optionnelle mais recommandée)

Configurer un bloc "TIMER"

1. Entrez la durée du délai
2. Sélectionnez l'unité : secondes, minutes ou heures

Configurer un bloc "ALERTE"

1. Choisissez le type : Email ou SMS
2. Ajoutez la liste des destinataires (adresses email ou numéros de téléphone)
3. Rédigez le message de l'alerte

Configurer un bloc "ET" ou "OU"

1. Définissez le nombre d'entrées (de 2 à 5)
2. Connectez les conditions aux différentes entrées

Supprimer un bloc

1. Sélectionnez le bloc à supprimer
2. Appuyez sur la touche Suppr ou Delete
3. Ou cliquez sur l'icône poubelle du bloc
4. Le bloc et ses connexions sont supprimés

Dupliquer un bloc

1. Sélectionnez le bloc à dupliquer
2. Utilisez Ctrl+D (ou Cmd+D sur Mac)
3. Ou cliquez sur l'icône dupliquer du bloc
4. Un nouveau bloc identique apparaît à côté

Navigation dans le Canva

Zoom

• Molette de la souris : Zoom avant/arrière
• Ctrl + Molette : Zoom plus précis
• Boutons +/- : En haut à droite du canva
• Ctrl+0 : Réinitialiser le zoom à 100%

Déplacement

• Clic droit + glisser : Déplace la vue du canva
• Barre d'espace + glisser : Alternative pour déplacer la vue
• Minimap : En bas à droite pour une vue d'ensemble

Importer un Scénario

L'importation permet de charger un scénario depuis un fichier (partagé par quelqu'un ou sauvegardé précédemment).

1. Cliquez sur le bouton "Importer"
2. Sélectionnez le fichier du scénario (.json ou .scenario)
3. Le scénario est chargé dans le canva
4. Vérifiez et modifiez si nécessaire
5. Enregistrez pour sauvegarder dans la base de données

Attention à l'importation

L'importation remplace le scénario actuel dans le canva. Si vous avez des modifications non enregistrées, elles seront perdues (après confirmation).

Exporter un Scénario

L'exportation permet de sauvegarder un scénario dans un fichier, utile pour :

• Partager un scénario avec d'autres utilisateurs
• Sauvegarder un scénario avant de le modifier
• Réutiliser un scénario sur un autre équipement
• Archiver des configurations

Pour exporter :

1. Cliquez sur le bouton "Exporter"
2. Choisissez l'emplacement de sauvegarde
3. Donnez un nom au fichier
4. Le fichier est créé au format .json ou .scenario

Partage de scénarios

Vous pouvez créer une bibliothèque de scénarios types et les partager avec votre équipe ou la communauté !

Enregistrer un Scénario

L'enregistrement sauvegarde votre scénario dans la base de données.

Enregistrement simple

1. Cliquez sur le bouton "Enregistrer"
2. Le scénario est sauvegardé dans la BDD
3. Un message de confirmation apparaît
4. Le scénario n'est pas encore dans l'équipement (nécessite une synchronisation)

Enregistrement avec validation

Avant d'enregistrer, le système vérifie :

✅ Cohérence de la logique : Les blocs sont correctement connectés ✅ Configuration complète : Tous les paramètres obligatoires sont renseignés ✅ Pas de boucles infinies : La logique ne crée pas de cycles ✅ Compatibilité équipement : L'équipement supporte toutes les actions ✅ Validité des capteurs : Les entrées/sorties référencées existent sur l'équipement ✅ Types d'IO cohérents : Les actions correspondent aux types de sorties (ex: pas de SET_VALUE sur sortie digitale)

En cas d'erreur de validation

Si des erreurs sont détectées :

1. Un panneau d'erreurs s'affiche
2. Les blocs problématiques sont surlignés en rouge
3. Cliquez sur une erreur pour naviguer vers le bloc concerné
4. Corrigez les erreurs
5. Réessayez d'enregistrer

Auto-sauvegarde

Le canva sauvegarde automatiquement un brouillon local toutes les minutes. En cas de fermeture accidentelle, vous pourrez récupérer votre travail.

Conditions Complexes

Vous pouvez créer des scénarios très sophistiqués en combinant plusieurs blocs :

Exemple 1 : Éclairage intelligent

Scénario : Allumer automatiquement la lumière quand il fait sombre et qu'il y a du mouvement

Composition :

• Bloc SI : Capteur de luminosité < 50 lux
• Bloc ET : Opérateur logique
• Bloc SI : Détecteur de mouvement = ON
• Bloc ACTION : Activer Sortie lumière (ON)
• Bloc TIMER : Attendre 5 minutes
• Bloc SI : Détecteur de mouvement = OFF
• Bloc ACTION : Désactiver Sortie lumière (OFF)

Exemple 2 : Gestion du chauffage avec paramètre

Scénario : Réguler le chauffage selon la température avec une consigne variable

Composition :

• Bloc PARAMÈTRE : "Température de consigne" = 21°C
• Bloc SI : Sonde PT1000 < Paramètre "Température de consigne"
• Bloc ACTION : Activer chauffage (ON)
• (Branche SINON)
• Bloc SI : Sonde PT1000 > (Paramètre + 1°C)
• Bloc ACTION : Désactiver chauffage (OFF)

Exemple 3 : Alerte température avec notification

Scénario : Envoyer une alerte si la température dépasse un seuil critique

Composition :

• Bloc SI : Sonde PT1000 > 30°C
• Bloc ALERTE : Email à admin@exemple.com - "Température critique : dépassement de 30°C"
• Bloc ACTION : Activer ventilation (ON)
• Bloc TIMER : Attendre 10 secondes
• Bloc SI : Sonde PT1000 > 35°C
• Bloc ALERTE : SMS au responsable - "URGENT : Température > 35°C"

Exemple 4 : Logique OU avec plusieurs capteurs

Scénario : Activer l'alarme si une porte ou une fenêtre s'ouvre

Composition :

• Bloc SI : Capteur porte = ON
• Bloc OU : Opérateur logique
• Bloc SI : Capteur fenêtre = ON
• Bloc OU : Opérateur logique (pour ajouter plus de capteurs)
• Bloc SI : Capteur fenêtre 2 = ON
• Bloc ACTION : Activer alarme (ON)
• Bloc ALERTE : SMS - "Intrusion détectée"

Construction progressive

Commencez par un scénario simple avec 2-3 blocs, testez-le, puis ajoutez progressivement des conditions et actions supplémentaires. C'est plus facile à déboguer !

Raccourcis Clavier

Pour gagner du temps :

Raccourci	Action
Ctrl+S	Enregistrer le scénario
Ctrl+Z	Annuler
Ctrl+Y	Rétablir
Ctrl+C	Copier le bloc sélectionné
Ctrl+V	Coller le bloc
Ctrl+D	Dupliquer le bloc
Suppr	Supprimer le bloc sélectionné
Ctrl+0	Réinitialiser le zoom
Ctrl+F	Rechercher un bloc
Échap	Désélectionner

Bonnes Pratiques

Pour créer des scénarios efficaces :

✅ Testez progressivement : Commencez simple puis ajoutez de la complexité ✅ Utilisez des paramètres : Pour les valeurs qui peuvent changer (seuils, consignes) ✅ Organisez visuellement : Alignez les blocs pour une meilleure lisibilité ✅ Nommez clairement : Donnez des noms explicites aux paramètres et scénarios ✅ Surveillez les valeurs temps réel : Utilisez l'onglet Capteurs pour voir les états actuels ✅ Validez régulièrement : Enregistrez souvent pour vérifier la cohérence ✅ Exportez les scénarios importants : Gardez une copie de sauvegarde ✅ Limitez les opérateurs ET/OU : Maximum 5 entrées pour garder la logique lisible ✅ Utilisez les TIMER judicieusement : Évitez des délais trop longs qui bloquent l'exécution

---

Prochaine étape

Maintenant que vous maîtrisez la création de scénarios, apprenez à les synchroniser avec votre équipement : Synchronisation avec l'équipement