Unsere neue Farbdemo

Wir haben eine kleine Demoseite veröffentlicht, auf der Sie selber ausprobieren können, wie verschiedene Farbkombinationen auf einer Website auf Sie wirken. Hier erklären wir etwas genauer, wozu das gut ist und wie das geht.

Warum überhaupt eine Farbdemo?

Farben und ihre Wirkung sind etwas sehr individuelles und intuitives. Jeder verbindet mit verschiedenen Farben unterschiedliche Dinge - zumeist unterbewusst. Zwar herrschen innerhalb bestimmter Kulturen ähnliche Assoziationen vor, aber jeder fühlt und sieht Farben ein wenig anders.

Warum ist das für uns als Designer eine Herausforderung?

Nun, zum Einen bringen viele Kunden bereits eine recht weit fortgeschrittene Corporate-Identity mit, wenn es um ein Projekt bei uns geht. Farben, Formen und eine bestimmte Sprache haben sich für ein Unternehmen bereits etabliert. Diese Dinge sollte man natürlich bei einem neuen Design berücksichtigen. Aber bei der Umsetzung einer Corporate Identity auf eine Website ist immer noch sehr viel Spielraum. Mit der Farbdemo kann man hier schon ein bisschen herumprobieren und sehen, was funktioniert und was nicht.

Zum zweiten sind auch wir Menschen, und auch wir assoziieren auf einer sehr persönlichen Ebene etwas mit Farben. Und dann entsteht manchmal ein Dialog, in dem man merkt: der andere verbindet mit einer Farbe ganz andere Gefühle. Dieser Dialog ist oft mühsam. Zunächst ist ja nicht jede Rot einfach eine Rot, da kommt es auf Schattierungen an. Und dann ja auch auf bestimmte Kombinationen von Farben. Und dann ist es oft so, dass bereits kleine Änderungen genügen und das Gefühl ist gleich ein anderes. Diesen Prozess in Worte zu fassen, ist ausgesprochen schwer.

Bisher behelfen wir uns damit, dass wir bereits im Vorfeld gezielt nach Websites oder anderen Designs fragen, mit denen der Kunde positive oder negative Gefühle assoziiert. Mit etwas Erfahrung kann man so schon recht gut eingrenzen, wie jemand tickt, was ihm (oder ihr) gefällt oder nicht gefällt. Zwar geht es ja primär immer um die Zielgruppe des Kunden und nicht um sein eigenes Gefühl. Aber natürlich soll die Website trotzdem auch dem Kunden gefallen und ihn gut repräsentieren. Und deshalb ist es immer wieder spannend, einem Kunden ein Design zum ersten Mal vorzustellen.

Um diesen Prozess zu vereinfachen und den Dialog über Farben, Formen und Ideen zu unterstützen, haben wir diese Farbdemo in einer ersten Fassung veröffentlicht. Wahrscheinlich werden wir sie später noch erweitern, verbessern - da sind wir auch für Feedback von Ihnen sehr dankbar!

Wie funktioniert die Farbdemo?

Auf einer Internetseite finden Sie in der linken oberen Ecke des Bildschirms fünf Startfarben (die Netjutant-Farben). Sie sind:

• Die Primärfarbe - die neben der Hintergrundfarbe prominenteste Farbe, die sich an vielen Stellen der Website wiederfindet (meist in größeren Flächen).
• Die Sekundärfarbe - eine Farbe, die die Primärfarbe unterstützen soll, aber auch eine gewisse Spannung hereinbringen darf.
• Die Akzentfarbe - für wichtige, aber eher kleine, Elemente der Website, wie beispielsweise Buttons oder Hinweise.
• Die Hintergrundfarbe - Die Farbe, die standardmäßig den Seitenhintergrund darstellt, sowie
• Die zweite Hintergrundfarbe - meist eine Farbe mit nur geringen Abweichungen zur Primär-Hintergrundfarbe. Sie wird gerne für große Bereiche verwendet, die erkennbar abgetrennt und trotzdem optisch ruhig und unauffällig sein sollen.

Durch Klick auf eine der fünf Farben können Sie diese Farbe entsprechend anpassen. Dabei sind Ihnen keine Grenzen gesetzt. Sie können auch direkt Farbwerte in verschiedenen Formaten hineinkopieren, die Sie vielleicht auf Seiten wie coolors.co gefunden haben.

Weil die Seite bei allen gewählten Farbkombinationen einigermaßen ordentlich aussehen soll, haben wir in den meisten Fällen darauf verzichtet, die Überschriften in einer der Farben einzufärben. Wo wir es doch getan haben, kann es passieren, dass der Kontrast zwischen Überschrift und ihrem Hintergrund zu klein wird, um die strengen Barrierefreiheits-Erfordernisse moderner Websites zu erfüllen. In diesem Fall blenden wir eine kleine Warnung dazu ein.

Die sonstigen Schriften sind so eingestellt, dass sie möglichst noch lesbar bleiben, egal, ob die Seite einen dunklen oder hellen Hintergrund hat. Natürlich kann man in einem echten Projekt auch mit den Schriftfarben mehr spielen, denn da weiß man ja vorher, welche Farbe der Hintergrund haben wird.

Auf Fotos haben wir bewusst verzichtet. Sie bringen ihre eigene Farbsprache mit und könnten sich mit den eigenen Farbkombinationen nicht gut vertragen. Hier ist aber später ein guter Designer in der Lage, die Website mit farblich stimmigen Bildern auszuschmücken und solche Reibungen zu vermeiden.

Haben Sie eine Farbkombination gefunden, die Ihnen gut gefällt, können Sie entweder ein Bildschirmfoto machen oder auf den Knopf "Die Farben in den Zwischenspeicher kopieren" drücken. Dann werden die fünf Farbwerte in den Zwischenspeicher des Geräts geladen und Sie können sie per Mail, Whatsapp oder anderen Textnachrichten verschicken.

Bitte beachten Sie: Ihre Kombinationen gehen verloren, wenn Sie die Seite aus irgendeinem Grund neu laden.

Wir freuen uns über Feedback

Wir würden uns sehr freuen, wenn dieses Tool nicht nur für uns und unsere Kunden, sondern auch für Sie und Ihre Kunden nützlich sein könnte. Falls Sie dazu Feedback haben, melden Sie sich gerne bei uns! Sie erreichen uns unter kontakt@netjutant.de, telefonisch unter +49 8685 30998-22, auf LinkedIn und auf Instagram. Wir freuen uns auch, wenn Sie uns dort folgen - so verpassen Sie nie wieder ähnliche Aktionen und Neuigkeiten.