Cosa ottieni
- Un file HTML con font e immagini incorporati, senza richieste di rete
- Hero shader, marquee dei clienti, fascia dello studio, griglia dei lavori sfalsata e indice progetti con ricerca
- Una pagina per ogni caso di studio, più journal, privacy, termini e pagina non trovata
- Schede dei servizi, piani di collaborazione con cambio valuta, preventivi, team, FAQ e modulo di brief progetto
- Foto opzionali di studio, casi e team e un loop per la card di caso generati con PopNow dopo un preventivo in crediti
Ideale per
- Studi di design, branding, web, motion e 3D
- Freelance e piccole società di consulenza con progetti reali da mostrare
- Studi di architettura e interni che vogliono un portfolio sobrio e premium
Non adatta a
- Negozi online o brand scuri e pieni di neon
- Pagine che richiedono una foto o un video dietro il titolo
- Siti senza lavori finiti da presentare
Come usarla
In Claude o ChatGPT
Usa la skill PopNow “Sito per agenzia creativa con hero shader” (creative-agency-website) per questo: Costruisci il sito per Quarrow, uno studio di brand e web di quattro persone a Porto. Progetti: il rilancio di un negozio di ceramiche, un’app per gli orari dei traghetti e un’identità per un forno. Collaborazioni: Sprint, Launch, Retainer.
In un agente di programmazione
/popnow-creative-agency-website Costruisci il sito per Quarrow, uno studio di brand e web di quattro persone a Porto. Progetti: il rilancio di un negozio di ceramiche, un’app per gli orari dei traghetti e un’identità per un forno. Collaborazioni: Sprint, Launch, Retainer.
Poi prova
Preventivami le foto per i tre casi di studio e una griglia del team prima di generare qualsiasi cosa.
Trasforma la card del caso dei traghetti in un loop video lento dalla sua foto principale e dimmi prima il prezzo.
Cosa tenere pronto
- Nome dello studio, una riga di posizionamento, città e contatti
- Da due a sei progetti con il brief, ciò che hai fatto e un risultato misurabile
- Servizi, come i clienti ti assumono e le persone che guidano il lavoro
- Facoltativo: una chiave API PopNow o le foto del tuo studio e dei tuoi progetti
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.
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 portfolio per sviluppatori
+3Un sito personale scuro per ingegneri, con case study, articoli, talk, curriculum e modulo di contatto.
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
Lo shader rallenta la pagina?
Viene renderizzato a risoluzione ridotta con il rapporto di pixel limitato, si ferma quando l’hero esce dallo schermo o la scheda è nascosta, e con movimento ridotto mostra un solo fotogramma fermo. Sotto c’è una versione CSS dello stesso aspetto, così la pagina sembra finita anche senza WebGL.
Cosa genera PopNow qui?
Foto per la fascia dello studio, per ogni caso di studio e per il team, tutte in un’unica direzione artistica, più un loop lento opzionale che sostituisce l’immagine ferma di una card di caso. L’hero è codice e non richiede nulla. Ogni esecuzione viene preventivata in crediti e parte solo dopo il tuo ok.
Posso usarlo senza una chiave API PopNow?
Sì. Le foto dello studio incluse possono restare come sostituti neutri, i media dei casi possono diventare pannelli CSS nei colori di ciascun cliente, e i preventivi usano avatar con iniziali. La skill elenca gli slot che richiedono ancora foto vere.
Posso cambiare l’accento arancione?
Sì, con alcuni token e i preset di colore dello shader. La pagina mantiene un solo accento ed evita tonalità viola e violette, cosa che il validatore controlla; un DESIGN.md di brand nel tuo progetto viene mappato su quei token.

