webentwicklung-frage-antwort-db.com.de

Wie kann man anzeigen, dass etwas nicht maßstabsgetreu ist?

Hintergrund

Ich entwickle eine Benutzeroberfläche für die Anzeige von Produktionsanlagen (Pumpen, Schlauchstränge, FCDs usw.) in einer Ölquelle.

Die meisten Ölquellen verfügen über Geräte mit sehr ungleichmäßigen Abständen. Zum Beispiel könnte es ein paar tausend Meter mit nichts geben, dann ein Dutzend Gegenstände oder so, dann etwas mehr Platz, dann ein paar weitere Gegenstände usw.

Für den Schaltplan verwende ich Measured Depth (MD) , was sich von True Vertical Depth (TVD) unterscheidet, es sei denn, das Bohrloch ist perfekt vertikal. Ich gebe die TVD an anderer Stelle in der Benutzeroberfläche an.

Aktuelle Lösung

Meine Lösung hierfür besteht darin, ein "gequetschtes" Schema anzuzeigen, in dem jede einzelne Tiefe eine eigene Zeile im Schema erhält. Ich habe den eigentlichen Schaltplan aus Gründen der Vertraulichkeit entfernt, aber er befindet sich rechts neben der Skala und zeigt Symbole für alle Geräte an.

(Current Axis

Das Problem

Leider hat dies einige Leute beim Testen der Benutzerfreundlichkeit verwirrt. Außerdem hat die Qualitätssicherung dies als Fehler protokolliert (inkonsistente Achsenskalierung). Ich möchte diese nicht maßstabsgetreue Darstellung wirklich beibehalten, da sie die Bildschirmfläche sehr effektiv nutzt und wir auch planen, eine separate maßstabsgetreue Ansicht zu entwickeln.

Mögliche Ideen

Ich könnte Zick-Zack-Indikatoren setzen, um zu zeigen, wo die Achse "gebrochen" ist, aber technisch gesehen ist die Achse überall gebrochen, so dass sie nicht gut aussieht.

Ich könnte es auch ganz oben buchstabieren (NICHT ZU SKALIEREN), aber das scheint hackig.

(Zigzag ScaleAxis Not to Scale

Oder vielleicht sollte ich mir darüber keine Sorgen machen, bis wir unsere separate maßstabsgetreue Ansicht implementieren, da dies dazu beiträgt, dies offensichtlicher zu machen.

(Tabs- Schematic and 3D

Ein weiteres Beispiel

Ich pflegte fahre durch Westkanada jeden Sommer mit meiner Familie. Es gibt lange Strecken mit im Wesentlichen nichts. Um die Zeit zu vertreiben, machte meine Mutter Listen mit den lustigen Städtenamen, durch die wir gingen (Piapot, Regina, Moosomin usw.). Wenn ich diese Städte in einem Diagramm zeigen wollte, könnte es so aussehen.

(Western Canadian Towns

Meine Frage

Gibt es andere Möglichkeiten, dies klarer zu machen?

20
sgryzko

Stellen Sie zunächst fest, was Sie kommunizieren möchten

Da Sie (zu Recht) nach einer begründeten, nicht hackigen Methode suchen, um dies darzulegen, können Sie mit ersten Prinzipien beginnen.

1. Verstehen Sie das Layoutmuster

  • Das Layout, das Sie verwenden möchten, ist weit verbreitet. Ich nenne es das Minikarten- oder Navigatormuster , obwohl es wahrscheinlich mehr gibt korrekter UX-Begriff dafür.

(mini map pattern

  • Das grundlegende Layout des Panels ist sinnvoll und wird von Zeitschriften, Websites, Broschüren und vielen anderen Inhaltslayouts verwendet. Sie haben eine linke Spalte mit einer "Vogelperspektive" -Ansicht des Inhalts und eine rechte Spalte mit einer Detailansicht. Dies ist aus mehreren Gründen ein gutes allgemeines Layout:
    • Das Layout bietet eine hierarchische Ansicht von komplizierten Inhalten.
    • Platzieren Sie die Mini-Map-Spalte links und Details rechts Bieten Sie eine gute visuelle Organisation und einen guten Fluss, da Benutzer (in LTR-Sprachen) daran gewöhnt sind, Inhalte zu verarbeiten von oben nach unten, von links nach rechts .
    • Die vertikale Ausrichtung der Spalten bietet dem Benutzer Scannbarkeit in beiden Spalten, abhängig von der Detailstufe, nach der der Benutzer sucht. Bei Webseiten ermöglicht das vertikale Layout , dass der Inhalt beliebig lang ist, da die Seite nach unten gescrollt werden kann.

2. Organisieren Sie Ihre Inhalte

  • Mit dem Verständnis des Musters können Sie jetzt Ihre Inhalte organisieren.
  • Der Zweck der Mini-Map ist es, dem Benutzer eine Orientierung zu geben, wie Ihr Inhalt (in Ihrem Fall Tiefe und Ausrüstung) organisiert ist . In Ihrem Fall ist die Ausrüstung nach Tiefe geordnet. Versuchen wir also, eine Minikarte zu erstellen, die den richtigen Maßstab verwendet, um diese Ausrichtung effektiv zu kommunizieren.

    • Sie haben aus gutem Grund ein negatives Feedback zu Ihrer nichtlinearen Achse erhalten. Dies liegt daran, dass Ihr vorhandenes Layout gegen die Erwartungen der Benutzer an eine Navigator-/Minikartenansicht verstößt.
  • Für das Detailfenster auf der rechten Seite ist das Gerät nach Tiefe indiziert, sodass Ihre Wahl der Schriftart und des Layouts diese Reihenfolge für die Benutzer klar machen sollte.

  • Jetzt müssen Sie nur noch das linke Bedienfeld visuell mit dem rechten Bedienfeld verbinden, damit die Benutzer die Beziehungen klar erkennen können.

3. Erstellen Sie dann das Design

Hier ist ein Beispiel, das die oben dargelegten Prinzipien enthält:

(mini-mapp design

Anmerkungen:

  • Die Minikarte ist maßstabsgetreu gezeichnet , um eine klare Ausrichtung und Kommunikation der räumlichen Beziehung zwischen den Tiefenebenen zu gewährleisten.

  • Detailspalte mit gleichmäßigem vertikalem Abstand , um die Lesbarkeit und Scanbarkeit zu verbessern.

  • Verwenden Sie eine große orangefarbene Schriftart für Detailüberschriften, um 1. visuelle Beziehung zur (orangefarbenen) Minikarte bereitzustellen; und 2. klare Übermittlung der Spaltenindizierung.

  • Verwenden Sie subtile Beschriftungspfeile, um die Mini-Karte mit dem Detailfenster in Beziehung zu setzen: Diese sollten für Sehbehinderte wahrscheinlich einen höheren Kontrast aufweisen, aber ich habe subtile Linien verwendet, um zu demonstrieren, dass Sie nicht viel tun müssen, um eine Beziehung herzustellen, wenn das Layout gut durchdacht ist das linke Feld zum rechten Feld.

  • Beachten Sie, dass bei einer angemessenen Kommunikation des Designs kaum eine zusätzliche Kennzeichnung erforderlich ist: Die Organisation der Bedeutung des Inhalts ist für den Benutzer offensichtlich.

ich hoffe, das hilft.

22
tohster

Du könntest:

  1. Entfernen Sie die Achsenlinie vollständig. Wenn das Diagramm nicht maßstabsgetreu ist, ist die Achsenlinie selbst das verwirrende/verwirrende Element der UX, das eine fehlerhafte Wahrnehmung verursacht. Verwenden Sie einfache Beschriftungen, die an Abschnitte angehängt sind, die nur im Sinne einer Liste voneinander getrennt sind. Sie können einen größeren Abstand zwischen Elementen einfügen, die weiter voneinander entfernt sind. Dies ist jedoch nicht erforderlich.

    Hier ist ein Beispielbild. Ich weiß, dass es horizontal ist und werde versuchen, das irgendwann zu beheben (stellen Sie sich bitte vor, es ist vertikal).

    (With axis removed

  2. Machen Sie die vertikale Achse eher zu einer Legende, wobei horizontale Häkchen Positionen anzeigen, jedoch ohne Zahlen (mit Ausnahme von möglicherweise Hauptlinien wie 1000, 2000 usw.). Fügen Sie diagonale Beschriftungslinien hinzu, die zu Feldern oder Abschnitten führen, in denen angezeigt wird, was sich an jedem Punkt befindet, wobei die Tiefe im Abschnittskörper angegeben ist. Verwenden Sie für sehr enge oder überfüllte Abschnitte einen "Zoomkreis" oder ein "Zoomquadrat".

    Stellen Sie sich erneut vor, dass sich die Achse auf der linken Seite befindet und das Layout vertikal statt horizontal ist.

    (town names with axis and diagonals

37
ErikE

Ich habe meinen Abschluss als Erdölingenieur gemacht, also kann ich Ihnen vielleicht hier helfen.

Dies ist ein domänenspezifisches Problem, und die richtige Lösung hängt von der Art der Ausrüstung ab, die Sie in der Ölquelle verwenden. Lassen Sie mich einige Beispiele nennen Hier. Es ist etwas technisch, aber ich werde mein Bestes geben, um es klar zu erklären:

Beispiel 1: Gehäuseinstallation

Sie tun gut, bevor Sie Ihre anderen Geräte in den Brunnen setzen. Betrachten Sie das folgende Diagramm.

(enter image description here

Hier wurden zwei Skalen angegeben. Eine ist die "normale Skala" mit gleichen Tiefenintervallen, während die andere die Tiefe angibt, in der verschiedene Gehäuse installiert wurden. Die normale Skala gibt True Vertical Depth (TVD) an und ist ein wichtiges Maß beim Bohren von Ölquellen. - -

Petroleum Engineers benötigen beide, damit sie es leicht mit anderen zukünftigen Installationen korrelieren können.

2. Schlammdiagramm bohren

In der folgenden Abbildung wurde nur eine bestimmte Tiefe angegeben. Das liegt daran, dass es wichtig ist, die richtige Tiefe für Schlammdiagramme zu kennen. Andernfalls kann es zu einem Blowout kommen und das Unternehmen verliert den Brunnen.

(enter image description here

Vorschläge:

  1. Erfahren Sie detailliertere Informationen zu den Geräten. Beim Bohrvorgang können keine Skalenintervallannahmen getroffen werden.

  2. Es ist besser, zwei Skalen anzugeben. Es gibt dem Ingenieur sowohl ganzheitliche als auch spezifische Informationen.

Hoffe das hilft! Lassen Sie mich wissen, wenn Sie etwas Bestimmtes benötigen.

Bearbeiten: - Ich sehe, dass Sie in den Diagrammen die gemessene Tiefe (MD) verwenden. Für die Skalierung ist es besser, einen Referenzpunkt (normalerweise Drehtisch) zu haben und dann entsprechend zu skalieren. Siehe einige technische Diskussion daz .

Bearbeiten 2 - Basierend auf Abfragen, die von OP gestellt wurden, reproduziere ich meinen Kommentar für einen einfachen Zugriff.

Die Darstellung einer nicht maßstabsgetreuen Achse wird tatsächlich explizit erwähnt, indem NTS oben geschrieben wird. Das ist eine Standardpraxis. Es ist kein Hack, sondern eine Art Konvention.

21
Adit Gupta

Defekte Achsen sind nur dann nützlich, wenn sie sparsam eingesetzt werden sollen.

Wenn, wie Sie sagen, die Achse überall unterbrochen ist, ist es sinnvoller, eine Tabelle zu verwenden, anstatt die relevanten Punkte zu beschreiben.

+-------+-----------+------+
| Depth | Structure | Icon |
+-------+-----------+------+
|     0 | Oil Rig   | A    |
|  6100 | Foo Pipe  | F    |
|  6200 | Bar Pipe  | B    |
|  8940 | Drill     | D    |
|  9000 | Drill Bit | DB   |
+-------+-----------+------+

Bei Bedarf kann die Grafik des Brunnens neben dieser Tabelle platziert werden, um einen identischen Effekt (jedoch mit weniger Verwirrung) als bei Ihrem ursprünglichen Entwurf zu erzielen.

14
March Ho

Obwohl ich keine Grafik erstellen kann, würde ich mit Ihrer ersten Neigung die Zick-Zack-Indikatoren verwenden. Sie sind so ziemlich überall und ich denke, Benutzer würden intuitiv verstehen, was sie bedeuten.

Wie Sie bemerkt haben, ist die Art und Weise, wie Sie sie verwendet haben, für Ihren Anwendungsfall jedoch nicht besonders gut. Ich würde empfehlen, für jeden Abschnitt einen Tiefenbereich anstelle der mittleren Markierung (wie 0-6000 [break] 8500-10000 [break] 130050-15000) zu verwenden und den 'Zick-Zack' über die gesamte Breite des Diagramms fortzusetzen.

1
DrewJordan