Benutzeroberflächen – Farben und Layout

Question

Obwohl ich mich speziell für Webanwendungsinformationen interessiere, wäre ich auch etwas neugierig auf die Entwicklung von Desktopanwendungen.Diese Frage wird durch meine Arbeit an meiner persönlichen Website sowie durch meinen Job bestimmt, bei dem ich einige Funktionen entwickelt habe, es aber anderen überlasse, sie in das Erscheinungsbild der Website zu integrieren.

Gibt es Anleitungen oder Faustregeln für Dinge wie Farbschemata, Layouts, Formatierung usw.?Ich möchte für Besucher Lesbarkeit und Klarheit gewährleisten, aber gleichzeitig nicht langweilig und langweilig sein.

Was meine Kenntnisse in diesem Bereich betrifft: Wenn Sie mir ein Bild geben, verfüge ich über genügend Kenntnisse, um es auf dem Bildschirm wiederzugeben. Wenn Sie mich jedoch bitten, eine neue Benutzeroberfläche zu entwerfen oder eine bestehende neu zu gestalten, weiß ich nicht, wo ich anfangen soll .

Answer 1

Normalerweise verfügt jedes Betriebssystem über Richtlinien für die Benutzeroberfläche.Für Windows haben Sie eine Schau hier.(Bearbeiten:Die Links in diesem Beitrag sind defekt.Aber eine Suche nach „Richtlinien für die Benutzeroberfläche" auf MSDN gibt es Artikel über alles)

Apple hat auch ein eigenes.Vielleicht möchten Sie es auch behalten Barrierefreiheit im Hinterkopf.

Answer 2

Ein Tipp, um zu überprüfen, ob Ihre Farben einen guten Kontrast haben, besteht darin, einen Schnappschuss davon zu machen und ihn in Graustufen umzuwandeln.Wenn man etwas nicht lesen kann, sind die Farben sicher schlecht gewählt.

Und obwohl es nicht um Benutzeroberflächen geht, Vorher-Nachher-Magazin kann Ihnen einige ziemlich gute Tipps zu Farbe, Design und verwandten Themen geben.Es gibt sogar einige kostenlose PDFs zum Herunterladen.

Answer 3

Das Buch Entwerfen von Schnittstellen, von Jenifer Tidwell, enthält ein ganzes Kapitel zu diesem Thema (Kapitel 9, Auszüge online verfügbar).Das gesamte Buch ist eine Empfehlung wert.

Answer 4

Was die Web-Benutzeroberfläche angeht, gehe ich hier mal ganz weit und sage, dass die wichtigste Farbe im Webdesign Weiß oder „hell“ ist.Dies ist die Farbe, auf der Sie dichte Inhaltsabschnitte platzieren.

Dunkler Text, heller Hintergrund, immer, wenn es um Ihre primären Inhaltsbereiche geht.

Und die wichtigste Regel beim Layouten sind Leerzeichen.Lassen Sie den Inhalt atmen.

Das Befolgen dieser beiden einfachen Regeln ist mehr wert als die meisten Richtlinien zur Benutzerfreundlichkeit der Benutzeroberfläche.

Und übrigens sind die MS-Benutzeroberflächenrichtlinien (im Großen und Ganzen) schrecklich.Lesen Sie Jakob Nielsen, werfen Sie einen Blick auf die Apple-Designästhetik, aber halten Sie sich von der MS-„Neutralgrau/Blau-Crunchbox“-12-Schritte-Assistent-10pt-Textphilosophie der Benutzeroberfläche fern.

(Und das sage ich als langjähriger MS-GUI-Programmierer)

Answer 5

Ich bin schrecklich darin, Farben zu finden, die zusammen gut aussehen, also schummele ich und verwende Bilder aus der Natur, die größtenteils die Farbe haben, die ich möchte (z. B. Grün), und die ich dann verwende Diese Internetseite um das Hauptfarbschema hervorzuheben.Im Allgemeinen gelingt es der Natur ziemlich gut, ihre eigenen schönen Farbschemata festzulegen.

Answer 6

Verwenden Sie kontrastreiche Farbkombinationen.Schwarzer Text auf weißem Hintergrund ist das beste Beispiel für eine kontrastreiche Kombination.

Eine schlechte Kombination ist grüner Text auf rotem Hintergrund.Für farbenblinde Menschen (wie mich) ist es schrecklich.

Sehen Sie, wie Ihre Website für eine farbenblinde Person aussieht: colorfilter.wickline.org

Answer 7

Was Desktop-Anwendungen betrifft:Was auch immer Sie tun, verwenden Sie keine handverlesenen Farben.Bleiben Sie bei den genannten Systemfarben wie „Fensterhintergrund“, „Menütext“ usw.Andernfalls werden Personen, die auf die Barrierefreiheitsfunktionen des Betriebssystems angewiesen sind, von Ihrer Farbauswahl abhängig sein (z. B. können sie kein kontrastreiches Thema auswählen) und Personen, die ihre Desktop-Themen gerne anpassen möchten, werden Ihre Anwendung für hässlich halten.

Answer 8

Hier sind einige einfache Hinweise für die Benutzerfreundlichkeit in Ihrem Typografie.Diese Dinge befassen sich hauptsächlich mit Fragen der Lesbarkeit und Zugänglichkeit.

DOS:

• Relative Schriftgröße verwenden (em)
• Identifizieren Sie Sprachänderungen innerhalb eines Dokuments mithilfe des LANG-Attributs
• Schwarzer Text auf weißem Hintergrund
• Verwenden Sie für Überschriften H1, H2 usw.und verschachteln Sie sie entsprechend
• Gliedern Sie Inhalte und organisieren Sie sie mit Überschriften, die den Suchanfragen Ihrer Benutzer entsprechen
• Schreiben Sie eine klare und einfache Kopie
• Nach links ausrichten, nach rechts ausrichten
• Die Farbe zwischen Text und Hintergrund muss einen hohen Kontrast aufweisen

NICHTS:

• Verwenden Sie als Linktext „hier klicken“ oder „mehr“.
• Verwenden Sie Unterstreichungen zur Hervorhebung
• Mehr als 2 Schriftfamilien
• Kursivschrift
• Textblöcke in Großbuchstaben
• Verwenden Sie echten roten oder echten blauen Text auf weißem Hintergrund (chromatische Aberration).