LCD-Schmuck - schmück dich digital!

Was ist Pixel Pin?

PixelPin ist ein tragbares, programmierbares Schmuckstück mit einem runden 240×240 Pixel Display. Er kann Bilder, Text, Zufallsanimationen und GIFs anzeigen.

So funktioniert's

1. Klicks

  • Einfachklick (kurz): kurz klicken bis max.
  • Langklick (lang):Button halten
  • Doppelklick (doppel): Button zweimal klicken

2. Buttons

  • Button 1 (oben): Einfachklick: zur nächsten App wechseln, Langklick: zur vorherigen App wechseln, Doppelklick: zum Setup Menu
  • Button (Mitte):Einfachklick: Pixel-Pin ein und ausschalten
  • Button 2 (unten): Funktion abhängig von der aktiven App (z.B. Einfachklick: nächstes Bild in Slideshow)
Bedienelemente Übersicht

Verfügbare Apps

Pixel-Pin kommt mit verschiedenen vorinstallierten Apps. Wechsle zwischen Apps mit Button 1 (Einfachklick = nächste App, Langklick = vorherige App).

📷 Slideshow

Funktion: Zeigt Bilder und GIFs an. Das Bildformat ist JPG, nicht progresive. Bilder sollten 240x240px gross sein. Bilder und GIFs dürfen nicht zu schwer sein, so max. ~25Kb.

Die App hat verschiedene Modi: Automatisch (Auto), Manuell und ein Slideshow-Menü zur Konfiguration.

Button 2 Steuerung:

Im Auto-Modus:

  • Einfachklick: Nächstes Bild anzeigen
  • Langklick: Zum Manuell Modus wechseln

Im Manual-Modus:

  • Einfachklick: Nächstes Bild anzeigen
  • Langklick: Slideshow-Menü öffnen

Slideshow-Menü:

  • Einfachklick: Zwischen Menüpunkten wechseln
  • Langklick: Ausgewählten Menüpunkt öffnen/aktivieren
  • Doppelklick: Menü schließen

Menüpunkte:

  • Quelle wählen: Zwischen SD-Karte und Flash-Speicher wechseln
  • Löschmenü: Bilder einzeln durchgehen und löschen oder alle auf einmal löschen
  • Auto-Geschwindigkeit: Wechselzeit einstellen (1s, 5s, 10s, 30s, 5min)
  • Exit: Zurück zum Auto-Modus

Webapp:Bildaufbereiter - Bilder vorbereiten und hochladen

📝 Text App

Funktion: Zeigt scrollende Textnachrichten auf dem Display an. Es gibt den Mehrzeilermodus (TextBlock), den Wortmodus (BigWords) oder den Buchstabenmodus (BigLetters). Text, Modus, Abspielgeschwindigkeit und Farbe kann über die Webapp konfiguriert werden.

Button 2 Steuerung:

  • Einfachklick (kurz): Anzeigemodus wechseln (TextBlock → BigWords → BigLetters)
  • Langklick (lang): Textausrichtung ändern (nur im TextBlock-Modus: Links/Mitte/Rechts)
  • Doppelklick: Anzeigegeschwindigkeit ändern (nur in BigWords/BigLetters Modi)

Webapp:Text App Konfigurator - Text und Einstellungen anpassen

🎵 Pixeltöne

Funktion: Generiert dynamische, farbige Pixel-Muster basierend auf Zufallsalgorithmen. Jeder Pixel wird mit zufälligen Farben eingefärbt.

Button 2 Steuerung:

  • Einfachklick (kurz): Pixelgröße ändern (Display wird neu gestartet)
  • Langklick (lang): Farbpalette wechseln (Alle Farben/Rot/Grün/Blau/Graustufen/Bunt)
  • Doppelklick: Geschwindigkeit ändern (Animation verlangsamen)

Webapp: ❌ Keine Webapp - App läuft autonom

🌈 Chaoslinien

Funktion: Zeichnet chaotische, farbige Linien über das Display. Organische Bewegungsmuster entstehen zufällig.

Button 2 Steuerung:

  • Einfachklick (kurz): Linienlänge halbieren (Display wird neu gestartet)
  • Langklick (lang): Farbpalette wechseln (Alle Farben/Rot/Grün/Blau/Graustufen/Bunt)
  • Doppelklick: Linienbreite erhöhen (1px → 2px → 3px → 4px)

Webapp: ❌ Keine Webapp - App läuft autonom

🎨 Streifen-Töne

Funktion: Erzeugt horizontale farbige Streifen, die sich bewegen und ihre Farbe ändern.

Button 2 Steuerung:

  • Einfachklick (kurz): Streifenhöhe ändern (Display wird neu gestartet)
  • Langklick (lang): Farbpalette wechseln (Alle Farben/Rot/Grün/Blau/Graustufen/Bunt)
  • Doppelklick: Geschwindigkeit ändern (Animation verlangsamen)

Webapp: ❌ Keine Webapp - App läuft autonom

✏️ Zufallszeichner

Funktion: Zeichnet animierte Blob-Formen (Ellipsen) mit zufälligen Farben, die sich organisch über das Display bewegen.

Button 2 Steuerung:

  • Einfachklick (kurz): Farben der Blobs neu generieren
  • Langklick (lang): Farbpalette wechseln (Alle Farben/Rot/Grün/Blau/Graustufen/Bunt)
  • Doppelklick: Display löschen und Blobs neu positionieren

Webapp: ❌ Keine Webapp - App läuft autonom

▢ Rechteck-Töne

Funktion: Generiert sich bewegende, farbige Rechtecke unterschiedlicher Größe. Hypnotische geometrische Muster entstehen.

Button 2 Steuerung:

  • Einfachklick (kurz): Maximale Rechteckgröße ändern (Display wird neu gestartet)
  • Langklick (lang): Farbpalette wechseln (Alle Farben/Rot/Grün/Blau/Graustufen/Bunt)
  • Doppelklick: Geschwindigkeit ändern (Animation verlangsamen)

Webapp: ❌ Keine Webapp - App läuft autonom

⚙️ Lua Scripts

Funktion: Führt eigene Lua-Scripts aus, die über die Webapp hochgeladen wurden. Ermöglicht komplett eigene Animationen und Funktionen.

Button 2 Steuerung:

  • Einfachklick (kurz): Abhängig vom geladenen Script
  • Langklick (lang): Abhängig vom geladenen Script
  • Doppelklick: Abhängig vom geladenen Script

Webapp:Lua Script Verwaltung - Scripts erstellen und hochladen

Setup Menü

Das Setup-Menü ist das zentrale Konfigurationsmenü des Pixel-Pins. Es wird über Button 1 Doppelklick geöffnet und bietet Zugriff auf Systemeinstellungen und Datenübertragung.

Zugriff:

Navigation im Setup-Menü:

Menüpunkte:

🌐 Sprache / Language

Ändert die Systemsprache der Benutzeroberfläche.

  • Einfachklick: Zwischen verfügbaren Sprachen wechseln (Deutsch/English/Français/Italiano)
  • Langklick: Sprache bestätigen und zum Setup-Menü zurück
  • Doppelklick: Abbrechen und zum Setup-Menü zurück

📡 USB/BLE-Transfer

Aktiviert den Transfermodus für Bildübertragung per Bluetooth oder USB. Der Pixel-Pin wartet dann auf Verbindung vom Webtool.

  • Nach Auswahl öffnet sich der Transfer-Bildschirm
  • Übertragung kann per BLE (Bluetooth) oder USB Serial erfolgen
  • Fortschrittsanzeige während der Übertragung
  • Langklick: Transfer abbrechen und zurück zum Setup-Menü
  • Doppelklick: Transfer beenden und Menü schließen

💾 SD → Flash kopieren

Kopiert alle Bilder von der SD-Karte in den internen Flash-Speicher. Alternativer Transfer wenn kein Bluetooth oder USB Übertragung möglich ist.

  • Zeigt Bestätigungsdialog mit Anzahl der Dateien
  • Einfachklick: Zwischen "Nein" und "Ja" wechseln
  • Langklick: Auswahl bestätigen (Kopiervorgang starten oder abbrechen)
  • Doppelklick: Zurück zum Setup-Menü
  • Während des Kopiervorgangs: Fortschrittsanzeige mit Dateianzahl und Größe

🚪 Exit

Schließt das Setup-Menü und kehrt zur zuvor aktiven App zurück.

Webtools

Nutze diese Browser-basierten Tools, um deinen Pixel-Pin zu konfigurieren und zu verwalten:

Browser-Kompatibilität

Die Webtools nutzen moderne Browser-APIs (WebBluetooth, WebSerial). Hier die Kompatibilität:

Bluetooth (BLE) Upload:

USB/Serial Upload:

Empfehlung: Nutze Chrome oder Edge für die beste Kompatibilität. Unter Linux benötigst du Rechte für den seriellen Port (dialout-Gruppe).

So funktioniert Bilderübertragen

1. Bilder vorbereiten

Öffne den Bildaufbereiter in deinem Browser. Öffne ein Bild, wähle einen Ausschnit und passe es an das runde Display an. Das Tool generiert automatisch ein optimiertes 240×240px JPEG.

2. Daten auf Pixel-Pin übertragen

Pixel Pin transferbereit machen

Du hast zwei Möglichkeiten:

Technische Daten

Mikrocontroller
ESP32-D0WD-V3
Display
1.28" GC9A01 (240×240px rund)
Flash Speicher
16 MB (9 MB für Bilder)
RAM
320 KB DRAM
Konnektivität
BLE 4.2, USB Serial
Erweiterung
MicroSD Kartenslot
Buttons
2x programmierbare Taster
Bildformat
JPEG (240×240px oder 204×240px)

Entwicklung & Dokumentation

Pixel-Pin ist ein Open-Source-Projekt. Die komplette Firmware kann angepasst und erweitert werden:

📂 GitHub Repository 📖 Entwickler-Doku