M5Stack Dial: Der ultimative physische Controller für WLED (ohne Home Assistant)
Kennst du das auch? Für etwas so Einfaches wie die Helligkeit oder Farbe deiner LED-Streifen zu ändern, musst du erst das Smartphone entsperren, die WLED-App öffnen und warten, bis die Verbindung steht. Smart Home soll den Alltag erleichtern, doch manchmal machen zu viele Schritte die Bedienung unnötig umständlich. Heute lösen wir genau das, indem wir ein M5Stack Dial in einen dedizierten physischen Controller für WLED verwandeln. Das Beste daran: Es funktioniert völlig eigenständig, ohne externe Server oder komplizierte Home-Assistant-Konfigurationen.
Auf YouTube teile ich weitere Tutorials, Praxistests und echte Smart-Home-Projekte. Auf YouTube abonnieren
Was ist das M5Stack Dial?
Das M5Stack Dial ist ein Gerät auf Basis des leistungsstarken Chips ESP32-S3. Es verfügt über ein hochwertiges rundes Touchdisplay, einen Rotary Encoder (das Drehrad), der sich hervorragend anfühlt, sowie über WiFi-/Bluetooth-Konnektivität. Damit ist es die perfekte Hardware für kompakte und elegante Steueroberflächen (HMI).
Benötigte Software
- Visual Studio Code (VS Code): Der Code-Editor, den wir als Grundlage verwenden.
- VS Code herunterladen (Windows, Mac, Linux)
- PlatformIO: Es wird als Erweiterung in VS Code installiert (suche im Extension Marketplace nach "PlatformIO IDE").
Projektdateien
- Firmware m5dial-wled (GitHub): Der von jmaffie entwickelte Quellcode, der die Magie möglich macht.
- Zum Repository auf GitHub
- 3D-Druckmodell (Gehäuse): Das Design von Jason, damit dein Controller professionell und hochwertig aussieht.
- Modell herunterladen auf Hackster.io
Schritt-für-Schritt-Anleitung: Firmware installieren
Lass dich von Begriffen wie "ESP32" oder "kompilieren" nicht abschrecken. Dieser Vorgang ist so einfach wie die Installation irgendeines Programms auf deinem Computer. Wir verwenden das Open-Source-Projekt m5dial-wled von jmaffie.
1. Umgebung vorbereiten
Diesen Schritt musst du nur einmal durchführen:
- Lade Visual Studio Code herunter und installiere es.
- Suche in VS Code nach der Erweiterung PlatformIO IDE. Hab etwas Geduld, denn beim ersten Mal dauert es meist ein paar Minuten, bis die gesamte Umgebung eingerichtet ist.
2. Projekt herunterladen und einrichten
- Lade das Projekt-Repository von GitHub herunter: m5dial-wled.
- Entpacke den Ordner und öffne ihn mit Visual Studio Code.
- Lege deine Zugangsdaten fest: Suche nach der Datei
secrets.h.exampleund benenne sie insecrets.hum. - Bearbeite die Datei mit deinen Netzwerddaten:
// Beispiel für die Konfiguration in secrets.h
const char* ssid = "TU_WIFI_NOMBRE";
const char* password = "TU_WIFI_PASSWORD";
const char* wled_host = "192.168.1.100"; // Die IP deines WLED-Controllers oder ein MDNS-Name
3. Flashen
- Verbinde dein M5Stack Dial über das USB-C-Kabel mit dem Computer.
- Klicke in der unteren Leiste von PlatformIO (dem Alien-Icon) auf das "V" (Build)-Symbol, um zu prüfen, ob alles korrekt ist.
- Wenn der Vorgang erfolgreich war, klicke auf den "Pfeil nach rechts" (Upload)-Button, um die Firmware auf das Gerät zu flashen.
Nutzungserlebnis: Was kannst du steuern?
Nach dem Neustart verbindet sich das Dial mit deinem WLAN und du siehst eine flüssige, moderne Oberfläche. Hier beginnt der spannende Teil:
- Helligkeitssteuerung: Drehe das Rad, um die Intensität anzupassen. Das ist ohne Zweifel die praktischste Funktion im Alltag.
- Farbpalette: Verändere die Atmosphäre des Raums in Sekundenschnelle, indem du durch den Farbkreis navigierst.
- Dynamische Effekte: Blättere intuitiv durch die umfangreiche Liste der WLED-Effekte.
- Anpassung: Du kannst Geschwindigkeit und Intensität jedes Effekts direkt über den Touchscreen anpassen.
Die Reaktion erfolgt sofort. Da keine Zwischeninstanz beteiligt ist, ist die Kommunikation zwischen dem Dial und WLED direkt und extrem reibungslos.
Professionelles Finish: 3D-Druck
Damit das Gerät nicht wie ein einfaches Elektronikteil auf dem Tisch wirkt, empfehle ich dir, ein Gehäuse oder eine Halterung zu drucken. Ich habe das Design von Jason verwendet, das ihm ein Aussehen ähnlich einer klassischen Kamera verleiht und die Verkabelung versteckt.
- 3D-Modell (Smart Home Button): Download auf Hackster.io
Profi-Tipp: Das M5Stack Dial hat rückseitige Stromanschlüsse. Wenn du ein sauberes Ergebnis an der Wand möchtest, kannst du es direkt dort mit Strom versorgen, statt den seitlichen USB-Anschluss zu nutzen.
Fazit
Das M5Stack Dial ist nicht nur ein "Spielzeug" für Enthusiasten; es ist ein Werkzeug, das die Ergonomie deines Smart Homes verbessert. Wenn du WLED bereits schätzt, ist dieser physische Controller genau das fehlende Puzzleteil.
Wenn du dieses Gerät noch weiter ausreizen und es über Home Assistant mit ESPHome steuern möchtest, um Rollläden, Licht oder Klima zu bedienen, solltest du dir mein anderes Tutorial nicht entgehen lassen: Home Assistant mit M5Stack Dial steuern.
Welche Funktion würdest du hinzufügen? Schreib es mir in die Kommentare!
Wo kaufen
Wenn dich eine der genannten Optionen interessiert, findest du hier die verfuegbaren Links:
Panel / Touchscreen
- M5Stack Dial v1.1 — Im Video getestet: OPENELAB · Amazon · AliExpress
Smarte Beleuchtung
- SMLIGHT SLWF-03 (Controlador WLED): AliExpress
- WS2811 / WS2812B / WS2813 / WS2815 RGB-LED-Streifen (Tira LED direccional (WLED)): AliExpress · Amazon
- WLED RGBIC COB LED-Streifen-Kit (PACK WLED COB): AliExpress
Getestetes Geraet
