Cosa ottieni
- Un file HTML offline, oppure route reali nel tuo progetto React, Vue, Svelte o Astro
- Home, lavori e case study, scritti e articoli, talk, Uses, About, curriculum, contatti e 404
- Copertine dei progetti disegnate come pannelli di prodotto HTML su sfondi fotografici
- Palette dei comandi, schede dell’esperienza, griglia dei repository, filtri e moduli validati
- Sfondi o foto PopNow opzionali, con preventivo prima di pagare
Ideale per
- Ingegneri e maker indipendenti che vogliono un sito personale
- Chi cerca lavoro e ha bisogno di una pagina «assumimi» con case study
- Sviluppatori che scrivono o parlano in pubblico e vogliono un unico posto per tutto
Non adatta a
- Brand chiari o colorati: il design è solo scuro
- Designer visivi il cui lavoro è soprattutto fatto di immagini
- Siti aziendali o negozi online
Come usarla
In Claude o ChatGPT
Usa la skill PopNow “Sito portfolio per sviluppatori” (developer-portfolio-website) per questo: Crea il mio sito personale. Sono un ingegnere backend a Berlino; il mio CV, tre progetti e due post del blog sono in ./notes.
In un agente di programmazione
/popnow-developer-portfolio-website Crea il mio sito personale. Sono un ingegnere backend a Berlino; il mio CV, tre progetti e due post del blog sono in ./notes.
Poi prova
Crea uno sfondo per un quarto progetto nello stesso stile di pietra scura e fammi prima un preventivo.
Togli la sezione dei talk e trasforma Uses in Process.
Cosa tenere pronto
- I tuoi lavori, le date e i risultati concreti
- Da due a sei progetti con il problema, le decisioni chiave e i risultati
- Post, talk, repository e strumenti che hai davvero
- Un tuo ritratto ed eventuali foto reali di eventi
Skill simili
Vedi tutte →Creatore di avatar 3D
+3Crea nel browser un personaggio 3D tenero come un peluche e salvalo come PNG trasparente o pagina 3D.
Calendario heatmap
+3Un anno di attività quotidiana come griglia di calendario sfumata, con serie, totali e accesso da tastiera.
Landing page SaaS per l’AI
+3Carta sabbia calda, binari sottili e tratteggi attorno a una kanban dal vivo dove un assistente pianifica.
Sezione hero animata
+3Una hero per landing page con una parola del titolo che ruota con delicatezza, due pulsanti e un riquadro immagine largo.
Sito per agenzia creativa con hero shader
+3Hero shader WebGL dal vivo dietro un’affermazione in basso, navigazione a pillola e griglia di casi di studio.
Landing page SaaS scura
+3Un sito di marketing scuro e ricco di animazioni per un prodotto software, consegnato come un unico file HTML autonomo.
Sito portfolio per designer
+3Sei card inclinate attorno a un titolo sfumato su grigio calmo, una card ritratto rossa e casi di studio.
Sito SaaS editoriale
+3Hero diviso blu notte, titolo serif accanto a una foto documentaria, fasce inclinate e un accento cobalto.
Template sito glassmorphism
+3Pillole di vetro su fondo quasi nero, titolo serif enorme con una parola in corsivo e iscrizione via email.
Sito di prodotti hardware
+3Nomi dei modelli enormi e sottili su scatti da studio argentati, card di specifiche e una gamma in scala.
Diagramma di architettura interattivo
+3Un diagramma di sistema cliccabile e offline, costruito da un modello JSON verificato, con le evidenze dietro ogni riquadro.
Hero con griglia interattiva
+3Una griglia scura di fili sottili che si piega verso il cursore e fa partire un anello luminoso a ogni clic.
Esploratore di knowledge graph
+3Trasforma gli appunti di progetto in un grafo offline e ricercabile, dove ogni affermazione rimanda alla sua riga di origine.
Template dashboard KPI
+3Quattro KPI con variazioni, un grafico a linee, una tabella di dettaglio e barre obiettivo.
Landing page da mockup AI
+3Vedi prima tre progetti a pagina intera, scegline uno: il tuo agente lo costruisce come codice pulito.
Template sito web per rivista
+3Un sito di rivista con qualità da stampa, articoli, temi, un piccolo shop e abbonamenti, in un unico file HTML.
Hero con animazione di particelle
+3Testo su carta calda accanto a una sfera di punti inchiostro e verde acqua che cambia forma per ogni idea.
Sito personal brand
+3Un ritratto sfumato su carta calda sotto una sottile parentesi, con affermazioni leggere e grassetto ai lati.
Pagina di lancio cinematografica di prodotto
+3Pagina quasi nera in stile film: titolo serif su luci in movimento, scena notturna, modulo di prenotazione.
Template dashboard di amministrazione
+3Una console di back office funzionante con grafici, tabelle, kanban e calendario, in un unico file HTML offline.
Template landing page SaaS
+3Un sito di marketing chiaro e sobrio per un prodotto software, con console di prodotto funzionante, prezzi e iscrizione.
Sito portfolio in stile scrapbook
+3Un CV online su più pagine fatto di oggetti di carta, con case study e un curriculum stampabile.
Template sito e-commerce di sneaker
+3Un negozio completo di scarpe o abbigliamento con catalogo, pagine prodotto, carrello e checkout demo in un unico file HTML.
Landing page per automazione di workflow
+3Pagina in grafite con titolo piccolo a sinistra e sotto un grafo di nodi dal vivo che esegue e riprova.
Domande
Perché le copertine dei progetti non sono screenshot?
Ogni copertina è una piccola interfaccia di prodotto costruita in HTML e CSS con dati del tuo ambito. Resta nitida a ogni dimensione, si abbina ai colori del sito e non mostra mai dati privati di una schermata reale.
Mi serve PopNow?
No. Gli sfondi in pietra e sabbia inclusi si possono riusare per i tuoi progetti, e i talk possono usare miniature disegnate. PopNow è opzionale per nuovi sfondi, una foto della postazione o un ritratto con nuova color correction, e ogni esecuzione ha prima un prezzo.
E se non ho talk o repository open source?
Le sezioni senza contenuti reali vengono rimosse insieme ai loro link. La skill non inventa mai talk, repository, numeri di stelle o clienti per una persona reale.
Può entrare nella mia app Next.js esistente?
Sì. Rileva lo stack, lascia stare i file non correlati e ricostruisce le stesse route come pagine reali con gli stessi token e font.