Der Nebel-Button: KI mit Partikeln zum Leben erwecken
Ein guter Button weckt den Wunsch, gedrückt zu werden. Der KI-Button von TAMSIV ist ein lebendiger Nebel, der zum Gespräch einlädt.
Die Design-Intention
Der Button sollte drei Dinge ohne Worte kommunizieren: „Ich bin hier“, „Ich bin bereit“, „Sprich mit mir“. Ich dachte an Nebel – diese kosmischen Wolken, die lebendig wirken, ohne bedrohlich zu sein.
Die technische Architektur
Komplett auf der nativen Animated API. Kein Lottie, kein Skia. 8 unscharfe Kreise, die sich sinusförmig bewegen und Bereiche unterschiedlicher Lichtdichte erzeugen. Farben zwischen Akzentblau (#137fec) und einem sanften Violett.
Die 4 Zustände
- Inaktiv: langsame Partikel, ruhige Atmung
- Zuhören: Amplitude steigt, Helligkeit nimmt zu
- Verarbeitung: Partikel konvergieren, schnelle Rotation
- Antwort: Partikel pulsieren mit dem TTS-Audio
Übergänge in Animated.spring für ein organisches Gefühl.
60fps obligatorisch
useNativeDriver: true, Reduzierung von 16 auf 8 Partikel, GPU-beschleunigte transform, null React-Re-Renders. Ergebnis: konstante 60fps selbst auf Geräten mit 3GB RAM.
Die Psychologie der Bewegung
Die Geschwindigkeit im inaktiven Zustand: ~4 Sekunden pro Zyklus, wie ein ruhiger Atemrhythmus. Als Tester mir sagten: „Es sieht aus, als würde sie darauf warten, dass ich mit ihr spreche“, wusste ich, dass es gelungen war.