Proyecto One Page

Paso a paso

Las fases en orden, con el nombre del chat y el prompt de cada una.

Escribe el cliente y los prompts se completan solos. Cada fase: abre un chat, pega el prompt, revisa lo que entrega la IA y haz tus pasos.

1Preparar

00Sitio localSin IA

Esta fase no usa IA ni chat. Usa solo el WordPress base One Page.

  1. Tú haces

    • Crear un sitio nuevo en LocalWP y restaurar en él el WordPress base One Page con WPVivid. Todo el proyecto se construye y se firma en local; el hosting se usa solo al final.
    • Cambiar el nombre del sitio por el del cliente e idioma English (United States).
    • Verificar que existen, vacías y publicadas: Home, Gallery, Privacy Policy y Terms of Use. No hay About, Services, Contact ni Blog.
    • Conectar Trustindex al perfil de Google (si aún no hay link, seguir).
    • Crear el proyecto en Claude con las Instrucciones One Page y subir a Contexto el Contexto_Sistema_OnePage.md, los PDFs y el logo.
01Business Info

Un dato que falta no bloquea el avance: el campo queda vacío y el sitio lo oculta. Nunca escribas PENDIENTE.

  1. Abre un chat nuevo con este nombre

    01 Business Info | Cliente

  2. Pega este prompt

    Fase 1: Business Info de Cliente. Lee los PDFs y el logo del Contexto y entrégame primero la tabla de zonas encontradas, luego cada dato en su bloque de código, la tabla de revisión, DUDAS y FALTANTES.

  3. La IA te entrega

    Cada dato en su bloque para copiar, tabla de zonas encontradas, tabla de revisión con la fuente, dudas y faltantes. Crea la Ficha_Proyecto.md.

  4. Tú haces

    • Pegar los datos en Business Info y subir los logos. Las zonas van todas en biz_areas, la principal primero.
    • Descargar la Ficha_Proyecto.md para adjuntarla en el chat de la fase 2.

2Identidad y contenido

02Colores

  1. Abre un chat nuevo con este nombre

    02 Colores | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 2: Colores. Analiza el brief y el logo de Cliente y dame primary, secondary y cta en hex, con el contraste de cada uno.

  3. La IA te entrega

    Tres colores (primary, secondary y cta) con su hex y su contraste con blanco.

  4. Tú haces

    Cargarlos en la paleta global de Bricks.

03Tipografía

  1. Abre un chat nuevo con este nombre

    03 Tipografía | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 3: Tipografía. Con los colores de la Ficha_Proyecto.md propón 3 pairings de máximo 2 fuentes, con vista previa y los pesos exactos.

  3. La IA te entrega

    Tres propuestas de dos fuentes con vista previa, y los pesos exactos a descargar.

  4. Tú haces

    Elegir una, descargar los pesos indicados y alojarlas localmente en Bricks. Nunca Google Fonts.

04Íconos y Componentes

  1. Abre un chat nuevo con este nombre

    04 Íconos y Componentes | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 4: Íconos y componentes. Propón 3 estilos de ícono con vista previa y recomienda uno. Cuando elija, entrégame la ficha de componentes.

  3. La IA te entrega

    Tres estilos de ícono con vista previa y, al elegir, la ficha de componentes (botones, tarjetas, campos).

  4. Tú haces

    Elegir el estilo de ícono y configurar los componentes de Bricks con la ficha.

05Contenido JSON

Los servicios se crean y renombran solo con el wizard, nunca a mano. En One Page no hay áreas ni blog en el JSON.

  1. Abre un chat nuevo con este nombre

    05 Contenido JSON | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 5: Contenido. Servicios: [pega aquí la lista]. DATOS DISPONIBLES EN BUSINESS INFO: [teléfono sí/no, email sí/no, dirección sí/no, horario sí/no, zonas sí/no, licencia sí/no, propietario sí/no, años sí/no]. Entrégame contenido.json que valide con el esquema del wizard One Page.

  3. La IA te entrega

    Un archivo contenido.json con solo servicios (site_type onepage) que valida.

  4. Tú haces

    Cargarlo en CM Wizard One Page, validar, corregir lo que marque y aplicar.

3Estructura global

06Header

  1. Abre un chat nuevo con este nombre

    06 Header | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 6: Header de Cliente. Modo del header: [sólido / transparente]. Sigue la Parte F de la guía de Header Settings con los cambios del Contrato One Page (sección 4).

  3. La IA te entrega

    Header con megamenú de servicios y anclas, en un elemento Code, con su PHP, CSS y JS por separado.

  4. Tú haces

    Pegar cada bloque en su campo de Bricks, firmar el código y probar: enlaces ancla, desplazamiento suave, celular y los modos sólido y transparente.

07Footer

  1. Abre un chat nuevo con este nombre

    07 Footer | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 7: Footer de Cliente. Sigue la Parte E de la guía de Footer Settings con los cambios del Contrato One Page (sección 5), con los enlaces legales obligatorios.

  3. La IA te entrega

    Footer de 4 columnas con zonas como texto y los enlaces legales obligatorios (Privacy Policy y Terms of Use).

  4. Tú haces

    Pegar, probar con distinta cantidad de servicios y zonas, y revisar que los dos enlaces legales abran.

4Páginas y plantillas

08.1Home

Cada sección lleva su id (home, about, services, areas, contact). Las zonas se muestran como texto, sin enlaces.

  1. Abre un chat nuevo con este nombre

    08.1 Home | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 8.1: Home de Cliente. Plantilla elegida: [pega el enlace o describe la estructura]. Primero el bloque SEO y luego el código por secciones, con el Contrato One Page (sección 6).

  3. La IA te entrega

    Primero el bloque SEO de la página, luego el código por secciones: Hero, About, Services (selector), Areas, testimonios y Contact con el formulario.

  4. Tú haces

    Pegar el SEO (texto plano, sin marcadores) en Bricks > Page Settings > SEO y las secciones en Bricks, en el orden indicado. La sección Services usa el selector de servicios del Contexto. Si una sección lleva el formulario y es la primera del proyecto, trae su CSS: pégalo una sola vez.

08.2Gallery

  1. Abre un chat nuevo con este nombre

    08.2 Gallery | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 8.2: Gallery de Cliente. Primero el bloque SEO y luego el código por secciones, con el Contrato One Page (sección 7).

  3. La IA te entrega

    SEO de la página y código por secciones con la galería del campo gal_images.

  4. Tú haces

    Cargar las imágenes en el campo Gallery Images de la página Gallery, pegar el SEO y las secciones.

09.1Privacy Policy

El texto es una plantilla estándar: la validación legal es del cliente y el equipo debe avisarle.

  1. Abre un chat nuevo con este nombre

    09.1 Privacy Policy | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 9.1: Privacy Policy de Cliente. Primero el bloque SEO, luego el hero compacto y el texto legal dinámico.

  3. La IA te entrega

    SEO, hero compacto y el texto legal dinámico con los datos de Business Info.

  4. Tú haces

    Pegar en la página que ya existe. Se hace al final, cuando el resto del sitio está terminado.

09.2Terms of Use

El texto es una plantilla estándar: la validación legal es del cliente y el equipo debe avisarle.

  1. Abre un chat nuevo con este nombre

    09.2 Terms of Use | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 9.2: Terms of Use de Cliente. Primero el bloque SEO, luego el hero compacto y el texto legal dinámico.

  3. La IA te entrega

    SEO, hero compacto y el texto legal dinámico con los datos de Business Info.

  4. Tú haces

    Pegar en la página que ya existe.

5Entrega

10Verificación, migración y entregaSin IA

Esta fase no usa IA. Un punto sin marcar significa que el sitio no está listo.

  1. Tú haces

    • Completar el Checklist One Page en local.
    • El responsable de calidad hace la revisión técnica y de diseño en local.
    • Migrar al hosting con WPVivid y pegar las mismas claves de seguridad en el wp-config.php (ver la guía).
    • Probar en el hosting: el código se ejecuta, el menú y las anclas funcionan, el formulario llega a la bandeja y las páginas cargan bien.
    • Avisar por Monday que el proyecto está finalizado.
    • Sigue la revisión de texto e imágenes del equipo de USA y la del cliente.
11Correcciones

  1. Abre un chat nuevo con este nombre

    11 Correcciones | Cliente

  2. Pega este prompt y adjunta la Ficha_Proyecto.md

    Fase 11: Correcciones de Cliente. Adjunto los PDFs con los cambios. Clasifícalos y entrégame el contenido.json nuevo, los campos de Business Info y la lista de cambios a mano.

  3. La IA te entrega

    Un nuevo contenido.json solo con servicios, los campos nuevos de Business Info (zonas incluidas) y la lista de lo que se cambia a mano.

  4. Tú haces

    Aplicar los cambios del cliente.