Geschichtenbasierte Website-Konzepte

Storygeführtes Website-Konzept

Zweck

Verwandle ein ausreichend verstandenes Geschäftsproblem in unterschiedliche Website-Konzepte, die auf Bedeutung, Transformation, Erzählung und Belegen aufbauen – nicht auf einer reinen Abfolge generischer Funktionen und Interface-Abschnitte.

Diese Fähigkeit arbeitet hauptsächlich mit Wörtern vor Bildern.

Sie bestimmt:

• was die Website grundlegend kommunizieren soll
• welche Geschichte oder Erzähllinse dies vermitteln kann
• wie das Verständnis des Besuchers fortschreiten sollte
• welche Belege diesen Fortschritt stützen
• wie das Konzept Inhalte, Stimme, Bildsprache, Layout, Bewegung und Interaktion auf einer Richtungsebene beeinflussen sollte
• wie die Erzählung die nächste Aktion des Benutzers unterstützt

Das Ergebnis ist eine Reihe von Konzeptrichtungen, die zur Bewertung und späteren visuellen Systementwicklung bereit sind.

Diese Fähigkeit produziert keine endgültigen Texte, keine endgültigen Layouts, keine detaillierten Wireframes, kein Designsystem und keinen Implementierungscode.

---

Kernprinzip

Ein starkes Website-Konzept verbindet:

Geschäftsproblem
→ Zielgruppenbedarf
→ sinnvolle Transformation
→ zentrale Idee
→ narrative Progression
→ unterstützende Beweise
→ Benutzeraktion

Visuelle Entscheidungen sollten später diese Kette verstärken.

Vermeiden Sie:

interessante Ästhetik
→ clevere Überschrift
→ willkürliche Abschnitte
→ dekorative Interaktionen

Das Konzept sollte erklären, warum die Erfahrung existiert, bevor es erklärt, wie sie aussieht.

---

Story ist keine Dekoration

„Storygeführt“ bedeutet nicht, dass jede Website Folgendes braucht:

• einen dramatischen Protagonisten
• eine filmische Scroll-Sequenz
• eine Gründergeschichte
• ein emotionales Testimonial
• einen Anfang-Mitte-Ende-Drehbuch
• eine fiktive Erzählung

Story kann einfach bedeuten, dass Informationen bewusst strukturiert sind, sodass der Besucher von einem bedeutungsvollen Zustand des Verständnisses zu einem anderen gelangt.

Beispiele für gültige narrative Strukturen sind:

Problem
→ Konsequenz
→ Lösung
→ Beweis
→ Aktion

Rohmaterial
→ Prozess
→ fertiges Ergebnis
→ Fähigkeit

alte Methode
→ Spannung
→ neue Methode
→ Beweis

Kundensituation
→ Herausforderung
→ Erfahrung
→ Ergebnis

Mission
→ Hindernis
→ Methode
→ Wirkung

Frage
→ Untersuchung
→ Enthüllung
→ Implikation

Die angemessene narrative Intensität hängt vom Projekt ab.

---

Wann diese Fähigkeit verwendet werden soll

Verwenden Sie diese Fähigkeit, wenn:

• Ein Website-Brief bereits ausreichend verstanden wurde.
• Der Benutzer nach einem Website-Konzept, einer kreativen Richtungsidee, einer zentralen Idee, einer narrativen Richtung, einer Storytelling-Struktur oder einer storygeführten Landingpage fragt.
• Eine Seite sich derzeit wie eine digitale Broschüre oder eine Abfolge von zusammenhanglosen Feature-Abschnitten anfühlt.
• Eine Startseite zwar Informationen enthält, aber eine klare Progression oder einen Standpunkt vermissen lässt.
• Mehrere Botschaften um Priorität konkurrieren und um eine zentrale Bedeutung herum organisiert werden müssen.
• Eine Marke über starkes Gründer-, Kunden-, Prozess-, Produkt-, Missions- oder Transformationsmaterial verfügt, das die Erfahrung strukturieren könnte.
• Grafische Universumsforschung existiert und mit einer tatsächlichen Website-Idee verbunden werden muss.
• Der Benutzer mehrere wirklich unterschiedliche kreative Konzepte wünscht, bevor er eine visuelle Richtung wählt.
• Ein Produkt seinen Wert durch Nutzung, Transformation oder Beweise demonstrieren muss, anstatt einfach nur Fähigkeiten aufzulisten.
• Designteams immer wieder zur visuellen Ausführung greifen, bevor sie sich darauf geeinigt haben, was die Website eigentlich sagen soll.
• Ein Konzept Überschriften, Bildsprache, Inhaltsstruktur, Handlungsaufforderungen und eventuelle Interaktion in eine kohärente Richtung verbinden muss.

Verwenden Sie diese Fähigkeit nicht, wenn:

• Das Geschäftsproblem oder die Zielgruppe noch unklar ist.
• Der Benutzer nur visuelle Inspiration oder grafische Recherche benötigt.
• Der Benutzer bereits ausgereifte Konzepte hat und nur zwischen ihnen wählen muss.
• Die Aufgabe das endgültige Verfassen von Texten ist.
• Die Aufgabe die detaillierte Informationsarchitektur für eine komplexe Anwendung ist.
• Die Aufgabe die Gestaltung von UI-Komponenten ist.
• Die Aufgabe die endgültige Layout-Komposition ist.
• Die Aufgabe die Spezifikation eines Designsystems ist.
• Die Aufgabe Implementierung oder Code ist.
• Das Interface in erster Linie ein Dienstprogramm oder operationelles Werkzeug ist, bei dem narrative Rahmung unnötige Reibung erzeugen würde.

Wenn das Projekt nicht ausreichend verstanden ist, führen Sie zuerst einen Problemframing-Workflow durch.

---

Zu prüfende Eingaben

Prüfen Sie so viele der folgenden, wie verfügbar sind.

Strategisches Material

• Geschäftsproblem
• Projektbrief
• Geschäftsziele
• Zielgruppe
• Jobs to be done
• Benutzerbedürfnisse
• gewünschte Aktionen
• Positionierung
• Wertversprechen
• Unterscheidungsmerkmale
• Wettbewerbsumfeld
• Einschränkungen

Transformationsbelege

• Kundenergebnisse
• Vorher-Nachher-Zustände
• gelöste Probleme
• eingesparte Zeit
• reduziertes Risiko
• erworbene Fähigkeiten
• verbesserte Erfahrung
• emotionale Ergebnisse
• betriebliche Verbesserungen
• soziale oder kulturelle Auswirkungen

Story-Material

• Gründergeschichte
• Unternehmensursprung
• Kundengeschichten
• Testimonials
• Fallstudien
• Beispiele für Produktnutzung
• Hinter-den-Kulissen-Material
• Fertigungs- oder Dienstleistungsprozess
• historische Meilensteine
• Mission
• Forschung
• Daten
• Ergebnisse
• Produktentstehung

Markenmaterial

• Markenstrategie
• Tonfall
• bestehende Botschaften
• Kampagnensprache
• Namensgebung
• Terminologie
• bestehende visuelle Identität
• Fotografie
• Archivmaterial

Inhaltsmaterial

• bestehende Seitentexte
• Sitemap
• Abschnittsinventar
• Produktbeschreibungen
• Dienstleistungen
• FAQs
• Bewertungen
• Statistiken
• Handlungsaufforderungen

Upstream-Designforschung

Wenn verfügbar, prüfen Sie die Ausgabe von:

• design-problem-framer
• graphic-universe-builder

Nützliche grafische Universums-Eingaben umfassen:

• Projektvokabular
• Forschungschuster
• projekteigene Chancen
• visuelle Atome
• Metapher-Kandidaten
• Kandidaten für grafische Universen
• Kategorie-Klischees

Verlangen Sie keine grafische Universumsforschung, wenn das Projekt bereits starkes konzeptionelles Material enthält.

---

Vorbedingungen

Stellen Sie vor der Konzepterstellung fest, ob diese Fragen beantwortet werden können:

Was bietet die Organisation an?

Wer ist die primäre Zielgruppe?

Was braucht, will, fürchtet oder kämpft diese Zielgruppe?

Welche sinnvolle Veränderung schafft das Angebot?

Warum sollte diese Organisation geglaubt werden?

Was soll der Besucher verstehen?

Was soll der Besucher fühlen, wenn Emotion relevant ist?

Was soll der Besucher tun?

Was macht dieses Projekt anders als offensichtliche Alternativen?

Wenn mehrere Antworten unbekannt sind, markieren Sie sie als offene Fragen.

Erfinden Sie keine strategischen Fakten, um ein Konzept vollständig wirken zu lassen.

---

Arbeitsablauf

1. Formulieren Sie das Designproblem neu

Fassen Sie den Brief in eine konzeptbereite Aussage zusammen.

Verwenden Sie:

Die Website muss <Zielgruppe> dabei helfen,
<Bedeutung> zu verstehen/zu glauben/zu erleben,
damit sie <gewünschte Aktion oder Ergebnis> ausführen kann,
wobei <Haupthindernis> überwunden werden muss.

Beispielstruktur:

Die Website muss technischen Käufern helfen zu verstehen, dass das Unternehmen
mehr tut, als Komponenten herzustellen: Es kontrolliert den gesamten Prozess
vom Rohmaterial bis zum fertigen Präzisionsteil, sodass Käufer dem Unternehmen
Hochrisiko-Fertigungsaufträge anvertrauen.

Beginnen Sie nicht mit der Konzeption, bis das Problem klar ausgedrückt werden kann.

---

2. Definieren Sie die wesentliche Bedeutung

Fragen Sie:

Wenn der Besucher sich an nur eine Idee aus dieser Erfahrung erinnert, welche sollte das sein?

Schreiben Sie einen Satz.

Dies ist nicht:

• ein Slogan
• eine Überschrift
• eine Liste von Funktionen
• ein visueller Stil

Es ist die Bedeutung, die das Konzept vermitteln muss.

Beispiel:

Dieses Unternehmen verwandelt einen unvorhersehbaren industriellen Prozess in etwas
Präzises, Sichtbares und Verlässliches.

Testen Sie die Aussage:

• Ist sie für die Zielgruppe bedeutungsvoll?
• Ist sie für das Unternehmen relevant?
• Ist sie spezifischer als „wir sind innovativ“?
• Kann verfügbare Evidenz sie stützen?
• Könnte sie Inhaltsentscheidungen leiten?

---

3. Definieren Sie die Zielgruppentransformation

Beschreiben Sie die gewünschte Veränderung.

Verwenden Sie:

Vorher:
Der Besucher denkt/fühlt/glaubt...

Nachher:
Der Besucher denkt/fühlt/glaubt...

Aktion:
Der Besucher ist nun bereit, ... zu tun

Mögliche Transformationen umfassen:

unsicher → zuversichtlich
unwissend → informiert
skeptisch → überzeugt
überfordert → klar
neugierig → investiert
unbeteiligt → emotional verbunden
problembewusst → lösungsbewusst
funktionsorientiert → ergebnisorientiert
allemeine Wahrnehmung → unverwechselbare Wahrnehmung

Erzeugen Sie keine emotionale Transformation, wenn eine praktische Änderung des Verständnisses ausreicht.

---

4. Erstellen Sie das Beweis-Inventar

Trennen Sie verfügbares Story-Material von Annahmen.

Verwenden Sie:

Beweis	Typ	Was es beweist	Stärke
...	Kunde / Gründer / Prozess / Daten / Produkt / Geschichte	...	hoch / mittel / schwach

Klassifizieren Sie Material als:

Verifiziert

Direkt durch bereitgestelltes Material gestützt.

Abgeleitet

Eine plausible Interpretation, die noch validiert werden muss.

Fehlend

Nützliche Evidenz, die derzeit nicht existiert.

Ein Konzept sollte nicht von erfundenen Testimonials, fabrizierten Geschichten, hypothetischen Kundenergebnissen, die als Tatsachen präsentiert werden, oder nicht existierendem Produktionsmaterial abhängen.

---

5. Identifizieren Sie mögliche narrative Linsen

Bewerten Sie, welche Linse die Bedeutung des Projekts am natürlichsten freilegt.

Mögliche Linsen umfassen:

Transformation

Zeigen Sie die sinnvolle Veränderung, die für den Kunden geschaffen wurde.

vorher
→ Intervention
→ nachher

Am besten, wenn das Ergebnis der stärkste Differenzierer ist.

Produkt in Verwendung

Zeigen Sie das Angebot durch reale Situationen anstatt isolierte Funktionen.

Kontext
→ Nutzung
→ Ergebnis

Am besten, wenn das Sehen des Produkts in Aktion Vertrauen schafft.

Prozess

Legen Sie offen, wie etwas erstellt, geliefert, transformiert oder gelöst wird.

Input
→ Phasen
→ Output

Am besten, wenn Prozess, Handwerk, Transparenz oder Fachwissen die Organisation differenzieren.

Gründer oder Ursprung

Nutzen Sie, warum die Organisation existiert, als organisierende Erzählung.

Frustration
→ Entscheidung
→ neuer Ansatz
→ aktuelle Mission

Am besten, wenn der Ursprung das Produkt oder die Marke sinnvoll erklärt.

Verwenden Sie die Gründererzählung nicht einfach, weil Gründermaterial existiert.

Kundengeschichte

Lassen Sie die reale Situation eines Kunden die Relevanz demonstrieren.

Situation
→ Problem
→ Erfahrung
→ Ergebnis

Am besten, wenn sozialer Beweis und gelebte Erfahrung stärker sind als Produktbehauptungen.

Mission und Wirkung

Strukturieren Sie die Erfahrung um die Veränderung, die die Organisation bewirken möchte.

derzeitiger Zustand
→ Herausforderung
→ Intervention
→ Wirkungsnachweis

Nützlich für Wohltätigkeitsorganisationen, Kultureinrichtungen, missionsgetriebene Organisationen und öffentliche Interessenarbeit.

Kontrast

Definieren Sie das Angebot durch Aufzeigen der Schwäche der konventionellen Alternative.

alte Annahme
→ Widerspruch
→ besseres Modell

Nützlich, wenn die Kategorie einen verfestigten Standard hat.

Reise

Führen Sie den Besucher durch eine sinnvolle Sequenz.

Stufe 1
→ Stufe 2
→ Stufe 3
→ Ziel

Nützlich, wenn Progression an sich wichtig ist.

System

Enthüllen Sie, wie scheinbar getrennte Teile zusammenarbeiten.

Teile
→ Beziehungen
→ System
→ Ergebnis

Nützlich für Plattformen, Infrastruktur, komplexe Dienstleistungen und Ökosysteme.

Untersuchung

Beginnen Sie mit einer Frage und enthüllen Sie die Antwort schrittweise.

Frage
→ Beweis
→ Entdeckung
→ Schlussfolgerung

Nützlich für redaktionelle, forschungsbezogene, kulturelle oder erklärende Erfahrungen.

Demonstration

Strukturieren Sie die Website um den Beweis einer Behauptung.

Behauptung
→ Demonstration
→ Beweis
→ Einladung

Nützlich, wenn Vertrauen schnell verdient werden muss.

Mehrere Linsen können nebeneinander existieren, aber jedes Konzept sollte einen dominanten narrativen Mechanismus haben.

---

6. Wählen Sie die angemessene Story-Intensität

Nicht jedes Projekt sollte zu einer immersiven narrativen Erfahrung werden.

Klassifizieren Sie Kandidatenkonzepte als:

Leichte Erzählung

Erzählung beeinflusst hauptsächlich:

• Nachrichtenreihenfolge
• Abschnittsfortschritt
• Überschriften
• Platzierung von Beweisen

Das Interface bleibt konventionell und effizient.

Gut für:

• SaaS
• professionelle Dienstleistungen
• B2B
• Produktseiten
• konversionsfokussierte Websites

Integrierte Erzählung

Erzählung beeinflusst:

• Seitenfortschritt
• Inhaltsrhythmus
• Bildsprache
• wiederholte Sprache
• ausgewählte Interaktionen
• Abschnittsübergänge

Gut für:

• Markenwebsites
• Portfolios
• Produkteinführungen
• differenzierte Dienstleistungsunternehmen
• redaktioneller Handel

Immersive Erzählung

Die Erfahrung selbst verhält sich wie eine Geschichte.

Erzählung kann beeinflussen:

• Scrollfortschritt
• Mediensequenzierung
• Szenenwechsel
• Interaktion
• Kapitelstruktur
• reichhaltige Bewegung

Gut für:

• Kampagnen
• kulturelle Erlebnisse
• Produkteinführungen
• Storytelling-Projekte
• erlebnisorientierte Markenwebsites

Immersion sollte nur vorgeschlagen werden, wenn:

• der Inhalt sie unterstützt
• der Wert sie rechtfertigt
• das Produktionsbudget sie plausibel unterstützen kann
• die Erzählung verständlich bleibt, ohne fragile Interaktion zu erfordern

---

7. Generieren Sie verbale Territorien vor visuellen Territorien

Beginnen Sie die Konzepterkundung mit Sprache.

Generieren Sie Wörter und Phrasen, die verbunden sind mit:

• Transformation
• Kundensprache
• Projektvokabular
• Prozess
• Objekte
• Domain-Terminologie
• Kontraste
• Ergebnisse
• kulturelle Assoziationen
• grafische Universums-Erkenntnisse

Mögliche Ideenfindungsmethoden umfassen:

Phrasenkombinationen

Kombinieren Sie Projektsprache auf unerwartete, aber vertretbare Weise.

Redewendungen

Erkunden Sie relevante Redewendungen als Impulse.

Zwingen Sie Redewendungen nicht in endgültige Konzepte.

Lehnen Sie solche ab, die sind:

• klischeehaft
• verwirrend
• kulturell unangemessen
• zu clever
• ohne Bezug zum tatsächlichen Geschäft

Domain-Sprache

Interpretieren Sie Terminologie, die bereits von der Zielgruppe verwendet wird, neu.

Doppeldeutigkeiten

Erkunden Sie Wörter mit sowohl funktionalen als auch emotionalen Bedeutungen.

Kontrastaussagen

Beispiele:

Nicht X. Y.
Von X zu Y.
Jenseits von X.
Was wäre, wenn X Y wäre?

Transformationssprache

Verwenden Sie Verben, die Bewegung oder Veränderung beschreiben.

Fragen

Verwenden Sie eine sinnvolle unbeantwortete Frage, um Spannung zu erzeugen.

Projekteigene Phrasen

Bevorzugen Sie Terminologie oder Sprache, die Wettbewerber nicht leicht beanspruchen können.

Schreiben Sie in dieser Phase keine endgültigen Website-Texte.

Der Zweck ist die Konzepterstellung.

---

8. Divergieren vor dem Konvergieren

Generieren Sie mehrere unterschiedliche Konzepte, bevor Sie sich auf eines festlegen.

Jedes Konzept sollte anders sein in:

• Erzähllinse
• zentraler Idee
• Anspruch
• Intensität

Zu diesem Zeitpunkt noch nicht bewerten.

---

9. Entwickeln Sie jedes Konzept als Richtung

Für jedes Konzept spezifizieren Sie:

Erzähllinse

Welche Linse wird verwendet und warum.

Zentrale Idee

Ein Satz, der die Kernbedeutung zusammenfasst.

Struktur

Wie die Seite den Besucher führen würde.

Abschnitt 1: Idee
Abschnitt 2: Idee
Abschnitt 3: Idee
...

Nachrichtenprogression

Wie Verständnis Abschnitt für Abschnitt aufgebaut wird.

Evidenzplatzierung

Wo Beweise eingeführt werden, um jede Behauptung zu stützen.

Tonfall

Wie Sprache die zentrale Idee verstärkt.

Implikationen für visuelle Richtung

Wie die Erzählung die Bildsprache beeinflussen könnte.

Implikationen für Layout

Wie die Erzählung die Struktur der Seite beeinflussen könnte.

Implikationen für Bewegung und Interaktion

Wie Bewegung oder Interaktion die Erzählung unterstützen könnte.

Nächste Aktion

Wozu die Erzählung den Benutzer führt.

---

10. Wählen Sie und fahren Sie fort

Der Benutzer bewertet die Konzepte anhand von:

• Relevanz für das Geschäftsproblem
• Kohärenz der Bedeutung
• Glaubwürdigkeit durch Beweise
• Unterscheidung vom offensichtlichen
• Angemessenheit der Intensität
• Klarheit der Benutzeraktion

Nach der Auswahl:

• Verfeinern Sie das ausgewählte Konzept als Richtung für das visuelle System.
• Fahren Sie mit visuellen Systementwicklungsfähigkeiten fort.