Insights / Artículos técnicos
Lanzamos la página web de Hatt
Lanzamos la página web de Hatt, un sitio personal que reúne ilustraciones, novelas y creación de avatares y gimmicks para VRChat. Está construido con Astro, Sveltia CMS y Pagefind, y diseñado para que Hatt pueda seguir publicando su actividad creativa.

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.
Contenido
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.
Páginas relacionadas
Preguntas frecuentes
¿Qué se puede ver en la página web de Hatt?
Reúne ilustraciones, novelas, creación de avatares y gimmicks para VRChat, perfil y enlaces a actividades externas.
¿Con qué tecnología está construido el sitio?
Es un sitio estático construido con Astro, TypeScript, UnoCSS, Sveltia CMS y Pagefind.
¿Acecore también puede asesorar sobre sitios personales o portafolios?
Sí. Podemos ayudar con organización de actividades, diseño, CMS, búsqueda, SEO y flujos de actualización después de la publicación.