
Galería de vista previa
Skills similares
Ver todas las SkillsLo que obtienes
- Una suite conectada: home, precios con pago, inicio de sesión y registro, el producto funcional, administración, novedades, contacto, privacidad, términos y una página de no encontrado, que comparten una misma historia y un mismo estado
- El estilo scrapbook ámbar: un Hero minimalista centrado con una frase en degradado ámbar y pegatinas, seguido de fotos con cinta, notas manuscritas, una cuadrícula bento en crema, un tablero de roadmap y testimonios en mosaico
- Interacciones que funcionan en modo claro y oscuro: captura de tareas con análisis en directo, una acción de planificación que gasta créditos, selector de facturación, búsqueda, ordenación y filtros en administración, y un menú de comandos
Ideal para
- Equipos de SaaS, productividad y software independiente que quieren un sitio de lanzamiento cálido y artesanal en lugar de una página corporativa con degradados
- Fundadores que necesitan el sitio de marketing, los precios, el producto y la administración maquetados como una demo convincente para un lanzamiento o una validación temprana
- Productos con un ciclo central claro (capturar, organizar, generar un resultado) que se pueda mostrar funcionando dentro de la vista de producto
No es para
- Marcas corporativas formales o reguladas: las pegatinas, la cinta washi y las notas manuscritas mantienen un tono deliberadamente desenfadado
- Aplicaciones reales con cuentas, pagos o datos reales: el inicio de sesión, el pago y los correos son simulaciones honestas dentro de la página
- Negocios sin producto de software, como una cafetería o un portafolio: la suite gira en torno a un producto, sus precios y una administración
Lanzamiento de producto y crecimiento de appsDiseño web y experiencias digitalesCrear página webCrear landing pageEstilo fijadoResultado editableScrapbook ámbarBento cremaCollage de UI inclinadaAnotado a manoEditorial divertido
Acerca de esta Skill

Suite Amber Scrapbook crea todas las superficies de un producto SaaS como un conjunto conectado de vistas: home de marketing, precios, inicio de sesión, el producto funcional, administración y las páginas de apoyo. La parte de marketing parece montada a mano con papel crema, cinta washi, polaroids y notas manuscritas, mientras que las vistas de producto y administración se mantienen serenas y precisas. El ejemplo es Dayfold, un planificador diario con IA ficticio.

Lo que obtienes
- Una suite completa: home, precios con cajón de pago, inicio de sesión y registro, el producto, administración, novedades, contacto, privacidad, términos y una página de no encontrado
- Una home que va del Hero minimalista a una marquesina de logotipos, bloques de funciones con tarjetas inclinadas y fotos con cinta, una cuadrícula bento en crema, un caso de cliente, un tablero de roadmap, testimonios en mosaico, una FAQ y un cierre en papel de libreta
- Una vista de producto con captura de tareas en lenguaje natural y una acción de planificación que gasta créditos, además de un Dashboard de administración con estadísticas, un gráfico y una tabla de usuarios con búsqueda
- Estado compartido: registrarse o comprar un plan actualiza el menú de la cuenta, los créditos, la insignia de precios y la tabla de administración
- Temas claro y oscuro, un menú de comandos y un único archivo autónomo que se abre en cualquier navegador y funciona sin conexión

Cómo usarlo
- Comparte el nombre de tu producto, una promesa de una línea, entre 8 y 10 funciones con las 3 principales marcadas, la estructura de tus precios y algunos elementos del roadmap.
- Tu agente adapta el ciclo del producto a tu sector, planifica y genera las fotos, y construye cada vista con tus textos.
- Abre el archivo, recorre cada página en modo claro y oscuro, y pide cambios en textos, planes o secciones.

Las fotos salen de la herramienta de imagen de tu agente cuando hay una disponible, lo que puede tener los costos de uso de esa herramienta. Todo lo que tu brief no cubra se convierte en texto provisional que el agente te lista para que lo confirmes.
Lo que necesitas antes de empezar
- Tú aportas
- Nombre del producto, una promesa de una línea y la audiencia · Entre 8 y 10 funciones con las 3 principales marcadas, además de la estructura de tus precios · Elementos del roadmap, un caso de cliente y citas o fotos reales (opcional)
- 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 las fotos (opcional; sin ella aportas tus fotos o recibes marcadores de posición etiquetados)
- Costos externos
- Las fotos se generan con la propia herramienta de imagen de tu agente cuando hay una disponible, lo que puede tener los costos de uso de esa herramienta. Si no la hay, el agente te pide tus fotos o entrega marcadores de posición claramente etiquetados. Nada más usa un servicio de pago.
- Última prueba
- v1.0.9 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Reseñas de usuarios
Cargando reseñas…








