Best Practices und Prinzipien für die GUI-Design [geschlossen]

Question

Was ist Ihr bestes praktisches benutzerfreundlichen User-Interface-Design oder Prinzip?

Bitte diese Praktiken vorlegen, die Sie tatsächlich Dinge finden wirklich nützlich macht - egal was - wenn es für die Benutzer funktioniert, teilen Sie es

!

---

Zusammenfassung / Sortierungs

Prinzipien

1. KISS.
2. Seien Sie klar und spezifisch in dem, was eine Option erreichen: zum Beispiel der Verwendung Verben, die die Aktion angeben, die auf einer Auswahl folgen werden (siehe:. Impl 1).
3. Verwenden Sie offensichtlich Standardaktionen geeignet, was die Bedürfnisse der Nutzer / erreichen will.
4. Setzen Sie das Aussehen und Verhalten der Benutzeroberfläche für die Umwelt / Prozess / Zuschauer: Stand-alone-Anwendung, Web-Seite, tragbar, wissenschaftliche Analyse, Flash-Spiel, Profis / Kinder, ...
5. Reduzieren Sie die Einarbeitungszeit eines neuen Benutzers.
6. Anstatt zu deaktivieren oder Optionen zu verstecken, sollten Sie eine hilfreiche Nachricht geben, wo der Benutzer Alternativen haben kann, aber nur, wenn diese Alternativen geben. Wenn keine Alternativen verfügbar sind, ist es besser, die Option zu deaktivieren - die visuell dann heißt es, dass die Option nicht verfügbar ist -. Nicht die nicht verfügbaren Optionen verstecken, sondern erklären in einem Mouseover Popup warum sie deaktiviert ist
7. Bleiben Sie konsequent und Praktiken entsprechen und Platzierung von Kontrollen, wie in weit verbreiteten Anwendungen erfolgreich umgesetzt wird.
8. Führen Sie die Erwartungen des Benutzers und lassen Sie Ihr Programm nach diesen Erwartungen verhalten.
9. Stick zum Vokabular und Wissen des Benutzers und nicht Programmierer / Implementierung Terminologie verwenden.
10. Folgen Sie grundlegenden Design-Prinzipien. Kontrast (Offensichtlichkeit), Wiederholung (Konsistenz), Ausrichtung (Aussehen) und die Umgebung (Gruppierung)

Die Umsetzung

1. (Siehe Antwort von paiNie) "Versuchen Sie Verben in Ihren Dialogfeldern zu verwenden."
2. Zulassen / Arbeitsgeräte Undo und Redo.

Referenzen

1. Windows Vista User Experience Richtlinien [ http://msdn.microsoft. com / en-us / library / aa511258.aspx]
2. niederländischen Webseiten - "Drempelvrij" Richtlinien [ http://www.drempelvrij.nl/richtlijnen]
3. Web Content Accessibility Guidelines (WCAG 1.0) [ http://www.w3.org/ TR / WCAG10 /]
4. Consistence [ http://www.amazon.com/Design-Everyday-Things -Donald-Norman / dp / 0385267746]
5. Lassen Sie mich nicht denken [ http://www.amazon.com/ dont-Make-Me-Think-Usability / dp / 0321344758 / ref = pdbbssr_1? ie = UTF8 & s = Bücher & qid = 1221726383 & sr = 8-1]
6. Seien Sie leistungsfähig und einfach [ http://msdn.microsoft.com /en-us/library/aa511332.aspx]
7. Gestalt Design Gesetze [ http://www.squidoo.com/gestaltlaws]

Answer 1

Versuchen Sie Verben in Ihren Dialogfeldern zu verwenden.

Es bedeutet verwenden

statt

Answer 2

Ich teste meine GUI gegen meine Oma.

Answer 3

Folgen grundlegenden Designprinzipien

• C ontrast - Dinge, die sind anders aussehen andere
• R ePetition - Wiederholen Sie den gleichen Stil in einem Bildschirm und für andere Bildschirme
• A lignment - Line-Bildschirmelemente up! Ja, das beinhaltet Texte, Bilder, Kontrollen und Etiketten.
• P roximity - Gruppe verwandte Elemente zusammen. Eine Reihe von Eingabefeldern eine Adresse eingeben sollte aus der Gruppe von Eingabefeldern zusammen und wurde verschiedene gruppiert werden, um Kreditkartendaten eingeben. Dies ist ein grundlegendes Gestalt Design-Gesetze .

Answer 4

Nie fragen: "Sind Sie sicher?". Nur erlaubt unbegrenzt, zuverlässig Undo / Redo.

Answer 5

Versuchen Sie, um darüber nachzudenken, was Ihre Benutzer möchte statt erreichen, was die Anforderungen sind.

Der Benutzer wird Ihr System eingeben und es verwendet, um ein Ziel zu erreichen. Wenn Sie Calc öffnen müssen Sie ein einfaches schnelle Berechnung 90% der Zeit zu machen, damit ist, warum es standardmäßig einfacher Modus eingestellt ist.

So denkt nicht über das, was die Anwendung tun müssen, aber denken Sie über den Benutzer, die es tun werden, wahrscheinlich gelangweilt, und versucht zu entwerfen, basierend auf, was seine Absichten sind, versuchen, sein Leben leichter zu machen.

Answer 6

Wenn Sie sich für das Web etwas zu tun, oder jede vorn gerichtete Softwareanwendung für diese Angelegenheit, Sie schulden es sich selbst wirklich zu lesen ...

Zwing ich denke nicht - Steve Krug

Answer 7

Paniermehl in Webapps:
Tell -> Die -> Benutzer -> Wo -> Sie -> Ist im System

Das ist ziemlich hart in „dynamisch“ Systemen mit mehreren Pfaden auf die gleichen Daten zu tun, aber es hilft oft das System zu navigieren.

Answer 8

Ich versuche, an die Umgebung anzupassen.

Wenn für eine Windows-Anwendung zu entwickeln, verwende ich die Windows Vista User Experience Richtlinien aber wenn ich eine Web-Anwendung zu entwickeln verwende ich die entsprechenden Richtlinien, weil ich niederländische Websites entwickeln benutze ich die "Drempelvrij" Richtlinien , die auf dem Web Content Accessibility Guidelines (WCAG 1.0) durch das World Wide Web Consortium (W3C).

Der Grund, warum ich dies tun, ist die Lernkurve eines neuen Benutzers zu reduzieren.

Answer 9

Ich würde empfehlen, ein gutes solides Verständnis des GUI-Designs zu erhalten, indem das Buch zu lesen Joel Spolsky : Wenn die Verhalten der Anwendung unterscheidet sich zu dem, was der Benutzer dann passieren erwartet Sie ein Problem mit Ihrer grafischen Benutzeroberfläche.

Das beste Beispiel ist, wenn jemand Swaps um das OK und Abbrechen auf einigen Websites. Der Nutzer erwartet, dass die OK Taste auf der linken Seite zu sein, und die Abbrechen Taste auf der rechten Seite zu sein. Also kurz gesagt, wenn das Anwendungsverhalten unterscheidet sich zu dem, was der Benutzer erwartet, was dann passieren Sie ein User Interface Design Problem haben.

Obwohl der besten Rat, in egal was Design oder Design-Muster, das Sie folgen, ist das Design und die Konventionen in Einklang in der gesamten Anwendung zu halten.

Answer 10

Vermeiden Sie den Benutzer auffordert, Entscheidungen zu treffen, wann immer Sie können (das heißt nicht schaffen eine Gabel mit einem Konfigurationsdialog!)

Für jede Option und jeder Meldungsfeld, fragen Sie sich: Kann ich stattdessen mit einigen vernünftigen Standardverhalten kommen, dass

• macht Sinn?
• wird nicht in der Benutzer-Weg?
• ist leicht genug, um zu erfahren, dass es für den Benutzer wenig kostet, dass ich dies auf ihn verhängen?

Ich kann mein Palm-Handheld als Beispiel: die Einstellungen sind wirklich minimalistisch, und ich bin sehr zufrieden. Die Basisanwendungen sind gut genug konzipiert, dass ich ihn einfach an, ohne das Gefühl der Notwendigkeit Zwicken nutzen können. Ok, es gibt einige Dinge, die ich nicht tun kann, und in der Tat hatte ich irgendwie selbst (anstelle der anderen) an das Werkzeug anzupassen, aber am Ende das macht wirklich mein Leben einfacher.

Diese Website ist ein weiteres Beispiel: Sie nichts konfigurieren können, und doch finde ich es wirklich schön zu verwenden

.

Angemessene Standardwert kann hart sein, um herauszufinden, und einfache Usability-Tests eine Menge Hinweise geben können Ihnen dabei zu helfen.

Answer 11

Zeigen Sie die Schnittstelle zu einer Probe von Benutzern. Bitten Sie sie, eine typische Aufgabe auszuführen. Achten Sie auf ihre Fehler. Hören Sie ihre Kommentare. Nehmen Sie Änderungen vor und wiederholen.

Answer 12

The Design of Everyday Things - Donald Norman

Ein Kanon der Designüberlieferung und die Grundlage vieler HCI Kurse an Universitäten auf der ganzen Welt. Sie werden keine großen GUI in fünf Minuten mit ein paar Kommentare von einem Web-Forum Design, aber einige Grundsätze erhalten Ihr Denken, den richtigen Weg wies.

-

MC

Answer 13

Beim Aufbau von Fehlermeldungen machen die Meldung Fehler sein die Antworten auf diese drei Fragen (in dieser Reihenfolge):

1. Was ist passiert?

2. Warum ist es passiert?

3. Was ist damit getan werden kann?

Dies ist von „Human Interface Guidelines: Der Apple Desktop Interface“(1987, ISBN 0-201-17753-6), aber es kann verwendet werden, für jede Fehlermeldung an jedem Ort. Es gibt eine Version aktualisiert für Mac OS X. Die Microsoft-Seite User Interface Nachrichten sagt dasselbe:“... im Falle einer Fehlermeldung, Sie sollten das Problem, die Ursache und die Benutzeraktion umfassen um das Problem zu beheben. "

sind auch alle Informationen, die von dem Programm bekannt ist, nicht nur einige feste Zeichenfolge. Z.B. für die Datei ist Teil der Fehlermeldung verwenden „Raw Spektrum„Warum ist es passiert“ L: \ refDataForMascotParser \ TripleEncoding \ Q1LCMS190203_01Doub leArg.wiff existiert nicht „statt nur“ File tut nicht vorhanden“.

Kontrast dies mit der berüchtigten Fehlermeldung: „Fehler happend. ".

Answer 14

(Gestohlene von Joel: o))

Sie nicht deaktivieren / entfernen Optionen - eher eine hilfreiche Nachricht geben, wenn der Benutzer klicken / sie wählen

.

Answer 15

Als meine Datenstruktur Professor zeigte heute: Geben Sie Anweisungen, wie Sie Ihr Programm arbeitet, um den durchschnittlichen Benutzer. Wir Programmierer denken wir oft mit unseren Programmen ziemlich logisch sind, aber der durchschnittliche Benutzer wahrscheinlich nicht wissen, was zu tun ist.

Answer 16

1. Mit dezent / einfachen animierte Funktionen die den anderen einem nahtlosen Übergang von einem Abschnitt erstellen. Dies hilft dem Anwender eine mentale Karte der Navigation / Struktur zu schaffen.

2. Verwenden Sie kurze (ein Wort, wenn möglich) Titel auf den Tasten, die eindeutig das Wesen der Handlung beschreiben.

3. semantischen Zoom verwenden, wo möglich (ein gutes Beispiel dafür ist, wie funktioniert auf Google / Bing Maps Zoomen, wo weitere Informationen sichtbar ist, wenn Sie auf einen Bereich konzentrieren).

4. Erstellen Sie mindestens zwei Möglichkeiten, navigieren: vertikal und horizontal. Vertikale, wenn Sie navigieren zwischen den verschiedenen Abschnitten und horizontal, wenn navigieren Sie in den Inhalt des Abschnitts oder Abs.

5. Halten Sie immer die wichtigsten Optionen Knoten Ihre Struktur sichtbar (wobei die Größe des Bildschirms und die Art von Gerät es erlaubt).

6. Wenn Sie tief in die Struktur gehen immer einen sichtbaren Hinweis halten (das heißt, wie in Form eines Pfades), das angibt, wo Sie sind.

7. Elemente ausblenden, wenn der Benutzer möchten auf Daten (wie zum Beispiel das Lesen eines Artikels oder Betrachten eines Projekts) konzentrieren. -. Aber passen sie von Punkt # 5 und # 4

Answer 17

Leistungsstarke und einfach Be

Oh, und mieten Sie einen Designer / Design Fähigkeiten erlernen. :)

Answer 18

Mit GUIs, Standards sind so eine Art plattformspezifisch. Z.B. Bei der Entwicklung von GUI in Eclipse diesen Link bietet anständige Richtlinie.

Answer 19

Ich habe die meisten der oben genannten und eine Sache zu lesen, die ich sehe nicht erwähnt:

Wenn Benutzer gemeint, sobald die Schnittstelle zu verwenden, zeigt nur, was sie verwenden müssen möglichst groß ist.

Wenn die Benutzeroberfläche wird durch den gleichen Benutzer mehrfach verwendet werden, aber vielleicht nicht sehr oft, Kontrollen zu deaktivieren ist besser als sie zu verstecken: die Benutzeroberfläche aus und versteckte Funktionen nicht offensichtlich sind (oder in Erinnerung) von einem gelegentlichen Benutzer ist für den Benutzer frustrierend.

Wenn die Benutzeroberfläche wird sehr regelmäßig von demselben Benutzer verwendet werden (und es gibt nicht viel Umsatz in den Job also nicht viele neue Nutzer kommen die ganze Zeit online) Kontrollen zu deaktivieren ist absolut hilfreich und die Benutzer wird auf die Gründe, warum sich daran gewöhnt, Dinge passieren, aber sie verwenden Kontrollen versehentlich in falsche Zusammenhänge erkannt und verhindert Fehler zu verhindern.

Nur meine Meinung, aber es geht alles wieder in Ihrem Benutzerprofil zu verstehen, nicht das, was nur eine einzige Benutzersitzung nach sich ziehen könnte.