Das bekommst du
- Eine HTML-Datei mit eingebetteten Schriften und Bildern, ohne Netzwerkanfragen
- Geteilter Hero, dessen Play-Button eine funktionierende Prüf- und Freigabe-Demo öffnet
- Workflow-Tabs, Versions-Schieberegler, Fähigkeiten-Bento, Freigabe-Handy, Audit-Log und Preise mit Plätzen
- Kundengeschichte, Tarifvergleich, Changelog, Anmeldung, Testphase, Demo-Buchung, rechtliche Seiten und 404
- Optionale Bilder, Porträts, ein bewegter Filmclip und eine Social Card von PopNow nach einem Credit-Angebot
Gut für
- Prüf-, Freigabe- und Kollaborationstools
- Software für Kreativ-, Produktions- und Agenturarbeit
- B2B-Produkte, die mit einem sorgfältigen Prozess verkaufen
Nicht für
- Bunte Consumer-Apps mit großen Illustrationen
- Reine Dark-Entwicklertools
- Einseitige Wartelisten
So nutzt du ihn
In Claude oder ChatGPT
Nutze den PopNow-Skill „Redaktionelle SaaS-Website“ (editorial-saas-website) dafür: Baue die Website für Redline Room, ein Vertragsprüf-Tool für kleine Kanzleien: Entwurf, Redline, Signatur, Ablage. Tarife: Solo 19 $, Kanzlei 49 $ pro Platz, Enterprise.
In einem Coding-Agent
/popnow-editorial-saas-website Baue die Website für Redline Room, ein Vertragsprüf-Tool für kleine Kanzleien: Entwurf, Redline, Signatur, Ablage. Tarife: Solo 19 $, Kanzlei 49 $ pro Platz, Enterprise.
Dann probier
Nenn mir vorher den Preis für ein dokumentarisches Hero-Bild einer kleinen Kanzlei und drei passende Porträts.
Lass die Kundengeschichte vorerst weg und behalte die Tarifvergleich-Route.
Das solltest du bereithalten
- Produktname, Zielgruppe, einzeiliges Versprechen und die wichtigste Handlungsaufforderung
- Deine echten Workflow-Stufen, Fähigkeiten, Tarife und Preise
- Kunden, Zitate und Zahlen, die du verwenden kannst, oder die Freigabe, sie zu entwerfen
- Optional: ein PopNow-API-Schlüssel, eigene Arbeitsergebnisse und Teamfotos
Ähnliche Skills
Alle ansehen →3D-Avatar-Maker
+3Baue im Browser eine niedliche 3D-Figur im Plüschtier-Look und speichere sie als transparentes PNG oder 3D-Seite.
Kalender-Heatmap
+3Ein Jahr täglicher Aktivität als schattiertes Kalenderraster, mit Serien, Summen und Tastaturbedienung.
KI-SaaS-Landingpage
+3Warmes Sandpapier und feine Linien um ein lebendiges Kanban-Board, auf dem ein Assistent Aufgaben plant.
Animierte Hero-Section
+3Ein Landingpage-Hero mit sanft wechselndem Schlagwort, zwei Buttons und einem breiten Bildrahmen.
Shader-Hero-Website für Agenturen
+3Orange-Shader hinter großer Aussage, Pillen-Navigation und versetztem Raster mit Fallstudien.
Dunkle SaaS-Landingpage
+3Eine dunkle, bewegungsreiche Marketingseite für ein Softwareprodukt, geliefert als eine eigenständige HTML-Datei.
Designer-Portfolio-Website
+3Sechs geneigte Karten um eine verblassende Überschrift auf ruhigem Grau, eine rote Porträtkarte, Fallstudien.
Entwickler-Portfolio-Website
+3Eine dunkle persönliche Website für Entwickler mit Fallstudien, Artikeln, Vorträgen, Lebenslauf und Kontaktformular.
Glassmorphism-Website-Vorlage
+3Mattglas-Pillen auf Fastschwarz, große Serifen-Überschrift mit einem kursiven Wort und E-Mail-Anmeldung.
Website für Hardware-Produkte
+3Riesige haarlinige Modellnamen auf Silber-Studioaufnahmen, Datenkarten und eine maßstabsgetreue Reihe.
Interaktives Architekturdiagramm
+3Ein offline nutzbares, klickbares Systemdiagramm aus einem geprüften JSON-Modell, mit den Belegen zu jedem Kasten.
Interaktiver Raster-Hero
+3Dunkles Raster feiner Fäden, das sich zum Cursor neigt und bei jedem Klick einen Ring ausrollt.
Knowledge-Graph-Explorer
+3Mach aus Projektnotizen einen durchsuchbaren Offline-Graphen, in dem jede Aussage auf ihre Quellzeile verweist.
KPI-Dashboard-Vorlage
+3Vier KPI-Kacheln mit Veränderungs-Chips über einem leuchtenden Liniendiagramm, Aufschlüsselung und Zielbalken.
Landingpage aus KI-Mockups
+3Drei Entwürfe ganzer Seiten ansehen, einen wählen, dann baut dein Agent ihn als sauberen Code.
Magazin-Website-Vorlage
+3Eine Magazin-Website in Printqualität mit Artikeln, Themen, kleinem Shop und Abos, als eine HTML-Datei.
Partikel-Animations-Hero
+3Text auf warmem Papier neben einer drehenden Kugel aus Tinten- und Türkispunkten, die sich je Idee formt.
Persönliche Marken-Website
+3Ein Porträt, das in warmes Papier übergeht, darüber eine feine Klammer, daneben kurze und fette Aussagen.
Kinoreife Produkt-Launch-Seite
+3Fastschwarze Filmseite: Serifen-Titelkarte über gleitendem Licht, Letterbox-Nachtszene, Reservierungsformular.
Admin-Dashboard-Vorlage
+3Eine funktionierende Backoffice-Konsole mit Diagrammen, Tabellen, Kanban und Kalender, als eine Offline-HTML-Datei.
SaaS-Landingpage-Vorlage
+3Eine ruhige, helle Marketingseite für ein Softwareprodukt mit funktionierender Produktkonsole, Preisen und Registrierung.
Portfolio-Website im Scrapbook-Stil
+3Ein mehrseitiger Online-Lebenslauf aus Papierobjekten, mit Fallstudien und druckbarem Lebenslauf.
Sneaker-Shop-Website-Vorlage
+3Ein kompletter Schuh- oder Modeshop mit Katalog, Produktseiten, Warenkorb und Demo-Checkout in einer HTML-Datei.
Landingpage für Workflow-Automatisierung
+3Graphit-Seite mit kleiner Überschrift und einem lebenden Knotengraphen, der läuft und Logs streamt.
Fragen
Was passiert, wenn jemand im Hero den Play-Button drückt?
Ein Dialog öffnet sich mit dem Prüfraum des Produkts, in HTML und CSS gebaut, und durchläuft einen Zyklus: ein Kommentar, eine Markierung, der Status springt auf freigegeben und eine Meldung. Er endet auf einem Wiederholen-Button, und bei reduzierter Bewegung wird der Endzustand gezeigt.
Mein Produkt ist nicht für Kreativteams. Passt es trotzdem?
Ja, wenn es Arbeit durch Stufen bewegt. Der Anpassungsleitfaden bildet die Workflow-Tabs, Rahmen, das Freigabe-Handy und die Auslieferungsmatrix auf Rechtsdokumente, Architekturzeichnungen, Verpackungsproofs und Video-Schnitte ab.
Was fügt PopNow hinzu?
Fotografie, die die Seite nicht zeichnen kann: Arbeitsergebnisse im Produkt, ein dokumentarisches Hero-Bild, passende Porträts, optional einen bewegten Filmclip im Prüffenster und eine Social Card. Jeder Lauf wird vorher in Credits angeboten.
Kann es in meine bestehende Next.js- oder Astro-Seite?
Ja. Der Skill liest dein Projekt und baut die Abschnitte als Komponenten und die Unterseiten als echte Routen, mit den Schriften als Paketen statt der einzelnen Datei.

