Styleguide – Designkonzept für Ihre Website

Vom Button bis zur Farbpalette – ein »Styleguide« bzw. »Corporate Design Manual« bündelt alle wichtigen Informationen für das einheitliche Erscheinungsbild Ihrer Webseite. Der Styleguide ist Basis und Leitfaden für stimmige Online-Auftritte wie aus einem Guss. Als erfahrene Webagentur entwickeln wir seit über 10 Jahren individuelle Styleguides für jeden Anspruch.

Grafik: Mehrere Displays mit Website
Styleguide Porzellan Museum Meissen

Einheitliches Layout

Jedes Design ist durch wichtige Elemente geprägt, die das visuelle Erscheinungsbild bestimmen und zusammen ein rundes Gesamtbild ergeben.

Der Styleguide definiert Raster, Farben, Schriften oder Piktogramme und demonstriert den Einsatz aller Elemente auf Ihrer Webseite. Unsere Styleguides klären alle Details mit Beispielseiten und Funktionsbeschreibungen, sodass für Webentwickler keine Fragen offen bleiben.

Ziel ist das unverwechselbare Auftreten Ihres Unternehmens und der Aufbau einer starken Marke mit Wiedererkennungswert.

Ihr Styleguide vom Layoutprofi

Nutzerfreundlichkeit ist unsere Stärke: Ihr individueller Styleguide wird von unseres erfahrenen Designern so aufbereitet, dass Mitarbeiter, Kunden sowie Partner Ihres Unternehmens diesen als Blaupause zur Gestaltung der Onlineauftritte verwenden können.

Unsere professionellen Styleguides beinhalten Vorgaben für:

  • Anwendung ihrer Brand-Elemente in Webanwendung
  • Beispiellayout im Responsive Webdesign
  • Farbpaletten
  • Bildsprache
  • Typographie und Iconfonts
  • Definition aller Interaktionselemente
  • bottom-up Definition aller Komponenten für eine Website

Umsetzung ihres Styleguides

Foto: Geöffnetes Buch Styleguide
Der PDF-Styleguide für Lieferantenportal unseres Kunden »GAI NetConsult«.

Konzept trifft Layout

»Ohne Konzept kein Layout « – diesem Leitsatz haben wir uns verschrieben. Bevor mit der grafischen Umsetzung begonnen wird, muss zunächst ein schlüssiges Interaktionskonzept entstehen.

Unsere Interaktionskonzepte garantieren logische Navigationsbäume und intuitive Nutzerführung. Auch für komplexe Websites finden wir klare Strukturen. Dabei haben unsere Webentwickler stets ein scharfes Auge auf die technische Umsetzbarkeit. So besticht Ihre Webseite später nicht nur durch ein schönes Äußeres.

Flexibler Aufbau

Drei auf einen Streich: Ein anpassungsfähiges Template glänzt auf jedem Ausgabegerät.

Unsere flexiblen Gestaltungsraster folgen dem »Mobile First« Prinzip. Wir erarbeiten das Design von der kleinsten Layout-Version hin zur größten. Egal, ob Hoch- oder Querformat, Desktop oder Tablet: Die Inhalte bleiben reaktionsfähig, sind übersichtlich gegliedert und optimal lesbar.

Das Design reagiert dabei auf den Nutzer, egal welche Auflösung sein Gerät aufweist.

Foto: Geöffnetes Buch Styleguide mit Hand
Der PDF Styleguide für den Formularassistent von cit.
Grafik: Bildschirm und Smartphone
Prototyp des Formularassistenten von cit

Prototyp Ihrer Webseite

Neben dem grafischen Entwurf, dem Feinlayout und dem Styleguide liefern wir Ihnen auf Wunsch einen kompletten Prototypen Ihrer Webseite im neuen Design.

Wir entwickeln Styleguides in Tools, wie „Sketch“ oder „figma“, die einen einfachen Export zu einem Online-Styleguide ermöglichen. In einem Online-Styleguide z.B. in „zeplin“ können alle Komponenten der Softwareentwicklung bereitgestellt werden.

Susanne Aurin

Susanne AurinLeitung Grafikdesign