tolino family sharing

Planung, Product Design und Einführung des Features Family Sharing für den tolino E-Reader und die plattformübergreifende tolino App.

  • Produktdesign
  • UX Research
  • Designsystem
  • Barrierefreiheit
  • Handel
Ein tolino E-Reader auf dessen Bildschirm der Willkommensbildschirm des Feautures tolino family sharing zu sehen ist mit dem Button Start.

SCOPE

Plattformübergreifende Feature-Implementation, Designsystem-Erweiterung, Illustrationselemente, Prototyping, Usability-Tests, Stakeholder-Workshops, Design- und Entwicklungsbegleitung.

Die Funktion auf vier Geräten gleichzeitig – Desktop, Laptop, Tablet und Smartphone – jedes mit einem Schritt der Familiengründung: Spitznamen wählen, „Familie anlegen“ und der Startbildschirm auf Deutsch und Englisch.
Eine Funktion, vier Plattformen

DISCOVER

Auf Basis von Umfragewerten, Interviews und Stakeholder-Anforderungen, wurde die Funktionalität des Features tolino Family Sharing definiert. Zuerst wurden Kernfunktionen priorisiert und anhand von User Stories und Flows auf Komplexität der Umsetzung geprüft. Danach wurde die Informationsarchitektur auf Basis einfacher Wireframes und Prototypen getestet und optimiert.

Das Illustrationsset auf hellem Blau: Bücher und Tablets als Strichfiguren mit Armen und Beinen – in einer Reihe laufend, sich begrüßend, ein aufgeschlagenes Buch weiterreichend, dazu eine Hand, die einen Brief mit Herz einwirft, ein benommenes Gesicht und ein eingerissenes Lesezeichen für die Fehlerzustände.
Illustrationsset
Drei E-Reader auf Altrosa mit der Einladungsstrecke: „You are invited!“ mit einer Hand, die einen Brief entgegennimmt, „Welcome to the family!“ mit vier jubelnden Figuren und „Now share a book.“ mit einem Buch, das zwischen zwei Figuren weitergereicht wird.
Einladungsstrecke
Zwei E-Reader nebeneinander auf Korallrot: „Welcome Luigi!“ bestätigt die Verbindung mit Marios Familie, „Now share a book.“ bietet an, das erste Buch zu teilen.
Dieselben Screens auf dem Gerät

DEFINE

Der Umfang des MVP wurde auf Basis der Erkenntnisse aus der Discovery-Phase definiert. Kritische und Wichtige Flows wurden zusätzlich von User Interviews validiert und iteriert. Das Designsystem wurde geprüft und auf Basis der bestehenden tolino Designsysteme erweitert und um neue Komponenten für Family Sharing ergänzt.

Startbildschirm in Bewegung
Eine Hand hält ein Tablet vor mintgrünem Hintergrund; auf der Buchseite liegt der Bestätigungsdialog: das Fred-Cover, „You are now sharing Fred by Anne Lowinsky with Mama“ sowie die Buttons „Share another book“ und „Done“.
Derselbe Dialog auf dem Tablet

DEVELOP

Klickbare Prototypen würden für eine finale Abstimmung mit Stakeholdern und für weitere Usability-Tests erstellt. Individuell angefertigte Illustrationselemente bildeten sowohl intern, wie auch extern auf Marketing-Ebene, einen Wiedererkennungswert. Die finalen HiFi-Wireframes wurden an die Dev-Teams übergeben, die in enger Absprache mit dem Design-Team die Funktionalität auf allen Plattformen implementierten.

Lesestatus-Karten für iOS oben und Android unten, dasselbe Cover in jedem Zustand: neu und nicht geladen, wird geladen, geladen, in Bearbeitung, beendet, ausgeliehen und in Bearbeitung, ausgeliehen und abgelaufen sowie Leseprobe.
Alle Lesestatus, beide Plattformen
Themenfarben und ihre Anwendung
Das Icon-Set in 24, 32 und 48 Pixeln, jede Größe in fünf Ausprägungen – Dunkelgrau, Schwarz, Blau, Hellgrau und Weiß – mit Sortieren, Konto, Bearbeiten, Bild, Buch, Link, Synchronisieren und dem Familien-Symbol.
Icons in allen Größen und Gewichten
Button-Zustände in drei Varianten – Text, Outline und gefüllt – jeweils als enabled, disabled, hover, focussed und pressed, annotiert mit den Hex-Werten für Text, Hintergrund und Kontur.
Button-Zustände, spezifiziert

DELIVER

Alle Flows wurden nach der Implementierung auf allen Plattformen getestet und optimiert. Family Sharing wurde in die tolino App und den tolino E-Reader direkt integriert und per Software-Update ausgeliefert.

Die Seite „About the book“ zu „Fred the lonely monster“ von Anne Lowinsky, als gelesen markiert, mit Continue-Button und dem Hinweis „You don’t share this book.“ Ein gelber Kreis markiert den Tap.
Ein eigenes Buch
Dieselbe Buchseite weiter gescrollt: unter „You don’t share this book“ erscheint der umrandete Share-Button, von einem gelben Kreis markiert, darunter beginnt die Inhaltsangabe.
Teilen aus dem Buch heraus
Der Screen „Share a book“ mit der Frage „With whom do you want to share?“, dem Fred-Cover neben Titel und Autorin und darunter den Familienmitgliedern – Mama, Luigi, Alfred, Yvonne und Neo –, wobei Luigi von einem gelben Kreis hervorgehoben ist.
Empfänger auswählen
Ein Bestätigungsscreen: das Fred-Cover über einem Icon aus Hand, Buch und eingekreistem L, dem Satz „You now share Fred by Anne Lowinsky with Luigi“, einem Link zur Familienübersicht und dem Button „Share another book“.
Bestätigung

Verwandte Projekte