M5Stack Dial : la télécommande tactile 100% locale pour Home Assistant

Le M5Stack Dial est un petit boîtier tactile équipé d'une puce ESP32-S3, d'un écran rond tactile de 1,28 pouce et d'une molette rotative particulièrement agréable à manipuler. Posé sur un meuble ou à côté de l'ordinateur, il devient une vraie télécommande physique pour Home Assistant : lumières, chauffage, volets, scènes... le tout piloté en local, sans dépendre du cloud.

Dans ce tutoriel, on installe ESPHome, on flashe le Dial avec la configuration que j'ai préparée, puis on active les entités une par une jusqu'à avoir un tableau de bord physique complet.

Le matériel

Le Dial embarque :

• un écran tactile rond ;
• une bague rotative ;
• un bouton poussoir caché sous l'écran ;
• un lecteur de badges RFID ;
• deux ports d'extension (non utilisés dans ce tutoriel).

Il s'alimente en USB-C, ou via le port supérieur avec une alimentation externe de 6 à 36 V. De quoi en faire un thermostat physique, un contrôleur de volume, un déclencheur de scènes, ou tout ça à la fois.

Avant de le reflasher, branchez-le une première fois : il est livré avec un firmware de démonstration qui permet de vérifier que l'écran, la molette et le tactile répondent bien.

Autoriser l'accès USB

Le flashage se fait directement depuis le navigateur (Chrome, Edge ou tout navigateur basé Chromium). Branchez le Dial à l'ordinateur : une fenêtre du système va demander d'autoriser l'accès au port série. Acceptez — l'invite diffère légèrement selon que vous êtes sur Mac, Windows ou Linux.

Installer ESPHome dans Home Assistant

Si ce n'est pas déjà fait : Paramètres → Applications → Installer une application, recherchez ESPHome, installez-la.

Une fois l'installation terminée, pensez à cocher l'option qui l'affiche dans la barre latérale — c'est plus rapide pour la suite.

ESPHome permet de transformer un fichier YAML en firmware sur mesure pour les puces ESP. C'est ce qui permet à un appareil comme le Dial de parler directement à Home Assistant, sans passer par un serveur tiers : pas de cloud, pas de latence.

Créer le projet

Depuis ESPHome Builder, ajoutez un nouvel appareil, choisissez Créer un nouveau projet, cherchez « Dial » et sélectionnez-le. Donnez-lui un nom (par exemple m5-dial), puis renseignez votre réseau Wi-Fi quand l'assistant le demande. Validez avec Terminer la configuration.

Vous arrivez sur l'écran d'édition : à gauche et au centre, des menus pour certains réglages ; à droite, le YAML complet, qui est la partie qu'on va utiliser pour tout le tutoriel.

Préparer secrets.yaml

Avant de coller quoi que ce soit, autant prendre la bonne habitude : les informations sensibles (Wi-Fi, mots de passe) vont dans un fichier secrets.yaml séparé, plutôt que codées en dur dans la config. Cliquez sur un champ marqué d'astérisques dans le YAML généré par l'assistant : ESPHome propose alors de créer un secret directement. Faites-le pour le mot de passe Wi-Fi.

Le fichier ressemblera à ceci une fois complété (à adapter avec vos propres valeurs) :

# secrets.yaml
wifi_ssid: "MonReseauWifi"
wifi_password: "MonMotDePasseWifi"

ap_ssid: "Dial Fallback Hotspot"
ap_password: "un-mot-de-passe-de-secours"

api_encryption_key: "clé générée par ESPHome, voir plus bas"
ota_password: "un-mot-de-passe-ota"

Deux astuces pour compléter les deux dernières lignes :

• OTA : le mot de passe n'existe pas encore par défaut. Cliquez sur la ligne correspondante dans l'éditeur pour qu'ESPHome en génère un, puis ajoutez-le à secrets.yaml.
• AP (point d'accès de secours, utile si le Wi-Fi principal tombe) : optionnel, à ajouter de la même façon si vous comptez vous en servir.

Ma configuration prête à l'emploi

Plutôt que d'écrire toute la configuration à la main, je vous ai préparé un fichier unique sur GitHub. Ce projet est un fork de celui d'Hectorzin, lui-même basé sur le projet original de JasionF (Smart Home Button) — je l'ai retravaillé et simplifié pour qu'il soit le plus rapide possible à mettre en route :

github.com/Glooob-domo/m5stack-dial-home-assistant

Ouvrez le fichier m5-dial.FR.yaml, copiez tout son contenu, puis dans ESPHome : effacez ce que l'assistant a généré dans la fenêtre de droite, et collez ma configuration à la place.

substitutions:
  device_name: m5stack-dial
  device_friendly_name: M5Stack Dial
  wifi_ssid: !secret wifi_ssid
  wifi_password: !secret wifi_password
  api_encryption_key: !secret api_encryption_key
  ota_password: !secret ota_password
  ap_ssid: Dial Fallback Hotspot
  ap_password: "changeme-dial-ap"

  timezone: Europe/Paris
  ui_language: fr

  # Molette : 1 = un pas par cran, 4 = plus sensible
  encoder_resolution: "1"

  # Amplitude d'un pas de molette (en %, sauf climate_temperature_step en demi-degrés)
  cover_position_step: "5"
  light_brightness_step: "1"
  climate_temperature_step: "2"
  music_volume_step: "10"

  # --- Horloge (page toujours visible) ---
  weather_entity: weather.disabled
  aqi_entity: sensor.disabled

  # --- Alarme locale au Dial ---
  show_alarm: "false"

### --- Lumière / Light ---
#dial_lights:
#  - entity_id: light.salon
#    name: Salon

### --- Chauffage / Climate ---
#dial_climates:
#  - entity_id: climate.salon
#    name: Salon

packages:
  m5_dial:
    url: https://github.com/Glooob-domo/m5stack-dial-home-assistant
    ref: main
    files:
      - dial.yaml
    refresh: 0s

(fichier raccourci ici pour la lisibilité — le fichier complet contient aussi les blocs media player, volets, garage, interrupteurs, scènes/scripts et températures, tous commentés par défaut.)

À l'enregistrement, vous allez voir une erreur et une ligne soulignée en rouge : c'est normal, ESPHome cherche un secret (api_encryption_key) qui n'existe pas encore.

Remplir les champs manquants

1. Cliquez sur les trois petits points en haut à droite de l'éditeur, puis Secrets.
2. Enregistrez : ESPHome va signaler des erreurs, enregistrez quand même.
3. Copiez la ligne correspondant à la clé de chiffrement générée (api_encryption_key).
4. Revenez à la configuration, et collez cette valeur dans secrets.yaml à la place du texte indicatif.
5. Faites la même chose pour ota_password, et pour ap_ssid / ap_password si vous en avez besoin — sinon, supprimez ces deux dernières lignes de la config.

Le reste des champs en haut du fichier (fuseau horaire, langue, sensibilité de la molette, amplitude des pas) est une configuration globale : les valeurs par défaut conviennent pour commencer, vous pourrez les ajuster plus tard.

Ajouter une première entité

Direction les blocs dial_* à la fin du fichier. Par défaut, aucun sous-menu n'apparaît sur le Dial en dehors de la page d'accueil (l'horloge) : c'est en renseignant une entité dans un bloc, puis en le décommentant, que le menu correspondant apparaît automatiquement à l'écran.

Pour la page horloge, commencez par renseigner votre entité météo. Dans Home Assistant : Outils de développement → États, cherchez weather, copiez l'identifiant de l'entité, et remplacez weather.disabled par cette valeur (aqi_entity est optionnel, à renseigner seulement si vous avez un capteur de qualité de l'air).

Testons avec une seule entité pour commencer, par exemple une lumière du salon : retirez le # au début des trois lignes du bloc dial_lights, et remplacez l'entité et le nom par les vôtres :

dial_lights:
  - entity_id: light.salon
    name: Salon

Premier flash

Enregistrez, puis cliquez sur Install → installation via le port USB de l'ordinateur → sélectionnez votre appareil dans la liste. La compilation peut prendre plusieurs minutes la première fois, c'est normal. Une fois terminée, le Dial redémarre et se connecte tout seul à votre réseau Wi-Fi.

Ajouter le Dial à Home Assistant

Ce n'est pas encore fini : le firmware tourne, mais Home Assistant ne connaît pas encore l'appareil.

1. Sur la page d'accueil d'ESPHome, sélectionnez votre projet pour récupérer son adresse IP.
2. Dans Home Assistant : Paramètres → Appareils et services. Le Dial devrait apparaître automatiquement ; sinon, ajoutez une intégration, cherchez ESPHome, et entrez l'IP relevée.
3. Étape indispensable : une fois l'appareil ajouté, ouvrez ses options (roue crantée) et cochez « Autoriser l'appareil à effectuer des appels de service Home Assistant ». Sans cette case, le Dial peut lire les états mais ne peut rien piloter.

Vous devriez maintenant voir le menu de votre lumière sur l'écran du Dial, et la molette doit faire varier la luminosité en direct.

Configurer le reste des entités

Une fois qu'une première entité fonctionne, le principe est le même pour tout le reste : décommenter le bloc voulu, renseigner l'entity_id et un nom, réinstaller. Petit tour des menus disponibles :

• Amplitude (*_step) : contrôle le nombre de « pas » de la molette par cran — par exemple une lumière réglée sur light_brightness_step: "1" varie de 1 % à chaque cran.
• Alarme (show_alarm: "true") : seule option indépendante de Home Assistant, entièrement locale au Dial.
• Lumières, chauffage, media players, volets : chacun son bloc dial_*, sur le même modèle que l'exemple ci-dessus.
• Garage : séparé des volets classiques, utile si votre portail/garage ne remonte pas d'état de position.
• Interrupteurs : pour piloter une prise connectée ou toute autre entité switch.
• Scènes et scripts : lançables directement depuis le Dial.
• Températures par pièce : un menu dédié pour suivre plusieurs capteurs.

Une fois tous les blocs voulus remplis, cliquez de nouveau sur Install : cette fois, l'installation peut se faire Over The Air, entièrement par Wi-Fi, sans rebrancher le câble USB.

Et ensuite ?

Le Dial est maintenant un vrai panneau de contrôle physique pour votre maison, 100 % local. N'hésitez pas à rejoindre le Discord pour partager votre configuration.