Ausgangslage

Die Neue Zürcher Zeitung hat uns mit der Neukonzeption ihrer Startseite nzz.ch beauftragt. In enger Kooperation mit der Redaktion der NZZ haben wir Bedürfnisse identifiziert, Ideen entwickelt und einen Mobile-First-Ansatz für den Newsroom realisiert.

Unsere Auswahl als Agentur begründet sich darauf, dass wir uns erfolgreich in das Team der NZZ einfügen konnten und gleichzeitig in enger Zusammenarbeit mit den verschiedenen Abteilungen und Stakeholder als Projektleitung des Vorhabens tätig waren.

Vorgehen in Kürze

Mobile First – Desktop Second, für Leser:innen und Newsroom Mitarbeitende.

Unsere Strategie & Beratung Angebote

Research & Analyse User Feedback

Um das Vorgehen vorzubereiten, standen wir in enger Absprache mit dem internen Research/UX-Team und analysierten die Forschungsberichte der letzten fünf Jahre.

Ideation Workshop

Als Erstes haben wir einen Ideation Workshop mit der Redaktion gemacht, wo Wünsche und Ideen aufgenommen, geclustert und priorisiert wurden. Verschiedene Stakeholder aus dem ganzen NZZ-Haus waren dabei:

  • Redaktion (Text & Bild)
  • Daten Analysten
  • Head of Technik
  • Product Manager

Es wurde beschlossen, einen Mobile-First-Ansatz zu verfolgen. Dabei soll nicht nur die Gestaltung der Startseite diesem Prinzip folgen, sondern der gesamte Newsroom soll bei der Bespielung und Pflege der Startseite einen Mobile-First-Ansatz anwenden.

Mobile-First Prototyping Workshop


In einem weiteren Workshop druckten wir die neuen Ideen als «Wireframe-Teaser» aus, um Papierprototypen zu erstellen. Wir bildeten vier Gruppen, von denen jede den Auftrag hatte, eine Startseite zu gestalten. Jede Gruppe bestand aus einem ausgewogenen Mix an Fachleuten, die ihre jeweiligen Perspektiven in die Prototypen und Entwürfe einbrachten. Dadurch konnten wir wertvolle und vielfältige Ergebnisse erzielen und diese anschliessend diskutieren.

Herausforderungen


Die grosse Vielfalt an Perspektiven und Anforderungen der Stakeholder stellte für uns eine besondere Herausforderung dar, da es galt, den Wünschen aus den verschiedenen Bereichen und Abteilungen gerecht zu werden, ohne dabei unsere Hauptzielgruppe – die Leserinnen und Leser der NZZ – aus den Augen zu verlieren.

Zudem standen wir vor der Herausforderung, nicht nur die Bedürfnisse der Leserschaft zu erfüllen, sondern auch die Anforderungen von Newsroom und Redaktion Mitarbeitenden zu berücksichtigen, die täglich mit dem neuen Ansatz arbeiten müssen.

Lösung

Neue Teaser-Formate: Um auf mobilen Geräten die Wichtigkeit der Nachrichten visuell hervorzuheben, wurden neue Teaser-Formate eingeführt, mit denen der Newsroom den Artikeln visuelle Gewichtungen verleihen kann. Aktuelle Ereignisse können mit einem grossen Teaser hervorgehoben werden, während weniger wichtige Nachrichten durch kleinere Teaser dargestellt werden. Dies bietet den Lesenden Orientierung und Führung und verbessert den Überblick, da die kleineren Teaser weniger Platz auf den Mobile-Geräten beanspruchen.


Container für zeitlose Artikel:
Neu eingeführt wurde eine Funktion für sogenannte Longform-Artikel, die sich durch zeitlose Themen und umfassende Recherche auszeichnen: Sie können nun zwischen den täglichen Nachrichten in Containern platziert werden, die durch Slider-Gesten navigierbar sind. Auf diese Weise erhalten die Leserinnen und Leser Zugang zu den Tagesnachrichten in vertikaler Richtung und zu den zeitlosen Artikeln in horizontaler Ausrichtung.

Desktop Second

Da der Fokus des Newsrooms nun vollständig auf dem Mobile-First-Ansatz liegt, wird die Desktop-Version automatisch zusammengestellt. Wir haben ein Konzept entwickelt, das es ermöglicht, die Desktop-Version technisch ohne grossen Layout-Aufwand zu generieren.

Als „Best Default“ setzen wir auf eine optimale Standardkonfiguration, sodass im Idealfall keine gesonderte Anpassung für die Desktop-Version notwendig ist. Für besondere Ereignisse gibt es jedoch nach wie vor die Möglichkeit, das Desktop-Layout mittels spezieller Templates und Bundles individuell anzupassen.

Wireframe des nzz.ch Frontpage-Konzepts Desktop-Vorlagen
MacBook und iPhone mit der Startseite der nzz.ch

News-Portal

Neue Zürcher Zeitung

Strategie, Design & Prototyping

nzz.ch

2023

Design Team

Karin Christen Portrait

Karin
Christen

Strategy & Concept

Stefan Velthuys Portrait

Stefan
Velthuys

UX Design & Prototyping

Simon Hallimonov Portrait

Simon
Hallimonov

UI Design & Ideation