Incom ist die Kommunikations-Plattform der Technische Hochschule Augsburg Gestaltung

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

STAX

STAX – explore and organise digital books

0. Workflow

Basierend auf den Ideen des Buchs »Sprint«, welches von Jake Knapp, John Zeratsky und Braden Kowitz verfasst und von Google Ventures veröffentlich wurde, entstand das Projekt STAX. Der Prozess unterteilt sich in fünf wesentliche Schritte (engl. »Milestones«). Im Folgenden wird insbesondere auf die Gestaltung eines Prototypen und den abschließenden Test an echten Personen eingegangen.

MuellerMoritz_Discover_Praesentation.001.jpegMuellerMoritz_Discover_Praesentation.001.jpeg

1. Beschreibung

Klassische Bücher mussten in den letzten Jahren deutlich an Popularität einbüßen. Besonders die jüngere Generation bevorzugt die Inhalte von Streamingplattformen oder konsumiert Content aus sozialen Medien. Der amerikanische Medienwissenschaftler Neil Postman kritisiert in seinem Buch »Wir amüsieren uns zu Tode« den Einfluss der neuen Kanäle und prophezeit, eine Symbiose aus digitalen und analogen Medien als Wissensquelle sei unmöglich. Das Projekt STAX möchte sich dieser Aufgabe stellen und soll das Lesen von Büchern im digitalen komfortabel und im Allgemeinen wieder salonfähig machen.

2. Analog

Möchte man eine Brücke zwischen einem analogen und einem digitalen Interface schlagen, lohnt es sich, zunächst die Abläufe und Möglichkeiten zu erforschen. Das klassische Printmedium »Buch« existiert schon sehr lange und viele sind an den Umgang damit gewöhnt. Zudem lassen sich anhand einiger Experimente viele Attributen erkennen, welche uns unterbewusst bei der Auswahl beeinflussen. So gibt zum Beispiel die Dicke erste Hinweise über die Menge an Inhalt oder der Schatten eines Buchstapels lässt die ungefähre Höhe erahnen und lässt somit erste Rückschlüsse auf die Anzahl der Bücher im Stapel zu.

read.pngread.png
stack.pngstack.png
lib.pnglib.png

2.1 Digital

Die digitale Welt bietet viele Optionen, welche zu Zeiten des Buchdrucks unmöglich gewesen wären. Die elementaren Grundfunktionen sind jedoch stark an den altbekannten Umgang mit dem Medium Buch angelehnt, da so eine geringe Einarbeitungszeit seitens der BenutzerInnen angenommen werden kann.

MuellerMoritz_Discover_Praesentation.001.jpegMuellerMoritz_Discover_Praesentation.001.jpeg

3. Werkzeuge

Folgende Software wurde für die Ausarbeitung eines Prototypen gewählt, welcher einem Endprodukt so nah wie möglich kommen sollte.

MuellerMoritz_Discover_Praesentation.001.jpegMuellerMoritz_Discover_Praesentation.001.jpeg

4. Styleguide

Die Gestaltung des Interfaces von STAX wurden durch zwei Personen maßgeblich inspiriert. Dieter Rams, ein deutscher Industriedesigner, welcher bis heute durch seine radikale Reduktion in der Gestaltung von Produkten polarisiert, war der Auffassung, gutes Design sei »so wenig Design wie möglich«. Kombiniert mit den Thesen des dänischen Schriftstellers und Entwicklers Jakob Nielsen, gute Gestaltung zeichne sich vor allem durch »Consistency« aus, entstand der grundlegende Ansatz zur Realisierung einer Benutzeroberfläche. STAX soll durch ein einfaches, intuitives und konsistentes Interface überzeugen.

Diese Richtlinien wurden in Form eines Styleguides zusammengefasst sowie stetig angepasst und verbessert.

STAX_CI_20202.jpgSTAX_CI_20202.jpg
STAX_CI_2020.jpgSTAX_CI_2020.jpg
STAX_CI_20203.jpgSTAX_CI_20203.jpg
STAX_CI_20204.jpgSTAX_CI_20204.jpg
MuellerMoritz_STAX_Praesentation Kopie.001.jpegMuellerMoritz_STAX_Praesentation Kopie.001.jpeg
MuellerMoritz_STAX_Praesentation Kopie.002.jpegMuellerMoritz_STAX_Praesentation Kopie.002.jpeg

5. »Navigating Complexity«

Neben der Konsistenz im Design sollte auch die Benutzung einem gleichen oder zumindest ähnlichen Schema folgen. Die Frage nach der Einfachheit eines Systems, was wir als einfach empfinden und ob ein Interface dahingehend optimiert werden kann oder aber ob das System nur durch eine gewisse Komplexität Bestand haben kann, war elementarer Bestandteil des Entwurfsprozesses. 

Durch die Visualisierung von Routen, welche innerhalb der App existieren wurde auf die Frage nach der Komplexität in der Navigation Bezug genommen und nach Möglichkeit wurden diese Routen verkürzt, was eine Verbesserung der Benutzerfreundlichkeit mit sich bringt. Erreicht wurden diese Optimierungen durch abstrakte Überlegungen, als Beispiel soll an dieser Stelle das Hick-Herman Gesetz genannt werden (»Je mehr Auswahlmöglichkeiten zur Verfügung stehen, desto länger braucht man, um sich zu entscheiden«).

MuellerMoritz_Discover_Praesentation.003.pngMuellerMoritz_Discover_Praesentation.003.png

6. Cross-Platform-Kompatibilität

»Responsive« bedeutet, dass eine digitale Oberfläche sich den Bedingungen des Endgeräts, auf welchem die Anwendung aufgerufen wird, anpasst. Alle Funktionen sollen unabhängig von Betriebssystem oder Größe in vollem Umfang zur Verfügung gestellt werden. Hierbei gibt es verschiedene Ansätze. Die Abbildung umfangreicher Informationen auf beschränktem Raum (kleine Displaygrößen) soll eine der Schlüsselqualitäten von STAX sein. Daher wurde der Ansatz »mobile first« gewählt, das Interface soll insbesondere auch auf mobilen Endgeräten gut funktionieren. Die Adaption auf größere Bildschirme gelingt anschließend ohne größere Komplikationen.

MuellerMoritz_Discover_Praesentation.004.pngMuellerMoritz_Discover_Praesentation.004.png

7. Befragung potenzieller NutzerInnen

Ob ein Produkt Zukunft hat und welche Faktoren weiterentwickelt, verändert oder verworfen werden sollten, lässt sich nach den Autoren des Buchs »Sprint« (genauere Beschreibung im Abschnitt »Workflow«) am besten herausfinden, wenn dazu echte, potenzielle KonsumentInnen befragt werden. Die angestellten Befragungen bezogen sich auf die Kategorien Design, Navigation und Logik. Letzteres zielt vor allem auf die Frage ab, ob und wie schnell man die Anwendung erfasst, ohne dass es dabei weiterer Erklärung bedarf. Hier kam es durch die Frage nach dem Zusammenhang der Farben zu weitreichenden Änderungen im Styleguide.

MuellerMoritz_STAX_Praesentation Kopie.001.jpegMuellerMoritz_STAX_Praesentation Kopie.001.jpeg

8. Präsentation

Zu Präsentationszwecke wurde ein Promovideo erarbeitet, welche die Vorteile und Funktionen in kurzer Form zusammenfasst und auch einen ersten visuellen Eindruck vermittelt.

9. Visionen

Der hier vorgestellte Prototyp zeigt bereits, welches Problem STAX lösen kann. Der Transfer von analogen Abläufen, welche bei LeserInnen intuitiv ablaufen, wurde als Grundlage für alle weiteren Experimente und Entwürfe herangezogen. Als Resultat entstand eine Benutzeroberfläche, welche sich vor allem die Frage nach der Komplexität der Navigation stellte und ob diese durch das Anwenden von gewohnten Abläufen simplifiziert werden kann. Potenzielle NutzerInnen konstatierten neben einer gelungen Optik auch die ungewohnt einfache Orientierung innerhalb der Anwendung. Durch Anregungen und Kritik ist aus STAX Ein Projekt geworden, welches auch nach dem Ende dieses Semesters noch nicht als abgeschlossen gilt, sondern lediglich als eine erste, grundlegende Idee angesehen werden soll, welche nach Möglichkeit weiter entwickelt werden kann. Als nächste Schritte könnte zum Beispiel die Einbindung einer Datenbank und weitere optische sowie funktionale Optimierungen vorgesehen sein.

10. Danksagung

Bedanken möchte ich mich bei allen Personen, welche mich im kreativen Entwurfsprozess des Projekts STAX unterstützt haben. Zunächst ist Herr Prof. Daniel Rothaug zu nennen, welcher eine sehr offene Herangehensweise an das Thema »Navigating Complexity« ermöglichte und eigene Ideen stets begrüßte. Außerdem förderte er die Entwicklung zu jedem Zeitpunkt mit Anregungen, Verbesserungsvorschlägen und kreativen Ideen.

Außerdem gilt mein Dank auch all denjenigen, welche sich die Zeit nahmen, den Prototypen zu testen, um anschließend Lob und Kritik zu äußern.

Ein Projekt von

Fachgruppe

Interaktive Medien

Art des Projekts

Studienarbeit im ersten Studienabschnitt

Betreuung

foto: Prof. Daniel Rothaug

Zugehöriger Workspace

Interfacedesign / Mensch und Maschine / IA

Entstehungszeitraum

Wintersemester 2020 / 2021

Keywords