Three years digital transformation at Der Spiegel: a retrospective.

MEDIA REPUBLIK > MEDIA INNOVATION > DER SPIEGEL RETROSPECTIVE DIGITAL TRANSFORMATION

In 2019, two newsrooms – print and online – merged. In 2020, two brands – Der Spiegel and Spiegel Online – became one. January 2020 was the crucial milestone of a technical and product innovation cycle, organisational change and design of a new consumer experience that started in 2018 and is still going on now, at the end of 2021.

Der Spiegel has recently announced that it fully recovered from the losses of the first pandemic year 2020. It is increasing its revenues by 20 million euros in 2021, with even better expectations for 2021.

Digital has been the growth driver. The transformative effort paid off and paved the way for more successful years ahead. Here, a review of Der Spiegel’s transformative path, with links to further readings and resources.

DER SPIEGEL BY THE NUMBERS

20 Mio.

REVENEUE
INCREASE
2021 VS 2020

244 Mio.

MONTHLY VISITS
ONLINE AND
MOBILE APP

695.831

PAID PRINT
CIRCULATION
end q3 2021

Before 2018: digitally reactive and in trouble.

When at the beginning of the 2010s, in the course of the change in media consumption, US news brands readjusted their digital offerings and converted to responsive design, the vast majority of publishing and media houses in Germany were still asleep.

Trapped in the technical constraints of legacy systems dating back to the end of the nineties, the adjustments on Spiegel.de were usually minimal when not superfluous.

The purely reactive strategy seemed to work until the thing became unsustainable: technically, editorially, culturally.

In 2018, due to the scandal of the journalist Claas Relotius (that partially invented his reportages), Der Spiegel faced a significant credibility problem. It was not the only one. Like many newspapers and magazines, Der Spiegel attracted new visitors from social media with the questionable practice of click-baiting headlines.

2018: the start of two years radically transformative.

schermata 2022 01 03 alle 15.21.52
Transformation path 2018-2021

The transformation at Der Spiegel started as a matter of product and technology, soon became holistic: editorial, organisational, cultural and commercial.

It started from the honest assessment of an unsustainable infrastructure. But the Spiegel management also realised that separating the core brand, Der Spiegel, made for print and a “Spiegel Online” for digital, did not make sense anymore. The readers were already beyond this obsolete product segmentation. It was the publisher, the one still behind.

There was no alternative to a big comprehensive change:
  • The infrastructure at Der Spiegel was hopelessly outdated. The CMS was 100% custom and could only be used with Internet Explorer.
  • The website was not responsive, the layout needed a fundamental redesign. In many cases, it did not help to make the depth of Spiegel´s reporting visible.
  • There was no way to personalise content offering, nor to implement any sophisticated pay models. Commercially, the product was a barrier for business innovation, not an enabler.

Formulating a product vision to synchronise all efforts.

The first and the most critical milestone at the beginning of 2018 was formulating a new product vision. Where did der Spiegel want to go on digital? As the development team explained, finding the product vision took longer than expected. To align all players, editorial, marketing, sales and development, needed to remove all potential ambiguities. The result was:

Wir begleiten unsere Nutzer:innen durch den Tag und in die Zukunft — und sind dabei wegweisend“.

“We accompany our users through the day and into the future – and lead the way”.

  • Lead the way with journalism meant: make complex contexts understandable and shaping debates, providing orientation.
  • Lead the way with technology: choosing a groundbreaking approach to design and technology.
  • Being a companion meant: develop new formats and innovations when they make sense for users, not as a means to show how modern a newsroom is.

GO DEEPER. Read the story of the Next Gen project on the Spiegel Developer Blog on Medium (German): Jan 2020, Alles neu denken — der Prozess hinter dem Relaunch des digitalen SPIEGEL (Rethinking everything – the process behind the digital SPIEGEL relaunch).

Agile and design thinking entered the newsroom.

newmethodsatderspiegel2019
Credits: Der Spiegel Development Team

The year-long work to relaunch Der Spiegel was also an example of product thinking in action – Agile, Design Thinking and New Work entered the newsroom, introducing the whole organisation to interdisciplinary working teams. 

During the NextGen project, teams were formed for: 

  • defining the core of Spiegel´s digital offerings, 
  • for developing new business/by-products/print, 
  • for optimising reader engagement and paid content, 
  • for managing video and audio, 
  • for handling cross-cutting issues like design and user experience (UX),
  • for search engine optimisation (SEO) user and research. 

Those teams live longer than the relaunch since the evolution of Der Spiegel never stops. The entire organisation has learned to work against OKRs and with greater autonomy. 

GO DEEPER.Wie wir den Spiegel entwickeln” (FREE) (DEU) Lessons learned from the relaunch of Der Spiegel, told by Stefan Ottlitz, head of product development, Christina Elmer and Matthias Streitz, heads the Spiegel development editorial team. March 2020.

Now, Der Spiegel is an organisation where new developments do not come out of the blue: they are informed by data, investigated with frequent user research, A/B tested and documented. 

Keep the user in focus: personas, surveys, data. 

Surprisingly enough, you can still hear of news publishers not using personas to inform their product and editorial decisions. Who knows? Maybe they think they can “feel” the readers with their gut.

That is not the case at Der Spiegel: the systematic use of audience personas have been a pillar of the NextGen project and the Spiegel transformation.

Spiegel personas are examples of target groups that they already reach very well or want to focus on even more – and are called Nina and Christian, Hamsi and Claudia, Jana and Frank, Ulf and Laura. They remind every day who are the readers, the viewers, the listeners of Spiegel content.

The Spiegel team received support from the Berlin-based Kobold agency to develop the user personas. Kobold helped to review the analytics data, conduct user research and leverage the experience of the teams to create the profiles.

A new CMS at the center.

The quest for a new content management system started in 2018, with some challenges to solve: 

  • not to develop everything in-house, 
  • the need to retain the maximum flexibility 
  • change and scale at-need and no big bangs after the big relaunch planned for 2020.

The answer to this was modularity, as the project name Polygon conveys.

The architecture of the new system combines different products interfaced. Components can be added, removed or replaced without disrupting the overall architecture. 

Central content storage ensures that nothing gets lost and everything can be served via any technology, on any present and future device. It is a headless system: the new standard for content management.

What does belong to Polygon architecture? Do not expect the big names of the enterprise content and publishing management: the choice has been often for small, new tools, affordable and very flexible. Worth to mention, inter alia: 

  • The Statamic editor for the newsroom (a made-in-Germany solution);
  • Plenigo as the paywall provider;
  • The Digas archiving system, a Spiegel development.
schermata 2022 01 03 alle 12.54.27

GO DEEPER.Polygon — wie die modulare Architektur des neuen digitalen SPIEGEL funktioniert” (Polygon – how the modular architecture of the new digital SPIEGEL works) (MEDIUM) (DEU) Spiegel Development Blog, January 2020

A new design language.

The best way to understand the design system developed for the Spiegel is to read the case study delivered by Make Studio on Behance and keep a tab of your browser open to the website now: you will appreciate on one side the usability, on the other, you will see how each element has been designed to help users not only navigating but also distinguishing the type of content on-page by role and editorial nature (e.g. reports vs opinions and commentary).

GO DEEPER. “The Design System of Der Spiegel” on Behance, by Make Studio.

Before its redesign, Spiegel was a different brand on print and digital: Spiegel online was born when digital was a means for diversification, and digital brands were ancillary to the print core business. 

The Spiegel digital relaunch started from a different view on the relationship between readers and Der Spiegel: users visit the Spiegel every day, starting from a newsletter or from social or visiting the main page, and download a digital edition of the magazine (or buying the print edition) once a week. Using a buzzword, it was about a digital-first relationship. 

The new design system of Der Spiegel is not only a state-of-the-art application of modern design principles (see the case study on Behance about UI patterns and object libraries), but a means to: 

  • unify branding and image 
  • making the most of the home page 
  • providing users with clear guidance on where to go and what to expect. 

Take the image aspects: 

  • The orange typical of the print magazine became the primary colour in the digital media environment. 
  • All the house fonts, changed and optimised, are now fully responsive. 
schermata 2022 01 03 alle 14.52.03
Source: https://www.behance.net/gallery/93165243/DER-SPIEGEL-Digital-Design-System

Usability and guidance. 

  • The menu items displayed in the horizontal bar worked only as direct links to topical pages. The main navigation became a “burger”. 
  • From a journalistic point of view, the distinction between news and opinion (columns, commentaries) is essential. The new Spiegel adopted a clear differentiation based on typeface: News headlines have a clear, angular typeface, whereas opinion pieces have a curved, personal-looking headline. In addition, every opinion piece has a rounded author image, which provides further differentiation.
schermata 2022 01 03 alle 14.53.25
Source: https://www.behance.net/gallery/93165243/DER-SPIEGEL-Digital-Design-System

The home page: from feed to orchestrated presentation. 

  • The front page of spiegel.de used to be a linear feed. In the new product, this feed also exists, but it now consists of blocks in which several articles can be bundled by topic and presented in different areas. Editors have many more chances to change and adapt the page and orchestrate content. 

The print relaunch in 2021.

May 2021 has been the closing of a loop: after redeveloping and redesigning all things digital, the print edition relaunched: more visual than ever. 

spiegel layout 20 prozent 580x383 1
spiegel layout 20 prozent 580×383 1

Still content-driven, of course, but more visual: the Der Spiegel on print became more “magaziny”. Less white space, smaller fonts bolder headlines. The new Spiegel print has been designed by Francis Uckermann: you can check out her design showcase here. 

The new design appeared at the beginning of the German federal elections campaign, with a cover that new seems obsolete but made headlines on all other media for showing a “superhero” version of Annalena Baerbock, the co-leader of the B90-Grüne (Greens). 

spiegel cover neu 510x674 1
spiegel cover neu

Final considerations: in praise of transparency.

At the bottom of this retrospective, you find links to the Spiegel “Behind the scene” and “Development” blogs. The whole transformative path has been documented and shared and still is.

The Spiegel Teams communicate learnings and internal case studies, take part in events and tell how they work – including what did work well and whatnot. You find contributions on Medium and on several tech blogs.

That is not different from the best practice we see at the Guardian, the New York Times, the Financial Times or the Schibsted Group. It should not come as a surprise: agile and new work are framework born out of a need for autonomy, empowerment and transparency. The German media industry has taken this transparency path later than other countries, but it is walking the talk.

READ ALSO

👉🏿 Der Spiegel at the end of 2021 and ahead of 2022: great expectations.

👉🏿 Backstage: the Spiegel teams “Behind the scenes” blog (DEU).

👉🏿 DEV Spiegel: the Spiegel development Blog (DEU).

Would like to receive this and other retrospectives and case studies from German media in your inbox? Consider to subscribe as a premium member.


INSERT_STEADY_CHECKOUT_HERE

Subscription and payments are managed by Steady Media GmbH, a company registered in Berlin, Germany. Steady passes on personal data to Media Republik to be able to provide the service. You can cancel the subscription at any time. Read more on your cancellation rights.

sez video 2
audio and voice
innovation
bookpublishing
newsmag
big picture