Das bekommst du
- Eine HTML-Datei mit eingebetteten Schriften und Bildern, ohne Netzwerkanfragen
- Startseite mit Produktkonsole, Feature-Raster, Tour-Tabs, Setup-Code, Testimonials und Preisen
- Zusätzliche Seiten für Kontoerstellung, Login, Vertriebsanfrage, Release Notes, Verfügbarkeitsstatus, AGB und eine Nicht-gefunden-Seite
- Helles und dunkles Theme plus ein Validator für Links, Formulare und Beispielreste
- Optionale Fotos, mit PopNow nach einem Credit-Angebot erzeugt
Gut für
- Startseiten von Start-ups und SaaS-Marketingseiten
- Preisseiten mit Tarifvergleich
- Launches von Entwicklertools oder API-Produkten
Nicht für
- Onlineshops und Portfolios
- Marken, die in jedem Abschnitt kräftige Farbe wollen
- Lange Editorial- oder Blog-Seiten
So nutzt du ihn
In Claude oder ChatGPT
Nutze den PopNow-Skill „SaaS-Landingpage-Vorlage“ (saas-landing-page) dafür: Erstelle die Startseite für Ledgerline, ein Tool zum Rechnungsabgleich für kleine Finanzteams. Tarife: Starter kostenlos, Team $29/Monat, Scale $99/Monat.
In einem Coding-Agent
/popnow-saas-landing-page Erstelle die Startseite für Ledgerline, ein Tool zum Rechnungsabgleich für kleine Finanzteams. Tarife: Starter kostenlos, Team $29/Monat, Scale $99/Monat.
Dann probier
Nenn mir den Preis für ein Porträt zur Kundengeschichte und ein 3x3-Testimonial-Raster, bevor du etwas erzeugst.
Streich die Statusseite und mach aus dem Changelog eine öffentliche Roadmap.
Das solltest du bereithalten
- Produktname, Zielgruppe und das eine Ergebnis, das es verspricht
- 4–6 Funktionen und 2–4 Tarife mit echten Limits
- FAQ-Antworten, ehrliche Zahlen und Zitate, die du verwenden darfst
- Optional: einen PopNow-API-Schlüssel oder eigene Fotos
Ä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.
Redaktionelle SaaS-Website
+3Marineblauer geteilter Hero, Serifen-Überschrift neben einem Dokumentarbild, schräge Bänder, ein Kobaltakzent.
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.
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
Warum ist das Produkt eine gezeichnete Konsole statt eines Screenshots?
Eine Konsole aus HTML und SVG bleibt scharf, passt zu beiden Themes, reagiert auf Hover und Zeitraumwechsel und lässt sich ohne neue Screenshots auf die Objekte und Zahlen deines Produkts umstellen.
Was erzeugt PopNow hier?
Nur Fotos: ein Porträt für die Kundengeschichte, ein Editorial-Bild, Testimonial-Avatare aus einem einzigen Rasterbild und optional ein Teamfoto oder eine Social-Preview-Karte. Jeder Lauf wird in Credits beziffert und startet erst nach deiner Zustimmung.
Kann ich es ohne PopNow-API-Schlüssel nutzen?
Ja. Testimonials weichen auf Initialen-Chips aus, das Editorial-Foto kann zur Produktkarte werden, und die mitgelieferten neutralen Porträts können unter neuen Namen einspringen.
Funktioniert es in meinem Next.js- oder Astro-Projekt?
Ja. Der Skill sieht sich das Projekt an und baut dieselben Abschnitte als Komponenten und echte Routen mit deinem Styling-Setup, statt die einzelne Datei zu erzeugen.