
Galería de vista previa
Skills similares
Ver todas las SkillsLo que obtienes
- Un sitio de ejemplo terminado para Parcelo, un producto ficticio de analítica de entregas: la landing page más registro, inicio de sesión, reserva de demo, changelog, caso de estudio, seguridad, privacidad, términos y una 404.
- UI de producto en vivo con los términos de tu producto: un Dashboard con selector de rango y gráfico interactivo, mini vistas en el bento, pestañas de pasos, un selector de facturación que lleva el plan al registro y formularios validados.
- Tu sitio como un archivo sin conexión con Onest y JetBrains Mono incrustadas, además de la guía de estilo, el plan de imágenes, las reglas de movimiento y la checklist con las que trabaja tu agente.
Ideal para
- Fundadores y marketers que lanzan un producto SaaS y quieren una página serena, creíble y centrada en el producto.
- Herramientas de analítica, operaciones o para desarrolladores cuya mejor prueba es el propio producto.
- Equipos que necesitan páginas de precios, seguridad, changelog y registro, no solo un Hero.
No es para
- Prototipos de apps o sitios gestionados con CMS: crea un sitio de marketing con páginas interiores fijas, no un producto funcional.
- Marcas que quieren un estilo colorido o un selector de modo oscuro; meridian es claro, con secciones oscuras y un único acento turquesa.
- Registros, pagos o analítica reales: los formularios validan y confirman en la página hasta que conectes un backend.
Lanzamiento de producto y crecimiento de appsDiseño web y experiencias digitalesCrear página webCrear landing pageEstilo fijadoResultado editableEnfocado en conversiónNavegación en píldora oscuraRitmo claro y oscuroMockup en perspectivaMinimal con acento verde azulado
Acerca de esta Skill

Describe tu producto y recibe un sitio SaaS sereno y centrado en el producto: una página blanca con un único acento turquesa, una navbar oscura en forma de píldora y un Dashboard en vivo que se inclina en perspectiva y se aplana al hacer scroll. El ejemplo es Parcelo, una herramienta ficticia de analítica de entregas que detecta paquetes retrasados antes de que el cliente pregunte.

Lo que obtienes
- Una landing page con Banner, navbar en píldora, Dashboard en el Hero, bento oscuro de funciones, pasos de configuración, caso de cliente, testimonios, precios, seguridad, FAQ y una caja CTA oscura
- Páginas de registro, inicio de sesión, reserva de demo, changelog, caso de estudio, seguridad, privacidad y términos, además de una página 404 diseñada
- Mini vistas de producto en el bento que muestran tus propios objetos en lugar de capturas genéricas
- Un selector de precios mensual y anual, formularios con estados de error y de éxito, y un changelog con filtros y búsqueda
- Un único archivo con fuentes y fotos incrustadas que se abre sin conexión en cualquier navegador

Cómo usarlo
- Comparte el nombre de tu producto, qué hace, sus funciones, planes y qué debe mostrar el Dashboard; bastan unas notas sueltas.
- Tu agente renombra cada etiqueta del Dashboard con los objetos de tu producto, completa cada sección y página, y lo revisa en escritorio y móvil.
- Abre el archivo único, recorre las páginas y pide cambios con tus propias palabras.

Las fotos creadas con la herramienta de imagen de tu agente pueden generar costos de uso de esa herramienta; si no tienes una, se usan paneles tintados y avatares con monograma.
Lo que necesitas antes de empezar
- Tú aportas
- Nombre del producto, promesa en una línea y público · Funciones, planes con precios mensuales y anuales, y qué debe mostrar el Dashboard · Opcional: un caso de cliente, citas, respuestas para la FAQ, datos de seguridad y entradas del changelog
- 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 generación de imágenes en tu agente para las fotos del caso, del equipo y de los avatares (opcional; sin ella se usan paneles tintados y monogramas)
- Costos externos
- Las fotos del caso de cliente, del caso de estudio, del equipo y de los avatares se generan con la propia herramienta de imagen de tu agente cuando está disponible, lo que puede tener costos de uso de esa herramienta. Sin fuente de imágenes, se usan paneles tintados y avatares con monograma.
- Última prueba
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Reseñas de usuarios
Cargando reseñas…









