Kapitel 10 von 18

Visuelle Feedback-Logik

Wie ein Mensch denkt - Intuitive Punktelogik Designprinzip: Die Punktedarstellung muss der menschlichen Intuition folgen, nicht nur mathematisch korrekt sein. Menschliche Erwartung bei "NACH": 13:07 → "FÜNF NACH EINS" + ●● Denkweise: "5 NACH + 2 Punkte = 7 Minuten nach" Berechnung: 5 + 2 = 7 Minuten nach 13:00 → 13:07

Der Mensch addiert die Punkte zur Basis-Anzeige. Menschliche Erwartung bei "VOR": 13:53 → "ZEHN VOR ZWEI" + ●●● Denkweise: "10 VOR - 3 Punkte = 7 Minuten vor" Berechnung: 10 - 3 = 7 Minuten vor 14:00 → 13:53

Der Mensch subtrahiert die Punkte von der Basis-Anzeige.

Falsche Implementierung (mathematisch korrekt, aber kontraintuitiv)

13:53 → "ZEHN VOR ZWEI" + ●● (invertiert) Denkweise: "10 VOR - 2 Punkte = 8 Minuten vor" Berechnung: 10 - 2 = 8 Minuten vor 14:00 → 13:52 ≠ 13:53!

Menschliche Erwartung bei "BALD": 13:58 → "BALD ZWEI" + ●● Denkweise: "BALD bedeutet gleich → noch 2 Minuten fehlen" Berechnung: 14:00 - 2 Minuten = 13:58

Der Mensch interpretiert die Punkte als fehlende Zeit bis zum Ereignis. Zwei-Modi-System für Anzeigepunkte Die 4 LED-Punkte zeigen Minuten zwischen 5-Minuten-Schritten an.

Problem: Wie zeigt man Zwischenwerte konsistent mit menschlicher Intuition?

Unterscheidung der beiden Modi

Progressive Punkte (von links, addieren)

LEDs werden von links nach rechts angezeigt Die Anzahl wird zur angezeigten Zeit addiert Tritt auf bei: positivem Offset (tatsächliche Zeit > angezeigte Zeit)

  • Bedeutung: "Minuten, die zur angezeigten Zeit addiert werden müssen"

Regressive Punkte (von rechts, subtrahieren)

LEDs werden von rechts nach links angezeigt Die Anzahl wird von der angezeigten Zeit subtrahiert Tritt auf bei: negativem Offset (tatsächliche Zeit < angezeigte Zeit)

  • Bedeutung: "Minuten, die von der angezeigten Zeit subtrahiert werden müssen"

Berechnungslogik Grundprinzip: Die LED-Richtung und -Anzahl werden durch den Offset zwischen angezeigter und tatsächlicher Zeit bestimmt.

Berechnung

signedOffset = actualMinute - displayedMinute; remainder = Math.abs(signedOffset); direction = signedOffset < 0 ? "rechts" : "links";

Beispiele Addieren (positive Offsets, LEDs von links)

  • 13:07 → "FÜNF NACH EINS" + ●● (von links)

  • Angezeigt: FÜNF NACH = 13:05, Offset: +2

  • Interpretation: 5 NACH + 2 = 7 Minuten nach 13:00

  • 13:31 → "NACH HALB ZWEI" + ● (von links)

  • Angezeigt: HALB = 13:30, Offset: +1

  • Interpretation: HALB + 1 = 13:31

  • 13:33 → "NACH HALB ZWEI" + ●●● (von links)

  • Angezeigt: HALB = 13:30, Offset: +3

  • Interpretation: HALB + 3 = 13:33

Beispiele Subtrahieren (negative Offsets, LEDs von rechts)

  • 10:53 → "FÜNF VOR ELF" + ●● (von rechts)

  • Angezeigt: FÜNF VOR = :55, Offset: -2

  • Interpretation: 55 - 2 = 53

Gemischte Beispiele (VOR kann beide Richtungen haben!)

  • 03:51 → "ZEHN VOR VIER" + ● (von links, positiver Offset!)

  • Angezeigt: ZEHN VOR = :50, Offset: +1

  • Interpretation: 50 + 1 = 51

Beispiele mit BALD/FAST (negative Offsets)

13:58 → "BALD ZWEI" + ●● (von rechts)

  • Angezeigt: BALD ZWEI = :60 (volle Stunde)

  • Offset: :58 - :60 = -2

  • Interpretation: 60 - 2 = 58 (noch 2 Minuten bis 14:00)

06:27 → "BALD HALB SIEBEN" + ●●● (von rechts)

  • Angezeigt: BALD HALB = :30

  • Offset: :27 - :30 = -3

  • Interpretation: 30 - 3 = 27 (noch 3 Minuten bis HALB)

14:04 → "BALD FÜNF NACH ZWEI" + ● (von rechts)

  • Angezeigt: FÜNF NACH = :05

  • Offset: :04 - :05 = -1

  • Interpretation: 5 - 1 = 4 (noch 1 Minute bis FÜNF NACH)

Wichtig: Die Richtung hängt vom Offset ab, nicht von den Schlüsselwörtern!

01:02 → "KURZ NACH EINS" + ●● (von links!)

  • Angezeigt: NACH = :00 (volle Stunde)

  • Offset: :02 - :00 = +2 (positiv!)

  • Interpretation: 0 + 2 = 2 (2 Minuten nach der vollen Stunde)

Logik-Implementierung // 1. Berechne die angezeigte Minute basierend auf den Wörtern const displayedMinute = calculateDisplayedMinute(wordsToLight);

// 2. Berechne Offset mit Vorzeichen const signedOffset = actualMinute - displayedMinute; const remainder = Math.abs(signedOffset);

// 3. LED-Richtung: positiv = links, negativ = rechts const isInvertedDisplay = signedOffset < 0;

// 4. LEDs anzeigen for(let i = 0; i < remainder; i++) { const dotIndex = isInvertedDisplay ? (3 - i) : i; // rechts → links oder links → rechts if(dots[dotIndex]) dots[dotIndex].classList.add('lit'); }

Die Funktion calculateDisplayedMinute() berücksichtigt

  • HALB-basierte Kombinationen: "FÜNF VOR HALB" = :25, "HALB" = :30, "FÜNF NACH HALB" = :35

  • Minutenmarker: "FÜNF NACH" = :05, "ZEHN VOR" = :50, "VIERTEL NACH" = :15

  • BALD/FAST ohne Marker: "BALD [STUNDE]" = :60 (volle Stunde)

  • Reine Präpositionen: "NACH" = :00, "VOR" = :60

Wichtige Regel: Die LED-Richtung hängt vom Offset zwischen angezeigter und tatsächlicher Zeit ab! Die Entscheidung, ob LEDs von links oder rechts angezeigt werden, wird durch den Offset zur angezeigten Zeit bestimmt:

Von rechts (subtrahieren) - Negative Offsets

"BALD HALB SIEBEN" (06:27)

  • Angezeigt: BALD HALB = :30

  • Offset: 27 - 30 = -3 (negativ!)

  • LEDs: ●●● von rechts

  • Operation: 30 - 3 = 27 ✓

"FÜNF VOR ELF" (10:53)

  • Angezeigt: FÜNF VOR = :55

  • Offset: 53 - 55 = -2 (negativ!)

  • LEDs: ●● von rechts

  • Operation: 55 - 2 = 53 ✓

Von links (addieren) - Positive Offsets

"KURZ NACH EINS" (01:02)

  • Angezeigt: NACH = :00

  • Offset: 02 - 00 = +2 (positiv!)

  • LEDs: ●● von links

  • Operation: 0 + 2 = 2 ✓

"FÜNF NACH ZWEI" (14:07)

  • Angezeigt: FÜNF NACH = :05

  • Offset: 07 - 05 = +2 (positiv!)

  • LEDs: ●● von links

  • Operation: 5 + 2 = 7 ✓

"ZEHN VOR VIER" (03:51)

  • Angezeigt: ZEHN VOR = :50

  • Offset: 51 - 50 = +1 (positiv!)

  • LEDs: ● von links

  • Operation: 50 + 1 = 51 ✓

Spezialfall: Warum kein "KURZ FÜNF VOR"?

5-Minuten-Regel und natürliche Sprache

Problem: Bei 10:53 ohne BALD/FAST - welche Anzeige ist korrekt?

Falsche Ansätze

❌ Variante A: "ZEHN VOR ELF" + 3 LEDs von links

  • Berechnung: 50 + 3 = 53 ✓ (mathematisch korrekt)
  • Problem: Verstößt gegen die 5-Minuten-Regel
  • :53 ist näher an :55 (2 Min) als an :50 (3 Min)
  • LEDs von links bei VOR ist visuell inkonsistent ❌ Variante B: "KURZ FÜNF VOR ELF"
  • Sprachlich unnatürlich im Deutschen
  • Niemand sagt "ES IST KURZ FÜNF VOR ELF"
  • KURZ funktioniert nur mit direkten Zeitmarken: "KURZ VOR HALB", "KURZ NACH EINS" ✓ Korrekte Lösung: "FÜNF VOR ELF" + 2 LEDs von rechts
  • Angezeigt: FÜNF VOR = :55
  • Offset: 53 - 55 = -2 (negativ)
  • Berechnung: 55 - 2 = 53 ✓
  • LEDs von rechts (negativer Offset) ✓
  • Sprachlich natürlich ✓

Weitere Beispiele mit dieser Logik

10:58 → "VOR ELF" + 2 LEDs von rechts (60 - 2 = 58)

  • Nicht "FÜNF VOR ELF" (wäre 55 - 3 = 52 ❌)

  • :58 ist näher an :00 (2 Min) als an :55 (3 Min)

10:58 mit BALD → "BALD ELF" + 2 LEDs von rechts

10:58 mit FAST → "FAST ELF" + 2 LEDs von rechts 10:58 mit KURZ → "KURZ VOR ELF" + 2 LEDs von rechts

Lernziel: Kontext-abhängige Berechnung, User Experience Design, menschenzentrierte Algorithmik, natürliche Sprachlogik

Test-Driven Development

Zurück
10 / 18
Weiter
Fortschritt56%

Kommt als nächstes:

Test-Driven Development