Wie meistern Sie die Herausforderung, für Großbildimmobilien zu entwerfen? [geschlossen]


10

Diese Frage ist etwas subjektiver, aber ich hoffe, eine neue Perspektive zu bekommen. Ich bin es so gewohnt, für eine bestimmte Bildschirmgröße (normalerweise 1024 x 768) zu entwerfen, dass ich finde, dass diese Größe kein Problem darstellt. Wenn Sie die Größe auf 1280 x 1024 erweitern, erhalten Sie nicht genügend Bildschirmfläche, um einen spürbaren Unterschied zu machen, aber ich habe ein wenig mehr Raum zum Atmen. Grundsätzlich erweitere ich nur meine "Rastergröße" und das gleiche grundlegende Design für den etwas kleineren Bildschirm funktioniert immer noch.

In den letzten Projekten verwendeten meine Kunden jedoch alle 1080p-Bildschirme (1920 x 1080) und wollten Lösungen, um so viel wie möglich von dieser Immobilie zu nutzen. Der Durchmesser von 1920 Pixel bietet knapp die doppelte Breite, die ich gewohnt bin, und der Breitbildschirm lässt einige meiner alten Designansätze nicht so gut funktionieren. Das Problem, auf das ich stoße, ist, dass ich bei so viel Platz mit einigen großen Problemen konfrontiert bin.

  • Wie viele Spalten soll ich verwenden? Das Breitformat eignet sich für eine 3-Spalten-Aufteilung mit einer 2: 1: 1-Aufteilung (dh die Inhaltsspalte ist größer als die beiden anderen). Wenn ich jedoch drei Spalten verwende, was mache ich dann mit dieser zusätzlichen Spalte?
  • Wie nutze ich die Bildschirmfläche effizient ? Es besteht die Versuchung, alles auf einmal auf dem Bildschirm anzuzeigen, aber zu viele Informationen erschweren die Verwendung der Anwendung. Leerzeichen sind wichtig, um komplexe Informationen zu verstehen, aber zu viel lässt verwandte Konzepte zu getrennt erscheinen.
  • Normalerweise arbeite ich mit Webanwendungen mit komplexen Daten. Visualisierung und Präsentation sind der Schlüssel, um die Rohdaten zu verstehen. Wenn Ihr Benutzer auch einen großen Bildschirm hat (mindestens 24 "), sind einige Informationen nicht sichtbar und Sie müssen den Zeiger über eine lange Strecke bewegen. Wie stellen Sie sicher, dass alles, was benötigt wird, innerhalb der visuellen Hot Points bleibt?
  • Einfache Websites wie Blogs sind tatsächlich besser, wenn die Breite begrenzt ist, was zu einer großen Verschwendung von Immobilien führt. Ich frage mich, ob es für die Administratorseite dieses Bildschirmtyps von großem Vorteil wäre, das Textfeld und die Textvorschau nebeneinander zu haben. (1: 1 zweispaltig).

Für Ihre Antworten weiß ich, dass fast alles im Design "es kommt darauf an" ist. Was ich suche ist:

  • Allgemeine Grundsätze, die Sie verwenden
  • Wie sich Ihre Herangehensweise an Design verändert hat

Ich finde, dass ich mich neu schulen muss, wie man mit diesem anderen Format arbeitet. Jeder Auflösungsschub, den ich bisher durchgearbeitet habe, betrug ungefähr 25%: 640 bis 800 (25% Anstieg), 800 bis 1024 (28% Anstieg) und 1024 bis 1280 (25% Anstieg). Der Sprung von 1280 auf 1920 bedeutet jedoch eine gute Raumvergrößerung von 50% - das entspricht dem Sprung von 640 direkt auf 1024. Es gab keine häufig verwendete mittlere Größe, um die Lektionen schrittweise zu lernen.


Könnten Sie einfach die UI-Steuerelemente vergrößern, um die leeren Bereiche zu füllen ...?
FrustratedWithFormsDesigner

@Frustrated: Würde das nicht den Zweck zunichte machen, wenn Sie nicht beispielsweise für einen Touchscreen entwerfen würden?
Michael K

@Michael: Nun, OP scheint die Anzahl der sichtbaren Steuerelemente nicht ändern zu wollen, da dies die Verwendung des Programms erschweren würde, und es mag auch nicht, wenn Leerzeichen vorhanden sind. Wenn es keine neuen Funktionen gibt, mit denen der Raum gefüllt werden kann, muss der Raum mit ... gefüllt werden?
FrustratedWithFormsDesigner

2
Es geht eher darum, meinen Geist für neue Steuerelemente und Interaktionsmöglichkeiten mit der Site zu erweitern. Nur alles größer zu machen, besiegt den Zweck. Dann haben Sie das "Big Shiny Red Button Syndrom" oder einen Text, der sich anfühlt, als würden Sie eine große Überschrift lesen. Wenn man versucht, die Belange des Designs in Einklang zu bringen, ist dies wirklich ein komplexes Problem.
Berin Loritsch

1
@Berin: Wenn sie eine spezielle Anfrage für die Größe der Super-Size-Oberfläche gestellt haben und dies die EINZIGE wesentliche Änderung ist, teilen Sie ihnen mit, dass Sie Bedenken hinsichtlich des Layouts und des Designs haben, und fragen Sie sie, ob sie Ideen haben, wie der Raum am besten genutzt werden könnte. Immerhin sind sie die Benutzer und sie müssen einen Grund gehabt haben , diese spezielle Anfrage zu stellen. Vielleicht sagen sie "Setze ein Dashboard-Widget in den leeren Bereich" oder so etwas ... sende einen Modell-Screenshot mit einem riesigen Leerzeichen und einen Text mit der Aufschrift "Was willst du hier?" Stellen Sie sicher, dass Ihre Bedenken bezüglich dieses Designs bekannt sind.
FrustratedWithFormsDesigner

Antworten:


1

So würde ich dieses Problem angehen.

Ich würde damit beginnen, meine Daten in logische Blöcke zu unterteilen. Ich könnte sogar so weit gehen, für jeden logischen Block eine andere ASCX-Datei zu erstellen. Jeder Block würde wissen, wie er angezeigt werden soll (minimale / maximale Breite). Ich würde dies b / c tun. Ich mag es nicht, Code neu zu schreiben. Wenn die Möglichkeit besteht, dass die App erweitert werden muss, um mehrere Auflösungsgrößen zu unterstützen, würde dies dazu beitragen, die Steuerung auf Steuerungsbasis zu vereinfachen.

Als nächstes würde ich ein neues Stylesheet für die größere Auflösung erstellen. Machen Sie Knöpfe und Überschriften größer. Fügen Sie mehr Leerraum um Elemente hinzu. Auf diese Weise ist das Umschalten zwischen den beiden Auflösungstypen nur einen Stylesheet-Austausch entfernt.

Jetzt kommt der schwierige Teil, das Layout. Wie Sie sagten, wird das Layout bei dieser Menge an Immobilien sehr unterschiedlich sein. Die Antwort wäre, dem Benutzer zu ermöglichen, die Elemente wie eine iGoogle-Seite an der gewünschten Stelle zu platzieren. Der Benutzer kann nach Belieben 2 oder 3 Spalten auswählen. Da ich nicht weiß, welche Arten von Bildschirmen Sie erstellen, weiß ich nicht, ob dies wirklich für Sie funktionieren würde.

Die zweite Antwort wäre, einen UI-Experten zu beauftragen, der Sie bei der Gestaltung dieser Seiten unterstützt. Nachdem ich in der Vergangenheit mit einem UI-Spezialisten zusammengearbeitet habe, kann ich sagen, dass es sich zu 100% lohnt, eine Expertenmeinung zu solchen Dingen einzuholen. Sie können Probleme lokalisieren und Lösungen vorschlagen, bevor der Kunde das Produkt überhaupt sieht.

Wenn ich es alleine machen müsste, würde ich feste Gegenstände an den Seiten platzieren und den mittleren Bereich wachsen lassen, um den Rest des Raums auszufüllen. Lassen Sie alle Daten, die wachsen können, den mittleren Bereich füllen.

Ich bin mir nicht sicher, wie hilfreich dies für Sie ist, aber ich hoffe, es gibt Ihnen einige Ideen.


Dies ist wahrscheinlich die vernünftigste Antwort, die ich sowohl auf die Benutzeroberfläche als auch auf die Programmierer für diese Frage erhalten habe. Es ist viel nützlicher als "alles größer machen", wie mir die Leute von der Benutzeroberfläche gesagt haben. HINWEIS: aspx ist ein technologiebezogener Begriff, aber das Aufteilen der Benutzeroberfläche in separate Dateien ist der richtige Ansatz.
Berin Loritsch

4

Ich würde sagen, wenn Sie den zusätzlichen Speicherplatz nicht durch Hinzufügen weiterer Informationen / Steuerelemente nutzen können, würde ich sagen, dass der vorhandene Inhalt und das vorhandene Steuerelement größer werden .

Warum? Denn nach Fitts Gesetz sind größere Dinge einfacher zu bedienen .

Vielleicht fragen Sie auch unter /ux// oder /graphicdesign//


2

Ich bin kein UI-Experte, aber ich verwende mit Eclipse jeden Tag einen 1920x1080-Bildschirm. Eclipse hat eine sehr einfach konfigurierbare Oberfläche, und hier sind einige meiner Beobachtungen beim Wechsel zwischen 1280 und 1920:

  • Bei beiden Auflösungen möchte ich das Fenster, in dem ich arbeite, in derselben Größe sehen. Bei der kleineren Auflösung neige ich dazu, die zusätzlichen Panels auszublenden, während ich bei der höheren Auflösung mehr Panels herausbringe.
  • Ich würde etwas größere Knöpfe bevorzugen. Sie würden proportional weniger Platz auf dem größeren Monitor beanspruchen und meine Mausaktionen beschleunigen.
  • Ich erweitere oft die Vorschau, um den gesamten Bildschirm zu verwenden, dh Code links, Vorschau rechts. Das ist ein zweispaltiges Format. Ansonsten verwende ich 3-Spalten mit einer Fußzeile:
    1. Links: Dateinavigation
    2. Mitte: Code (Größte, wahrscheinlich 2/3 der Bildschirmbreite)
    3. Rechts: Code-Navigation und Aufgaben
    4. Fußzeile: Status (Konsole, Server usw. Ziemlich kurz, möglicherweise 1 / 5-1 / 6 Bildschirmhöhe)

Manchmal setze ich auch Ansichten und Controller im 2-Spalten-Modus nebeneinander, aber das ist definitiv programmiererspezifisch. :) :)

Wenn ich mich auf einem größeren Bildschirm befinde, möchte ich damit so viele Informationen wie möglich sehen und trotzdem leicht zu finden sein. Mehr Platz um Komponenten herum hilft bei der Unterscheidung zwischen Informationssammlungen. Symbole auf Registerkarten sind eine Möglichkeit, die Aufmerksamkeit auf die Bedeutung der einzelnen Komponenten zu lenken.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.