macOS Menu Bar Icon States effizient steuern

Du kennst das Problem: Deine App läuft im Hintergrund, aber der User hat keine Ahnung, was gerade passiert. Ein statisches Icon in der Menu Bar reicht oft nicht aus, um Prozesse wie Sprachsteuerung oder aktive Hintergrund-Tasks klar zu kommunizieren. Wenn das visuelle Feedback fehlt, wirkt die App schnell eingefroren oder reagiert gefühlt nicht.

Gleichzeitig willst du den User nicht mit zu viel Bewegung ablenken. Die Herausforderung besteht darin, subtile Animationen zu nutzen, die genau dann aktiv werden, wenn sie gebraucht werden – zum Beispiel, wenn ein Voice Trigger erkannt wurde oder ein Agent im Hintergrund arbeitet.

Voraussetzungen

• macOS App Codebase (apps/macos)
• Zugriff auf AppState und AppStateStore

Schnellstart

In fünf Minuten setzt du die wichtigsten Zustände für dein Icon auf Basis der AppState Logik um.

1. Voice Trigger (Big Ears) aktivieren

Wenn das Wake Word erkannt wird, nutzt du AppState.triggerVoiceEars(ttl: nil). Das Icon skaliert dabei auf das 1.9-fache und zeigt Ear Holes für bessere Lesbarkeit. Sobald die Erfassung beendet ist (nach 1 Sekunde Stille), stoppst du den Effekt.

// Voice Trigger starten
AppState.triggerVoiceEars(ttl: nil)

// Nach 1s Stille beenden
stopVoiceEars()

2. Arbeitsmodus (Agent Activity) anzeigen

Für Hintergrundprozesse setzt du isWorking. Das löst eine “Scurry”-Bewegung aus (schnelleres Wackeln der Beine und leichter Versatz). Nutze defer, damit die Animation nicht hängen bleibt, falls ein Task abbricht.

AppStateStore.shared.setWorking(true)
defer {
    AppStateStore.shared.setWorking(false)
}
// Hier folgt der Task, z.B. WebChat Agent Run

Fehlerbehebung

• Icon-Animation bleibt hängen: Stelle sicher, dass du setWorking(false) immer in einem defer Block aufrufst. So wird der Status auch bei Fehlern zurückgesetzt.
• Icon flackert unkontrolliert: Nutze keine externen CLI oder Broker Signale, um die Zustände zu steuern. Die Logik sollte intern in der App bleiben, um Race Conditions zu vermeiden.
• Animation wirkt zu lang: Halte die TTL (Time To Live) kurz (unter 10 Sekunden). Das Icon muss schnell zum Baseline-Zustand zurückkehren, falls ein Job hängt.

Hast du Fragen zur Implementierung der Renderer-Details? Frag den AI Setup Assistant.

Nächste Schritte

• WebChat Agent Integration
• macOS App Architektur Guide
• CritterIconRenderer Dokumentation
• Voice Pipeline Setup