Profil

Stromnetz Berlin - Hertzklopfen im Netz.

Die Aufgabe

Von Hause aus sind das Stromnetz und seine Themen eher etwas für Fachleute. Erstaunlich, wo ganz Berlin mit dem Stromnetz verwoben ist.

Im Unternehmen entstand der Wunsch, mehr in Kontakt mit den Kunden zu gehen. Das eigene Angebot zeitgemäßer und offener zu gestalten, sich von der Informationspflicht in Richtung aktiver Kommunikation mit den zentralen Zielgruppen zu entwickeln.

Aufbauend auf dem Logo und dem definierten Corporate Design für Print sollte ein Online-CD entwickelt werden, das Stromnetz Berlin einen eigenständigen, konsistenten und souveränen Auftritt in den digitalen Kommunikationskanälen erlaubt.

Infografik "Erneuerbare Energien in Berlin (heute)".

Die Herausforderung

Viel Text, wenig Bild, strukturelle Abbildung der internen Organisation in der Navigation -  so etwa lässt sich die Ausgangssituation zusammenfassen, die damit klare Hinweise an die kommunikativen Erfordernisse gibt.

  • Wir brauchen eine Struktur, die durch die Augen des Nutzers schaut, bei seinem Interesse ansetzt.
  • Zusätzlich zur Menü-Navigation soll es - gerade für die mobile Nutzung - auch möglich sein, direkt über den Content in die Inhalte einzusteigen. 
  • Wenn es nur wenige konkrete Bilder gibt, brauchen wir einen flexiblen Seitenaufbau und  Content-Module, die auch ohne großen Bildanteil aufgelockert wirken.
  • Die technisch z.T. recht komplexen Zusammenhänge lassen sich textlich nur umfangreich und wenig zugänglich darstellen - hier braucht es visuelle Unterstützung!


Ausschnitt der modularen Startseite mit Direkteinstiegen für B-2-B-Zielgruppen.
Die modulare Startseite mit Schnelleinstiegen für B2B-Zielgruppen.
Responsiver Wechsel von der Smartphone- zur Desktop-Ansicht.
Responsiver Wechsel von Smartphone- zu Desktopansicht
Eine der klickbaren HTML-Infografiken zur Veranschualichung von Aufbau und Funktion des Stromnetzes.
Beispiel einer HTML-basierten klickbaren Infografik.

Informationsarchitektur und Design

  • Die Struktur der Seite wurde an die gängigen Anforderungen ihrer Nutzer ausgerichtet. Vielfältige Content-Einstiege sowie die zielgruppenspezifischen Direkteinstige auf der Startseite erlauben, schnell zum gewünschten Inhalt zu finden.
  • Gestalterisch haben wir das bestehende CD aufgegriffen und in ein flexibles Interface System übersetzt, das auch ohne viele Fotos offen und einladend wirkt. Vertikale Achsen im Raster ermöglichen dabie eine sehr fleble Postionierung der Bilder und Teaser.
  • Vor dem Hintergrund der Makroaufnahme eines Faserkabels wirken die farbigen (Teaser)Flächen und die freischwebenden Elemente leicht und übersichtlich, die Prozesse zusammenhängend.


Die Umsetzung

  • In Workshops mit den Content-Ownern wurden zunächst die Anforderungen an Struktur und Darstellung geklärt und mit den Anforderungen und Bedürfnissen der zentralen Zielgruppen abgeglichen.
  • Die Designs für den abgestimmte Strukturvorschlag wurde in einem responsiven HTML-Prototypen umgesetzt und schrittweise optimiert. Zusammen mit einem Lastenheft fungierte dieser Prototyp als Grundlage der technischen Umsetzung durch eine Hamburger Agentur.
  • Parallel zur Entwicklung der gestalterischen Grundlagen wurde ein Set CD-gerechter Infografiken zur Veranschaulichung der mitunter recht komplexen Zusammenhänge entwickelt, die z.T. per HTML5 animiert wurden.
  • Begleitend zur Einpflege der Contents in das neue System gab es mehrere Checkpoints zur Qualitätssicherung der Umsetzung des Designs mit den Echtinhalten.

Steckbrief

  • URL: www.stromnetz.berlin
  • Kunde: Stromnetz Berlin GmbH
  • Branche: Energie
  • Umsetzung: 2014/15, 14 Monate
  • Technologie: Opentext, HTML5/CSS3/JS
  • Leistungen: Strategie- und Kreativberatung, UX-Design, Konzeption, Screendesign, responsives Frontend-Prototyping und Template-Vorlagen (HTML5/CSS3/Javascript), HTML5 basierte Infoanwendungen und –animationen, begleitende QS

Aktuell