Individuelle Designlösungen

Was sind individuelle Designlösungen?

Individuelle Designlösungen bedeuten, dass wir eine Seite, ein Bild oder eine Oberfläche nicht aus einer fertigen Vorlage in Ihren Markenfarben einfärben, sondern von Grund auf aus der Geschichte Ihrer Marke und dem Bedarf Ihrer Kunden aufbauen. Mit diesem Ansatz lassen sich die Startseite einer Website, ein Kampagnenbereich, ein Icon-Set oder eine Vorstellungspräsentation gestalten. Gemeinsam ist ihnen, dass die Arbeit so sehr zu Ihnen gehört, dass sie sich nicht einfach auf eine andere Marke übertragen lässt.

Diese Seite beschreibt die kreative und strategische Seite der Arbeit. Themen wie Menüaufbau, mobile Nutzung, Geschwindigkeit und Barrierefreiheit haben wir auf unserer Seite zu benutzerfreundlichen Websites behandelt; markenspezifisches Design baut auf diesem Fundament auf und ersetzt es nicht.

Der Unterschied zwischen fertiger Vorlage und individuellem Design

Fertige Vorlagen ermöglichen einen schnellen Start, kommen aber mit einem allgemeinen Aufbau, der für Tausende verschiedener Unternehmen geschrieben wurde. Reihenfolge der Abschnitte, Bildproportionen und Akzente beruhen auf den Annahmen der Person, die die Vorlage entworfen hat. Individuelle Designlösungen stellen diese Fragen dagegen neu, ausgehend von der Art, wie Ihr Kunde Entscheidungen trifft.

• Aufbau: In der Vorlage stehen die Abschnitte fest; bei individueller Arbeit wird der Seitenfluss nach der Geschichte gezeichnet, die Sie erzählen möchten.
• Bildsprache: Eine Vorlage bietet eine allgemeine Ästhetik; bei individueller Arbeit werden Typografie, Weißraum und Bildproportionen aus Ihrer Identität abgeleitet.
• Wiedererkennbarkeit: Dieselbe Vorlage kann auch auf anderen Websites verwendet werden; markenspezifisches Design zielt darauf ab, Sie von ähnlichen Anbietern der Branche abzuheben.
• Flexibilität: Aus einer Vorlage auszubrechen wird meist schwierig; beim individuellen Design werden neue Abschnitte nach dem von Anfang an aufgebauten System ergänzt.

Für welche Marken hat das Vorrang?

Unternehmen, deren Produkt oder Leistung von außen betrachtet denen der Konkurrenz ähnelt, müssen den Unterschied am stärksten über die Sprache des Designs erzählen. Marken im Luxussegment, Anbieter, die ein wählerisches Publikum ansprechen, wie Architektur- und Projektbüros, und Unternehmen, die zugleich zu mehreren Kundengruppen sprechen, profitieren von individuellen Designlösungen am meisten.

Wann reicht eine Vorlage aus?

Nicht jedes Unternehmen braucht am ersten Tag individuelle Designlösungen. Für eine Vorstellungsseite, die schnell online gehen muss, eine neue Leistung in der Testphase oder einen Start mit begrenztem Budget kann eine gut gewählte Vorlage sinnvoll sein. In diesem Fall sagen wir Ihnen das offen und legen gemeinsam fest, an welchen Stellen die Vorlage an Ihre Marke angepasst werden muss.

Die Bausteine markenspezifischen Designs

Markenspezifisches Design ist weniger ein einzelner schöner Bildschirm als die Summe von Entscheidungen, die einander ergänzen. Diese Entscheidungen fassen wir unter drei Überschriften zusammen: markenspezifischer Aufbau, persönlich zugeschnittene Erfahrung und branchengerechte Kreativität. Im Folgenden erklären wir, was jeder Punkt in der Praxis bedeutet.

Markenspezifischer Aufbau

Der Aufbau umfasst die Entscheidungen darüber, was Besucher in welcher Reihenfolge auf der Seite sehen. Für einen Hersteller kann es richtig sein, zuerst die Produktionsstärke und dann das Produktsortiment zu zeigen; für ein Boutique-Hotel zuerst die Aussicht und dann die Zimmer. Individuelle Designlösungen bauen diese Reihenfolge nach der Reihenfolge der Fragen auf, die Kunden in Ihren Verkaufsgesprächen stellen.

Persönlich zugeschnittene Erfahrung

Auf dieselbe Website können Besucher mit unterschiedlichen Zielen kommen: Händler und Endkunde, Architekt und Hausbesitzer, einheimischer Gast und ausländischer Tourist. Markenspezifisches Design kann für jede dieser Gruppen einen eigenen Einstieg, eine andere Gewichtung oder eine Darstellung in ihrer eigenen Sprache aufbauen. In fertigen Vorlagen geht diese Unterscheidung meist in einem einheitlichen Menü verloren.

Personalisierung braucht nicht immer eine komplexe technische Grundlage. Zwei klare Wege auf der Startseite wie „Ich bin Händler“ und „Ich bin Endkunde“ führen dazu, dass jede Gruppe die Antwort auf ihre eigene Frage schneller erreicht. Bei mehrsprachigen Websites muss man neben der Übersetzung auch die unterschiedlichen Prioritäten der Besucher in jedem Land berücksichtigen.

Branchengerechte Kreativität

Jede Branche weckt bei Besuchern bestimmte Erwartungen: Von einer Kanzlei erwartet man Seriosität, von einem Café Wärme, von einem Softwareunternehmen Klarheit. Bei individuellen Designlösungen versuchen wir, diese Erwartung zu erfüllen und uns dabei von den immer wiederkehrenden Klischees der Branche fernzuhalten. Ziel ist, dass Besucher Ihre Marke von ähnlichen unterscheiden können, ohne das Gefühl „Ich bin hier richtig“ zu verlieren.

Auf der Website eines Beleuchtungsherstellers kann es zum Beispiel sinnvoller sein, neben den Produktfotos die Wirkung des Lichts im Raum zu zeigen, auf der Website eines Restaurants die Atmosphäre am Tisch vor der Speisekarte spürbar zu machen. Die Sprache einer Branche zu sprechen beginnt damit, zu wissen, worauf die Kunden dieser Branche schauen.

Typografie und Seitenrhythmus

Bevor Besucher eine Seite lesen, spüren sie ihren Rhythmus: Eine große Überschrift, auf die ein weiter Weißraum folgt, vermittelt den Eindruck einer ruhigen, sorgfältigen Marke; häufige, dichte Blöcke hinterlassen dagegen einen lebhaften, praktischen Eindruck. Bei der Arbeit an markenspezifischem Design legen wir Überschriftengrößen, Zeilenabstände und Abstände zwischen den Abschnitten einzeln nach diesem Eindruck fest. Schon dieselbe Schrift kann mit einem anderen Rhythmus einen völlig anderen Charakter bekommen.

Eigene Illustration, Icons und visuelle Anleitung

Eine Seite aus Stockbildern wirkt, wie sorgfältig sie auch gemacht ist, wie etwas, das man auch auf anderen Websites sehen könnte. Bei der Arbeit an markenspezifischem Design zeichnen wir bei Bedarf eigene Icon-Sets, Illustrationen oder Infografiken für Sie. Wenn Fotos produziert werden, erstellen wir vor dem Dreh eine visuelle Anleitung zu Licht, Bildausschnitt und Farbton; so werden die Fotos nicht nachträglich in das Design gepresst, sondern gemeinsam mit ihm gedacht.

Bewegung und Mikrointeraktionen

Dass sich eine Schaltfläche beim Überfahren verändert, ein Abschnitt beim Scrollen sanft erscheint oder ein kleines Zeichen anzeigt, dass ein Formular abgeschickt wurde, verleiht der Oberfläche Charakter. Bewegung darf jedoch den Zugang zum Inhalt nicht verzögern und die Seite nicht schwerfällig machen. Auch Googles Leitfaden zur Seitenerfahrung betont, dass eine gute Seitenerfahrung nicht nur aus Messwerten besteht, und empfiehlt, Einblendungen zu vermeiden, die den Zugang zum Inhalt erschweren.

Manche Nutzer bevorzugen in den Geräteeinstellungen reduzierte Bewegung. Ein Design, das diese Einstellung respektiert, vereinfacht oder deaktiviert die Animationen und liefert denselben Inhalt weiter aus; so bleibt Bewegung eine Verzierung und wird für niemanden zum Hindernis.

Wie werden individuelle Designlösungen entwickelt?

Individuelle Designlösungen erfordern mehr Nachdenken und gegenseitigen Austausch, als eine fertige Struktur anzupassen. Deshalb gehen wir Schritt für Schritt vor, damit die Entscheidungen auf einem soliden Grund stehen. Die folgende Reihenfolge ist für Website-Projekte geschrieben; bei kleineren Arbeiten wie einem einzelnen Kampagnenbereich oder einer Präsentation verkürzen sich einige Schritte.

1. Entdeckungsgespräch

Wir sprechen darüber, was Ihre Marke verspricht, wer Ihr Kunde ist und woran er sich bei der Entscheidung stößt. Die Einwände, die Ihr Vertriebsteam am häufigsten hört, und die Stärken, die Ihre Kunden am meisten schätzen, sind das Rohmaterial der Geschichte, die das Design erzählen wird. Auch Beispielwebsites aus Ihrer Branche sehen wir uns in dieser Phase gemeinsam an. Was Ihnen gefällt, hilft uns bei der Richtung ebenso wie das, was Sie auf keinen Fall wollen.

2. Wahl der visuellen Richtung

Statt direkt mit dem Design zu beginnen, stellen wir mehrere sich deutlich unterscheidende visuelle Richtungen mit Moodboards vor. Jedes Board enthält einen Vorschlag für Typografie, Farbeinsatz, Bildsprache und Seitenrhythmus. Wird die Richtung in dieser Phase gewählt, geht später weniger Zeit durch die Unschärfe „etwas ein bisschen anderes“ verloren. Manchmal entsteht aus diesem Gespräch auch ein dritter Weg, der die Stärken zweier Richtungen verbindet.

3. Schlüsselbildschirme und Prototyp

Die gewählte Richtung setzen wir zunächst auf einigen Schlüsselbildschirmen um, etwa der Startseite und der wichtigsten Unterseite. Diese Bildschirme verwandeln wir in einen anklickbaren Prototyp, damit Sie ihn auf Smartphone und Computer nah an der echten Nutzung ausprobieren können. Die meisten Entscheidungen des markenspezifischen Designs werden auf diesen Bildschirmen klar; die übrigen Seiten bauen auf diesen Entscheidungen auf.

Wie wir Feedback bewerten

Bei individuellen Designlösungen kostet es am meisten Zeit, wenn Feedback zu persönlichem Geschmack wird. Deshalb empfehlen wir, bei jeder Präsentation anhand der Ziele zu diskutieren, die wir im Entdeckungsgespräch gemeinsam aufgeschrieben haben. Statt „Diese Farbe gefällt mir nicht“ bringt ein Feedback wie „Dieser Bildschirm schafft bei unseren Händlern nicht genug Vertrauen“ das Design deutlich schneller in die richtige Richtung.

4. Komponentenbibliothek

Schaltflächen, Karten, Formularfelder, Überschriftenstile und Bildproportionen werden einzeln definiert und zu einer Komponentenbibliothek zusammengestellt. Werden die Komponenten in der Designdatei und im Code unter denselben Namen geführt, sprechen Designerin und Entwickler dieselbe Sprache, und kleine Abweichungen summieren sich nicht zu Uneinheitlichkeit. Diese Bibliothek sorgt dafür, dass auch später hinzukommende Seiten in derselben Sprache gestaltet werden. Dass individuelle Designlösungen langlebig sind, hängt weniger von auffälligen Bildschirmen ab als von dieser geordneten Grundlage.

5. Übergabe an die Entwicklung und Umsetzungskontrolle

Die Designs werden samt Abstandsmaßen, Schriftgrößen, Bewegungsdauern und ihrem Verhalten bei unterschiedlichen Bildschirmbreiten an das Entwicklungsteam übergeben. Während der Entwicklung vergleichen wir die Bildschirme mit dem Design und beheben Abweichungen vor der Veröffentlichung. Dass eine Idee, die auf dem Papier gut aussieht, auch im Code dieselbe Wirkung hat, hängt von dieser Kontrolle ab.

Der Zusammenhang zwischen Corporate Design und markenspezifischem Design

Corporate Design ist das Regelwerk, das Farben, Schriften und Logoverwendung Ihrer Marke festlegt. Markenspezifisches Design wendet diese Regeln für eine bestimmte Arbeit eigenständig an. Das Corporate Design beantwortet die Frage „mit welchem Material“, das individuelle Design die Frage „was bauen wir mit diesem Material“.

Haben Sie eine starke Identität, bleiben individuelle Designlösungen in deren Grenzen und erweitern sie digital. Ist Ihre Identität zersplittert oder besteht sie nur aus einem Logo, kann es gesünder sein, zuerst die Grundregeln zu klären; diese Arbeit haben wir auf unserer Seite zum Corporate Design ausführlich beschrieben.

Die Identität ins Digitale erweitern

Ein Corporate Design, das für Printmaterialien erstellt wurde, beantwortet viele Fragen nicht, die am Bildschirm auftauchen. Entscheidungen wie was passiert, wenn man einen Link überfährt, wie die Farben auf dunklem Hintergrund wirken oder wie eine Benachrichtigung oder Fehlermeldung aussieht, werden im Prozess des markenspezifischen Designs definiert. Werden diese Entscheidungen im Geist der Identität getroffen, wirken Website und Printmaterialien wie Teile derselben Marke.

Beispielprojekt: diMARE

Für diMARE, bekannt für Damenmodekollektionen, Modenschauen und Geschäfte, haben wir eine englischsprachige Website gestaltet und dabei die Kollektionsaufnahmen vollflächig eingesetzt. Mit einem dunklen oberen Menü und schlichter Typografie unterstützten wir die Luxuswahrnehmung der Marke; die Logoverwendung haben wir für das Web angepasst, damit die Website von Anfang bis Ende mit einer einheitlichen Identität erscheint. Details finden Sie auf der Seite zum Projekt diMARE.

Individuelle Lösungen im Grafikdesign

Individuelle Designlösungen beschränken sich nicht auf die Website. Auch eine Präsentation für ein Investoren- oder Händlertreffen, eine Infografik für den Messestand, eine Landingpage für einen Produktlaunch oder eine nur Ihnen gehörende Icon-Familie lassen sich mit demselben Ansatz bearbeiten. Das Kriterium ist überall gleich: Die Arbeit muss die Regeln Ihrer Identität einhalten und zugleich speziell für den Zweck dieser Arbeit durchdacht sein.

In einer Präsentation sollte jede Folie einen einzigen Gedanken tragen, in einer Infografik sollte sich ein komplexer Ablauf in wenigen Sekunden erschließen. Bei solchen Arbeiten kostet es ebenso viel Mühe wie das Design selbst, den Inhalt zu vereinfachen; deshalb ordnen wir Text und Daten gemeinsam mit Ihnen, bevor wir mit dem Design beginnen.

Leistungsumfang, Budget und worauf zu achten ist

Zeit und Budget für markenspezifisches Design zu nennen, ohne Ihren Bedarf anzuhören, wäre nicht richtig. Den Leistungsumfang bestimmen einige grundlegende Entscheidungen, die wir bei der Angebotserstellung einzeln mit Ihnen klären.

Was bestimmt den Leistungsumfang?

• Anzahl der Seiten oder Materialien, die individuell gestaltet werden
• Bedarf an getrennten Wegen für verschiedene Zielgruppen und an einer mehrsprachigen Struktur
• Ob eigene Illustrationen, Icons oder Infografiken nötig sind
• Ob Foto- und Videoproduktion zum Projekt gehören
• Intensität der bewegten Elemente und Interaktionen
• Ob die Komponentenbibliothek später auch von anderen Teams genutzt wird

Das Budget effizient einsetzen

Nicht jede Seite muss mit derselben Sorgfalt von Grund auf gestaltet werden. Wer für kritische Bildschirme wie Startseite, Leistungs- und Angebotsseiten, auf denen die Besucher ihre Entscheidung treffen, mehr Aufwand einplant und Hilfsseiten mit denselben Komponenten aufbaut, lenkt das Budget dorthin, wo es die größte Wirkung entfaltet. Bei individuellen Designlösungen setzen wir diese Prioritäten in der Entdeckungsphase gemeinsam.

Häufige Fehler bei individuellen Designprojekten

• Individuelles Design nur als „anders aussehen“ zu definieren und die Benutzbarkeit nachzuordnen
• Zu den Details überzugehen, ohne die visuelle Richtung gewählt zu haben, und in jeder Runde die Richtung zu wechseln
• Seiten ohne echte Texte und Fotos mit Platzhalterinhalten freizugeben
• Die Seite mit schweren Animationen und großen Videos zu verlangsamen
• Seite für Seite zu gestalten, ohne eine Komponentenbibliothek aufzubauen, und sich später mit Uneinheitlichkeit herumzuschlagen
• Die Entscheidung nach persönlichem Geschmack zu treffen, der die Zielgruppe nicht repräsentiert

Vor dem Gespräch

• Die kurze Geschichte Ihrer Marke, ihr Versprechen und die Beschreibung der Zielgruppe
• Logo, Farben und, falls vorhanden, Markenrichtlinien
• Die Fragen und Einwände, die Ihr Vertriebsteam am häufigsten hört
• Beispiele, die Ihnen gefallen und denen Sie auf keinen Fall ähneln möchten, jeweils mit Begründung
• Eine Liste der vorhandenen Fotos, Videos und Texte

Sie müssen diese Liste nicht vollständig mitbringen; fehlende Punkte ergänzen wir im Entdeckungsgespräch gemeinsam. Je konkretere Beispiele Sie mitbringen, desto produktiver verläuft jedoch das erste Gespräch über individuelle Designlösungen.

Nach der Veröffentlichung: das individuelle Design bewahren und weiterentwickeln

Individuelle Designlösungen sind am Tag der Veröffentlichung kein eingefrorenes Werk; mit dem Wachstum Ihres Unternehmens kommen neue Seiten, neue Kampagnen und neue Produkte hinzu. Dass das Design mit diesen Ergänzungen wächst, ohne Schaden zu nehmen, hängt vom Grundsystem und von der späteren Sorgfalt ab.

Beim Hinzufügen neuer Seiten

Wird eine neue Leistungsseite oder ein Kampagnenbereich gebraucht, schaut man zuerst in die Komponentenbibliothek. Eine Seite, die sich aus vorhandenen Karten, Überschriftenstilen und Bildproportionen aufbauen lässt, bewahrt die Sprache des markenspezifischen Designs. Wird wirklich eine neue Komponente gebraucht, erleichtert es spätere Arbeiten, sie nach denselben Regeln in die Bibliothek aufzunehmen.

Das Design anhand von Daten überprüfen

Nach der Veröffentlichung lässt sich beobachten, welche Abschnitte Interesse finden, welche Schaltflächen angeklickt werden und wo Besucher die Seite verlassen. Wir legen die Ziele von Anfang an gemeinsam fest und bewerten die Ergebnisse in regelmäßigen Abständen. Manchmal verbessert eine kleine Änderung im Aufbau die Funktion der Seite spürbar, ohne optisch etwas zu stören.

Kampagnen- und Saisonzeiten

Saisoneröffnungen, neue Kollektionen oder Kampagnen zu besonderen Anlässen erfordern vorübergehende Änderungen auf der Website. Von Anfang an gestaltete flexible Bereiche für diese Zeiten ersparen es, die Seite jedes Mal neu zu ordnen. So transportieren individuelle Designlösungen die Bildsprache der Kampagne, ohne sich von der dauerhaften Identität zu lösen.

Häufig gestellte Fragen (FAQ)

Warum dauern individuelle Designlösungen länger als eine fertige Vorlage?

Weil Seitenaufbau, visuelle Richtung und Komponenten von Grund auf für Sie durchdacht werden und in jeder Phase gemeinsam entschieden wird. Den Zeitplan teilen wir Schritt für Schritt mit, sobald der Leistungsumfang feststeht.

Muss ich für markenspezifisches Design mein bestehendes Logo ändern?

Nein. Funktioniert Ihr Logo in kleiner Größe und auf verschiedenen Hintergründen gut, baut das Design darauf auf; gibt es problematische Stellen, teilen wir sie zusätzlich als Vorschlag mit.

Bedeutet individuelles Design, dass die Website langsamer lädt?

Nein. Die Geschwindigkeit hängt nicht davon ab, dass das Design individuell ist, sondern davon, wie Bilder, Schriften und Animationen eingesetzt werden; deshalb bewerten wir diese Entscheidungen in der Designphase auch im Hinblick auf die Geschwindigkeit.

Können wir nur für einige Seiten ein individuelles Design beauftragen?

Ja. Die kritischsten Bildschirme wie die Startseite oder eine Kampagnenseite können individuell gestaltet werden, die übrigen Seiten lassen sich mit denselben Komponenten schlichter aufbauen.

Was ist der Unterschied zwischen markenspezifischem Design und Corporate Design?

Das Corporate Design legt die Regeln für Farbe, Schrift und Logoverwendung fest. Markenspezifisches Design wendet diese Regeln für eine bestimmte Arbeit wie eine Website, eine Präsentation oder einen Kampagnenbereich eigenständig an.

Lassen sich individuelle Designlösungen auf unsere bestehende Website anwenden?

Ist die vorhandene Grundlage solide und flexibel, kann das neue Design auf demselben System umgesetzt werden. Trägt die Grundlage die vom Design verlangte Struktur nicht, muss möglicherweise auch die Entwicklungsseite erneuert werden; das bewerten wir gemeinsam, nachdem wir die bestehende Website geprüft haben.

Sprechen wir über ein Design, das zu Ihrer Marke passt

Erzählen Sie uns von Ihrer Marke, Ihrem Kunden und Ihren Erwartungen an das Design; gemeinsam legen wir den passenden Ansatz und Leistungsumfang fest. Für das Entdeckungsgespräch erreichen Sie uns über unsere Kontaktseite.