Storyblok – Headless CMS mit visuellem Editor

Die Brücke zwischen Entwickler-Flexibilität und Redakteur-Komfort

9 Minuten
Storyblok – Headless CMS mit visuellem Editor
#Storyblok #Headless CMS #Visual Editor #WYSIWYG

In den vorherigen Artikeln haben wir Headless-Systeme gesehen, die stark Entwickler-orientiert sind (Strapi, Directus) oder vollständig als SaaS betrieben werden (Contentful).

Mit Storyblok kommt nun ein Kandidat, der versucht, beide Welten zu verbinden: die technische Flexibilität eines Headless CMS mit der Bedienfreundlichkeit eines klassischen visuellen Editors.

Stellen Sie sich vor: Eine Marketingmanagerin möchte einen neuen Hero-Bereich auf der Homepage erstellen. Bei Strapi oder Contentful müsste sie Entwickler bitten, das umzusetzen – oder sich durch abstrakte Formularfelder klicken, ohne zu sehen, wie es aussieht. Bei Storyblok klickt sie auf “Neue Komponente”, zieht einen Hero-Block in die Seite, lädt ein Bild hoch, schreibt den Text – und sieht in Echtzeit, wie es auf der Website aussieht. Ohne die Entwickler zu stören.

“Headless muss nicht bedeuten, blind zu arbeiten.”

Damit richtet sich Storyblok nicht nur an Entwicklerteams, sondern auch an Redakteur*innen und Marketer, die Inhalte visuell gestalten möchten, ohne Code zu berühren – und ohne ständig auf Entwickler angewiesen zu sein.

Entstehungsgeschichte

Storyblok wurde 2017 in Linz (Österreich) gegründet. Die Gründer wollten ein System schaffen, das Headless-Architektur mit einem nutzerfreundlichen “What You See Is What You Get”-Editor kombiniert.

Der Ansatz traf einen Nerv – vor allem in Europa, wo viele Unternehmen bisher klassische CMS gewohnt waren, aber auf moderne Frontend-Technologien umsteigen wollten, ohne ihre Redaktionsprozesse aufzugeben.

Fokus & Philosophie des Anbieters

Storyblok verfolgt einen einzigartigen Hybrid-Ansatz:

  • Redaktionsfreundlichkeit: Visueller Editor für Live-Vorschau und komponentenbasiertes Arbeiten
  • Technische Freiheit: Frontend bleibt entkoppelt, kann in jedem Framework umgesetzt werden
  • Globale Ausrichtung: Multi-Language und Multi-Site-Unterstützung out-of-the-box
  • API-first: Inhalte werden konsequent über REST oder GraphQL bereitgestellt

Technische Basis

💻 Programmiersprache / Frameworks

  • Backend: Proprietäre SaaS-Architektur
  • SDKs: JavaScript, PHP, React, Vue, Svelte und andere
  • API-Typ: REST und GraphQL (Delivery & Management API)

🏠 Hosting

Vollständig SaaS in der Storyblok-Cloud, globale CDN-Auslieferung über Partner

Preisgestaltung: Visual Editor hat seinen Preis

Storyblok ist ein SaaS-only-System mit gestaffelten Plänen. Die Preise basieren auf “Spaces” (Projekten).

Kostenmodelle

Community (Free):

  • 0 USD/Monat (keine Kreditkarte nötig)
  • 1 Nutzer kostenlos (weitere: 9 USD/Monat pro Nutzer)
  • Limitierte Content-Items und API-Aufrufe
  • Visueller Editor verfügbar
  • Ideal für: Persönliche Projekte, Tests, kleine Blogs

Entry Plan:

  • 99 USD/Monat
  • 5 Team-Mitglieder inklusive (weitere: 9 USD/Monat)
  • Höhere Content- und API-Limits
  • Multi-Language-Support
  • Webhooks
  • Für: Kleine Unternehmen, Startups, Agenturen mit wenigen Projekten

Business Plan:

  • 849 USD/Monat
  • 20 Team-Mitglieder inklusive
  • Advanced Workflows, Rollen & Rechte
  • SLA, Priority Support
  • Custom Roles
  • Für: Mittlere bis große Unternehmen

Enterprise Plan:

  • Ab 3.299 USD/Monat (individuell)
  • Unbegrenzte Nutzer
  • Dedizierter Support, Custom SLA
  • Single Sign-On (SSO)
  • Advanced Security Features
  • Für: Konzerne, große Multi-Brand-Setups

Wichtige Preisdetails

Space-basierte Preisgestaltung:
Jedes Projekt (Space) braucht ein eigenes Abo. Wer 5 Kunden-Websites betreut, zahlt 5× Entry Plan = 495 USD/Monat – oder wechselt auf Business/Enterprise mit Multi-Space-Optionen.

Flexibilität:
Monatliche Verträge, jederzeit up- oder downgraden ohne Strafe.

Neue Features (2025):

  • AI SEO-Optimierung
  • Ideation Room (Brainstorming-Tool)
  • Concept Room (in Entwicklung)

Besonderheiten für kleine Teams oder Einzelunternehmer

Der Free Plan ist großzügig für persönliche Projekte. Aber sobald ein Kunde zahlt oder das Projekt professionell wird, landet man schnell beim Entry Plan (99 USD/Monat).

Für Agenturen herausfordernd:
Wenn man 10 Kundenprojekte betreut, wird Storyblok schnell teuer. Alternativen:

  • Kunden auf Self-Hosted-Lösungen (Strapi) setzen
  • Business/Enterprise-Plan mit Multi-Space-Management nutzen
  • Pro Kunde entscheiden, ob der visuelle Editor den Aufpreis rechtfertigt

Anforderungen

Technisches Wissen

  • Grundkenntnisse in API-Integration nötig, aber weniger komplex als bei Strapi oder Directus
  • Frontend muss selbst gebaut oder angebunden werden

🖥️ Hardware / Hosting-Voraussetzungen

Keine – alles läuft in der Storyblok-Cloud

Konzept & Architektur

Headless-only

Frontend-Logik wird vollständig extern umgesetzt

✨ Besonderheit

Visueller Editor mit Live-Vorschau, der Änderungen in Echtzeit im Ziel-Frontend anzeigen kann

Workflow-Tools

  • Rollen- & Rechteverwaltung
  • Komponentenstruktur
  • Drag-and-Drop-Content-Editing
  • Versionierung

Versionierung

Integriert mit Änderungsverfolgung und Rollback

Aktualität & Community

Release-Zyklen

  • Kontinuierliche SaaS-Updates
  • Neue Features werden ohne eigenes Deployment verfügbar

Entwickler-Community

  • Aktiv, besonders in Europa stark vertreten
  • Slack-Community, Events, Meetups

📖 Dokumentationsqualität

Gut strukturiert, viele Beispiele, API-Referenzen und Tutorials

Zielgruppe

Startups

Schneller Start mit visueller Bearbeitung und modernem Frontend

Agenturen

Ideal für Kundenprojekte, bei denen Redakteur*innen eigenständig arbeiten sollen

Konzerne

Multi-Site- und Multi-Language-Features sind Enterprise-tauglich

Content-Heavy-Projekte

Gut geeignet, wenn große Content-Mengen flexibel strukturiert und visuell gepflegt werden sollen

Gemischte Teams

Besonders wertvoll, wenn Entwickler und Redakteure eng zusammenarbeiten

Beispiele & Use Cases: Wenn Marketing eigenständig arbeiten will

🏆 Marken setzen auf Storyblok

Adidas nutzt Storyblok für regionale Marketing-Kampagnen, wo Content-Teams eigenständig Landing Pages erstellen müssen – ohne auf Entwickler zu warten.

Renault setzt Storyblok für Multi-Market-Websites ein, bei denen lokale Teams in verschiedenen Ländern Inhalte pflegen, aber das Design zentral vorgegeben ist.

Marc O’Polo verwendet Storyblok für E-Commerce-Content-Management, wo Produktpräsentationen und Storys visuell zusammengestellt werden.

Typische Projekt-Szenarien

Marketing-Kampagnen mit häufigen Änderungen
Ein E-Commerce-Unternehmen startet wöchentlich neue Kampagnen. Das Marketing-Team will Landing Pages selbst bauen, ohne jedes Mal Entwickler-Tickets zu erstellen. Mit Storybloks visuellem Editor können sie komponentenbasiert arbeiten: Hero-Bereich, Produktgrid, Testimonials, CTA – alles drag-and-drop, live-preview.

Multi-Brand Corporate Website
Ein Konzern mit 5 Marken will ein gemeinsames CMS, aber jede Marke soll eigene Inhalte pflegen. Storyblok erlaubt Multi-Space-Management: Jede Marke hat ihren eigenen Space, zentrale Komponenten werden geteilt, lokale Teams arbeiten eigenständig.

Internationale Website mit 20+ Sprachen
Ein SaaS-Produkt expandiert global. Jedes Land braucht lokalisierte Inhalte, aber die Struktur soll einheitlich bleiben. Storybloks Multi-Language-Features erlauben es, Content in verschiedenen Sprachen zu pflegen, Fallbacks zu definieren und Übersetzungs-Workflows zu managen.

Content-Hub für Magazin und App
Ein Publisher will Artikel sowohl auf der Website als auch in der mobilen App ausspielen. Mit Storyblok werden Artikel strukturiert erfasst (Autor, Kategorie, Bilder, Text-Blöcke), die Website (Next.js) rendert sie als Blog, die App (React Native) zeigt sie mobil-optimiert.

Konkretes Beispiel: Fashion-Brand mit saisonalen Kollektionen

Eine Modemarke launched 4 Kollektionen pro Jahr. Jede Kollektion braucht:

  • Eine dedizierte Landing Page
  • Produktgalerien
  • Lookbook-Bilder
  • Video-Integrationen
  • Multi-Language (DE, EN, FR, IT)

Herausforderung: Das Marketing-Team kann nicht auf Entwickler warten – die Kollektionen müssen pünktlich live gehen.

Lösung mit Storyblok:

  1. Entwickler erstellen Komponenten: Hero, ProductGrid, Lookbook, VideoEmbed
  2. Marketing-Team komponiert Landing Pages im visuellen Editor
  3. Live-Preview zeigt sofort, wie es aussieht
  4. Inhalte werden in 4 Sprachen gepflegt
  5. Scheduled Publishing: Seiten gehen automatisch zum Launch-Termin live

Resultat:

  • Marketing arbeitet eigenständig
  • Entwickler müssen nur einmal Komponenten bauen
  • Konsistentes Design über alle Kollektionen
  • Schnellere Time-to-Market

Kosten:

  • Storyblok Entry Plan: 99 USD/Monat
  • Initiale Komponenten-Entwicklung: 10.000-15.000 EUR
  • Danach: Marketing arbeitet selbstständig, keine Entwicklerkosten pro Kampagne

Passt Storyblok zu dir?

Stärken

  • Visueller Editor macht Headless für Redakteur*innen zugänglich
  • Multi-Language- und Multi-Site-Unterstützung integriert
  • Starke europäische Community
  • Flexible API-Anbindung an beliebige Frontends

Schwächen

  • Höhere Kosten im Vergleich zu manchen Open-Source-Alternativen
  • Proprietäre SaaS-Lösung – kein Self-Hosting möglich
  • API-Limits im Free-Plan können schnell erreicht werden

Empfehlung

Storyblok ist ideal, wenn man die Vorteile von Headless nutzen möchte, ohne auf den visuellen Komfort klassischer CMS zu verzichten. Besonders in Projekten, in denen Marketing- und Entwicklerteams eng zusammenarbeiten, spielt es seine Stärken aus.

Im nächsten Artikel der Serie sehen wir uns Sanity an – ein Headless CMS, das mit extrem flexiblem Content-Modeling punktet und sich stark an Entwickler richtet, die komplexe Datenstrukturen sauber abbilden wollen.


Weiterführende Informationen

Offizielle Ressourcen:

Visual Editor:

Framework-Integrationen:

Community:

Storyblok beweist: Headless CMS muss nicht kompliziert sein – auch Redakteure können visuell arbeiten!