Implementation Plan

Fases

• 1. Shell: tokens, fuentes, header con wordmark, footer, modo tenue.
• 2. Datos: modelo de series, capítulos y bloques; redacción del contenido.
• 3. Biblioteca: tarjetas, filtros, búsqueda y anillos de progreso.
• 4. Capítulo y playground: renderizador de prosa, callouts, worker mx, editor y diff.
• 5. Progreso y comentarios: store persistido, auto-completado al 80%, celebración, hilos.
• 6. Grafo: mapa de prerrequisitos con resaltado de antecesores.
• 7. Docs: los seis documentos del proyecto.
• 8. Deploy: metadatos SEO por página, revisión de accesibilidad, publicación y dominio nviame.cl.

Criterios de aceptación

• Cada playground funciona al cargar, sin editar.
• Contraste AA en ambos temas y foco visible en todos los controles.
• Ningún texto de relleno en la interfaz ni en el contenido.

El plan se ejecuta en ocho fases cortas, cada una con un entregable visible. El orden prioriza tener temprano una ruta completa de lectura —de la biblioteca al capítulo— para validar tipografía y ritmo con contenido real antes de construir las funciones interactivas.

Las fases de datos y contenido corren en paralelo con las de interfaz: el modelo de bloques se define primero y la redacción avanza mientras se construyen los componentes que la renderizan.

Riesgos y mitigaciones

• Editor pesado en la carga inicial: carga diferida y solo en cliente.
• Código del aprendiz que bloquea la página: Web Worker con temporizador de seis segundos.
• Contenido regulatorio desactualizado: avisos explícitos de que se describen patrones generales.
• Pérdida de progreso: el store tolera datos corruptos y vuelve a un estado vacío sin fallar.

Cada fase cierra con una revisión en navegador en escritorio y móvil, comprobando que los playgrounds funcionan al cargar y que el progreso se refleja en todas las vistas.