Communitygithub.com

draft-landing — Informationsarchitektur für Landing Pages

Erstellt die Struktur und den Seitenaufbau einer Landingpage mit Fokus auf Conversion, basierend auf dem Produkttyp und der Zielgruppe.

Was ist draft-landing — Informationsarchitektur für Landing Pages?

Dieses Skill unterstützt dich bei der Erstellung einer informationsarchitektonischen Gliederung für Landing Pages, die auf Conversion optimiert ist. Es eignet sich besonders, wenn ein Produkttyp bekannt ist oder ermittelt werden kann, und der Nutzer eine klare Abschnittsreihenfolge sowie Platzierungen für Call-to-Action-Elemente benötigt. Der Workflow umfasst die Identifikation des Produkttyps, die Suche nach Landing-Page-Mustern und produktspezifischen Informationen über die `draft_agent.uiux`-Suchbefehle. Anschließend validiert das Skill jeden Abschnitt mit dem „Na und?“-Test, um sicherzustellen, dass jeder Bereich seinen Platz verdient. Das Ergebnis wird als skelettartige Tabelle im CLI (maximal 40 Zeilen) ausgegeben, mit Hinweisen zur Conversion-Strategie und CTA-Textgestaltung. Überschreitet die Ausgabe das Budget, wird ein `/atlas-report` erstellt. Das Skill vermeidet bekanntermaßen Anti-Patterns wie das Platzieren des primären CTAs unter dem Fold oder das Hinzufügen von Abschnitten ohne klaren Conversion-Zweck.

Funktioniert mit✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/tonone-ai/tonone/tree/HEAD/skills/draft-landing

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Was macht draft-landing — Informationsarchitektur für Landing Pages?

Befolge das Ausgabeformat, das in docs/output-kit.md definiert ist: max. 40 Zeilen CLI, Box-Drawing-Skeleton, einheitliche Schweregrad-Indikatoren, komprimierte Prosa.

Wann verwenden

Der Nutzer benötigt eine Landing-Page-Struktur, Abschnittsreihenfolge oder ein conversion-optimiertes Layout. Der Produkttyp ist bekannt oder ermittelbar.

Arbeitsablauf

  1. Produkttyp ermitteln aus der Nutzeranfrage oder dem Projektkontext
  2. Landing-Page-Muster durchsuchen:
    python3 -m draft_agent.uiux search --domain landing --query "{product_type}" --limit 3
    
  3. Produktbegründung für Zielgruppe und Conversion-Kontext durchsuchen:
    python3 -m draft_agent.uiux search --domain product --query "{product_type}" --limit 3
    
  4. Jeden Abschnitt validieren mit dem „Na und?“-Test – jeder Abschnitt muss seinen Platz verdienen
  5. Ausgabe der Abschnittsreihenfolge mit Markierungen für CTA-Positionen

Ausgabeformat

┌─ Landing Page IA — {product_type} ──────────────────────────────────┐
│ #  │ Abschnitt         │ Zweck                      │ CTA?          │
├────┼───────────────────┼────────────────────────────┼───────────────┤
│  1 │ {section_name}    │ {purpose}                  │ Primärer CTA  │
│  2 │ {section_name}    │ {purpose}                  │ —             │
│  3 │ {section_name}    │ {purpose}                  │ Sekundärer CTA│
│  … │ …                 │ …                          │ …             │
└────┴───────────────────┴────────────────────────────┴───────────────┘

Conversion-Strategie: {strategy}
CTA-Text-Hinweise:     {cta_guidance}

Anti-Patterns

  • Überspringe niemals den „Na und?“-Test pro Abschnitt – wenn ein Abschnitt ihn nicht beantworten kann, streiche ihn
  • Füge niemals Abschnitte ohne klaren Conversion-Zweck hinzu
  • Platziere den primären CTA niemals unter dem Fold auf dem ersten Bildschirm
  • Strukturiere die Seite niemals, ohne die primäre Zielgruppe und ihre Aufgabe (Job-to-be-done) zu kennen

Lieferung

Wenn die Ausgabe das CLI-Budget von 40 Zeilen überschreitet, rufe /atlas-report mit den vollständigen Ergebnissen auf. Der HTML-Bericht ist die Ausgabe. Die CLI ist die Quittung – Box-Header, einzeiliges Fazit, die Top-3-Ergebnisse und der Pfad zum Bericht. Gib niemals eine Analyse an die CLI aus.

Individual skills in this repo

This repo contains 2 individual skills — each has its own dedicated page.

Verwandte Skills