 |
 |
 |
 |
 |
 |
|
|
|
spyral | Erscheinungsbild und Website
Die Unternehmensberatungsfirma spyral GbR in Stuttgart ist spezialisiert
auf das Coaching und die Beratung großer und mittelständischer
Unternehmen in Fragen des Veränderungs-
managements.
In enger Zusammenarbeit mit dem Auftraggeber haben wir das Erscheinungsbild
und die Website für spyral entwickelt.
|
|
Veränderungen
sind eher zyklisch... spyralisch!
Von
Bildern und Images wird man leicht fehlgeleitet

Geschäftsausstattung
kleines 1x1 mit Fallgruben
Eine
Website allein macht nicht glücklich...
|
| |
|
|
| |
....................................
Projekt
0411 spyral
Erscheinungsbild
Website
....................................
Auftraggeber
spyral
GbR
Michael Schwartz
....................................
Brand Identity
Corporate Design
Web Design
kilde communications
...................................
Projektstart
21. Dezember 1998
....................................
Erscheinungsbild
30. Dezember 1999
....................................
Onlinestart
1. Juli 2000
....................................
Relaunch
1. April 2001
|
|
Suchet, so werdet ihr finden...
Wenige Tage vor Weihnachten 1998 wurden die ersten Gedanken
für die Entwicklung des Corporate Design angestoßen. Der Auftraggeber
war auf uns zugetreten mit der Bitte, ihn bei der behutsamen Entwicklung
der Identität seines Beratungsunternehmen zu unterstützen.
Bei der Entwicklung einer Unternehmensidentität erleben wir es immer
wieder, dass unsere Autraggeber keine punktgenauen Briefings abgeben können,
weil sie sich selbst auf dem Weg, auf der Suche
nach Identität befinden. Deshalb arbeiten wir in solchen Fällen
sehr eng und in einem iterativen Prozess mit unseren Kunden zusammen.
Bemerkenswert in diesem Projekt ist, dass wir unseren Kunden während
der drei Jahre, die die gesamte Entwicklung gedauert hat, nur zwei- vielleicht
dreimal gesehen haben. Alle weiteren Abstimmungen, Brainstormings und
Meetings fanden in Telefonkonferenzen oder
per eMail statt. Ein manchmal etwas kompakterer Projektablauf wäre
jedoch für die Effizienz der Ergebnisse förderlich gewesen.
|
|
...........................................
Entwicklung von Signet und Erscheinungsbild
...........................................
Definition der Bilder- und Markenwelt
...........................................
Entwicklung der Geschäftsausstattung
...........................................
Produktion von Briefbogen und Visitenkarten
...........................................
Gestaltung und Produktion eines Workshop-Flyers
...........................................
Entwicklung einer ersten minimalen Website
...........................................
Relaunch der Website mit Flash und Audio
...........................................
|
| |
|
 |
| |
....................................
Brand Identity
Corporate Design
|
|
Veränderungen sind eher zyklisch... spyralisch!
Ausgehend von sehr offenen Ideen und Vorstellungen zum Thema
Veränderung bewegten wir uns anfangs noch mit einer sehr breiten
Streuung unserer Gestaltungsansätze. Da weder ein Projektname noch
ein Konzept für die strategische Positionierung
vorlagen, waren wir vollständig auf unsere Intuition angewiesen.
Auch die Firmierung und Größe des späteren Unternehmens
standen nicht fest. Gut, dass wir zusammen mit dem Auftraggeber bereits
in anderen Projekten Erfahrung gesammelt hatten, so war zumindest das
notwendige Vertrauen vorhanden. Die ersten Ideenansätze
und Entwürfe wurden Mitte Februar 1999 vorgestellt.
Die Präsentation zeigte in ihrer ganzen Bandbreite
welche möglichen Richtungen grundsätzlich eingeschlagen werden
könnten. Ein didaktisches Mix aus Bleistiftskizzen,
Erklärungen und auch bereits konkreteren Entwürfen gab uns gemeinsam
die Entscheidungsgrundlage für die weitere Entwicklung.
Aufgrund der Auschlusskriterien war es jetzt relativ einfach, in einigen
weiteren Entwicklungsrunden, den favorisierten Entwurf einzugrenzen.
Zu diesem Zeitpunkt war die Namensentwicklung schon so weit fortgeschritten,
dass nur noch der Name spyral der
Vorschlag des Auftraggebers übrigblieb.
Das Zeichen setzte sich nicht nur wegen des gleichbedeutenden Namens durch,
sondern weil es die Zyklen in einem Veränderungsprozess am besten
visualisiert: mit einer dynamischen und modernen aber auch humanistisch-organischen
Form. Die Wahl der Farben fiel auf Blau
und Grau für das Zeichen, um konservative,
ruhige und seriöse Aspekte hinzu zufügen. Das Umfeld wird durch
ein aktives Gelb belebt.
Für die Verwendung des Zeichens in Office-Anwendungen entwickelten
wir in PowerPoint ein kleines Design Manual,
mit dem unser Kunde dann auch gleich loslegen konnte, um seine Korrespondenz
und seine Präsentationen mit der neuen Identität zu versehen.
|
|

Einer der ersten Entwürfe für das Zeichen
(PDF, 375 KB)
Die ersten Entwürfe wurden online mit Acrobat Reader präsentiert.
(PDF, 50 KB)
Zwischenabstimmung:
Der Vorläufer des finalen Zeichens ist bereits dabei.

Das finale Bildzeichen: Es fehlt noch die Wortmarke.
(PDF, 26 KB)
Reinzeichnung: Das fertige Zeichen für die Umsetzung in 4C und Sonderfarben.

(PDF, 53 KB)
Ein kleines Design Manual
für Office-Anwendungen
|
| |
|
 |
| |
....................................
Brand Identity
Corporate Design
...................................
Hier finden Sie den aktuellen Workshop-Flyer
|
|
Von Bildern und Images wird man leicht fehlgeleitet
Ausgehend von dem neuen Zeichen konnten wir jetzt mit dem
Ausloten der Markenwelt beginnen. In welchem
Umfeld würde das Signet eingesetzt werden? Welchen Regeln würde
es sich im Layout unterordnen müssen? Wie würde es auf andere
Farbigkeiten reagieren? Welche Bilder, welche grafischen Zutaten würden
es gut ergänzen?
Unser Auftraggeber und wir trugen zunächst Material zusammen: Fotos
und Ideen aus denen wir in Moodboards die
Bilderwelt der Marke kollagenartig entstehen ließen. Dieses Bildmaterial
wurde dann zusammen mit den bereits vorliegenden Texten
in einem ersten Entwurf einer Imagebroschüre umgesetzt.
Bunt, wunderschön aber leider nicht ganz das gewünschte
Ergebnis. Die Gestaltung passt eher zu einem populärwissenschaftlichen
Beileger zu einem Buch über Naturphänomene denn zu einem rational
argumentierenden Beratungsunternehmen im
Umfeld potenzieller Kunden wie DaimlerChrysler, debis und SAP. Hier mussten
wir noch einmal ganz von vorn anfangen...
Die Idee einer Imagebroschüre wurde dann zugunsten eines etwas einfacher
und minimalistisch gestaltetem Flyer verworfen. Dieser Flyer wurde zunächst
im Sonderfarbendruck im Offsetdruck produziert. Später wurde mit
dem Gestaltungsraster ein PowerPoint-Master entwickelt, der vom Auftraggeber
selbst aktualisiert und auf einem Office-Farbdrucker ausgedruckt
oder aber als Online-Dokument im PDF-Format
veröffentlicht werden kann.
|
|

Die Bilderwelten der Marke werden untersucht: Überall
finden sich Spiralen...
(PDF, 534 KB)
Der erste Entwurf der Imagebroschüre ist sehr aufwändig bebildert
und gestaltet.

Auch eine Spirale: ein Fingerabdruck als Hintergrundmotiv
(PDF, 154 KB)
Die Reinzeichnung des finalen Workshop-Flyers (für Sonderfarbendruck)
|
| |
|
 |
| |
....................................
Corporate Design
|
|
Geschäftsausstattung kleines 1x1 mit Fallgruben
Nach den Erfahrungen mit der Imagebroschüre war das
Finalisieren der Geschäftsausstattung eher eine Routineaufgabe. Aber
Vorsicht, hier lauern Fallgruben! In der Vergangenheit hat es sich in
jedem Fall als notwendig erwiesen, dass zumindestens bei Sonderfarben
ein Echtfarbenandruck gemacht werden
muss, ehe die Auflage produziert werden kann. In unserem Fall hielten
wir es jedoch für ausreichend, unserem Kunden einen Screenproof sehen
zu lassen und uns im Übrigen auf unser gutes Farbempfinden und die
Erfahrung unserer Drucker zu verlassen.
Das geht vielleicht zweimal gut und einmal daneben. Moores
Gesetz folgend wurden nicht nur die Farben vom Auftraggeber anders
beurteilt, nein auch hatten die Drucker zwei der Farbformen verwechselt.
Also selbst wenn das Budget noch
so knapp bemessen ist, in Zukunft drucken wir wieder an!
Wichtig für das Corporate Design ist
auch der richtige Rahmen für Präsentationen, die vornehmlich
in PowerPoint entwickelt werden.
Die Entwicklung eines professionell gestalteteten Folienmasters
mit konsistenter Struktur in Gliederung, Layout, Farben- und Schriften
ist eine ernstzunehmende Aufgabe, die bei einer Designagentur durchaus
richtig aufgehoben ist.
|
|

Visitenkarten und Briefbogen für die Geschäftsausstattung
(PDF, 287 KB)
Reinzeichnungen der Geschäftsausstattung
(mit Farbauszügen)

(PDF, 78 KB)
Ein Folienmaster für PowerPoint Präsentationen
|
| |
|
 |
| |
....................................
Web Design
...................................
Hier finden Sie die aktuelle Website. |
|
Eine Website allein macht nicht glücklich...
Es zeigt sich am Anfang jedes Website-Projekts, dass es
für die Entwickler wichtig ist, nicht nur ein Corporate Design zu
haben, das online-gerecht aufbereitet werden kann, sondern vor allem bedarf
es Content. Ohne Inhalte ist eine Strukturierung
der Site, eine Planung der Navigation unmöglich.
Deshalb als erstes eine Sitemap
erstellen, in der gemeinsam mit dem Kunden die Inhalte gegliedert und
auf einzelne Seiten verteilt werden. Der Webdesiger kann dann aufgrund
seiner Erfahrung anfangen, Content und Navigation
zu trennen und Hierarchien und logische
Abläufe aufzubauen.
In unserem Fall wurden die Inhalte der ersten Version durch den Kunden
vorbildlich vorbereitet. Jedoch stellte sich bald heraus, dass sich die
minimalistische Gestaltung zur Infowüste
entwickelt hatte vor lauter Text kam die Botschaft nicht an.
Trotz eines knappen Budgets entschloss
sich daher unser Kunde die Site in stark überarbeiteter Form noch
im ersten Quartal 2001 zu relaunchen. In einem ersten Brainstorming
versuchten wir außer den bereits offensichtlichen Schwächen
der Site noch weitere Features und
Ziele zu bestimmen.
Hierbei wurde deutlich, dass es an Bildern, Handfestem und Konkretem mangelte.
Weder das emotionale Erlebnis noch der
praktische Nutzen der Site waren für
den Besucher unmittelbar erfahrbar. Deshalb entschlossen wir uns verstärkt
Bilder und Flash-Animationen einzusetzen um Neugier und Spieltrieb hervorzulocken.
Zusätzlich wurden Bilder gefunden, die einerseits zur Spirale und
andererseits zu Veränderungsmanagement passen. Diese Bilder sollten
weiter metaphorisch zur Verdeutlichung der Inhalte eingesetzt werden.
Das Grundthema der Site ist Musik
visualisiert durch Klaviertasten und Noten.
Die inhaltliche Hinführung in der Flash-Intro war vielleicht der
schwierigste Part, da hier erst der Makrokosmos
mit seinen Spiralnebeln in die DNS-Spirale des
Mikrokosmos, dann weiter in die Welt der Musik übergeleitet
werden sollte.
Für die Visualisierung der Bilderwelten
wurde teils von uns selbst fotografiert und kollagiert - teils wurden
lizenzfreie Bilder mit 3D-Illustrationen kombiniert. Die DNS-Spiralen
der Intro sowie die Klaviertasten auf der Methoden-Seite das Kernstück
der Site haben wir eigens für dieses Projekt mit Cinema
4D gestaltet.
Die interaktiven Sequenzen mit Animationen und
Audio in der Intro und auf der Methoden-Seite sind sehr komplexe
Flash-Skripte, die den Zustand der Seite
abfragen und sich damit kontextsensitiv
verhalten. So werden in der Intro die interaktiven Bereiche rund um das
Zeichen durch Fragezeichen solange "geteasert", bis sich der
Besucher endlich entschließt mit der Maus darüber zu fahren.
Das interaktive Piano der Methoden-Seite
ist so konfiguriert, dass verschiedene Melodien erklingen, jenachdem ob
eine schwarze oder eine weiße Taste gespielt wird. Dabei werden
in allen Flash-Animationen die Spielregeln der
Usability eingehalten. Die Intro kann jederzeit übersprungen
werden. Auf der Methoden-Seite kann die Musik
optional ausgeschaltet werden.
Auch wurden im Layout der neuen Site umfangreiche Optimierungen gegenüber
dem ersten Prototypen vorgenommen: die "Bühne" wurde bildschirmmittig
eingerichtet. Ein geriffelter Verlauf hinter der linken Marginalspalte
beruhigt das Layout und erhöht die Wertigkeit. Auch Farben und Schriften
wurden mit Stylesheets weiter vereinheitlicht.
|
|

In einer Sitemap wird die Struktur und der Umfang der
Site festgelegt.

Die Website in der ersten Version (1. Juli 2000)

Ein Brainstorming hilft bei der Definition neuer Ziele.

Auf den weißen Tasten beginnen...

Die neue Bilderwelt kommt musikalisch daher...

...und kosmisch kreativ im Cinema 4D-Look.

Mit Flash werden neue Töne angeschlagen...

Der Relaunch der Website mit komplexen Flash- und Audiosequenzen.
(1. April 2001)
|
| |
|
|
|
|
|
Projektarchiv
zur Übersichtsseite
|