El contexto
Claudio García es el asesor oficial de posgrados de la Universidad Columbia del Paraguay. Su trabajo consiste en acompañar a profesionales que quieren cursar una maestría, doctorado, especialización o diplomado: los orienta en la elección del programa, los guía con la documentación, los ayuda a cumplir requisitos y los lleva hasta la inscripción.
Todo ese proceso arrancaba hasta entonces por un mensaje suelto de WhatsApp. Sin una página que consolidara su propuesta, cada consulta empezaba desde cero: Claudio tenía que explicar una y otra vez qué programas hay, cómo es el proceso, cuánto tiempo demora y por qué trabajar con él hace la diferencia.
El desafío
El objetivo era crear una landing que convierta visitantes en consultas por WhatsApp, con un solo gesto. Pero había capas adicionales:
- Comunicar autoridad académica. El visitante tiene que sentir que está hablando con el asesor oficial de una universidad, no con un intermediario más.
- Mostrar los cuatro tipos de programas (maestrías, doctorados, especializaciones, diplomados) sin abrumar. Cada uno con su público y su propia duda.
- Derribar objeciones concretas. ¿Tengo los papeles al día? ¿Cuánto cuesta? ¿Lo puedo hacer en paralelo con el trabajo? ¿Sirve para acreditar puntos? Todo eso había que anticiparlo.
- Performance sin concesiones. El tráfico principal iba a venir de celular, muchas veces con conexión débil. La landing tenía que cargar en menos de un segundo y funcionar impecable en Safari iOS.
- Cero backend. Sin servidores, sin formularios con DB, sin costos de mantenimiento. Cada lead debía aterrizar directo en WhatsApp con el contexto ya armado.
La solución
Diseñamos y desarrollamos una landing single-page construida sobre Astro 6 y Tailwind CSS 4, con TypeScript estricto en toda la base. Sin React, sin framework UI pesado, sin CMS: solo componentes .astro compilados a HTML estático que sirven desde edge.
La estructura sigue un recorrido de conversión clásico:
- Hero con la promesa clara, badge de “Asesor Oficial”, CTA primario a WhatsApp y métricas de confianza: +100 profesionales asesorados, 95% de tasa de aceptación, +8 años de experiencia.
- Programas con acordeón interactivo por cada tipo (maestrías, doctorados, especializaciones, diplomados), duración, áreas disponibles y CTA a cada uno.
- Sobre mí con la historia y credenciales de Claudio, para construir confianza persona a persona.
- Cómo funciona en cuatro pasos (consulta inicial, análisis de perfil, inscripción guiada, acompañamiento durante el programa).
- Testimonios de profesionales reales que completaron el proceso.
- FAQ con acordeón
<details>nativo que responde las dudas más frecuentes sin JavaScript extra. - Contacto con un formulario que no usa backend: arma una URL
wa.mecon nombre, programa de interés y mensaje, y abre WhatsApp con todo pre-escrito. El lead llega a Claudio con contexto, listo para responder.
El diseño sigue una paleta académica premium: verde Columbia #285f5d como color institucional, amarillo #f4e14b como acento para CTAs, tipografía Playfair Display en headings y Source Sans 3 en body. Sensación de institución seria, pero cercana. Patrones sutiles de fondo, gradientes controlados, animaciones de entrada por IntersectionObserver y wave separators entre secciones para que la página respire.
Pusimos especial cuidado en Safari. Múltiples blurs grandes y backdrop-filter apilados derriten la GPU de iPhone. Detectamos Safari en un script inline antes del primer paint y aplicamos clases safari-blur-off y safari-backdrop-off sobre los elementos decorativos, desactivando los efectos costosos solo en ese navegador sin tocar la experiencia en Chrome y Firefox. El resultado: animaciones fluidas hasta en iPhones viejos.
Resultado
La landing vive en un dominio propio y funciona como la puerta de entrada oficial para los posgrados que Claudio asesora. Cada consulta que llega por el formulario aterriza en WhatsApp con el programa de interés y el nombre ya cargados, lo que reduce fricción y acelera la respuesta.
Lighthouse entrega puntajes por encima de 95 en performance, accesibilidad, SEO y best practices, incluso desde mobile con throttling agresivo. Cero dependencias de backend significa cero mantenimiento mensual: la página vive en edge, se sirve estática y no tiene superficie de ataque.
Para Claudio, dejó de explicar por WhatsApp lo que su página ya comunica sola. Para los visitantes, una primera impresión profesional que refleja la seriedad del programa al que aplican.