it-swarm.com.de

Beispiele für "Light Table" -GUIs zum Bearbeiten und Vergleichen von Bildern, Text oder anderen Daten

Ich suche nach Beispielen für vorhandene Lösungen des folgenden Schnittstellenproblems. Die Benutzeroberfläche muss über eine Tabelle, eine Liste, eine Miniaturansicht oder ähnliche Elemente verfügen, die je nach Beispiel Dateien, Bilder, Audio, Tweets, Kalendertermine, Aufgaben usw. enthalten können.

Der Benutzer kann dann eine beliebige Anzahl von Elementen "öffnen", um die Details anzuzeigen, die Daten zu vergleichen und/oder zu bearbeiten. Die Detailansicht darf den Rest der Daten nicht abdecken oder überlappen, da der Benutzer mehrere Detailansichten gleichzeitig öffnen möchte.

Dies könnte natürlich als Standard-Fenstersystem mit einem neuen Fenster für jedes geöffnete Element implementiert werden, aber ich suche nach etwas, das ein eleganteres Layout für dieses spezielle Problem bietet. Ideen für die Navigation in einer solchen Benutzeroberfläche, Ideen für Layouts, wie die Verbindung zwischen den Elementen in der Tabelle und den "geöffneten" Elementen angezeigt wird.

2
last-child

Momentan fallen mir keine vorhandenen Apps ein, aber ich würde diese Art von Layout untersuchen.

enter image description here

Sie haben einen Hauptbereich und einen Detailbereich. Das Hauptfenster enthält eine Liste mit Elementen, Miniaturansichten usw. Ausgewählte Elemente werden alle im Detailfenster angezeigt. Sie können neu angeordnet werden (Drag & Drop, Pfeile beim Schweben usw.), um den Vergleich zwischen relevanten Elementpaaren zu erleichtern. Die Größe der Fenster kann geändert werden, was sich auf die Größe der Miniaturansichten und der Detailansicht auswirkt. Auf diese Weise können Sie natürlich nicht sehr große Objekte nebeneinander vergleichen, aber auf einem einzigen Monitor können Sie dies auch nicht anders tun. Sie können Symbolleisten haben, um Elemente im Fokus usw. zu bearbeiten.

2

Sie können ein Rasterlayout verwenden, bei dem Felder zum Erweitern verschoben und auch verschoben werden können, damit der Benutzer das Layout so organisieren kann, dass interessante Elemente nebeneinander positioniert werden können.

Ein Beispiel für diese Art von Layout finden Sie unter diesem Link. Schauen Sie sich "Grid 16" unter "Layout" in der Navigation an: http://themeforest.net/item/adminica-the-professional-admin-template/) full_screen_preview/160638

1
Triona

Das erste, was auftritt, ist der Versuch, die Tabelle in einer Art dieser Datentypen abzulehnen, die sehr unterschiedlich sind. Es fällt mir leicht, eine EP anhand eines Titelbilds in meiner Aufnahmetasche zu finden, als anhand eines Künstler-/Titelaufklebers oder durch den Katalog mit den MP3-Dateinamen.

Dementsprechend ist es notwendig, die Schnittstellenentscheidung in Interaktion mit Objekten anstelle von Datensätzen zu suchen. Über das gleichzeitige Betrachten mehrerer Objekte - außer dem Vergleich derselben Objekte ist dies kaum anwendbar, da der Aufmerksamkeitsort auf jedem konkreten Objekt gleich bleibt.

Beim Vergleich zwischen Gruppen von Typen, zum Beispiel beim gleichzeitigen Hören eines Songs (Audio) und beim Anzeigen der Songtexte (txt), bleibt Ihr Aufmerksamkeitsort auf dem Textdokument. In diesem Fall muss kein zusätzlicher Marker für die aktuelle Audiowiedergabe angezeigt werden.

Hier ein gutes Beispiel für objektive Interaktion Raskin. Jenseits des Desktops

0
denis.efremov

Dies ähnelt den vorhandenen Diff/Merge-Tools.

Die meisten dieser Tools ordnen verschiedene Dokumente horizontal an, um den Vergleich von mehrseitigen/Bildschirmdokumenten zu vereinfachen (sie scrollen zusammen). Die meisten dieser Tools beschränken den Vergleich aus zwei Gründen auf 2-3 Dokumente gleichzeitig:

  1. Desktop-Immobilien.

  2. Kognitive Wahrnehmung - wenn die Dokumente lang oder kompliziert zu vergleichen sind,
    Wenn mehr als 2-3 angezeigt werden, kann sich der Benutzer beim Vergleich nur schwer daran erinnern, welche welche ist.

Häufige Ausnahmen von der Regel für 2-3 Dokumente sind der Vergleich flacher (enger) Listen, z. Spezifikationen von Produkten auf Hersteller- oder Überprüfungswebsites (z. B. Digitalkameras, Bildschirme).

Wenn Sie mehr als 2 Dokumente anzeigen, sollten Sie die Namen/Miniaturansichten über dem Bildlaufbereich einfrieren. Wenn Sie also nach unten scrollen, können Sie leicht erkennen, welche Spalte auf welches Dokument verweist. Wenn die Dokumente ähnliche Namen haben, betonen Sie den Unterschied zwischen den Namen (z. B. unterschiedlicher Pfad, unterschiedliche Erweiterung, unterschiedliches Datum, geändert von einem anderen Benutzer).

Beispiele:

  • Dokumente
  • Spezifikationen
  • Vergleichselemente können vor dem Vergleich oder in der Titelleiste ausgewählt werden, indem Sie auf ein Symbol zum Hinzufügen/Entfernen/Ändern im Titel einer der Spalten klicken.

    0
    Danny Varod