Das bekommst du
- Ein 28-seitiges Portfolio als eine Offline-HTML-Datei oder portiert in dein Framework
- Hero mit schwebenden Karten, Projekt-Bento, Fallstudien mit Identitätstafeln
- Werkfilter, Referenz-Karussell, Prozess-Tabs, Buchungs- und Kontaktformulare
- Eine Prüfung für Offline-Sicherheit, Struktur und übrig gebliebene Beispielnamen
- Optional PopNow-Projektszenen und ein neu geschnittenes Porträt, vorher bepreist
Gut für
- Marken-, Grafik- und Produktdesigner
- Fotografinnen, Illustratoren und kleine Studios
- Freelancer, die über Fallstudien und Gespräche Aufträge gewinnen
Nicht für
- Entwicklerportfolios, die zuerst Code zeigen
- Einseitige Lebensläufe
- Galerien mit Hunderten Bildern
So nutzt du ihn
In Claude oder ChatGPT
Nutze den PopNow-Skill „Designer-Portfolio-Website“ (designer-portfolio-website) dafür: Baue mein Portfolio: Ich bin Ada Lind, Verpackungsdesignerin in Lissabon, fünf Projekte in ./work mit Notizen in projects.md.
In einem Coding-Agent
/popnow-designer-portfolio-website Baue mein Portfolio: Ich bin Ada Lind, Verpackungsdesignerin in Lissabon, fünf Projekte in ./work mit Notizen in projects.md.
Dann probier
Zwei Projekte haben nur Handyfotos. Stell sie im Licht der Seite neu in Szene und nenn mir vorher den Preis.
Portiere es in unsere Astro-Seite mit einer Route pro Projekt.
Das solltest du bereithalten
- Name, Kurzbiografie, Stadt, Kontaktdaten und Verfügbarkeit
- Drei oder mehr Projekte mit Fotos, Briefings und echten Kundenzitaten, falls vorhanden
- Leistungen und Preise sowie ein Porträt oder eine Freigabe für einen beschrifteten Platzhalter
Ä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.
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.
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
Ist es nur für Grafikdesigner?
Nein. Die Bereiche passen auch zu Fotografinnen, Produkt- und UX-Designern, Illustratorinnen, Architekten und kleinen Studios: Projekte werden zu Aufträgen oder Fallstudien, Leistungen zu Paketen oder Retainern.
Senden die Buchungs- und Kontaktformulare etwas?
Sie prüfen die Eingaben und bestätigen auf der Seite, und sie sagen klar, dass nichts gesendet wurde. Verbinde einen Formular- oder Kalenderdienst, sobald die Seite live geht.
Erzeugt PopNow ein Porträt von mir?
Nur aus deinem eigenen Foto, zum Beispiel neu freigestellt auf den roten Hintergrund. Es erfindet nie ein Porträt und gibt es nicht als dich aus; erzeugte Personen in der Vorlage sind beschriftete Platzhalter.
Wie stelle ich sicher, dass nichts aus dem Beispiel übrig bleibt?
Führe den mitgelieferten Validator aus. Er bricht den Build ab, wenn der Name des Beispieldesigners, Kunden, zitierte Personen, Domain, Telefonnummer oder Projekt-IDs übrig sind, und prüft, dass jeder Link auf eine Seite zeigt.