Ce que vous obtenez
- Un site produit de 23 pages en un seul fichier HTML hors ligne, ou porté dans votre framework
- Héros avec sélecteur de modèles, gamme à l’échelle, grille de matériel et cartes de fiches blanches
- Pages produit avec galerie, fiche technique complète et configurateur qui transmet au contact
- Un validateur pour la sécurité hors ligne, la structure et les noms d’exemple oubliés
- En option : rendus produit, scènes et boucle de héros PopNow, chiffrés d’abord
Idéal pour
- Marques de robotique, de vélos électriques, de drones, d’audio et de caméras
- Sites de lancement ou de catalogue pour une petite famille de produits
- Proposer une refonte haut de gamme avec des pages fonctionnelles
Pas fait pour
- Boutiques qui doivent encaisser des paiements dès aujourd’hui
- Catalogues de centaines de produits
- Marques chaleureuses, ludiques ou purement logicielles
Comment l’utiliser
Dans Claude ou ChatGPT
Utilisez le skill PopNow « Site web de produit matériel » (hardware-product-website) pour ceci : Construisez le site de nos trois vélos électriques, Arc 1, Arc 2 et Arc Cargo, avec les prix, l’autonomie et le poids tirés de specs.csv.
Dans un agent de code
/popnow-hardware-product-website Construisez le site de nos trois vélos électriques, Arc 1, Arc 2 et Arc Cargo, avec les prix, l’autonomie et le poids tirés de specs.csv.
Puis essayez
Générez des prises de vue studio des trois vélos sur le fond argenté et donnez-moi le devis de l’ensemble d’abord.
Portez-le dans notre application Next.js avec une route par vélo.
À préparer
- Noms de produits, références, prix et les caractéristiques qui comptent
- Des photos produit, ou une clé API PopNow pour générer un jeu assorti
- Des faits réels pour les partenaires, l’équipe, le contact et les délais
Skills similaires
Tout voir →Créateur d’avatar 3D
+3Créez dans votre navigateur un personnage 3D façon peluche et enregistrez-le en PNG transparent ou en page 3D.
Calendrier heatmap d’activité
+3Une année d’activité quotidienne en calendrier de cases colorées, avec séries, totaux et navigation au clavier.
Modèle de landing page SaaS IA
+3Papier sable et filets fins autour d’un tableau kanban où un assistant planifie les tâches.
Section hero animée
+3Un hero de landing page avec un mot de titre qui change en douceur, deux boutons et un large cadre d’image.
Modèle de site d’agence créative à shader
+3Héros shader orange vivant, déclaration en bas, navigation en pilules et grille d’études de cas décalée.
Landing page SaaS sombre
+3Un site marketing sombre et très animé pour un logiciel, livré en un seul fichier HTML autonome.
Site portfolio de designer
+3Six cartes inclinées autour d’un titre qui s’estompe, une carte portrait rouge, des études de cas éditoriales.
Site portfolio de développeur
+3Un site personnel sombre pour développeurs, avec études de cas, articles, conférences, CV et formulaire de contact.
Site SaaS éditorial
+3Héros scindé bleu marine, titre serif sur cinq lignes, photo documentaire, bandeaux inclinés et accent cobalt.
Modèle de site glassmorphism
+3Verre dépoli sur fond noir, grand titre serif à un mot en italique, et inscription par e-mail.
Diagramme d’architecture interactif
+3Un schéma système cliquable et hors ligne, construit à partir d’un modèle JSON vérifié, avec les preuves derrière chaque bloc.
Héros à grille interactive
+3Grille sombre de fins filaments qui se courbe vers le curseur et envoie un anneau à chaque clic.
Explorateur de graphe de connaissances
+3Transformez vos notes de projet en graphe consultable hors ligne, où chaque affirmation renvoie à sa ligne source.
Modèle de tableau de bord KPI
+3Quatre indicateurs avec variations, courbe lumineuse, répartition et objectifs, sur papier chaud.
Landing page à partir de maquettes IA
+3Voyez trois maquettes de page complète, choisissez-en une, et votre agent la code proprement.
Modèle de site web magazine
+3Un site de magazine digne de l’imprimé, avec articles, rubriques, petite boutique et abonnements, en un seul fichier HTML.
Héros à animation de particules
+3Texte sur papier chaud, à côté d’une sphère de points qui change à chaque idée.
Site de marque personnelle
+3Portrait fondu dans du papier chaud sous un fin crochet, affirmations de chaque côté.
Page de lancement produit cinématique
+3Page presque noire façon cinéma : titre serif, scène de nuit encadrée, formulaire de réservation.
Modèle de dashboard admin
+3Une console de back-office fonctionnelle avec graphiques, tableaux, kanban et calendrier, en un seul fichier HTML hors ligne.
Modèle de landing page SaaS
+3Un site marketing clair et apaisé pour un logiciel, avec console produit fonctionnelle, tarifs et inscription.
Site CV portfolio façon scrapbook
+3Un CV en ligne sur plusieurs pages fait d’objets en papier, avec études de cas et CV imprimable.
Modèle de site e-commerce de sneakers
+3Une boutique complète de chaussures ou de vêtements avec catalogue, fiches produit, panier et paiement de démo, en un fichier HTML.
Modèle de page d’automatisation de workflows
+3Page graphite au titre court, avec un graphe de nœuds vivant qui s’exécute et relance les étapes.
Questions
Ne fonctionne-t-il que pour les robots ?
Non. La marque d’exemple est un fabricant de robots, mais toute petite famille de produits physiques convient : vélos, drones, enceintes, caméras ou instruments. L’échelle de la gamme, les sections et les étiquettes s’adaptent à vos produits.
Peut-il prendre des commandes ?
Le configurateur construit une spécification chiffrée et la transmet à un formulaire de devis. Il n’encaisse aucun paiement tant que vous n’avez pas branché un prestataire, et la page l’indique.
Et si je n’ai pas encore de photos produit ?
PopNow peut générer un jeu cohérent à partir d’une seule description écrite de votre produit, après vous avoir donné le total. D’ici là, la page peut afficher des vignettes étiquetées comme espaces réservés.
Comment savoir qu’il ne reste rien de l’exemple ?
Le validateur fourni fait échouer la compilation si subsiste une marque, un produit, une personne, un partenaire, un lieu, un numéro de téléphone ou un domaine d’exemple, et vérifie aussi la sécurité hors ligne et que chaque lien mène à une page.

