Índice
Estructura principal del sitio de Hatt
Ilustración
Preparamos un flujo para conservar ideas de personajes y notas de mundo como artículos y obras.
Novelas
Reúne el acceso a historias publicadas en sitios externos y registros del proceso creativo.
Modelado
Conecta la creación de avatares, gimmicks y accesorios para VRChat con BOOTH y YouTube.
Publicamos el sitio personal Página web de Hatt, que reúne la actividad creativa de Hatt en un solo lugar.
El sitio funciona como una entrada para ilustraciones, novelas y creación de avatares y gimmicks para VRChat. También lo agregamos a la página de trabajos de Acecore como caso de producción web y construcción con CMS.
Contexto
Hatt trabaja en varias actividades creativas, como ilustración, novelas y producción de avatares y gimmicks 3D para VRChat.
Sin embargo, las entradas estaban separadas entre blog, sitios externos de publicación, BOOTH, YouTube, X y otros canales. Las obras y los lugares de publicación ya existían, pero para una persona que llegaba por primera vez era difícil entender rápidamente qué crea Hatt y desde dónde empezar.
Por eso, en este proyecto no concentramos todas las obras en una sola página. Diseñamos el sitio como un hub que muestra la visión general de la actividad.
Mostrar tres actividades en la portada
La portada organiza la actividad de Hatt en tres áreas.
- Ilustración: un lugar para conservar ideas de personajes y notas de mundo como artículos y obras
- Novelas: una entrada a historias publicadas en sitios externos y registros del proceso creativo
- Modelado: presentación de avatares, gimmicks y accesorios para VRChat
Primero comunica qué tipo de creador es Hatt y luego guía hacia el blog, las obras de modelado, el perfil y los enlaces externos. En un sitio personal, la clasificación de la actividad y el diseño de navegación importan tanto como la impresión visual.
Un sitio estático que puede seguir creciendo
Para la construcción usamos Astro, TypeScript, UnoCSS, Sveltia CMS y Pagefind.
Astro permite publicar el sitio como estático, con buena velocidad de carga y facilidad de mantenimiento. El blog y la información de obras se pueden editar desde el CMS, de modo que sea más sencillo seguir publicando sin tocar código.
También incorporamos Pagefind para la búsqueda interna. Aunque aumenten los artículos y obras, las personas visitantes pueden llegar a la información que buscan mediante palabras clave.
La forma de ordenar SEO y OGP en sitios Astro también se explica en Guía de mejora SEO: implementar datos estructurados y OGP en un sitio Astro.
No separar los espacios externos de actividad
La actividad de Hatt no termina dentro del sitio. Sitios de publicación de novelas, BOOTH, YouTube y X son lugares adecuados según cada tipo de obra.
Por eso, la página no reemplaza esos servicios externos. Funciona como una puerta de entrada que los conecta. Por ejemplo, en la página de modelado es fácil pasar a avatares y gimmicks publicados en BOOTH, y también están ordenados los enlaces a YouTube y X.
En sitios personales y portafolios, muchas veces resulta más efectivo crear rutas claras entre cuentas existentes que intentar integrarlo todo en una sola plataforma.
También como caso de trabajo
Agregamos el proyecto a la página de trabajos y portafolio de Acecore como “Producción de la página web de Hatt”.
Esta producción no fue solo publicar páginas. Incluyó organizar la actividad creativa, edición con CMS, búsqueda, OGP, sitemap y diseño de enlaces externos. Incluso en un sitio personal pequeño, preparar una estructura que pueda crecer después de publicarse aumenta el valor cuando se sumen nuevas obras y artículos.
Para consultar sobre producción web, visita Producción y operación web o contacta desde Contacto.
Resumen
La página web de Hatt ya está publicada como entrada para ilustraciones, novelas y creación de avatares y gimmicks para VRChat.
Acecore produce sitios personales, portafolios y sitios de negocio adaptados a cada objetivo. Si quieres consultar desde organización de contenido hasta CMS, búsqueda, SEO y operación posterior, contáctanos desde Producción y operación web o Contacto.
Flujos organizados durante la producción
Organización
Clasificamos la actividad en ilustración, novelas y modelado.
CMS
Hicimos que el blog y la información de obras se puedan actualizar con Sveltia CMS.
Búsqueda
Incorporamos Pagefind para encontrar artículos y obras con facilidad.
Enlaces externos
Ordenamos los accesos a YouTube, X y BOOTH.
¿Qué se puede ver en la página web de Hatt?
¿Con qué tecnología está construido el sitio?
¿Acecore también puede asesorar sobre sitios personales o portafolios?
Comentarios
Gui
CEO de Acecore. Lidera sistemas de negocio, web, bases de datos e infraestructura, calidad y adopción de IA desde la definición de problemas de negocio hasta el diseño, la puesta en marcha y la mejora posterior. Se apoya en capacidad práctica con C#/.NET y también cubre PHP/JavaScript, SQL Server/PostgreSQL/MySQL y Linux/Windows Server, diseñando requisitos, selección tecnológica, estándares de calidad y operaciones de desarrollo basadas en GitHub como un flujo coherente. Incorpora la IA generativa en procesos de desarrollo, verificación y organización de información, como una base práctica para que equipos pequeños entreguen más rápido y con mayor fiabilidad.
¿Quiere saber más sobre nuestros servicios?
Ofrecemos soporte integral en desarrollo de sistemas, diseño web, diseño gráfico y educación IT.
Artículos relacionados
Lanzamos el portal de Aceserver 7 de junio de 2026, 10:00
Diseñar un sitio Astro + Cloudflare que crece función por función 7 de junio de 2026, 19:00
Cómo añadir comentarios a un blog Astro usando solo Cloudflare 7 de junio de 2026, 18:00