it-swarm.com.de

Best Practices für das Scrollen und Navigieren auf Touch-Oberflächen: horizontal oder vertikal

Es ist bekannt, dass bei herkömmlichen (Maus/Tastatur) Schnittstellen horizontales Scrollen widerspricht den Erwartungen der Benutzer Bei Touch-Geräten ist die Angelegenheit jedoch nicht so klar.

Gibt es Best Practices für Touch-Interfaces, um zu entscheiden, ob horizontales oder vertikales Scrollen verwendet werden soll? Gibt es Fallstudien dazu?

Wie können Sie dem Benutzer den Navigationsstil Ihrer App andeuten und beibringen? die Art und Weise, damit zu interagieren? und welche sind die effizientesten? (zB Apple verwendet Paginierungspunkte am unteren Rand des Startbildschirms, Windows verwendet jedoch das "Panorama", das einen kleinen Teil des folgenden Bildschirms zeigt)

Windows Panorama Style Interfacepagination dots

Ist die Größe/der Typ des Geräts (Telefon oder Tablet) für diesen Aspekt von Bedeutung? Selbst wenn nicht ausschließlich gescrollt wird, verwendet die Flipboard-App für das iPad beispielsweise horizontale Paginierungen oder Gesten, während die iPhone-App vertikale verwendet.

15

In westlichen Kulturen ist seit unserer Kindheit ein horizontaler (von links nach rechts) Fortschritt in uns eingebaut. Denken Sie darüber nach, wie wir lesen und wie wir das Magazin/die Bücher umblättern.

Auch Daumenbewegung ist wichtig. In der Studie von Microsoft: Die Leistung des Daumenmotors variiert je nach Bewegungsausrichtung, Richtung und Gerätegröße während der Verwendung von Einhand-Mobiltelefonen (PDF-Datei) stellten sie fest, dass der horizontale Winkel/45-Grad-Winkel schneller und einfacher ist wenn der Benutzer das Telefon mit einer Hand benutzt.

7
Igor-G

Ich weiß nicht, ob dies eine bewährte Methode ist/sein könnte, aber ich würde mich nicht nach Gerät, sondern nach Geräteorientierung unterscheiden. Unabhängig davon, ob es sich um ein iPad oder ein iPhone handelt, ist es für mich natürlicher, vertikales Scrollen im Hochformat und horizontales Scrollen im Querformat zu verwenden.

Mein Telefon verfügt über horizontales Scrollen in seiner Fotogalerie, unabhängig von der Ausrichtung, und es ist etwas umständlich, da nicht allzu viel Platz auf dem Bildschirm für die Wischvorgänge vorhanden ist ...

2
Marjan Venema

Obwohl die Bildschirmgröße die Art und Weise, wie Benutzer mit dem Gerät interagieren, direkt beeinflussen kann, ist es meiner Meinung nach wichtiger, zwei Haupttypen der Datendarstellung zu verstehen:

  1. Kontinuierliches Scrollen von (möglicherweise unendlichen) Daten
  2. Seitenwechsel von Daten, aufgeteilt in mehrere Blöcke, die miteinander in Beziehung stehen können (oder nicht)

Die Idee hinter dieser Trennung ist, dass kontinuierliche Daten detaillierter sind und unter Verwendung kleinerer Teile angezeigt werden könnten. Auf der anderen Seite bestehen ausgelagerte Daten aus größeren Informationsblöcken und wechseln möglicherweise in den völlig neuen Kontext, wobei alle Daten auf dem Bildschirm ersetzt werden.

Für die fortlaufenden Daten ist es üblich (für die Sprachen, die Priorität beim Schreiben von Zeilen über Spalten haben, dh von links nach rechts und dann von oben nach unten), nach oben/unten zu scrollen und zwischen Datenblöcken zu wechseln (auch wenn Chunks selbst möglicherweise nicht passen Der vertikale Raum wird normalerweise mit Wischen/Paging erstellt.

Ich verwende absichtlich den Begriff "Daten" anstelle von "Text" oder "Bilder" (oder was auch immer), da es mehr um die logische Struktur und nicht um einen bestimmten Datentyp geht (Sie können Text als fortlaufende Daten behandeln oder in Seiten aufteilen, z Beispiel).

Es gibt viele Ausnahmen von dieser Regel (zum Beispiel könnte Paging mit vertikalem Wischen durchgeführt werden), aber die generische Idee ist wie oben beschrieben.

In Bezug auf visuelle Markierungen der horizontalen Bildlaufverfügbarkeit.

Punkte wie virtuelle Registerkarten (siehe z. B. TweetDeck iPhone-App) eignen sich für die begrenzte Anzahl von Bildschirmen, und "Panorama" kann ansonsten für unendliches Paging verwendet werden (erfordert jedoch mehr Designarbeit, um den Benutzer nicht von den auf dem aktuellen Bildschirm dargestellten Daten abzulenken ).

2
alexeypegov