Sein wir ehrlich: Wir Gestalter würden uns doch am liebsten sofort nach einem gelungenen Meeting ans Design machen. Ideen sammeln solange sie noch frisch sind, skizzieren und ausprobieren, verwerfen und radieren, ausdrucken und verfeinern. Dabei ist für eine Webdesign Agentur in Wien gerade zu Beginn eines Webdesign-Projekts kaum etwas so wichtig wie eine saubere Trennung von Konzept, Architektur und Oberflächengestaltung.
Dabei können die Mittel unterschiedlich sein: Man kann zum Beispiel sehr ausgereifte schriftliche Konzepte abliefern, die auch schon Themen wie die visuelle Ausrichtung und den Charakter der Stimme, mit der die Inhalte ausformuliert werden, definieren. Meiner Meinung macht es aber fast immer Sinn, für die unterschiedlichen Bereiche, die abgedeckt werden müssen, unterschiedliche Methoden zu verwenden.
Zieldefinition: Das schriftliche Konzept.
Als ersten Schritt legen wir immer zusammen mit dem Auftraggeber die Ziele des Projekts fest. Die Frage „Wozu brauchen Sie eigentlich eine Website?“ ist oft viel weniger banal, als sie klingt: Immer noch gibt es die Meinung, dass man eine Website haben muss, weil das heute nunmal so ist und weil jeder eine hat. Welches Potenzial ein durchdachter und zielgerichteter Webauftritt samt begleitender Suchmaschinen-Werbe- oder Social Network-Kampagne für das eigene Unternehmen hat, wird meist erst im Gespräch klar. Das Aufzeigen von Möglichkeiten gehört zum Beruf des Gestalters wie das Design selbst.
Dabei ist es ganz wichtig, dass die Ziele, die man sich steckt, messbar sind (Frank Reese zeigt in einem seiner Bücher sehr eindrucksvoll, dass man wirklich alles, was eine Website erreichen soll, messen und taxieren kann).
Ein schriftliches Konzept definiert daher den Zweck, den der Webauftritt hat, ebenso wie die Zielgruppen und die möglichen Kanäle und Tools, mit denen man arbeiten wird. Auftraggeber und Grafiker einigen sich darauf, wo sie hin wollen und legen die Rahmenbedingungen fest. Das kann sehr ausführlich passieren, aber letztlich sollte man für die konkreteren Fragen, die sich stellen (Wie soll die Website aussehen? Wie soll sie aufgebaut sein?) geeignetere Methoden verwenden.
Charakter und Kommunikationstyp: Moodboards.
Wie Moodboards (Stimmungen transportierende Collagen, meist auf Karton) ausehen können, haben wir hier im Blog schon ein paar Mal gezeigt. Sie können im Prinzip zwei große Fragen lösen:
- Welcher Kommunikationstyp wollen wir sein?
- In welche visuelle Richtung wollen wir gehen?
Diese beiden Themen hängen natürlich stark mit einander zusammen: Der Kommunikationstyp bestimmt oft auch die visuelle Richtung. Am besten sehen wir uns Beispiele an:
- Für das Dunkelrestaurant Vier Sinne haben wir den Kommunikationstypen mittels Moodboards bestimmt, was Oliver in einem Blog-Beitrag beschrieben hat (die Typen waren: „Edel-Seriös“, „Spielerisch-Mutig“ und „Sozial-Engagiert“).
- Für eine Event-Agentur, die gerade gegründet wird, haben wir die visuelle Linie durch Moodboards abgeklärt; ich habe vor kurzem darüber geschrieben (die Typen: „Barocker Luxus“, „Minimalistischer Luxus“ und „Transparenz & Dynamik“).
Auch wenn ich jetzt zwei Projekte gezeigt habe, in denen komplette Corporate Designs geschaffen wurden: Moodboards eigenen sich auch hervorragend für reine Web-Projekte, wobei ich in diesem Fall eigentlich lieber nicht mit Karton und Papier arbeite, sondern die Boards direkt am Computer gestalte:
Website-Architektur: Wireframes und Mockups.
Wenn die Rahmenbedingungen geklärt, die Ziele definiert, der Kommunikations-Typ bestimmt und die visuelle Ausrichtung festgelegt ist, sollte man trotzdem noch nicht mit der eigentlichen grafischen Gestaltung der Website beginnen. Davor gibt es noch einen Themenkomplex, den man isoliert betrachten sollte: die Website-Architektur. Dazu gehört die Flächenaufteilung ebenso wie die Hierarchisierung aller notwendigen Elemente und die Navigations-Logik.
Es gibt viele Gründe, wieso man diesen Schritt vor dem eigentlichen Entwurf ansetzen und diese beiden Aufgaben nicht vermischen sollte, auch wenn es für den Gestalter anfangs aufwändiger erscheint:
- Die Gestaltung würde von der reinen Flächenaufteilung und geplanten Logik ablenken und die Entscheidung damit emotional aufladen, was an dieser Stelle nicht wirklich sinnvoll ist. Daher sehen Wireframes betont ungestaltet aus: Es soll nicht der Eindruck entstehen, es handle sich um einen Vorentwurf.
- Ungewollte Überlagerungen werden vermieden, indem man sich erst auf eine Architektur einigt, auf der dann die Gestaltung aufbaut. So kann es später bei der Entwurfspräsentation nicht passieren, dass der Auftraggeber den Entwurf nicht mag, weil er den Aufbau nicht ideal findet (oder umgekehrt).
- Bei Änderungen in der Struktur der Website ist aufgrund der einfachen und schnellen Arbeitsweise von Wireframes und Mockups nicht viel Aufwand notwendig. Muss man einen fertigen grafischen Entwurf ändern, ist das bereits viel schwieriger.
Wie gesagt, Wireframes sehen gewollt ungestaltet aus, weshalb man (ohne Geschmacksfragen zu diskutieren) sehr unkompliziert über den Aufbau reden und nachdenken kann. Die folgenden Screens sind der Nachvollziehbarkeit halber wieder jene des Dinner-in-the-Dark-Restaurants Vier Sinne:
Wenn man erst die Stufen Konzept, Moodboards und Wireframes durchlaufen hat, ist das eigentliche Entwerfen das reinste Vergnügen. Es sind schon so viele Entscheidungen getroffen worden, dass man sich wirklich auf das Design konzentrieren kann. Und das ohne Gefahr zu laufen, beispielsweise einen Konzeptfehler übersehen zu haben, der den kreativen Prozess bremsen oder zurückwerfen würde. Und letztlich profitieren alle davon, wenn der Designer Spaß am Gestalten hat. Das wissen wir doch.