cronicas-de-los-reinos/docs/plans/2026-02-16-cronicas-mmorpg-design.md

Cronicas de los Reinos - Libro Digital de Lore MMORPG

Resumen

Web estilo libro digital / e-reader que preserva las historias completas del lore de MMORPGs clasicos, escritas en estilo narrativo (como novelas). Cada juego es un "tomo" en una estanteria virtual.

Stack Tecnologico

• Framework: Next.js 14+ con App Router
• Lenguaje: TypeScript
• Estilos: Tailwind CSS
• Contenido: Archivos MDX (Markdown + React) editables como texto plano
• Hosting: Estatico (GitHub Pages, Vercel, Netlify)

Juegos Iniciales

1. World of Warcraft (azul/dorado)
2. Ragnarok Online (rojo/naranja)
3. MapleStory (verde/naranja vibrante)
4. Tales of Pirates (azul marino/dorado)

Estructura de Rutas

• / — Estanteria principal (todos los tomos)
• /[game] — Portada del tomo (intro + indice de capitulos)
• /[game]/[chapter] — Lectura del capitulo

Estructura de Contenido

content/
  wow/
    meta.json            (titulo, color, descripcion)
    01-origenes.mdx
    02-primera-guerra.mdx
    03-arthas-y-la-plaga.mdx
  ragnarok/
    meta.json
    01-creacion-de-midgard.mdx
    02-guerra-de-los-dioses.mdx
    03-heroes-de-rune-midgard.mdx
  maplestory/
    meta.json
    01-mundo-del-arce.mdx
    02-heroes-legendarios.mdx
    03-el-mago-negro.mdx
  tales-of-pirates/
    meta.json
    01-el-mar-infinito.mdx
    02-islas-del-tesoro.mdx
    03-era-de-los-piratas.mdx

Diseno Visual

Estanteria (pagina principal)

• Fondo con textura de madera oscura / estante de biblioteca
• Cada juego como libro/tomo con lomo visible y colores tematicos
• Hover inclina el libro, click lo abre

Portada del tomo (pagina del juego)

• Simula portada de libro abierta
• Titulo en tipografia decorativa
• Sinopsis breve
• Indice de capitulos estilo tabla de contenidos clasica

Modo lectura (capitulo)

• Fondo color crema/pergamino suave
• Tipografia serif (Georgia), ~18px
• Margenes amplios, max-width ~700px
• Numero de capitulo y titulo arriba
• Navegacion: capitulo anterior / siguiente
• Barra de progreso de lectura sutil arriba

Funcionalidades

• Navegacion por estanteria
• Lectura continua (cap anterior/siguiente)
• Progreso de lectura visual
• Responsive (movil y desktop)
• SEO optimizado (paginas estaticas)

Fuera de Alcance

• Sin login / autenticacion
• Sin base de datos
• Sin comentarios
• Sin audio / text-to-speech