famly

Case Study famly App

Als Kommunikationstool für Kindertagesstätten und Eltern konzipiert, ist die famly App mit einem umfangreichen Funktionsspektrum für beide Seiten sehr komplex. Gerade in dieser Komplexität steckt auch die Schwierigkeit in der User Experience. Die App wird vor allem von Eltern als zu unübersichtlich und unlogisch in der Benutzung empfunden. In dieser Case Study werden die einzelnen Funktionsbereiche analysiert, ihre Kritikpunkte in der Nutzererfahrung herausgearbeitet und Optimierungsvorschläge erstellt.

  • Analyse der User Journeys
  • Elternbefragung
  • Analyse der Informationsarchitektur
  • Neukonzeption und Redesign der besonders kritisierten Bereiche

Über die App

Die famly App ist eine der umfangreichsten Kommunikations-Apps zwischen Kitas und Eltern. Die Einrichtung hat vielfältige Möglichkeiten Informationen zur gesamten Einrichtung, der Gruppe und einzelnen Kindern einzusehen und zu teilen, gleichzeitig ist die App auf Elternseite vor allem ein Informationsmedium rund um den Kitaalltag des eigenen Kindes. Eine Nachrichtenfunktion und die Möglichkeit zur An- und Abmeldung bei Krankheit/Abwesenheit, Urlaubseinträge sowie weitere Vermerkoptionen seitens der Eltern runden das Funktionsbild ab.

Gerade weil die App so komplex ist, bringt sie leider gerade für Eltern regelmäßig Hürden in der Bedienung mit sich. Während Kita-Mitarbeiter*innen per iPad auf das Tool zugreifen, wird die App auf Elternseite ausschließlich auf Smartphones genutzt. Dabei gibt es überwiegend ähnliches Feedback: Funktionen sind zu versteckt oder schwer erfassbar und vor allem teilweise nicht nachvollziehbar an verschiedenen Stellen innerhalb der App verteilt. Die App ist technisch hochfunktional, fällt aber in puncto User Experience vor allem negativ auf.

Um das Nutzungserlebnis zu verbessern, wurden zunächst die Bereiche herausgefiltert, die als besonders problematisch empfunden werden und sodann vor allem eine tiefer greifende Analyse und Optimierung der problematischen Bereiche durchgeführt. Ein Soft-Relaunch des Logos bringt zudem mehr Konsistenz im Erscheinungsbild. Das Ergebnis ermöglicht bessere User Flows und dadurch mehr Zufriedenheit und weniger Fehler während der Nutzung.

Das Logo

Status Quo

Die Verteilung der Farben in den einzelnen Varianten ist nicht stringent. Nur die lilafarbene Variante kommt ohne Sekundärfarbe aus. Die weiße und schwarze Variante finden zumindest im App-Kontext keinen Einsatz. Das handgeschriebene „l“ fügt sich unharmonisch an die serifenlose Blockschrift, es fehlt entweder eine klare Trennung oder eine echte Verbindung.

Evolution

Ziel der Evolution war die Harmonisierung des Logos unter gleichzeitig besserer Lesbarkeit. Durch leichte Erhöhung der Strichstärke und eine Trennung zwischen Groteske und Schreibschrift hat das Logo sowohl an Klarheit als auch an Emotionalität gewonnen. Bei den Logo-Varianten wurde die schwarze Variante ausgeschlossen und die verbleibenden in der Gestaltungslogik vereinheitlicht.

Die obere Navigationsebene und ihre Kategorien

Inhalte (zugänglich über Navigationsleiste unten):
– Neuigkeiten
– Dashboard Kind/Kinder
– Nachrichten
– Benachrichtigungen
– Profileinstellungen

Header:
– Kategorieüberschrift auf oberster Ebene
– oder Überschrift Subebene und Navigationspfeil zum Verlassen der aktuellen Subebene
– Suchfunktion
– Elternprofil

Bei näherem Betrachten fällt schnell auf, dass das Dashboard sehr überladen ist, es doppelte Platzierungen für einzelne Funktionen gibt und bestimmte häufig genutzte Funktionen nur mit sehr vielen Klicks erreichbar sind.

Die Navigationsleiste

  • Die Icons der fünf Hauptkategorien sind in ihrer Gestaltung inkonsistent
  • Nicht jedes Icon ist klar erkennbar in der Funktion/Information, die sich dahinter versteckt

Als erster Schritt in Richtung verbesserter Nutzerfreundlichkeit wurden daher die Icons in allen Zuständen einheitlicher und besser verständlich gestaltet.

Status Quo

  • inkonsistente Gestaltung der Icons im aktiven Zustand
  • aktiver Zustand schwer erkennbar durch fehlenden Kontrast
  • Icon-Bedeutung nicht immer klar erkennbar
  • Darstellung für Dashboard Kind inkonsequent und bei 
mehreren Kindern nicht logisch umsetzbar (hier ist 
ein Profilbild eines Kindes vorgesehen, wie also sieht die Darstellung bei mehreren Kindern aus?)

Redesign

  • konsequentes Icon-Design mit besserer Lesbarkeit und leichte Anhebung der Konturstärke
  • bessere Zuordnung der Funktionen durch deutlichere Symbolik
  • Ergänzung des Kalender-Icons
  • Entfernung des Benachrichtungs-Icons
    → Integration in Homescreen, da sonst doppelt vorhandene Informationsebene

Der Aufbau des Dashboards – Status Quo

Das Dashboard ist die wohl komplexeste Kategorie mit dem höchsten Funktionsumfang und auf vielen Ebenen verschachtelten Funktionen. Genau hier liegt auch die große Schwierigkeit: Sind alle Funktionen wirklich an der richtigen Stelle platziert oder an anderer Stelle sinnvoller einsetzbar? Das Clustern von Informationen und inhaltliche Sortieren der Funktionen ist im Dashboard die Hauptaufgabe, um hier für mehr Nutzerfreundlichkeit zu sorgen. Bei der Optimierung wurden Bereiche und Funktionen zusammengelegt, auf konsistente Gestaltung geachtet und vor allem die Übersichtlichkeit korrigiert.

Um zu verstehen, wie das komplexe Dashboard mit all seinen Unterebenen aufgebaut ist, wurde es zunächst analysiert, bewertet und dann neu angelegt.

Analyseprozess zur Optimierung des Dashboards

Schritt 1: Analyse der Funktionen

Bei genauer Analyse der Funktionen und Bereiche und ihrer Subebenen wird schnell klar, dass Bereiche doppelt, zu versteckt platziert oder zu kompliziert aufgebaut sind:

  • Die Eingaben von Abwesenheitsmeldungen sind nach Grund unterschieden und dadurch unnötigerweise auf drei Eingabemöglichkeiten mit großem Platzbedarf verteilt
  • die Eingabe für die Ferienabfrage ist zu versteckt unter „Weitere“ untergebracht. Hier sind Eingaben und Informationsebenen vermischt, wo man nicht unbedingt suchen würde
  • Bereich „Familie“ passt inhaltlich zu „über mich“, ist aber ein eigener Bereich und nimmt ebenfalls viel Platz ein


Schritt 2: Feature Audit Nutzungshäufigkeit der Funktionen

Eine Umfrage unter Eltern ergab, dass einige der prominent sichtbaren Funktionen im Dashboard selten, andere wiederum häufig genutzt werden. Dieses Ergebnis sollte als Grundlage für die Neustrukturierung des Dashboards dienen. Es wird deutlich, dass vor allem die Eingabemöglichkeiten wie Ferienabfrage und Abwesenheit häufig genutzt sind und daher prominent im Dashboard platziert werden sollten. Im Gegensatz dazu stehen statische Inhalte bzw. hinterlegte Informationen zum Kind, die nur selten verändert werden und daher keiner dauerhaft prominenten Platzierung bedürfen.

Schritt 3: Neustrukturierung der Funktionen

Durch das Feature Audit wurde schnell klar, dass häufig genutzte Funktionen teilweise noch zu tief in der Struktur versteckt sind. In der Neustrukturierung des Dashboards wurden also folgende Optimierungen vorgenommen:

  • Zugriffsbuttons wurden neu sortiert: die am häufigsten genutzten Buttons für Abwesenheit, Ferienabfrage und Abmeldezeit wandern in die erste Zeile und werden prominent gestaltet
  • Informationen zum Tag und alle weiteren Zugriffsebenen wandern in die zweite Zeile
  • Eingabe für Abwesenheit unter einem Button zusammengefasst, Gründe für Abwesenheit als Radio-Buttons
  • Angaben zu „Familie“ werden in „Über mich“ integriert, da inhaltlich zugehörig
  • Ferienabfrage wird aus „Weitere“ herausgelöst und kommt in prominente obere Buttonzeile
  • Kategorie „Krankheit-/Ferientage“ wird zwecks besserer Verständlichkeit umbenannt in „Statistik Abwesenheit“


Redesign des Dashboards

Entsprechend der Analyse sind die Hauptzugriffsbereiche nun prominent gestaltet und damit auf den ersten Blick schnell erfassbar. Die optische Differenzierung hilft zusätzlich bei der Orientierung. Verschachtelungen von Informationsebenen wurden teilweise aufgelöst und Inhalte zusammengefasst, so dass Inhalte besser auffindbar sind und ihre Platzierung selbsterklärender ist.

Nachrichten

Status Quo

  • Chat-Hierarchie schlecht erkennbar
  • Überschriften und Buttons im Aktionen-Menü schwer voneinander unterscheidbar

Redesign

  • Chat-Hierarchie klar differenziert durch Einrückungen und Ergänzung von Profilbild für beide Chat-Teilnehmer
  • Überschriften und Buttons im Aktionen-Menü klarer gekennzeichnet

Einstellungen/Profil

Status Quo

Allgemein:
 Vermischung von Informationsebene und Profileinstellungen

1
Zugriff auf die Eingabe-Funktion “Kontaktinformation” von zwei verschiedenen Ebenen aus 
–> schlechter erlernbare Navigation

3 & 4
Informationsebenen 
–> zu versteckt und unlogisch in der Struktur platziert 
–> Trennen von Kalender und Wochenplänen 
 aus Einstellungen

Redesign

Da ohnehin nur ein Elternteil in der App Zugriff hat, 
braucht es keine zwei Stellen, um Profilinformationen 
einzugeben und es braucht keinen Schnellzugriff oben.

  • Umbenennung des Navigationspunktes in “Einstellungen”
  • nur rein funktionelle und technische Einstellmöglichkeiten 
der App ohne Bezug zu Kind und Einrichtung
  • Neuer Navigationspunkt “Kalender”
  • beinhaltet Kalendereinträge und Wochenpläne, 
die beide von Einrichtungsseite gepflegt werden
  • Anpassung Iconstil
  • Optimierung der Typografie und Hierarchie bei Einträgen
  • neue hierarchische Strukturierung im Wochenplan