Mobile Business Blog-Serie – Die Mobile Website der Stadt Zürich: Ideen (Teil 1 von 3)

Sowohl Interaction Designer bei Namics als auch Dozent für Typographie an der ZHdK zu sein war für mich der kleinere Spagat als der, zwischen Politik, Accessibility und Trend. Aber bekannterweise «entstehen Diamanten nur unter Druck» wie eine meiner Studentinnen kommentierte.

Die mobile Website der Stadt Zürich wurde zunächst auf Deutsch umgesetzt

Die mobile Website der Stadt Zürich wurde zunächst auf Deutsch umgesetzt

Mit der mobilen Website der Stadt Zürich sollten Service-, Interaktions- und Grafikdesign nahtlos ineinander greifen. Wichtigstes Kriterium war es, die online Dienstleistungen der Stadt Zürich den mobilen Bedürfnissen anzupassen und nicht die bestehenden Dienste in ein mobiles Kleid zu zwängen. Zudem sollte die Umsetzung auch zeitgemäss und «typisch Züri» sein – grafisch wie auch inhaltlich, einzigartig und konsequent.

30, 60 und 120 Punkt NeueHelvetica Condensed für die mobile Website war eine der zentralen Ideen dieser bemerkenswerten Zusammenarbeit zwischen der Stadt Zürich und Namics. Spass und Selbstkritik waren die Hauptdarsteller des Prozesses. Ausprobieren anstatt diskutieren, Scheitern und wieder Aufstehen. Spätestens als es galt, diese urzürcherische Schrift auf den verschiedensten Geräten angezeigt zu bekommen.

Skizzen von Grafik Designer Patrick Stürcken

Skizzen von Grafik Designer Patrick Stürcken

Eine weitere Idee waren die «Bookmarks». Wer gibt schon m.stadt-zuerich.ch ein, wenn er etwas von der Stadt Zürich wissen möchte? Niemand! Google ist die Antwort, logisch. Das brachte uns zum Mantra der «Bookmark City». Jeder Service lässt sich mit einem eigenen Ikon «bookmarken» und verhält sich danach so, wie die den Usern bekannten Apps: Toiletten, Notfallnummern, Badetemperaturen, Sportagenda, etc. Diese Bookmarks haben uns jedoch fast das Genick gebrochen, aber eben, nur fast.

Diese Idee mag gut klingen, beinhaltet jedoch einige hinterhältige Tretminen, nicht nur technischer Natur sondern auch gestalterischer. Wer will schon 1001 Icons für jeden zukünftigen Service gestalten, niemand. Auch wir nicht. «Lass es uns doch einfach anschreiben» sagte unser Designer Patrick. «Aber nur mit einer Condensed» war meine Antwort. «Na und?» war seine darauf. «Auch schon mal was von Corporate Design gehört?» klang mein etwas zu grauhaarige Antwort. «Klar, na und?» war seine wiederholte Antwort, «sprich mit Ihnen, du bist hier der Senior Designer!» Kurz darauf konnten wir die Stadt von dieser Erweiterung der Helvetica um den Condensed Schnitt überzeugen.

Bookmark City auf einem iOS Gerät

Bookmark City auf einem iOS Gerät

Evolution beinhaltet Mutation und diese «züchten» wir mit Prototypen. Kultur in Zürich ist es, auf das Tram zu laufen, einen Parkplatz zu finden oder mit dem Velo zur nächsten Badi zu fahren. «Lass es uns ausprobieren und lernen» und schon beim ersten Papierprototypen wurde uns klar: Die Tastatur ist keine Option. Wir waren unterwegs und hatten keine Muse, um zu tippen. Früh wurde die Suche überzeugt gestrichen. Jetzt muss die Informations-Architektur überzeugen und den Weg zeigen. «Loslassen, Dialekt sprechen und beobachten» forderte unser UX Consultant Michael, zu Recht. «Wa wötsch» war meine verbale und visuelle Antwort im nächsten Entwurf. Wöchentlich sassen wir mit der Stadt zusammen und lernten sprichwörtlich «anhand» der Erfahrungen mit den Prototypen.

Verschiedene interaktive Prototypen zum Ausprobieren direkt auf dem Gerät

Verschiedene interaktive Prototypen zum Ausprobieren direkt auf dem Gerät

Papier Prototyp Version 2

Im nächsten Teil dieser Serie in der Serie möchten wir Ihnen spannende Einblicke in die Konzeption geben.

Dieser Post ist Teil der folgenden Serie:

Ideen (Teil 1)
Konzeption (Teil 2)
Umsetzung (Teil 3)

3 Gedanken zu “Mobile Business Blog-Serie – Die Mobile Website der Stadt Zürich: Ideen (Teil 1 von 3)

  1. Kompliment für den informativen Einblick in dieses Projekt. Mich würde interessieren mit welchen Mitteln der Interaktive „Papier“ Klick-Prototyp erstellt wurde?
    Vielen Dank für ein Feedback.

    • Der Prototype ist ein klickbares PDF, erstellt entweder übers Indesign oder direkt im Acrobat Pro. Dies lässt sich dann mit der Goodreader App auf den Geräten darstellen. Funktioniert auch wunderbar mit dem iPad, geht super schnell.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

*

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>