This is some text inside of a div block.
Freundlicher Smilie in Grün

Webdesign für die Hamburg Media School

Kunde
Hamburg Media School
Fokus

Webdesign
Website-Relaunch

Leistungen

Konzept & Beratung
Informationsarchitektur
UX/UI Design

Die Hamburg Media School gilt seit ihrer Gründung im Jahr 2003 als Sprungbrett in eine erfolgreiche Medienkarriere. Wir durften den Relaunch der Seite konzipieren und gestalten – durch zahlreiche Unterseiten eine komplexe Aufgabe und eine spannende Herausforderung im Bereich Informationsarchitektur und Navigationskonzept.

Website-Konzept für die Hamburg Media School

Die Strukturierung der Inhalte war eine komplexe Aufgabe. Die Herausforderung war es dabei, ein Navigationskonzept zu entwickeln, welches für alle Unterseiten funktioniert und alle fünf Studiengänge gleichberechtigt behandelt. Im ersten Schritt haben wir mit dem Kunden eine Sitemap entwickelt, welche die Fachrichtungen, die zahlreichen Weiterbildungsmöglichkeiten und alle weiteren Unterseiten logisch strukturiert.

Danach haben wir für alle Seitentypen Wireframes erarbeitet. Der Anspruch an das Designkonzept war es, einerseits einen sehr modularen Aufbau zu verwenden, damit alle Inhalte über das Content-Management-System eingepflegt werden können. Gleichzeitig wünschte sich der Kunde aber möglichst viele Freiheiten, was die Gestaltung der Unterseiten angeht, damit jede Fachrichtung möglichst individuell dargestellt werden kann.



User Interface Design

Die neue Website ist nach dem Mobile First-Ansatz konzipiert. Das bedeutet, dass das Layout für die optimale Darstellung auf mobilen Devices entworfen wurde. Im zweiten Schritt wurden die Inhalte für Desktop-Geräte optimiert. 

Der modulare Aufbau ermöglicht es dem Kunden, jede Unterseite individuell zusammenzustellen. So sieht nicht jeder Studiengang-Onepager gleich aus, sondern kann je nach inhaltlicher Anforderung passend gestaltet werden.

Für das Layout haben wir ein schlichtes, modernes Design entworfen. Wir haben die moderne, geometrische und besonders gut lesbare Schrift „Brown“ mit der filigranen und zeitlosen „Minion“ gepaart, was einen unverwechselbaren Typografie-Mix ergibt.
Jeder Studiengang erhält einen eigenen Header, für den wir uns ein besonderes Bild-Konzept überlegt haben. Wir arbeiten in den Headerfotos mit Ebenen, die sich teilweise vor die Headline schieben. So bekommen die Headerbilder eine räumliche Tiefe.

Eine besonders gute Usability hat die Navigation der Website. Das seitlich angeheftete Menü hat den Vorteil, dass die Inhalte viel bequemer und übersichtlicher durchstöbert werden können. Außerdem ist die Navigation so immer im Blick und lässt sich nach Bedarf ein- und ausklappen.

Fakten