Sieben Prinzipien eines guten Designers (2): Farbgebrauch

Sieben Prinzipien eines guten Designers (2): Farbgebrauch
<br />Vorheriger Artikel: Sieben Prinzipien guter Designer (1): Schriftdesign Englisches Original
Beschränken Sie Ihre Farben <br />Teil 2 von 7 einfachen Regeln, um ein Top-Designer zu werden. Beschränken Sie Ihre Farbverwendung. Es scheint, als ob die vorherige Regel Sie dazu auffordert, die Verwendung Ihrer Schriftarten einzuschränken, nicht wahr? Absolut richtig! Der Grund, warum wir die Verwendung von Farben einschränken, ist derselbe Grund, aus dem wir die Verwendung von Schriftarten einschränken. Durch die Reduzierung der Anzahl der Farben in unserem Design wird es harmonischer. Im Grunde wird alles einheitlich aussehen, wie die Trikots einer Sportmannschaft oder das Logo eines Unternehmens. —Wir möchten, dass die Uniform (Sportbekleidung) insgesamt einfarbig aussieht.
Wie bei der Auswahl von Schriftarten handelt es sich bei der Beschränkung der Anzahl der verwendeten Farben um eine Richtlinie und nicht um eine Regel. Sie können die Farben des Regenbogens sehr gut in Ihren Designs verwenden und es wird großartig aussehen. Zunächst benötigen Sie jedoch eine Strategie für den Einsatz von Farben und müssen dabei bleiben. Machen Sie es zu einem Teil Ihres Designs.
Lassen Sie uns zunächst über den Farbwert sprechen. Der Wert einer Farbe hängt davon ab, wie hell oder dunkel sie ist. Beispielsweise ist Gelb eine sehr helle Farbe und Lila eine sehr dunkle Farbe. Natürlich kann eine Farbe ihren eigenen Farbbereich haben. Beispielsweise assoziieren die meisten von uns mit Lila eine dunkle Farbe, Lila kann aber auch sehr hell sein. Hier ist ein Beispiel einiger Farben und ihrer zugehörigen Werte. Dann können Sie eine Reihe von Farbwerten sehen.

Eine Regel, die ich beim Arbeiten mit Farbschemata verwende, lautet daher: Stellen Sie sicher, dass Ihr Farbschema einen Bereich von Farbwerten enthält. In jedem Design benötigen Sie einige helle und einige dunkle Farben für den Kontrast. Wenn der Hintergrund Ihres Designs beispielsweise dunkel ist, benötigen Sie helle Texte und Bilder. Auf diese Weise werden Texte und Bilder leichter lesbar. Umgekehrt benötigen Sie bei einem hellen Hintergrund ein dunkles Bild, einen dunklen Text usw.
Normalerweise verwende ich auch nur 2–5 Farben, um mein Farbschema abzurunden. Reduzieren Sie die Anzahl der Auswahlmöglichkeiten und Sie erhalten ein gutes Designergebnis. Hier ist ein Beispiel für ein Farbschema, das ich zusammengestellt habe. Wie Sie sehen, habe ich eine dunkle Farbe, eine Mitteltonfarbe und eine helle Farbe verwendet. Ich habe ganz rechts begonnen und für jede Farbe einen Wertebereich erstellt. Diese Farbkombinationen sind sozusagen meine Farbpalette, die ich in meinen Designprojekten verwenden werde. Sobald ich diese Palette habe, versuche ich mein Bestes, nur diese Farben zu verwenden.

Okay, wir haben also über einige Tipps zur Farbauswahl gesprochen, z. B. wie viele Farben Sie auswählen müssen und welche Werte sie haben sollten. Was ist also der nächste Schritt? Ich erzähle Ihnen, was der nächste Schritt und der schwierigste Teil ist: sich für diese 2–5 Farben zu entscheiden! Ich persönlich denke, dass das manchmal eine schwierige Aufgabe ist. Hier ist eine Tabelle mit Tipps, die mir beim Erstellen meines Farbschemas helfen: Bestimmen Sie eine Palette von kühlen und warmen Tönen .
Das heißt, die Verwendung warmer oder kalter Farben. Zu den warmen Farben zählen Rot, Orange, Gelb, Braun usw. Kühle Farben sind Blau und Lila. Ich finde, Grün ist eine ziemlich gemäßigte Farbe. Wenn Sie alle gewählten Farben in einem Farbton halten, wirken sie auf jeden Fall sehr harmonisch. Lassen Sie sich inspirieren unter www.colourlovers.com <br /> Auf dieser wunderbaren Website dreht sich alles um Farbschemata. Sie klicken sich einfach durch viele Seiten mit Farbschemata. Achten Sie auf Ihre Umgebung. <br />Überall um Sie herum sind Farbschemata. Schauen Sie sich die Verpackungen im Supermarkt an, schauen Sie sich die Farben bei Ihrem örtlichen Starbucks an, schauen Sie sich die Natur an! Wenn Sie einige Farben sehen, die Ihnen gefallen, merken Sie sie sich einfach und prüfen Sie, ob Sie sie auf Ihren Computer kopieren können. Achten Sie auf vorhandene Firmenlogofarben. <br />Ich verwende häufig vorhandene Markenfarben. Ich schaue mir ihr Logo und Farbschema an und verwende dies als meine Ausgangsidee. Und dann vielleicht nur noch ein oder zwei Farben hinzufügen.
Hier ist ein von mir fertiggestelltes Design, das das eingeschränkte Farbschema zeigt.

Wie Sie sehen, sorgen das straffe Farbschema und die einheitlichen Schriftarten wirklich für Ordnung.
Ich weiß, dass diese Lektionen ziemlich einfach sind … aber das ist die Grundlage des Designs. Es schadet also nie, sich zu erholen. Die nächsten 5 Richtlinien erscheinen in Kürze und ich verspreche, dass die nächsten 5 interessanter sein werden. Danke!

<<:  MySQL-Joinpufferprinzip

>>:  Detaillierte Beschreibung der HTML-Tabellenrahmensteuerung

Artikel empfehlen

Detaillierte Erklärung zur Verwendung der Vue-Nummernschild-Eingabekomponente

Eine einfache Nummernschild-Eingabekomponente (vu...

Three.js-Beispielcode zur Implementierung des Tautropfen-Animationseffekts

Vorwort Hallo zusammen, hier ist der CSS-Assisten...

Detaillierte Erklärung des dynamischen Weihnachtsbaums durch JavaScript

Inhaltsverzeichnis 1. Animierter Weihnachtsbaum, ...

Lizenzschlüssel für VMware Workstation Pro 16 mit Nutzungs-Tutorial

VMware Workstation ist eine leistungsstarke virtu...

Auszeichnungssprache - Titel

Klicken Sie hier, um zum Abschnitt „HTML-Tutorial“...

Docker erstellt MySQL-Erklärung

1. MySQL-Image herunterladen Befehl: docker pull ...

Detaillierte Erklärung der Fallstricke von MySQL 8.0

Ich habe heute MySQL 8.0 aktualisiert. Das erste ...

Erfahren Sie, wie nginx hohe Leistung und Skalierbarkeit erreicht.

Die Gesamtarchitektur von NGINX ist durch eine Re...

So importieren/speichern/laden/löschen Sie Bilder lokal in Docker

1. Docker importiert lokale Images Manchmal kopie...

Verwendung des HTML-H-Titel-Tags

Die Verwendung von H-Tags, insbesondere h1, war sc...

Implementierung der React-Sternebewertungskomponente

Voraussetzung ist die Eingabe der Bewertungsdaten...