it-swarm.com.de

Double Tab Navigation - Was denken Sie über diese Erfahrung?

UPDATE: Am Ende habe ich die doppelten Registerkarten entfernt, um die Erfahrung zu vereinfachen. Sie können das Ergebnis auf der Website sehen.

Ich habe ein UX-Problem, bei dem ich gehofft habe, dass Sie helfen können.

Ich gestalte unser Navi auf SuperMoney neu, um mehr Navigationsebenen bereitzustellen, ohne jedoch zu viel Platz in Anspruch zu nehmen. Die Website wird in drei Hauptbereiche unterteilt: Überprüfungen, Inhalte und Tools.

Siehe Modell:

Mockup of site with two levels of top nav, where the second level is scoped by the first, and side nav

Für die Inhaltsnavigation habe ich das Navi oben entworfen, das einen doppelten Satz von Registerkarten verwendet. Wenn Sie mit der Maus über Topics fahren, werden die Kategorien der obersten Ebene angezeigt. Wenn Sie den Mauszeiger über eine Kategorie bewegen, werden die Unterkategorien in der linken Seitenleiste (und die relevanten Artikel) angezeigt. Wenn Sie den Mauszeiger über eine dieser Unterkategorien bewegen, werden die angezeigten Artikel erneut aktualisiert.

Denken Sie, dass die verschachtelten Registerkarten UX verwirrend sind?

6
Miron Lulic

Die doppelte Lasche ist ein starkes System. Es benötigt sehr wenig vertikalen Raum und kommuniziert die Idee einer Hierarchie sehr effektiv. Die verschachtelten Registerkarten sind jedoch ein großer Nachteil. Ihr Design geht ziemlich gut damit um, aber es ist immer noch ein wenig beschäftigt.

Meine Lieblingslösung ist die Verwendung eines kleinen Dreiecksausschnitts für eine der Ebenen. Zum Beispiel:

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Dies hat viele der gleichen Vorteile wie das Registerkartenmuster, sieht jedoch anders aus und ist etwas subtiler, was für die zweite Ebene der Hierarchie geeignet ist.

Schließlich kann ich nicht sagen, ob dies für Ihre Benutzeroberfläche gilt, aber nur für den Fall: Verwenden Sie keine Hovers, um das Untermenü der Registerkarte anzuzeigen. Das Tab-Muster ist großartig, solange Sie sich religiös an die Metapher halten. Wenn eine Registerkarte aktiv ist, sollte alles auf der metaphorischen Papierkarte zu dieser Registerkarte gehören. Wenn Sie zu irgendeinem Zeitpunkt die Registerkarte A über den anderen Registerkarten anzeigen und der Inhalt der Registerkarte B noch vorhanden ist, verstoßen Sie gegen die Regeln Ihrer eigenen Schnittstellenmetapher, und Ihre Benutzeroberfläche leidet darunter. Sie können ein Dropdown-Menü für die Registerkarten verwenden (die Sie anscheinend haben), aber die aktive Registerkarte nur ändern, wenn sie sich tatsächlich ändert (Inhalt und alle).

3
Peter

Registerkarte CREDIT der sekundären Ebene hat aufgrund der gleichen weißen Farbe und Grenzlinie eine starke wahrgenommene Beziehung zum Hauptbereich.

Gleichzeitig ist die Beziehung zwischen Registerkarten der oberen und zweiten Ebene weniger ausgeprägt. Ein Benutzer kann die Beziehung zwischen ihnen verstehen, indem er Etiketten liest und vergleicht (d. H. Text analysiert) und sie dann visuell erhält (d. H. Unbewusst). So bekommt ein Benutzer etwas mehr mentale Belastung.

Um die visuelle Beziehung zwischen den Ebenen zu verbessern, können Sie einige Hinweise verwenden. Vergleichen Sie zum Beispiel:
tabs
Vs.
tabs

Außerdem sieht die Benennung der Beschriftungen etwas verwirrend aus: Es gibt DEBT-Beschriftungen sowohl im Registerkarten- als auch im Menü der dritten Ebene.

Versuchen Sie, sowohl visuelle als auch logische Hinweise zu erstellen, um eine stark wahrgenommene Beziehung herzustellen.

3

Gut gemacht. Ich mag die Richtung, in die es geht, und die Funktionalität sieht genau richtig aus. Die drei Schritte bis zur Information beunruhigen mich jedoch. Zugegeben, wir alle möchten, dass die Dinge durch eine Reihe von Aktionen einfach sind, anstatt intuitiv zu versuchen, was relevant ist, aber ich denke, eine vereinfachte Version Ihrer Architektur zeichnet sich ab. Schauen Sie sich Mashable.com an, um ein großartiges Beispiel dafür zu finden, wie es möglicherweise besser strukturiert werden könnte.

Entschuldigung, wenn dies nicht an der richtigen Stelle ist, ist dies mein erster Beitrag.

1
James Green

Die Navigation mit zwei Registerkarten ist nicht sehr verwirrend, aber ich werde sagen, dass sie aus entwicklungspolitischer Sicht von der Anzahl der Faktoren abhängen kann. Einer dieser Faktoren ist die Reaktionszeit.

Wenn Sie mit der Maus über eine bestimmte Option fahren und der Inhalt etwas spät angezeigt wird, kann dies zu Verwirrung führen, da der Benutzer in der Zwischenzeit möglicherweise mit der Maus über eine andere Option schwebt.

Ich denke, es ist besser, ein Minimum davon zu verwenden.

Hoffe das könnte deine Frage beantworten.

0
talktokets