bee-focused
UX-Konzept
Kategorie: UX-Konzept
Abschlussaufgabe des Zertifikatslehrgangs UX/UI Design an der OfG
Fertigstellung: 2025
Technologie: Figma, Photoshop, Illustrator
Leistung: Konzeption, Umsetzung
Dieses UX-Konzept ist die Abschlussaufgabe meines Zertifikatslehrgangs UX/UI Design an der OfG. Die Aufgabe bestand darin, ein durchdachtes Konzept für eine Timer-App zu schreiben, die auf dem Pomodoro-Prinzip basiert.
Die App bee.focused hilft Usern dabei, fokussiert zu arbeiten und regelmäßige Pausen einzuhalten. Durch eine klare visuelle Sprache, sanfte Animationen und passende Sounds schafft die Anwendung ein ruhiges, motivierendes Arbeitsumfeld.
Das Design der App ist minimalistisch und konzentriert sich darauf, die Funktionalität der App zu unterstützen.
Farbpalette & Fonts
Nach dem Start der App erscheint kurz der Welcome-Screen mit dem Icon der App. Anschließend gelangen User direkt auf den Home-Screen. Der Übergang erfolgt nahtlos, da das Icon sich bei beiden Screens an der selben Stelle befindet. Die App-Navigation ist bewusst als flache Struktur gehalten, um eine unkomplizierte Bedienung zu ermöglichen. Vom Home-Screen aus sind zwei Unterseiten direkt zugänglich: Statistiken und Einstellungen.
Während der Fokusphasen hört man das leise Summen von Bienen, welches durch seinen Frequenzbereich als „White Noise“ gilt und zur besseren Konzentration beiträgt. Eine schwebende Biene in der Mitte des Screens bewegt sich sanft auf und ab – eingebettet in eine stilisierte Wabe, deren Umriss mit zunehmender Dauer immer dicker wird. In den Pausen wechselt die Szene: Die Biene schwebt nun über einer Blume, begleitet von einer beruhigenden Melodie.
Wireframes und Raster
Zielgruppenanalyse und Personas
Die App bee.focused richtet sich an User, die ihre Produktivität steigern und gleichzeitig mehr Achtsamkeit in ihren Arbeitsalltag integrieren möchten. Die Zielgruppe umfasst sowohl junge Erwachsene, die sich in Studium oder Ausbildung befinden, als auch Berufstätige, die im Rahmen ihrer Tätigkeit oder Weiterbildung strukturiert arbeiten müssen. Allen Usern gemeinsam ist das Bedürfnis nach einer klaren Zeiteinteilung, Hilfe bei der Konzentration sowie regelmäßigen Erholungspausen. Sie sind technologieaffin, offen für digitale Tools zur Selbstorganisation und schätzen eine freundliche, minimalistische Nutzeroberfläche, die nicht ablenkt, sondern unterstützt.
Hauptmerkmale der Zielgruppe:
- zwischen 18 und 50 Jahre alt
- digital-affine Smartphone-Nutzer
- Interesse an Produktivität und Selbstorganisation
- arbeiten häufig im Homeoffice, im Co-Working-Space oder in Bibliotheken
Personas
Use Cases
Use Case 1: Lernsession mit Pomodoro-Timer starten
Akteure: Lea (Studentin), App-System
Szenario: Lea möchte sich 90 Minuten auf eine Hausarbeit konzentrieren und nutzt dafür die App mit drei Pomodoro-Einheiten.
Vorbedingungen:
- Die App ist installiert und wurde bereits eingerichtet
- Smartphone ist vollständig geladen oder am Ladegerät
- Keine aktiven Störungen (Benachrichtigungen stummgeschaltet, Mitbewohner informiert)
Ablauf:
- Lea öffnet die App bee.focused
- Sie sieht den Home Screen mit der schwebenden Biene
- Sie tippt auf den Play-Button
- Der Timer startet eine 25-minütige Fokussitzung
- Währenddessen hört Lea das beruhigende Bienensummen
- Nach 25 Minuten ertönt ein Ton, und die App wechselt in den Pausenmodus mit neuer Musik und Grafik
Nachbedingungen:
- Lea hat 3 Arbeitseinheiten (inkl. Pausen) abgeschlossen
- Die Streak wurde aktualisiert und gespeichert
- Lea fühlt sich produktiv und motiviert für weitere Sessions
Ausnahmen:
- Wenn Lea den Timer vorzeitig pausiert, wird die Einheit gespeichert, aber als unvollständig markiert
- Bei Inaktivität oder App-Absturz erinnert ein sanfter Reminder daran, den Fokus fortzusetzen
Use Case 2: Lernzeit trotz Zeitmangel planen
Akteure: Thomas (Umschüler), App-System
Szenario: Thomas hat abends nur 45 Minuten Zeit, um für seinen IT-Kurs zu lernen. Er möchte diese Zeit möglichst effizient nutzen.
Vorbedingungen:
- Thomas hat die App eingerichtet und kennt die Grundfunktionen
- Seine Kinder sind im Bett, und er ist bereit zu lernen
- Keine aktiven Störungen (Benachrichtigungen stummgeschaltet, Mitbewohner informiert)
Ablauf:
- Thomas öffnet bee.focused auf seinem Smartphone
- Er startet eine einzelne Pomodoro-Einheit
- Nach der Fokuseinheit erscheint automatisch die 5-Minuten-Pause
- Thomas lässt die App im Hintergrund weiterlaufen, während er sich kurz bewegt
- Danach entscheidet er, ob er eine weitere Einheit beginnt oder die Sitzung beendet
Nachbedingungen:
- Eine abgeschlossene Fokusphase wurde registriert
- Thomas fühlt sich trotz kurzer Lernzeit produktiv
- Die Statistik verzeichnet Fortschritte in seiner Lernroutine
Ausnahmen:
- Wenn ein Kind aufwacht und Thomas unterbrechen muss, pausiert er den Timer
- Die Einheit kann später am Abend oder am nächsten Tag fortgesetzt werden
Screenflow
Der Screen Flow zeigt die Navigation innerhalb der App bee.focused. Vom Home Screen aus lassen sich alle wichtigen Bereiche erreichen: die Statistiken mit Fokuszeiten und Streaks sowie die Einstellungen, in denen Zeiten, Sounds und das Erscheinungsbild angepasst werden können. Auswahloptionen, wie Tonarten, werden über Drop-down-Felder gelöst, ohne in tiefere Menüstrukturen zuführen. Die Navigation bleibt bewusst flach und intuitiv.
Screenflow
Den Prototypen kann man sich hier ansehen.
Prototyp