Design der von okamo aus Berlin gestalteten Homepage der Website von GTZ Berlin. Die Startseite zeigt eine Zufallsauswahl von Projektbildern und lädt den Nutzer auf eine Entdeckungsreise ins vielfältigen Portfolio des Fernsehtrailer- und Postproduktionsspezialisten GTZ Berlin

Das GTZ Berlin (Grafik Trick Zentrum Berlin) entwickelt und produziert seit 2003 Kampagnen, Imagefilme, Promotion und TV-Design. Ina Hebestedt und Svend Angermann betreuen mit dem GTZ Berlin Kunden wie Pro Sieben Sat.1, das Erste, N24 und andere mehr von der Konzeption bis zur Realisierung. Das Spektrum der Arbeiten reicht dabei von Idee und Konzept über Organisation bis zum Dreh und Schnitt und wird abgerundet durch Grafik und Design. Die Arbeit für die Website hat für uns einige freudige Wiedersehen mit TV-Logos bedeutet, die von uns für Pro Sieben Sat.1 gestaltet und vom GTZ Berlin für den Screen weiterverarbeitet wurden. Das Konzept der Website favorisiert die völlige Konzentration auf die Inhalte, in diesem Falle also Screenshots der Arbeiten und Bewegtbilder. Das Grafikdesign der Website nimmt sich zurück und verankert sich im Kopf der Betrachter durch pointierten Einsatz von Farbe, Typografie und schwarzen Flächen, die als Trennelemente sowie als Font für invertiert hervorgehobene Schrift im Hauptmenü und der Kurzbeschreibung der gezeigten Projekte Verwendung finden. Die präsentierten Projekte werden über ein Keyword-Menü erschlossen. Jedes Projekt ist mit Keywords aus drei verschiedenen Themenfeldern verschlagwortet. Auf diese Art kann der Nutzer je nach „Erkenntnisinteresse“ seinen weg wählen, um sich dem Portfolio des GTZ Berlin zu nähern. Die Startseite bietet eine Zufallsauswahl von ausgesuchten Projekten, die in immer wechselnden Anordnungen für Lebendigkeit sorgen.


 

Alternative Entwicklungslinien des Design der Website


Von okamo aus Berlin gestaltete Designstudie der Website von GTZ Berlin mit stark horizontaler Gliederung (auf weißem Fond)
Von okamo aus Berlin gestaltete Designstudie der Website von GTZ Berlin mit stark horizontaler Gliederung (auf schwarzem Fond)
Von okamo aus Berlin gestaltete Designstudie der Website von GTZ Berlin mit stark horizontaler Gliederung (auf schwarzem Fond)

Im Entwicklungsprozess wurden verschiedene Wege sondiert. Hier sehen Sie drei zwischenzeitliche Varianten, drei Ansätze, die zu Beginn auf eine fast formatfüllenden Art die Fläche des Browserfensters nutzen. Hier stand noch stärker die Schaffung von Atmosphäre im Vordergrund. Die horizontalen schwarzen Balken signalisieren „großes“ Kino und die Navigationselemente sind wie beiläufig überlappend angeordnet. Im Laufe der Entwicklung wurde diese Großzügigkeit jedoch abgelöst durch die kleinteiligere Projekt-Matrix, die es dem Nutzer besser ermöglicht, sich einen schnellen Überblick über das Portfolio des GTZ Berlin zu verschaffen. Die Videos lassen sich in einem flashbasierten Player auch Fullscreen bei überzeugender Ton- und Bildqualität ansehen.

 

Frühe Skizzen aus der Designentwicklung


Von okamo aus Berlin gestaltete Designstudie der Website von GTZ Berlin mit klassisch links positioniertem Menü
 
Von okamo aus Berlin gestaltete Designstudie der Website von GTZ Berlin mit einer Ansicht von Projektteasern in Anlehnung an Apple's Cover Flow
 

Zu Beginn der Projektphase gibt es keine „Taboos“ und wir probieren im Team aus, was auch immer uns in Bezug auf die Aufgabe als Lösungsansatz in den Sinn kommt. Nebenstehend sehen sie zwei sehr unterschiedliche Varianten. Die erste zeigt schon die später wieder aufgegriffene Bild-Matrix, die zweite setzt auf einen an Apples Coverflow angelehnte Präsentation der einzelnen Projekte.

 

Einige Logovariationen auf dem Weg zur finalen Form

Wir waren im Zuge des Redesigns der Website ebenfalls beauftragt, eine Logoüberarbeitung vorzunehmen. Wir haben dabei den Geist der alten Form aufgegriffen durch einige kleine Interventionen aufgefrischt. Abgerundet wurde diese Anpassungsarbeit durch eine neue dem Logo beigestellte Wortmarke. Wir haben uns für die „Sommet Rounded“ entschieden. Sie verkörpert mehr Frische, eine zeitgenössischeres Gefühl und eine modernere Anmutung.

   
EIne von okamo aus Berlin gestaltete Matrix mit Vorstudien zum neuen Logo-Design von GTZ Berlin

Vorher/Nachher

Die Logoüberarbeitung ging einher mit der Entscheidung, auf die Langform des Names „Grafik Trick Zentrum Berlin“ zu gunsten der knappen und im Sprachgebrauch einfacheren Form „GTZ Berlin“ aufzugeben. So konnte eine kompaktere Wort/Bild-Marke geschaffen werden.

   
Gegenüberstellung des alten und des neuen, 2010 von okamo aus Berlin überarbeiteten Logo-Designs von GTZ Berlin

Website vor dem Redesign durch okamo

Screenshot der alten Website von GTZ Berlin, bevor sie 2010 von okamo neu konzipiert und gestaltet wurde

Der Screenshot zeigt die Website vor dem Redesign: Es war schwer, sich einen Überblick über das Portfolio des GTZ Berlin zu verschaffen und die Videos wurden sehr klein und in sich öffnenden Extrafenstern präsentiert.

   


Projekte // Webdesign · GTZ Berlin Redesign

left arrow
right arrow

Kurzbeschreibung
Webdesign und neues Logodesign (Redesign) des Berliner Produktions- und Postproduktionsbüros GTZ Berlin
Auftraggeber
GTZ Berlin e.K.
Jahr
2010