Leona’s Workshop: una plataforma WordPress inmersiva para una artista independiente
Leona’s Workshop reúne el trabajo de una artista especializada en garage kits y figuras de resina inspiradas en anime, además de videos, tutoriales, recursos para otras personas creadoras y recomendaciones de herramientas y materiales.
El sitio existente ya contenía años de galerías, páginas editoriales, medios y conocimiento especializado. El reto no consistía únicamente en cambiar colores o reorganizar una portada. Era necesario convertir ese patrimonio digital en una experiencia coherente, fácil de administrar y capaz de representar una identidad artística muy particular sin obligar a reconstruir todo desde cero.
VesperaMX diseñó y desarrolló un tema WordPress personalizado alrededor del concepto visual The Museum of Resin: una galería digital oscura, editorial e inmersiva donde cada pieza recibe el protagonismo de una exhibición. La solución integra portafolio, videos, recursos, recomendaciones y contacto dentro de una arquitectura preparada para crecer de forma incremental.
Estado del proyecto: el tema personalizado y las experiencias principales ya funcionan en el entorno de desarrollo. La optimización final, la migración de infraestructura y la integración de comercio headless continúan en curso; por ello, este caso no presenta métricas finales de lanzamiento o adopción.
Resumen del caso
| Área | Descripción |
|---|---|
| Industria | Artes visuales, economía de creadores y educación artística |
| Plataforma | Sitio público y sistema editorial en WordPress |
| Participación | Descubrimiento, UI/UX, arquitectura de contenido, desarrollo, integraciones y QA |
| Estado | Proyecto en curso; experiencias principales completadas en desarrollo |
| Restricción principal | Modernizar sin perder contenido histórico ni depender de integraciones frágiles |
El reto
La plataforma debía resolver varias necesidades que normalmente terminan separadas entre múltiples sitios o servicios:
- Presentar un portafolio fotográfico con una identidad visual propia.
- Mantener galerías históricas y contenido creado durante años.
- Incorporar videos y tutoriales sin duplicar trabajo editorial.
- Organizar recursos y recomendaciones de compra de manera clara.
- Dar a la artista control sobre textos, imágenes, enlaces, categorías y redes sociales.
- Filtrar solicitudes de contacto que no correspondieran con los servicios disponibles.
- Preparar una base para futuras integraciones de mercancía y comercio.
- Mejorar navegación, accesibilidad y mantenimiento sin romper páginas heredadas.
El sitio anterior utilizaba distintas plantillas, plugins y estructuras acumuladas con el tiempo. Una reconstrucción indiscriminada habría puesto en riesgo contenido útil y páginas que todavía dependían de componentes heredados. Al mismo tiempo, mantener el sistema sin una nueva arquitectura habría perpetuado inconsistencias y dependencia técnica.
Nuestro enfoque
Convertir la identidad artística en un sistema de diseño
La dirección visual se desarrolló como una experiencia de museo contemporáneo: fondos oscuros, imágenes de gran formato, tipografía editorial, numeración de exhibiciones, contraste controlado y transiciones discretas.
El objetivo no fue decorar WordPress, sino construir un lenguaje reutilizable para la portada, archivos, páginas individuales, tutoriales, contacto y nuevas colecciones. Los efectos de movimiento se implementaron con degradación progresiva y respeto por prefers-reduced-motion, de modo que la presentación no dependa de animaciones para funcionar.
Modernizar de forma incremental
El mockup inicial se convirtió en un tema WordPress funcional y versionado. En lugar de desechar todo el contenido existente, se reutilizaron los tipos de contenido, medios y páginas que seguían aportando valor.
Las dependencias heredadas se revisaron antes de limpiar plugins o reemplazar plantillas. Cuando una página histórica todavía requería una herramienta anterior, se preservó su compatibilidad mientras las nuevas áreas se construyeron con una arquitectura más clara. Esto redujo el riesgo de una migración destructiva y permitió validar cada sección dentro de un entorno de desarrollo.
Poner el control editorial en el dashboard
La portada, las galerías destacadas, los bloques de video, la sección About, los llamados a la acción, las redes sociales, el contenido de contacto y la guía de compras se modelaron con Advanced Custom Fields.
Los campos y tipos de contenido se registraron desde el tema para mantenerlos bajo control de versiones. También se agregaron ajustes globales para elementos compartidos, evitando que datos como las redes sociales dependieran de una página específica.
El resultado es una experiencia visual personalizada que sigue siendo administrable desde WordPress: la artista puede actualizar contenido sin editar plantillas ni solicitar un despliegue por cada cambio.
Automatizar contenido sin crear una dependencia frágil
Los videos recientes y playlists se integraron mediante feeds públicos de YouTube con caché y contenido de respaldo. Esta decisión evita requerir una clave de API para una necesidad editorial que puede resolverse de forma más simple y estable.
Para la guía de compras, el análisis técnico mostró que una automatización basada en scraping del escaparate de afiliados sería frágil. En su lugar, tiendas, categorías, productos, imágenes y enlaces se convirtieron en contenido administrable con ACF. Así se conserva el control editorial, se evitan procesos que consuman créditos externos y se reduce el riesgo de que un cambio en un tercero rompa la página.
Diseñar flujos propios para la operación de la creadora
El formulario de contacto se desarrolló como una función propia, no como una configuración genérica. Incluye razones de contacto administrables, carga de imágenes, validación, registro de solicitudes dentro de WordPress y protección anti-bots sin depender de un CAPTCHA externo.
Cuando una persona selecciona solicitudes de comisiones, la interfaz muestra el aviso definido por la creadora y deshabilita el envío. La misma regla se valida en el servidor para que no dependa únicamente de JavaScript.
Hacer que un sitio visual siga siendo fácil de recorrer
Las galerías se organizaron por año y se enriquecieron con carga diferida, indicadores de video, tipo de pieza y estados de contenido sensible. Las imágenes de cada colección pueden abrirse en un lightbox con navegación limitada a su propio grupo, evitando mezclar piezas distintas.
La navegación responsiva incorpora menú de pantalla completa y una paleta Ctrl+K / ⌘K con acceso al menú y búsqueda de contenido mediante la WordPress REST API. Los recursos de tutoriales también cuentan con filtrado instantáneo para facilitar el acceso a una biblioteca creciente.
Qué se entregó hasta esta etapa
- Tema WordPress a medida construido a partir de una propuesta visual original.
- Portada inmersiva con hero, colección, videos, áreas editoriales, presentación de la artista y contacto.
- Administración de la portada y secciones clave mediante ACF.
- Archivo y páginas individuales para galerías, con imágenes reales, lazy loading y PhotoSwipe.
- Controles editoriales para tipo de obra, video y contenido sensible.
- Bloques de videos y playlists alimentados automáticamente mediante RSS con caché y fallback.
- Página de tutoriales con videos, enlaces de recursos y búsqueda en vivo.
- Guía de compras administrable con tiendas, categorías, productos, imágenes y enlaces afiliados.
- Formulario de contacto personalizado con reglas condicionales, adjuntos, anti-bot y registro de envíos.
- Navegación responsiva, menú hamburguesa, accesibilidad de teclado y paleta de comandos.
- Ajustes globales para redes sociales y elementos compartidos del sitio.
- Protección de interacción aplicada únicamente a las áreas visuales definidas, sin bloquear globalmente el contenido textual.
- Flujo de desarrollo con repositorio privado, ramas por función, revisiones y validación en ambiente de desarrollo.
Tecnologías utilizadas
| Área | Tecnologías y prácticas |
|---|---|
| CMS y aplicación | WordPress, PHP, Custom Post Types |
| Modelado de contenido | ACF Pro, opciones globales, repeaters y WordPress Media Library |
| Frontend | HTML5, SASS/SCSS, JavaScript con ES Modules |
| Navegación y búsqueda | WordPress REST API, búsqueda en vivo y controles de teclado |
| Contenido externo | RSS/Atom de YouTube, caché y fallbacks locales |
| Experiencia de medios | PhotoSwipe, lazy loading, imágenes responsivas y estados editoriales |
| Calidad y entrega | Git, GitHub, ramas por función, pull requests y validación en desarrollo |
Valor para el negocio
Como el proyecto continúa en curso, no se presentan cifras de conversión, tráfico o ventas atribuidas al rediseño. El valor ya visible en la solución se concentra en seis áreas:
- Identidad diferenciada: el sitio deja de sentirse como una plantilla genérica y convierte el portafolio en una experiencia vinculada con la obra.
- Autonomía editorial: la creadora puede administrar imágenes, textos, videos, recursos, productos y enlaces desde WordPress.
- Consolidación de audiencia: portafolio, aprendizaje, recomendaciones y contacto viven dentro de una misma experiencia.
- Menor dependencia externa: las integraciones utilizan caché, respaldo y contenido administrable en lugar de procesos frágiles o costosos.
- Protección de la inversión existente: se conservan galerías, medios y páginas históricas que todavía aportan valor.
- Base mantenible: el tema, los campos y el código están organizados para incorporar nuevas colecciones, integraciones y mejoras sin rehacer la plataforma.
Estado actual y siguientes etapas
La experiencia principal se encuentra implementada y validada en desarrollo. Las siguientes etapas contemplan optimización de imágenes y rendimiento, preparación SEO, revisión final de plugins, migración de infraestructura y la futura integración headless del catálogo de mercancía.
Estas actividades se mantienen separadas del alcance ya terminado para comunicar con claridad qué funciona hoy y qué continúa en evolución.
Por qué este caso importa
Los sitios de artistas y creadores suelen crecer de manera orgánica: primero una galería, después tutoriales, videos, enlaces, una tienda y distintas formas de contacto. Con el tiempo, esa evolución puede fragmentar la experiencia y dificultar su mantenimiento.
Este proyecto demuestra que WordPress puede convertirse en una plataforma editorial y visual altamente personalizada sin sacrificar administración, compatibilidad ni control del contenido. La clave no es instalar más plugins, sino modelar la información, preservar lo que funciona y construir únicamente la lógica que hace diferente al proyecto.
¿Tu sitio creativo ya no representa la calidad de tu trabajo?
VesperaMX puede ayudarte a transformar un WordPress existente en una experiencia personalizada, administrable y preparada para integrar portafolio, contenido, comunidad y comercio.