Remain Style Guide
Markenfarbe
Was die Markenfarbe ist
Sie ist die eigene Farbe, die eine Marke darstellt, gibt der gesamten Marke ein einheitliches Gefühl und ist wirksam darin, dem Nutzer unablässig dieselbe Botschaft zu vermitteln
Der Einsatz der Markenfarbe
Als Markenfarbe schlagen wir hauptsächlich eine primary color und eine secondary color vor. Wenige Farben zu verwenden statt vieler hebt den Markencharakter stärker und hilft dabei, inhaltszentriert zu gestalten. Wenn es zu eintönig wirkt, lässt sich der Markenfarbe Sättigung und Helligkeit hinzufügen, um etwas reicher auszudrücken.
Das Verhältnis der Markenfarben
Die primary color muss einen höheren Anteil haben als die secondary color. Ist es umgekehrt, kann das beim Nutzer Verwirrung über die Hauptfarbe auslösen, daher ist es besser, die primary color häufiger zu verwenden als die secondary color.
Als primary color wurde #3d5afe und als secondary color #ff6e40 gewählt,
und dies ist ein Beispiel, das zeigt, dass der Anteil der primary color höher ist als der der secondary color.
Die Farbkombination (color scheme)
Wenn man primary color und secondary color festlegt, ist auch die Kombination zwischen den Farben sehr wichtig. Das Werkzeug Color Wheel (Farbkreis) ist ein Werkzeug, das zu einer harmonischen Farbkombination verhilft. Da alle Farben zueinander passen, aber auch miteinander kollidieren, kann sich dieser Prozess sehr hinziehen oder schwierig anfühlen. Dann lässt sich mit dem Color-Wheel-Werkzeug Zeit sparen.
Die Beziehung zwischen primary color (#3d5afe) und secondary color (#ff6e40) ist eine Komplementärbeziehung, und dies ist ein Beispiel, das zeigt, auf welche Weise sie im Web eingesetzt wird.
Die Interaktionsfarbe (interaction color)
Für die Interaktionsfarbe schlagen wir vor, eine gegenüber der Default-Farbe um 1 bis 2 Töne hellere oder dunklere Farbe zu verwenden. Man kann die Stufen von Helligkeit und Sättigung auch größer ansetzen.
Nachdem die default color festgelegt ist, lassen sich als interaction color etwa 4 bis 5 Stufen lighten und darken color anlegen und verwenden. Das erlaubt einen reicheren Ausdruck, als wenn man die interaction color mit 1 bis 2 Farben ansetzt. Die lighten color wird nach links hin heller, und je heller sie im Vergleich zur Grundfarbe ist, desto höher die Zahl. Die darken color wird nach rechts hin dunkler, und je dunkler sie im Vergleich zur Grundfarbe ist, desto höher die Zahl.
Indem man beim Maus-Hover die interaction color für die Farbe einsetzt, kann man dem Nutzer leicht erkennbar machen, an welcher Stelle er gerade mit der Maus hovert.
Ein Beispiel, in dem als Grundfarbe vor dem Maus-Hover die default color und als Farbe beim Maus-Hover die interaction color (lighten-1) verwendet wird.
Themen: Design
Kategorie: Schnipsel/Artikel
%% Quelle: http://styleguide.co.kr/content/color/brand-color.php %%