KATAPULT-Magazin & KATAPULT-Verlag

In meiner Zeit bei KATAPULT von 2019 bis Mitte 2021 war die Firma mitten in einer ihrer größten Wachstumsphasen. Die Eintragung als gGmbH im Handelsregister (von gUG zuvor) oder die Gründung des KATAPULT-Verlags – als Entwickler Nummer zwei durfte ich das alles miterleben.

Eine meiner wachsten Erinnerungen ist die Produktion von Ausgabe 16 (Januar–März 2020) – das Magazin, an dem gearbeitet wurde, als ich ins Team kam. Die frisch gedruckten Hefte wurden direkt ins Büro geliefert (damals in die gemieteten Räume im Biotechnikum Greifswald). Wir bereiteten gemeinsam die Magazine für den Versand vor – von Faltentasche zukleben bis Versandbündel schnüren.

Das tokenbasierte Designsystem für Webprojekte

Direkt in den ersten Monaten baute ich verschiedene Landing-Pages für das KATAPULT-Universum (die teils nicht mehr online sind):

• katapult-wald.de – eine Spendenseite rechtzeitig zur Veröffentlichung von Heft 19
• katapult.link – ein Linktree für die Bio in Social-Media-Kanälen
• katapult-verlag.de – die Website für den neu gegründeten KATAPULT-Verlag

Alle diese Websites griffen den Stil von KATAPULT auf. Da KATAPULT in erster Linie ein Magazin war und ist, entstand der markante Stil von KATAPULT genau dort: im gedruckten Raum. Mein Herzenswunsch war, diese visuelle Identität ins Digitale zu übersetzen.

Aus diesem Grund begann ich initiativ, an einem Designsystem für Webprojekte zu arbeiten. Ziel war die bestmögliche Übersetzung von Print ins Digitale. Mit jeder Website und neuen Features, die gebraucht wurden, wuchs das Designsystem mit der Zeit zu einem vollständigen Web-Framework – und legte damit das Fundament für die neue KATAPULT-Website.

Unter der Haube ist es ein CSS-Framework, welches ein Set an Basiskomponenten liefert und mit Tailwind-inspirierten Utilities erweitert wird.

Ein Detail, das mir besonders am Herzen lag: die Wahl der Schriftart. Für den Fließtext entschied ich mich für Spectral – eine elegante Serifenschrift, die sowohl auf katapult-magazin.de als auch katapult-verlag.de zum Einsatz kommt.

Aus Archivzwecken kannst du dir das Designsystem hier anschauen: katapult-design-system.byjohann.dev

Die neue Magazin-Website

Während meiner Zeit beim KATAPULT-Magazin bestand eines meiner Hauptanliegen darin, die alte Website (Typo3) abzulösen und mit einer performanten, schicken zu ersetzen. Das Designsystem war bereit, es fehlte „nur“ an der Content-Migration, dem Design und der Umsetzung der neuen Website.

Nach einem Vergleich und Abwägen der besten Erfahrung für die Redaktion entschieden wir uns für Kirby CMS.

Etwa die Hälfte der Entwicklungszeit floss in die Datenmigration – alle Artikel aus dem Typo3-System mussten aus einem WYSIWYG-Format in das Blöckeformat von Kirby CMS konvertiert werden. Dabei waren unzählige historisch gewachsene HTML-Variationen zu berücksichtigen, die sich über die Jahre in den WYSIWYG-Editor eingeschlichen hatten.

Eine weitere Herausforderung war gleichzeitig die größte Freude am Projekt: das Design zu konzipieren. Die richtige Balance zwischen dem typischen KATAPULT-Stil und einem modernen Onlinemagazin zu finden, brauchte Zeit. Doch als ich in den Flow kam, konnte ich das Layout innerhalb von etwa zwei Wochen umsetzen.

Zum damaligen Zeitpunkt entschieden Benni und ich uns für eine agile gestalterische Entwicklung. Das heißt: Es wurden keine Mockups konzipiert, sondern der technische Prototyp wuchs in Feedback-Zyklen zum finalen Produkt heran. Ich möchte an dieser Stelle Benni danken, dass er mir die Freiheit gab, autonom zu arbeiten – und mir und meinen Fähigkeiten vertraute.

Mein einziges Foto von Angela Merkel

Am 4. Februar 2020 legte Bundeskanzlerin Angela Merkel den Grundstein für das Zentrum für Life Science und Plasmatechnologie in Greifswald – direkt neben dem Biotechnikum, in dem KATAPULT damals seine Büros hatte. Bei dieser Gelegenheit besuchte sie auch einige Firmen aus der Nachbarschaft, darunter KATAPULT.

Benni überreichte ihr das erste KATAPULT-Buch „100 Karten, die deine Sicht auf die Welt verändern“. Ich stand daneben – und schoss mein einziges Foto von der damaligen Bundeskanzlerin.