Restaurante Demo Builder
Construye una demo de ventas respaldada por evidencia que haga que el propietario reconozca su propio restaurante y haga obvia la oportunidad perdida en línea. Trata la demo como una primera versión útil del sitio web del restaurante, no como un tema genérico con el nombre del restaurante pegado.
Lee references/demo-playbook.md antes de realizar investigaciones sustanciales, diseño, producción de imágenes o implementación. Usa solo las secciones relevantes para la solicitud.
Elige el Modo de Tarea
Determina el modo solicitado antes de actuar:
- Analizar: Devuelve un concepto fundamentado, fundamentación, estructura de página, dirección de imagen, plan de menú y brechas de verificación. No edites archivos del proyecto a menos que se te pida.
- Construir: Investiga el restaurante, crea o prepara los activos apropiados, implementa la demo funcional, ejecútala y verifica visualmente las vistas de escritorio y móvil.
- Actualizar: Inspecciona la demo existente y los hechos públicos actuales, luego actualiza solo lo que está desactualizado o es débil y vuelve a ejecutar la verificación visual.
Pide aclaración solo cuando varios negocios compartan el nombre y la ubicación correcta no se pueda inferir. De lo contrario, inspecciona primero los datos locales del cliente potencial y las fuentes públicas.
Trabaja a partir de la Evidencia
- Inspecciona el espacio de trabajo actual antes de navegar. Busca exportaciones de clientes potenciales, briefings, demos existentes y activos de diseño para encontrar el nombre del restaurante, la ubicación, el ID del lugar y las URL.
- Verifica los hechos públicos actuales, ya que la información del restaurante cambia con frecuencia. Consulta el sitio web propio del restaurante y sus páginas sociales, la ficha de Google o los datos de Maps, el menú o la página de pedidos actual, las reseñas recientes y las páginas oficiales de turismo o cámara de comercio relevantes.
- Registra la fuente y el nivel de confianza para el nombre, dirección, teléfono, horario, calificación, número de reseñas, categorías, servicios, elementos del menú, precios, eventos, pedidos en línea, enlaces sociales y cualquier imagen del local o exterior propuesta para la demo.
- Separa el contenido en tres etiquetas mientras trabajas:
- Hecho verificado: Respaldado directamente por una fuente actual.
- Inferencia razonable: Respaldado por patrones repetidos en reseñas o contexto de ubicación.
- Propuesta creativa: Eslogan, dirección artística, diseño o idea de campaña creada para la demo.
- Resuelve los hechos contradictorios con la fuente más reciente controlada por el propietario cuando sea posible. Coloca los conflictos no resueltos en la lista de verificación del propietario.
- Detén la investigación cuando la identidad del restaurante, el problema del sitio web, la disponibilidad del menú, los detalles de contacto principales, la evidencia de la audiencia principal y los temas recurrentes de las reseñas estén suficientemente establecidos. Para el modo de análisis, prefiere un conjunto pequeño de fuentes sólidas sobre un barrido exhaustivo de directorios; enumera los detalles no resueltos en lugar de retrasar el brief.
Nunca inventes elementos del menú, precios, horarios, premios, descuentos, opciones de entrega, reservas, pedidos, horarios de eventos o afirmaciones de accesibilidad. No agregues un botón de comando que parezca funcional a menos que su destino y servicio sean reales.
Define una Posición Comercial
Elige una audiencia principal y un objetivo de conversión principal a partir de la evidencia. Las audiencias típicas incluyen viajeros de paso, familias locales, clientes habituales del desayuno, clientes de bares deportivos y grupos nocturnos. Los objetivos típicos incluyen ver el menú, obtener indicaciones, llamar o realizar un pedido en línea verificado.
El primer viewport debe responder en cinco segundos:
- ¿Qué restaurante es este?
- ¿Por qué este visitante debería elegirlo?
- ¿Está abierto o cuándo abre?
- ¿Cómo puede el visitante ver el menú o llegar?
Usa el nombre del restaurante como H1. Coloca el posicionamiento en el texto de apoyo. Prefiere pruebas concretas como momentos del día, platos estrella, ubicación, horarios, porciones o temas de reseñas en lugar de frases genéricas como "buena comida" o "ingredientes frescos".
Enruta el Diseño
Después de que la evidencia del restaurante, la audiencia, la ocasión y la acción principal estén establecidas, lee references/design-routing.md. Crea un perfil de restaurante, ejecuta scripts/select_recipe.py y guarda el recipe-lock.json generado con el registro de investigación de la Demo.
Lee solo la referencia de la Receta seleccionada, luego copia el Starter de diseño seleccionado independientemente de assets/layouts/<layout-id>/:
morning-regular: references/recipe-morning-regular.mdhometown-table: references/recipe-hometown-table.mdlocal-tavern: references/recipe-local-tavern.mdoccasion-dining: references/recipe-occasion-dining.md
Usa references/layout-research-2026-07-v2.md solo cuando revises la evidencia estructural detrás de la biblioteca V2, expandas las gramáticas de diseño o diagnostiques un desajuste de diseño. El documento anterior design-research-2026-07.md y assets/starters/ son historia de V1 y no participan en el enrutamiento de nuevas Demos. No copies el código, las fotografías, los textos, el logotipo, las ilustraciones o la composición completa distintiva de un restaurante de referencia.
Trata la selección de Receta y diseño como restricciones separadas. La Receta controla la audiencia, el tono, las funciones y la actitud visual; la gramática de diseño controla el Hero, la composición de medios, la forma de prueba, la geometría del menú, la geometría de las secciones y la transformación móvil. La evidencia verificada del restaurante continúa controlando los pedidos, las reservas, los eventos, los horarios, los servicios, el contenido del menú, las reseñas y las imágenes. Nunca anules manualmente el bloqueo V2: corrige el perfil, la definición de compatibilidad o la huella de historial cuando un resultado sea incorrecto.
Bloquea la Paleta de Colores del Restaurante
Usa $restaurant-brand-palette después de bloquear la Receta y el diseño, pero antes del estilo visual final, siempre que una imagen de fachada, letrero, logotipo, menú, empaque o interior proporcione evidencia de color de identidad utilizable. Guarda el brand-palette.json validado y la vista previa junto a recipe-lock.json.
Trata la paleta, la Receta y el diseño como bloqueos separados. La paleta controla los roles y proporciones de color en CSS; no cambia la audiencia, la función, la gramática del Hero o la geometría de las secciones. Requiere la etapa de handoff de la habilidad de paleta antes de importar los tokens. Asigna los tokens validados a variables CSS y no introduzcas valores hexadecimales de reemplazo ad hoc durante la implementación.
Si ningún color de marca confiable sobrevive a la revisión de evidencia, permite que la habilidad de paleta cree un respaldo de Receta claramente etiquetado. No afirmes que un respaldo provino del restaurante. Vuelve a validar después de cualquier cambio de token e inspecciona el texto sobre las fotografías por separado.
Construye la Página Alrededor de las Decisiones
Usa esta secuencia predeterminada cuando la receta seleccionada no especifique un orden mejor respaldado por evidencia. Elimina cualquier sección que carezca de evidencia:
- Navegación compacta con
Menú,FavoritosyVisitar, más un comando de alto valor. - Hero a sangre con el nombre del restaurante, una propuesta de valor concreta,
Ver MenúyObtener IndicacionesoLlamar. - Franja de prueba con calificación/número de reseñas verificado, horario, señal de precio o contexto de ubicación/centro.
- De tres a seis platos destacados usando nombres confirmados cuando estén disponibles; usa una categoría o etiqueta representativa liderada por texto cuando un plato carezca de una foto real verificada, en lugar de inventar imágenes de comida realistas.
- Un menú HTML legible con navegación por categorías.
- Sección de experiencia o momento del día solo cuando aclare el negocio, como desayuno hasta noche, cena familiar, deportes o eventos en vivo.
- Prueba de reseñas breve y con fuente que respalde el posicionamiento elegido.
- Una banda de llegada o exterior cuando una foto de fachada verificada mejore materialmente el reconocimiento o la orientación.
- Sección de visita con dirección, horario actual, teléfono, mapa/indicaciones y enlaces sociales propios.
- Acciones adhesivas móviles para los comandos más importantes.
Mantén la experiencia directa y útil. Evita una tarjeta decorativa para cada sección, formularios de reserva falsos, historias genéricas de chefs, afirmaciones no respaldadas de "lo mejor de la ciudad" y textos de marketing extensos.
Crea un Sistema de Imágenes Consistente
Usa $restaurant-food-image-studio para la auditoría real de referencias de comida, generación de imágenes, reparación, seguimiento de manifiestos y hojas de contacto de fuente versus propuesta. En una compilación completa de Demo, establece primero la evidencia del restaurante y la dirección comercial aquí, luego pasa la lista corta de platos verificados y los requisitos de imagen a esa habilidad. Mantén los principios a continuación como el contrato de aceptación para el sitio final.
Trata la validación demo del Manifiesto V3 de Food Image Studio como el límite de integración. No copies un activo de comida re-elaborado por IA en el sitio web a menos que tenga una foto real única y registrada de un plato servido del mismo restaurante, la foto real se haya proporcionado como entrada de imagen, la fuente se haya enrutado a un Sistema de Fotografía orientado al cliente bloqueado, ambas hojas de evidencia canónicas estén bloqueadas por hash, las cinco puertas de QA pasen y el manifiesto actual pase <food-image-skill>/scripts/validate_manifest.py --stage demo. Ejecuta ese validador inmediatamente antes de copiar cada salida y nuevamente durante el QA final de la Demo. Si falta la fuente, el Sistema de Fotografía, el registro de evidencia o cualquier puerta de QA, mantén el espacio liderado por texto o usa un activo no alimentario verificado por separado. Nunca omitas esta puerta con una descripción de menú, foto de stock, imagen de estilo sintético o render de concepto-representativo.
Prefiere imágenes reales propiedad del restaurante porque la identidad del plato y el ambiente son evidencia. Para una demo de ventas privada, las fotos reales públicas de Maps, páginas sociales, plataformas de reseñas, directorios y páginas de menú pueden servir como referencias fácticas o de composición temporales incluso cuando el cargador sea desconocido. Registra la fuente y la incertidumbre, no impliques que los derechos de referencia están autorizados y obtén aprobación o activos de reemplazo antes del lanzamiento público.
Usa puertas separadas. En la puerta de fuente, retén automáticamente la fuente única de plato real, la evaluación de la cámara de la fuente, la ruta, la procedencia y los hashes. En la puerta de Demo privada, retén la comparación de la fuente con la foto diseñada, el tiempo de generación, el ángulo de salida registrado y las cinco puertas: fidelidad, consistencia de estilo, optimización del apetito, señales de IA y preparación para el sitio web. El usuario puede inspeccionar cualquiera de los artefactos más tarde y solicitar cambios. No se requiere la identidad del cargador cuando una foto pública real está creíblemente vinculada al restaurante correcto. En la puerta de lanzamiento público, requiere un reemplazo autorizado o el permiso del titular de derechos correspondiente más la confirmación del propietario de la exactitud fáctica. No impliques que un uso privado o uno a uno registrado otorga derechos de publicación.
Cuando no exista un menú digital actual, haz que $restaurant-food-image-studio ejecute su respaldo basado en Google Maps primero. Agrupa las fotos de platos reales repetidas, corrobóralas con fotografías del menú, publicaciones sociales, leyendas y menciones en reseñas, luego selecciona de tres a seis candidatos destacados. La repetición es una señal de selección, no una prueba de volumen de ventas: usa Destacado por defecto y reserva Popular, Más Popular, Bestseller o nombres de platos exactos para afirmaciones respaldadas.
Usa IA como una capa de dirección artística y restauración:
- Inspecciona cada fuente real y clasifica su vista de cámara antes de generar.
- Preserva el tipo de plato, ingredientes, porción, método de cocción, acompañamientos y recipiente de servicio; trata la fuente como verdad alimentaria en lugar de una composición final obligatoria.
- Bloquea una familia de cámara principal orientada al cliente, tolerancia de ángulo, escala del sujeto, recorte, fondo, dirección de iluminación, grado, sensación de lente y política de accesorios para el conjunto del restaurante.
- Enruta una fuente que no se ajuste a ese sistema a
referencia-re-elaboración; nunca preserves un ángulo de vista aérea o instantáneo casual inadecuado simplemente porque es real. - Mejora la exposición, el balance de blancos y las señales de apetito respaldadas por la fuente, como el dorado natural del pan o el dorado visible, sin cambiar el punto de cocción, las marcas, la porción o los ingredientes.
- Rechaza el brillo plástico, la textura cerosa, la repetición, la geometría perfecta, los efectos imposibles y otras señales visibles de IA.
- Usa una imagen amplia para el hero y una familia consistente
4:3para la comida destacada. - Genera solo de tres a seis imágenes de comida destacada; deja que el menú completo permanezca liderado por texto.
- Marca la salida incierta como imagen conceptual e inclúyela en el conjunto de verificación del propietario.
- Mantén las capturas de pantalla de Google Maps y otros originales de terceros fuera de la página de la Demo; regístralos solo en el manifiesto interno y la hoja de contacto.
No etiquetes una imagen generada como un elemento de menú exacto cuando la referencia no pruebe sus ingredientes. Evita guarniciones imposibles, vapor o tirones de queso exagerados, logotipos falsos, texto de menú generado, perfección excesiva y pulido de foto de stock que contradiga el restaurante.
Usa $restaurant-exterior-image-studio para la auditoría real de la fuente de la fachada, la planificación de la preservación, la restauración asistida por IA o la recreación basada en referencias, el seguimiento del manifiesto, el registro, la comparación y el QA de seis partes. En una compilación completa de Demo, decide el propósito y la ranura de la imagen de llegada aquí primero, luego pasa la relación de aspecto, el punto focal, la ubicación prevista y el requisito de orientación a esa habilidad.
Trata la validación demo de Exterior Image Studio como el límite de integración. No copies una fachada asistida por IA en el sitio web a menos que las fuentes reales actuales prueben el letrero, la entrada, la geometría de la fachada, los colores de la fachada y las características fijas; todas las regiones orientadas a la salida estén respaldadas o recortadas; el contrato de preservación esté completo; las seis puertas de QA pasen; y <exterior-skill>/scripts/validate_manifest.py --stage demo tenga éxito inmediatamente antes de la integración.
Mantén un hero liderado por comida cuando el apetito sea la conversión principal; coloca el exterior cerca de la sección de Visita a menos que el edificio en sí sea la atracción verificada. Mantén los originales de plataformas públicas internos, etiqueta una salida de Demo privada como una propuesta de foto y preserva las puertas separadas de precisión del propietario y derechos de publicación. Street View sigue siendo solo para investigación, excepto para un embed o enlace oficial.
Lee la sección Exterior And Arrival Imagery en references/demo-playbook.md antes de planificar o colocar el activo; deja que la Habilidad especializada controle los detalles de producción.
Haz del Menú la Utilidad Principal
Construye el menú como contenido estructurado de la página, no como
...[truncado para traducción]