Un amigo, un taller, y ningún sitio web.
El proyecto nace de la necesidad de un amigo con un taller de tapicería, "Tapicería JG", que no tenía ninguna presencia web desde la que mostrarse a clientes potenciales. No era falta de trabajo — hoy en día tener web es lo mínimo para posicionarse y captar más clientes de forma efectiva.
Maqueté la idea completa de lo que podría ser su web, ampliando el contenido respecto al mínimo real del cliente para tener una estructura visual final más completa. Partí de muy pocos recursos gráficos por parte del cliente, así que tuve que rehacer el branding casi desde cero contando solo con su logo original.
Una paleta monocromática nacida de un error.
La primera propuesta de color usaba tonos marrones cálidos para los CTAs. Al auditar la accesibilidad con WAVE, ese contraste no superaba WCAG AA. La solución fue pasar a una paleta monocromática, jugando con los grises para mantener armonía visual sin perder legibilidad.
El fondo con textura de lino fue una decisión deliberada: es el material real con el que se trabaja en el taller, así que la web "se siente" del oficio desde el primer scroll.
Del papel a un sitio en producción.
Empecé en papel: un boceto a mano de la estructura de la página que pasé a un wireframe digital de página completa antes de montar nada en Elementor. Como el cliente solo tenía su logo, fui construyendo la identidad sobre mockups reales y cogí referencias concretas para el comportamiento del scroll.
Tres referencias, tres decisiones
Stack. WordPress y Elementor; servicios, trabajos y testimonios como Custom Post Types con ACF; Yoast SEO y LiteSpeed Cache; One Tap para accesibilidad; Click to Chat, Easy WP SMTP y GDPR/CCPA Cookie Consent.
La web en móvil
Lo que no sale en el portfolio, pero pasó de verdad.
Los CTAs en marrón cálido no superaban WCAG AA según WAVE. Solución: paleta monocromática (ver sección 02).
El icono por defecto de la plantilla no ejecutaba la acción. Solución: icono "X" propio con etiqueta dinámica redirigiendo a la acción de cierre real.
Tras varias rondas de optimización, el cuello de botella eran los scripts de One Tap y Click to Chat, no el resto del sitio.
Al cambiar el dominio desde WordPress, la etiqueta quedó bloqueada y la web entraba en bucle de redirección. Solución: edité wp-config.php desde el File Manager, forzando el navegador a abrir desde el direccionamiento correcto.
Un buen uso del copiloto, no un atajo.
Usé IA en dos frentes muy concretos. El primero, redacción: textos de servicios, trabajos y testimonios, adaptados al tono cercano y artesanal de la marca. El segundo, código: fragmentos de CSS para animaciones concretas — el scroll-track de la sección de historia que ilumina el texto al bajar, el contador animado de la sección de cifras, y la columna fija en la página de servicios que se desplaza junto al scroll. También fue clave para depurar el problema del cambio de dominio perdido.
En ningún caso sustituyó el criterio de diseño: cada pieza generada se revisó, se ajustó a mano y se validó contra el sistema de diseño antes de entrar en producción.
Lo que más aprendí no fue técnico: fue a contrastar los pocos recursos gráficos del cliente contra lo que la marca necesitaba comunicar, y a priorizar accesibilidad real por encima de una paleta "bonita" cuando entraban en conflicto.