Rediseñamos PYMEsign desde cero: por qué, cómo y qué viene
Hay proyectos que uno va postergando porque siempre aparece algo más urgente. El rediseño del propio sitio es, históricamente, el trabajo que el zapatero deja para el final. Bueno, llegó el final.
El sitio actual de PYMEsign lleva corriendo sobre Joomla desde 2016. Diez años en los que ayudamos a decenas de empresas a renovar su presencia digital mientras nuestro propio sitio seguía con el mismo diseño que el año en que salió Stranger Things. Es hora de practicar lo que predicamos.
Este artículo cuenta el proyecto por dentro: la decisión técnica, el enfoque de diseño, las funcionalidades que vienen y el ritmo con el que vamos a construirlo.
Por qué no fue un rediseño, sino una reconstrucción
La primera decisión fue no migrar: partir de cero con una stack completamente nueva.
El sitio en Joomla no tenía nada rescatable desde el punto de vista técnico. El código estaba acoplado al CMS, el diseño era difícil de mantener, y la arquitectura no permitía agregar las funcionalidades de IA que queremos ofrecer. Parcharlo habría costado más que empezar limpio.
La segunda decisión fue separar el frontend del backend. En la industria esto se llama headless CMS: WordPress sigue siendo el panel de gestión de contenidos, pero el sitio que ven los usuarios está construido sobre Next.js, un framework de React diseñado para rendimiento y SEO. WordPress como motor de contenidos, Next.js como cara visible. Cada uno hace lo que mejor sabe hacer.
El stack técnico, explicado sin vueltas
Para quienes viven de código: Next.js 14 con App Router, TypeScript, Tailwind CSS y shadcn/ui en el frontend. WordPress como CMS headless consumido vía REST API. Supabase (PostgreSQL) para datos transaccionales. Deploy en Vercel con CI/CD automático desde GitHub. Claude API de Anthropic para las funcionalidades de IA. n8n para automatización de pipelines.
Para quienes no: básicamente construimos el sitio con las mismas herramientas que usamos para proyectos de clientes de alto rendimiento. El resultado es un sitio que carga rápido, posiciona bien en Google, escala sin problemas y puede integrar funcionalidades de inteligencia artificial de forma nativa.
Algunos números concretos de lo que esto implica en la práctica:
- Velocidad: las páginas estáticas se pre-generan en el servidor. El usuario recibe HTML listo, no espera que el navegador ejecute JavaScript.
- SEO: control total sobre metadatos, Open Graph, schema markup y estrategia de renderizado por ruta.
- Escalabilidad: el CMS y el frontend son sistemas independientes. Actualizar uno no afecta al otro.
- IA nativa: la arquitectura permite integrar streaming de respuestas de Claude sin trucos ni workarounds.
El diseño: Minimal Black
El concepto visual del nuevo sitio tiene nombre propio: Minimal Black.
Fondo negro puro (#0f0f0f), tipografía Times New Roman como elemento dominante, máximo contraste, mínimo ruido visual. Dos colores de acento usados con parsimonia: índigo para todo lo relacionado con IA, esmeralda para lo nuevo y lo exitoso.
La idea no es «sitio oscuro porque está de moda». Es coherencia con lo que somos: una agencia que trabaja con precisión, que no decora por decorar, y cuyo logo —un monograma P+Y+g en Times New Roman Bold— ya habla ese mismo idioma. El sitio extiende el lenguaje del logo a cada pantalla.
Lo que se eliminó deliberadamente: carruseles, gradientes decorativos innecesarios, secciones de «clientes en un slider infinito», fondos con texturas complejas, botones de colores múltiples. Lo que queda tiene que tener razón de estar.
Qué va a ofrecer el nuevo sitio
Una presentación honesta de los servicios
Cada servicio tiene su propia página con descripción detallada, proceso de trabajo, tecnologías involucradas y precio de referencia cuando corresponde. Sin eufemismos ni texto genérico de agencia.
Los servicios nuevos o que involucran IA van marcados explícitamente. El visitante sabe exactamente qué está mirando.
Portfolio con proyectos propios y de clientes
Una distinción que vale la pena hacer: en el portfolio van a convivir los proyectos de clientes con los proyectos propios de la agencia —herramientas, automatizaciones y plataformas que construimos y operamos nosotros mismos. Los proyectos propios tienen su propio badge y su propia sección de detalle técnico, porque demuestran algo diferente: que no solo entregamos proyectos, sino que los sostenemos.
Diagnóstico gratuito
Un formulario multi-step que hace las preguntas correctas sobre el sitio actual de la empresa, el objetivo del rediseño, el presupuesto y el timing. No es un formulario de contacto disfrazado. Al final, genera un análisis inicial y habilita una reunión con contexto real.
Express IA (post-lanzamiento)
La funcionalidad más ambiciosa del sitio: el usuario ingresa el nombre de su empresa, el rubro y una descripción breve. En minutos, un pipeline automatizado genera una demo funcional de landing page con textos, estructura y meta SEO pensados para ese negocio específico.
El flujo completo corre sobre n8n como orquestador, Claude API para la generación de contenido, WordPress REST API para crear la página y Resend para enviar el link por email. El usuario ve el progreso en tiempo real mientras el pipeline trabaja.
Chatbot con Claude (post-lanzamiento)
Un asistente integrado en el Hero del sitio, entrenado con el contexto de PYMEsign: servicios, proceso, preguntas frecuentes, criterios de trabajo. Responde en español rioplatense, en tres párrafos o menos, y deriva a diagnóstico cuando la consulta lo amerita. No es un bot de FAQ con respuestas hardcodeadas: entiende preguntas abiertas y responde con criterio.
El enfoque de desarrollo: lanzar lo que convierte, agregar lo que impresiona
Una decisión de producto que vale la pena explicar: el chatbot y el Express IA no van en el lanzamiento inicial.
No porque no estén listos —están diseñados y el pipeline está documentado en detalle. Sino porque el lanzamiento de un sitio nuevo es un momento de validación, no de demostración. Primero confirmamos que el sitio convierte, que el diagnóstico trae leads calificados, que el portfolio comunica lo que tiene que comunicar. Sobre esa base sólida, activamos las funcionalidades diferenciadoras.
El calendario de fases:
- Setup — Infraestructura, repositorio, deploy, variables de entorno, Supabase.
- MVP — Home, Servicios, Portfolio, Blog, Nosotros, Diagnóstico, SEO base.
- Chatbot IA — Claude streaming integrado en el Hero.
- Express IA — Pipeline completo n8n + demo automática + email.
- Express con pago — MercadoPago Checkout Pro y panel de administración. (Opcional, evaluamos según demanda)
Por qué lo contamos antes de que esté listo
Porque este sitio es, en sí mismo, un caso de uso de lo que ofrecemos.
El cliente que nos contacta para un rediseño web va a poder ver exactamente qué decisiones tomamos para nuestro propio proyecto y por qué. El stack que usamos para PYMEsign es el mismo que proponemos para proyectos headless de clientes. Las automatizaciones de IA que van a vivir en el sitio son las mismas que construimos para otros negocios.
No hay mejor forma de demostrar una capacidad que usarla en uno mismo y mostrarlo con transparencia.
El sitio nuevo llega en las próximas semanas. Mientras tanto, seguimos construyendo.
¿Tenés un proyecto en mente o querés saber más sobre alguna de las tecnologías que mencionamos? Escribinos a info@pymesign.com.
¿Te resultó útil?
Hablemos sobre cómo aplicar esto en tu negocio.