Einleitung

Innerhalb des Kurses „Die Maus im Fenster“ geleitet von Prof. Frank Rausch, widmete ich mich der Frage, wie Audible als native macOS aussehen könnte. 

Grundlage für das Redesign war die bereits vorhandene App von Audible, die es in dem Appstore zu downloaden gibt. Diese ist Stand heute allerdings eine iOS bzw. iPadOS App, die auch auf dem Mac funktioniert. Designed ist sie nach den eben erwähnten Guidelines. MacOS ermöglicht Interaktionsmöglichkeiten, die die Userexperience an der einen oder andern Stelle signifikant verbessern könnte. Wie die App von diesen Features profitiren könnte und wie diese ausgestaltet aussehen könnten, stelle ich nun in den folgenden Abschnitten vor.

Audible Originals

Audible ist eine Hörspiel Applikation aus dem Hause Amazon. Hier kann man aus einer großen Auswahl neue Hörspiele suchen und kaufen, die Vorhandenen in App Käufe verwalten und allgemein Hörspiele zuhause und unterwegs genießen. 

Die originale App funktioniert auf dem Smartphone und Tablet recht gut, weist allerdings auf dem PC bzw. Mac verschiedene Opportunity Areas auf. Besonders das Layout und das Fehlen von macOS typischen Elementen wie Sidebar, Statusleiste, Pop Over, dem Öffnen von neuen Fenstern und vielem mehr, ließ Audible auf dem Mac nach einer reinen iOS Applikation aussehen und bedienen.

Audible Redesign

Für das Redesign entschied ich mich dazu, weitere Usecases und Features mit einzubinden und Vorhandenes den Guidelines nach macOS anzupassen. Dank der vielen Iterations- und Feedbackrunden, sind einige Neuerungen entstanden, die ich in den folgenden Abschnitten vorstellen werde.

Der Player

Das Herzstück der App ist der Player für die Hörspiele. Hier halten sich die User vermutlich die längste Zeit auf. In der aktuellen Version der Audible App, ist der Player auf dem Handy gut zu bedienen, sieht auf dem Mac allerdings fast identisch aus. Da Maus, Tastatur und größerer Bildschirm deutlich mehr Raum für Interaktionen ermöglichen, habe ich einige Features und Details gestaltet, die diesem Funktionsumfang gerecht werden.

Navigation

Als erstes widmete ich mich der Navigation. Da das Original wenig discoverability und keine globale Navigation aufweist, sowie insgesamt viele Klicks erfordert, habe ich mich für eine Sidebar entschieden. Hier sind alle Funktionen der App schnell zugänglich und auf einen Blick ersichtlich.

Tool Bar

Als nächstes gestaltete ich eine Toolbar mit integriertem Player. Dieser ermöglicht es auch beim Browsen von z.B. neuen Hörspielen jederzeit Zugriff auf das momentane Hörspiel zu haben. Weiter kann hier die Lautstärke geregelt, sowie Transkription an und abgewählt werden. Auch fährt sich hier die zweite Sidebar aus und ein. Dieses Feature habe ich hinzugefügt und finde es sehr spannend.

Transkriptionsmodus mit Charakter Beschreibungen (Sidebar links)

Im Laufe der Itertationen hat sich ein Feature herausgebildet, das ich sehr mag und wirklich gerne mal benutzen würde. In Toolbar lässt sich eine weitere Sidebar von rechts ausfahren. Hier wird das Gehörte verschriftlicht und läuft wie eine Art Chatfenster nebenher. Es lässt sich scrollen und mit einem Klick auf die Charaktere, öffnet sich ganz Mac-like ein weiteres Fenster. Hier lassen sich weitere Metadaten abrufen. Oft habe ich Schwierigkeiten, mir jede*n Protagonist*in zu merken. Dank dieser Funktion kann man stets sehen, um wen es sich gerade handelt, wie diese Person heißt und was sie für eine Rolle inne hat. Zur mentalen Orientierung innerhalb des Hörspiels wäre ich sehr dankbar über dieses Feature.

Kapitelübersicht

Mittig ist die Kapitelübersicht angeordnet. Oben ist das Cover des Hörspiels , recht daneben Autor, Titel etc. zusätzlich noch eine Avatar Group für die Charaktere innerhalb des aktuellen Kapitels. Darunter eine Liste mit der Kapitelübersicht. Hier sieht man kurze Zusammenfassungen des aktuellen sowie weiterer Kapitel, kann downloaden, speichern uvm.

Die Suchfunktion

Als nächstes entwickelte ich eine neue Suchfunktion. In der originalen App ist diese recht unübersichtlich und schwer zu bedienen. Auch schrie das gesamte Layout nach einer Überarbeitung. 

Um den vertikalen Raum mehr zu nutzen, erstellte ich eine Such- bzw. FIlterfunktion in Listenansicht, darunter dann die gefundenen Resultate in Form von Hörspielen.

Detailansicht eines Hörspiels

Hat man ein interessantes Hörspiel entdeckt, möchte man weiterführende Informationen über dieses aufrufen. Hierfür machte ich ein Redesign der Detailansicht.

Auch hier habe habe ich mich bemüht, den vertikalen Raum mehr zu nutzen als in der originalen Version. Die Elemente sind dabei weitestgehend ähnlich, allerdings anders angeordnet und etwas feinjustiert.

Prototype und Userflow

Wie das Ganze in Aktion aussieht, habe ich in einem Screencast zusammengefasst. Einfach auf das Video unten klicken und los gehts.

Fazit

Das Projekt und Redesign von Audible hat viel Spaß gemacht und ich habe wirklich viel dabei gelernt. Gerade das Designen einer macOS App war für mich völliges Neuland. Dank der vielen Integrationen und Feedback Runden innerhalb des Kurses, bekam ich viel Input, an dem ich mich abarbeiten konnte. Mit dem Ergebnis bin ich zufrieden und kann den Kurs jedem Empfehlen, der sich für das Gestalten von nativen Mac Apps interessiert sowie für das Thema Desktop und Betriebssysteme allgemein, genauso nerdig wie spaßig.