Projektphasen und Ablauf für Ihr Webdesign-Projekt

Uns ist es wichtig, dass Sie als Kunde stets wissen, bei welchem Schritt wir gerade sind und wie es mit Ihrem Projekt voran geht. Denn wir wollen die Webdesign Agentur sein, die es besser macht! Wir kennen uns aus – Sie nicht. Aber Webdesigner beauftragen sollte kein Glücksspiel sein. Deshalb erklären wir Ihnen hier, was wir machen, wenn wir Internet Auftritte erstellen, wie wir vorgehen – und warum.

Unser Vorgehen

Der Prozess für das Webdesign umfasst alle Schritte der Entstehung: die Planung der Web-Strategie, das Projekt-Briefing, die Sitemap, das Design und den Launch.

  • Briefing
  • Planung
  • Design
  • Programmierung
  • Roll-Out

Briefing

Vorbereitungsphase: das Projekt-Briefing

Wir führen zuerst ein Interview mit unseren Kunden, um erste Anhaltspunkte für die Vorstellungen zu sammeln, erfragen die wichtigsten Eigenschaften des Designs und welche Materialien (on- und offline) bereits existieren. Ein eventuell vorhandenes Design-Briefing studieren wir bereits vor dem Interview, um möglichst effizient zu arbeiten.
Wenn existierende Materialien verwendet werden sollen, nehmen wir diese auf und prüfen deren Tauglichkeit, zum Beispiel der vorliegenden Dateiformate, Bildqualität und Lizenzen und geben dem Kunden Feedback. Wir überprüfen außerdem eventuell vorhandene Social-Media-Präsenzen und wie diese genutzt werden, um uns ein möglichst umfassendes Bild zu machen. Beim Relaunch einer vorhandenen Seite überprüfen wir die online Reputation der Seite, sichern die Linkstruktur und Materialien.
Wir erfragen alle gewünschten Funktionalitäten und Module, beraten unsere Kunden hinsichtlich der Wahl des richtigen CMS (Content Management System) und gegebenenfalls zur technischen Infrastruktur.

Planung

Informationsarchitektur festlegen

Bevor wir die Informationsarchitektur erstellen, überprüfen wir, ob es klare strategische Ziele gibt, sofern diese nicht bereits im ersten Interview deutlich geworden sind. Die wichtigsten Fragen sind immer: für wen ist die Seite, wie sollen Besucher die Webseite finden und was genau sollen sie dort tun? Auch „Etappenziele“ wie das Abonnieren eines Newsletters und die Verbindung mit Social-Media gehören ins Strategiepapier.
Danach erstellen wir eine Sitemap, auf der Informationen und Funktionen verortet und der User-Flow geplant werden. Jeder Seite wird eine eindeutige Call-to-Action zugeordnet. Für umfangreichere Projekte legen wir außerdem Wireframes an, mit denen Informationsarchitektur und Use-Cases detaillierter geplant werden können. Das ist vor allem dann wichtig, wenn eine Webseite sich an mehrere Zielgruppen richtet, die mit unterschiedlichen Erwartungen und über verschiedene Einstiegspunkte auf die Seite Webseite kommen. Oder wenn es eine Vielzahl von Interaktionsmöglichkeiten gibt. Sitemap, Informationsarchitektur und gegebenenfalls weitere erstellte Übersichten legen wir unseren Kunden für Feedback und Abnahme vor. So stellen wir sicher, dass das Grundgerüst den Vorstellungen unserer Kunden entspricht.

Design

Webdesigner machen sich ans Werk

Anhand einer groben Zielgruppenbestimmung und der Corporate Identity entwickeln unsere Webdesigner einen ersten Vorschlag für Farbschema und Typographie. Dafür halten wir uns entweder an das erhaltene Design-Briefing oder wir erstellen gemeinsam mit unseren Kunden das Briefing.
Ist die Grundrichtung des Designs abgestimmt und das Funktionsinventar festgelegt, entwickeln wir einen „lebenden“ Styleguide daraus. Unsere Webdesigner sind alle auch Front-End-Developer, daher können wir Styleguides direkt in html/CSS entwickeln. Der Webstyleguide funktioniert dann wie eine kleine Webseite, auf der alle wichtigen Elemente abgebildet sind. So können unsere Kunden in der Designphase bereits interaktive Elemente anstelle von leblosen Bildern sehen.
Den Styleguide bekommen Kunden zum Abschluss des Projektes zusätzlich als PDF ausgehändigt. Damit können Sie künftig bei jedem Design schnell und einfach Farbcodes, Schriftarten und deren Verwendung nachlesen.

Programmierung

Programmierer machen sich ans Werk

Mit dem Styleguide macht sich das Programmierteam unserer Webdesignagentur an die Arbeit und setzt in einer eigenen Testumgebung einen Prototypen auf. Dort wird das globale Template und die Templates für besondere Unterseiten und Inhalte angelegt und die gewünschten Funktionen implementiert. Responsives Webdesign zur Darstellung auf mobilen Endgeräten und weitere Standards haben wir unter Webdesign & Frontend als unsere Qualitätsstandards definiert.
Das Template wird bereits unter Berücksichtigung des Styleguides angelegt und das endgültige Erscheinungsbild nochmals vom Designer überprüft. Das responsive Design wird auf allen Bildschirmgrößen überprüft und die gängisten Browser werden durchgetestet.

Content

Inhalte wie Texte und Bilder werden eingepflegt

Je nach Vereinbarung pflegen wir dann Inhalte ein: entweder aus einem bereitstehenden Textdokument oder wir migrieren die Daten einer bestehenden Seite. Möchten Sie die Inhalte selbst einpflegen, legen wir zumindest für alle Inhaltstypen je ein Beispiel an. Haben Sie das Einpflegen der Inhalte in unsere Hände gegeben, führen wir auch eine einfache Suchmaschinenoptimierung (SEO) durch. Das heißt, wir legen Meta-Title und -Descriptions an, Alternativtexte für Bilder und optimieren die Ankertexte der internen Verlinkung.
¯\_(ツ)_/¯ Jetzt dürfen Sie sich zurücklehnen: wir sollten jetzt alle Informationen haben, die wir brauchen und Sie müssen gar nichts tun.

Fertigstellung

Roll-Out der neuen Webseite

Sind alle Arbeiten abgeschlossen und vom Kunden endgültig abgenommen, findet der Roll-Out statt und die fertige Webseite wird von unserer Testumgebung auf den Server des Kunden übertragen. Etwaig vorhandene Daten werden zuvor gesichert. Auf dem Live-Server werden alle Funktionalitäten nochmals überprüft und (im Falle eines Relaunches) Weiterleitungen verwaister Seiten eingerichtet.

Und das benötigen wir von Ihnen:

  • Ein Strategiepapier oder Ihre Mitwirkung an der gemeinsamen Erstellung
  • Ein Design-Briefing oder Ihre Mitwirkung beim gemeinsamen Erstellen des Design-Briefings
  • Die vorhandenen Materialen (Content, Bilder, Logo, zu berücksichtigende Layouts, Farbcodes)
  • Ihr konstruktives Feedback zu Vorschlägen und Entwürfen

Dürfen wir Ihre Webseite erstellen?