
Galería de vista previa
Skills similares
Ver todas las SkillsLo que obtienes
- Un sitio de 23 rutas: modelos con tres páginas de producto, tecnología, aplicaciones con cuatro casos, blog con tres artículos, descargas, sobre nosotros, reserva de demos, FAQ, newsletter, páginas legales y 404
- Controles que funcionan: selector de modelo en el Hero, galería de producto, configurador con total en curso, interruptor de comparación, filtros de módulos con ordenación y búsqueda, filtro de descargas y búsqueda en FAQ
- Tipografía Inter Tight e IBM Plex Mono, tarjetas de especificaciones blancas y discretas y fotos de estudio plateadas, todo en un único archivo que se abre sin conexión
Ideal para
- Fabricantes de robótica, drones, bicicletas eléctricas, audio y cámaras con una familia de productos que presentar
- Startups de hardware que necesitan especificaciones, comparativas, descargas y reserva de demos en un solo sitio
- Marcas de instrumental de laboratorio y equipamiento que quieren un aspecto sereno y técnico en lugar de una página de lanzamiento estridente
No es para
- Pedidos o pagos reales: el configurador y el formulario de demo confirman en la página e indican que no se envió nada
- Productos solo de software sin nada físico que fotografiar
- Marcas que quieren un aspecto oscuro o colorido; la paleta es plata, blanco y grafito
Identidad de marca y sistemas visualesDiseño web y experiencias digitalesCrear sitio de productoEstilo fijadoResultado editableBento de robotFunciones del robotHero de robotFicha técnica del robot
Acerca de esta Skill

Convierte tu línea de productos en un sitio de marca sereno y técnico: un nombre de modelo gigante y fino sobre fotografía de estudio plateada, tarjetas de especificaciones blancas y discretas y una gama dibujada a su altura relativa real. El ejemplo cubre tres robots en 23 rutas conectadas, y el sitio llega como un único archivo que se abre sin conexión en cualquier navegador.

Lo que obtienes
- Un selector de modelo en el Hero que cambia imagen, nombre, entradilla y especificaciones, una gama a escala y un bento de hardware asimétrico con una celda de código
- Páginas de modelo con galería y configurador, una comparación lado a lado con un interruptor de solo diferencias y un catálogo de módulos filtrable
- Pestañas de tecnología, páginas de casos de aplicación, un blog, descargas con filtros, una página sobre nosotros con cronología, FAQ con búsqueda y reserva de demos
- Formularios validados que llevan tu configuración a la solicitud de demo y confirman en la página
- Inter Tight e IBM Plex Mono incrustadas con todas las imágenes, para que la página no haga solicitudes de red

Cómo usarlo
- Dale a la Skill tu marca, productos con códigos, especificaciones y precios, tu público y las páginas que necesitas. Añade fotos de producto si las tienes.
- Rellena cada página, genera las imágenes que falten con un mismo estilo de estudio y te lista los datos redactados para que los confirmes.
- Abre el archivo, prueba el selector, el configurador y los filtros, y pide cambios con tus propias palabras.

Las imágenes que no aportes salen de la herramienta de imagen de tu agente, que puede tener sus propios costos de uso.
Lo que necesitas antes de empezar
- Tú aportas
- Nombre de la marca, público y las páginas que necesitas · De dos a cuatro productos con códigos, especificaciones clave, precios y para qué sirve cada uno · Opcional: fotos de producto, socios, citas y datos de la empresa que puedas confirmar
- Dependencias
- Node.js 18 o superior en la máquina de tu agente, para ejecutar el script incluido que genera el archivo único sin conexión · Acceso a internet mientras se genera el archivo, para descargar las fuentes una vez e incrustarlas · Una herramienta de imagen en tu agente para Heros de producto, planos de cuerpo entero, primeros planos y escenas; opcional si aportas tus propias fotos
- Costos externos
- Las imágenes que no aportes se generan con la herramienta de imagen de tu agente, que puede generar costos de uso. La página terminada no hace solicitudes de red. Ver el ejemplo no cuesta nada.
- Última prueba
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Reseñas de usuarios
Cargando reseñas…









