Konzipieren für Tablet-Rechner:
So gelingt eine gute Zeitungs-App

18. Februar 2011

Nicht etwa Spiegel, Focus oder Zeit, nicht etwa FAZ oder Süddeutsche – nein, ausgerechnet die krisengeschüttelte Frankfurter Rundschau demon­strierte im September 2010, wie ein Printmedium auf dem iPad neu erfunden werden kann. Nutzer und Fachpresse waren mehr als angetan: Von den Käufern gab es fast ausnahmslos stehenden Beifall, und selbst kritische Branchenbeobachter gaben sich dem Jubel hin. Der Kress bewertete die FR-App als »die bisher beste deutsche iPad-App einer Tageszeitung«. Von einem wirklich »großen Wurf« sprach Meedia.de und attestierte der FR zumindest in der DuMont-Welt eine »Vorreiterrolle in Sachen digitales Publizieren«. DWDL.de meinte gar, die FR-Redaktion habe »weltweit Wegweisendes« vorgelegt. Obendrauf gab es für die iPad-FR zum Jahresende dann auch noch einen Sonderpreis des European Newspaper Award in der Kategorie »iPad und mobile Endgeräte«. Bislang gibt es natürlich erst ein paar Dutzend Apps deutscher Zeitungen und Zeitschriften, doch so viel Lob will erst einmal verdient sein.

Nichts anderes als Software
Eine Tablet-Applikation, also eine Anwendung für ein digitales Endgerät wie dem iPad, ist zuallererst nichts anderes als ein Stück Software. Für Software gibt es einen einigermaßen tragfähigen Konsens über Qualitätskriterien. Zu finden sind diese Kriterien in den entsprechenden DIN-Normen, ganz wesentlich in den sieben Grundsätzen der Dialoggestaltung (DIN EN ISO 9241-110): Danach kann Software dann als nutzerfreundlich gelten, wenn sie aufgabenangemessen, selbstbeschreibend, steuerbar, erwartungskonform, fehlertolerant, individualisierbar und lernförderlich gestaltet ist. Der vielleicht wichtigste Faktor in dieser Reihe ist die Erwartungskonformität. Praktisch meint sie: Content-Design und Navigations­logik einer App sind konsistent so zu strukturieren, dass alles so aussieht und funktioniert, wie es die Nutzer gewohnt sind. Sprich: Die gesamte App braucht ein verlässliches, vertrautes Ordnungsmuster und durchgängig eingesetzte Standard-Elemente.

Die iPad-FR erfüllt dieses Kriterium in geradezu prototypischer Weise. Als Navigations­prinzip ist ihr eingebaut, dass jeder Format-Modus (hoch oder quer) seine eigene, eindeutige Funktion erfüllt: Hält ein Nutzer das iPad im Hochformat in den Händen, dann bekommt er eine Fassung ohne Schnörkel, mit Text und mit Bild. Hält er es dagegen im Querformat in den Händen, dann wandelt es sich zum Multimedia-Magazin.

Das Querformat liefert den Nutzern »viele Überraschungen«, so Michael Bayer, Ressortleiter Multimedia der FR. »Sie müssen lediglich auf einen kleinen grünen Kreis drücken, der auf weitere Informationen, Bilder oder Videos hinweist.« Die FR-App hat also quasi einen eingebauten Drehschalter: Ins Querformat drehen bedeutet, die Multimedia-Fassung aufzurufen, ins Hochformat drehen bedeutet, die auf Texte und Fotos konzentrierte Lese-Fassung aufzurufen.

Role-Model für Zeitungs-Apps
Die Redaktion hat das gerätetypische Doppelformat des iPad damit auf eine Weise genutzt, in der sich für die App eine klare, innere Ordnung ergibt. Der Ansatz könnte sich zum Standard mausern, denn tauglich erscheint diese Navigationslogik als Role Model auch für andere App-Anbieter. Nicht ganz überraschend findet es sich beispielsweise auch – unabhängig von der FR – im sogenannten Libroid-Format für E-Bücher, entwickelt von Ex-Spiegel-Mann und Bestseller-Autor Jürgen Neffe.


Das Libroid will das Buch für Tablet-Rechner sein

Kern der Libroid-Technik ist ein Dreispalten-Raster fürs Querformat, verknüpft mit einem Einspalten-Raster fürs Hochformat: In der Mittelspalte steht der Text, rechts und links wird dieser Kern-Inhalt von schmaleren Randspalten flankiert. Dort können Fotos eingebunden werden beziehungsweise Links ins Internet, Karten oder Grafiken – ganz ähnlich wie im Hypertext des Webs. Die drei Spalten sind kontextuell so verwoben, dass inhaltlich zueinander gehörende Texte, Bilder, Links oder Fotos in der Bildschirmhorizontalen stets miteinander auf Augenhöhe stehen. Wird eine der Spalten gerollt, bewegen sich die anderen entsprechend ihrer inhaltlichen Verzahnung mit eigener Geschwindigkeit mit. Nutzer, die diese Ergänzungen ausblenden wollen, drehen das iPad in die Senkrechte und die Randspalten verschwinden zugunsten des »reinen«, ungestörten Lesens – ähnlich wie in der iPad-FR.

Vertraute Metaphern nutzen
Um Erwartungskonformität zu gewährleisten und die Leser zum Start nicht zu überfordern, hilft der Rückgriff auf vertraute Konventionen aus der Print- und der Web-Welt. Einige ausgewählte Beispiele:

Der Umfang: Ganz oben auf der Liste der Print-Metaphern, die auch für Apps adaptiert werden sollten, steht die Eigenschaft „begrenzter Textraum“. (…) Ein echter Knackpunkt ist die jeweilige Dateigröße einer App-Ausgabe: Apps mit fast einem halben Gigabyte benötigen je nach Internetverbindung schnell bis zu 15 Minuten allein fürs Herunterladen und Installieren, also etwa die Hälfte der durchschnittlich fürs tägliche Zeitunglesen aufgewendeten Zeit. Für monatlich erscheinende Magazin-Apps wie Wired mag das vielleicht noch akzeptabel sein. Für tagesaktuelle Zeitungsapps ist das zweifellos ein Manko, denn auf Dauer können zu lange Ladezeiten ein echtes Verkaufshemmnis bedeuten. Auch hier zeigt sich die iPad-FR als Vorreiter: Das Entwicklungsteam hat es seit dem Start geschafft, die Dateigröße für die einzelne Ausgabe auf unter 90 Megabyte zu halbieren.

(…)

Die Paginierung: Ob fortlaufende, absolute Seitenzahlen in einer App sein müssen oder nicht, erscheint momentan noch unentschieden. Manche bieten sie an (GEO, Handelsblatt), andere verzichten darauf (FR, Stern), wieder andere setzen relative Seitenzahlen für einzelne Artikel ein (also Seitenangaben wie „1 von 5“, etwa beim Spiegel) oder relative Artikelnummerierungen für einzelne Ressorts (beispielsweise „Artikel 1 von 6“, etwa bei Focus). So oder so brauchen Leser innerhalb einer App in jedem Fall eine Information über ihren aktuellen Standort. Minimum ist deshalb ein aufrufbares, horizontales oder vertikales Navigationselement für Vor-Zurück-Bewegungen im gesamten Textraum einer App, etwa als Fortschrittsleiste mit Seitenzahlangabe, als Popover-Inhaltsverzeichnis oder als sogenannte Flip-View mit Seitenminiaturen.

Auch Web-Logiken sind zu beachten
Print-Konventionen allein reichen allerdings nicht aus, um eine mediengerechte App auf die Beine zu stellen. Die Spiegel-App in der Ur-Version beispielsweise wurde von vielen Nutzern heftig kritisiert, weil ihr als digitales Medium ein erkennbarer Mehrwert gegenüber der Print-Version fehlte. Uninspirierte E-Paper-Kopien oder gar simple PDFs in verappter Form wurden und werden in den Käufer-Kommentaren nicht zufällig regelmäßig verrissen. Auch Goldmedia Research stellte in seinen Forschungen fest, dass gerade jene Nachrichten-Apps von den Nutzern favorisiert werden, die neue Formen und Darstellungsmuster bieten. Das iPad ist in den Augen der Nutzer demnach ganz offensichtlich ein Multimedium. Neben Schrift, Foto und Grafik werden – ganz wie im WWW – auch Audios und Videos erwartet und das alles möglichst in interaktiven Spielarten. Entsprechend gehören zwingend auch Metaphern aus dem Web-Publishing in den Werkzeugkasten der App-Entwickler. Auch hier einige, ausgewählte Beispiele:

Standard-Positionen: (…)

Rollseiten-Konventionen: Anders als Papierseiten sind Bildschirmseiten prinzipiell nicht längenbegrenzt, theoretisch könnten sie jeweils Hunderte Meter lang sein. Für die App-Konzeption ist deshalb zu entscheiden, ob Bildschirmportionen oder Rollseiten angeboten werden sollten. Werden Rollseiten eingesetzt, ist festzulegen, wie lang sie maximal sein dürfen und wie sie binnenorganisiert werden. Eine iPad-Konvention ist in den bislang gelaunchten Apps im Ansatz bereits zu erkennen: PDF-Äquivalente setzen auf das Blättern als Metapher, iPad-spezifische Apps eher auf Rollseiten-Lösungen. In der FR-App beispielsweise werden Texte, die länger sind als der Bildschirm hoch ist, grundsätzlich zu Rollseiten. Im Hochformat werden sie zu Einspaltern, im Querformat zu Dreispaltern. Alle Seiten laufen also vertikal ohne relative Paginierung. In der Stern-App dagegen haben alle längeren Texte, unabhängig vom Format, einen Einspalten-Umbruch und werden durch querlaufende rote Balken jeweils am Seitenkopf in Bildschirmportionen zerlegt. Das Balken-Element erzeugt also Seitenabschnitte innerhalb der Rollseiten. Das ist zwar ungewöhnlich, kann aber durchaus nützlich sein, weil es den Lesefortschritt stärker betont. Handwerklich besser wäre allerdings, wenn auf jedem roten Querbalken eine relative Seitenzahl (also etwa „Seite 1 von 12“) stünde, damit zu jedem Lese-Zeitpunkt klar ist, wie viele Abschnitte die Rollseite insgesamt hat und welcher Abschnitt gerade auf dem Schirm ist.


In der Stern-App werden längeree Texte durch querlaufende rote Balken in bildschirmfüllende Portionen unterteilt.

(…)

Multimedia: Für Michael Bayer, iPad-Projektleiter der Frankfurter Rundschau, eröffnen Tablet-Computer eine neue Welt des Publizierens. „Wir gehen davon aus“, so Bayer, „dass iPad-Leser deutlich jünger sind als Zeitungsleser, dass sie technikaffin sind – und multimediale Elemente lieben.“ Entsprechend spielt das multimediale Storytelling in der iPad-FR eine besondere Rolle. Dort, wo es sich anbietet, werden einzelne Geschichten quasi ipadifiziert, also durch Hörproben, Audiosequenzen, Ton-Bild-Schauen, Kurz-Videos, interaktive Grafiken oder interaktive Textkästen ergänzt. Als Erkennungszeichen weist ein grüner Kreis quer durch die App auf diese Elemente hin. Das iPad-Team der FR hat damit auch in diesem Aspekt aus dem Stand ein ebenso einfaches wie effektives (und noch dazu markenfähiges) Navigationsinstrument geschaffen. Für den jeweiligen Medienmodus kann es mit einem jeweils passenden Zeichen bestückt werden. Geeignete Symbole für Text, Foto, Audio, Video oder Grafik sind den meisten Nutzern aus dem Web bereits vertraut (s Abb.), entsprechend sollte auch in den Tablet-Apps auf das gängige Set dieser Icons zurückgegriffen werden.



Die App mit dem grünen Kreis: Multimedia-Komponenten sind in der iPad-FR schnell zu erkennen.

Unverzichtbar für Audio- und Video-Sequenzen sind zudem die webtypischen Fortschrittsleisten, schließlich will jeder Nutzer spätestens beim Aufruf einer multimedialen Komponente wissen, wie lang das Zuhören oder Zuschauen maximal dauern kann. Das klingt vielleicht alles etwas selbstverständlich, doch manche Apps dokumentieren erstaunlicherweise das Gegenteil. Audio-Sequenzen in Wired oder auch in der FR kommen beispielsweise gern einmal ohne Fortschrittsleiste daher oder zumindest ohne Laufzeit-Angabe aus. Niemand ist unfehlbar.

Auch wenn sich Gestaltungskonventionen für Tablet-Apps also erst in blassen Umrissen abzeichnen, liefern etliche der bislang realisierten Applikationen bereits überzeugende Modelle. Die FR-App ist aus vielen Gründen ein ausgezeichnetes Role Model und kann konzeptionell als Orientierungsinstanz dienen. Manches darin hat ohne Zweifel das Zeug, sich als Standard zu festigen.

Bis sich allerdings Konventionen für News-Apps herauskristallisieren, wird noch einige Zeit vergehen. Mediendesign-Guru Mario Garcia zum Beispiel glaubt, dass sich ein Design für Tablet-Rechner „in fünf Jahren als etwas Eigenes etabliert haben wird, mit sichtbaren Anlehnungen an traditionelles Printdesign“ und „80 Prozent Design speziell für Tablets.“ Ob diese Vorausschau zutrifft, wird letztlich auch davon abhängen, ob kostenpflichtige News-Apps den Nutzern tatsächlich einen echten Mehrwert bieten – gerade gegenüber Tablet-optimierten, kostenlos zugänglichen Websites. Aber das ist ein anderes Thema.

Den vollständigen Artikel finden Sie in der Januar-Ausgabe der Medienfachzeitschrift Message.

publiziert in Usability/UX
blog comments powered by Disqus
S. 1 v. 11
 



  • Das Handbuch für alle Onlinejournalisten

  • Die Schlagwörter-Wolke

    Das Buch: Texten fürs Web Der Floskelmülleimer Die Bunte Seite Die TfW-Praxistipps Die Top-Artikel auf TfW Freitagnachmittaglink Medienmarkt Online-Textformen Text-Umkleidekabine Usability/UX
  • Translator

    German flagEnglish flagFrench flagSpanish flagJapanese flagArabic flagDutch flagTurkish flag                                        
  • Archiv nach Monaten