Contexto
EDUC Solutions se presenta como una agencia de transformación digital en Estados Unidos, con ocho disciplinas bajo un mismo equipo, entre ellas sitios y portales, software a medida, plataformas LMS corporativas, contenido, marketing e IA. El sitio es bilingüe, en inglés y español.
El encargo era condensar esa oferta amplia y técnica en una narrativa fácil de recorrer, que transmitiera seniority ante compradores empresariales sin sonar a catálogo, y que terminara en consultas calificadas. Diseñé la experiencia UX/UI y desarrollé el sitio como una aplicación React de una sola página.
Participación de José
Definí la arquitectura de información y el orden de la home, diseñé el header bilingüe, la grilla de capacidades, el cierre de la home y el formulario de calificación, y los implementé. Instrumenté GA4 y revisé mapas de calor en Clarity. El copy y las fotos los aportó el cliente.
Diagnóstico
Ocho disciplinas compiten por la misma primera impresión
Era un sitio nuevo, sin una versión anterior que corregir, así que el riesgo estaba en el propio encargo: que una oferta tan ancha se leyera como un catálogo frío o como una promesa poco creíble. Mi lectura de la causa: ocho disciplinas con el mismo peso obligan al visitante a clasificarse antes de entender qué hace la empresa, y un comprador empresarial probablemente llega con un problema concreto, no con el nombre de un servicio.
Le cuesta al comprador, que compara proveedores y abandona si no ve pronto con quién hablar ni qué pasa después. Y le cuesta a EDUC Solutions, que necesita saber el tipo de proyecto, el presupuesto y el plazo antes de dedicarle una sesión a su equipo senior.
Decisiones
Una promesa para líderes y una sola acción de reserva
Un hero con varias acciones del mismo peso reparte la atención de alguien que todavía no sabe si la agencia le sirve.
El titular y el párrafo hablan a líderes que necesitan claridad y ejecución bajo un solo equipo, y el hero lleva un botón principal, "Reservar una sesion estrategica", que abre la página de contacto; "Ver casos de estudio" queda como secundario, con menos peso visual.
Valoré abrir con las ocho disciplinas en la primera pantalla; preferí una sola promesa porque, con ocho servicios a la vista, el visitante tendría que elegir uno antes de entender la propuesta. El coste: la home no dice qué servicios existen hasta el primer scroll.
Que quien ya tenía un proyecto encontrara la reserva sin buscarla, y que el resto siguiera hacia la grilla o hacia los casos.
Cuatro entradas, el idioma a la vista y un solo botón de color
El público es bilingüe, y un selector de idioma escondido en el pie obliga a empezar a leer en el idioma equivocado.
Un header fijo con cuatro entradas (Servicios, Portafolio, Recursos y Contacto), el selector EN/ES con su rótulo "Idioma" e "Iniciar proyecto" como único botón turquesa. En móvil, el panel repite entradas, idioma y botón, y añade "Ver casos". Tras el primer scroll, "Iniciar proyecto" flota abajo a la derecha.
Valoré depender solo del idioma del navegador, que el sitio también detecta y recuerda; preferí sumar un selector visible porque, en un público bilingüe, el idioma del navegador no siempre es el que el visitante prefiere leer. El coste: en móvil el header ocupa dos filas, 131 px de los 844 de la pantalla, y el botón flotante tapa parte del texto durante el scroll.
Que cada visitante leyera el sitio en su idioma desde la primera pantalla y tuviera la acción principal a un toque en cualquier punto de la página.
Ocho disciplinas en una grilla con jerarquía; en móvil, un carril
Ocho servicios del mismo tamaño se leen como una lista de precios, y en móvil ocho tarjetas apiladas alargan la home.
Una grilla de ocho tarjetas en la que dos ocupan más espacio, Experiencias Digitales y Plataformas Corporativas, y el resto se agrupa alrededor; cada tarjeta lleva etiqueta, título y una frase, y abre su página de servicio. En móvil, la misma grilla pasa a un carril horizontal con una tarjeta por vista y flechas.
Valoré ocho tarjetas iguales y, en móvil, una lista larga; preferí jerarquía y carril porque las dos líneas centrales tenían que leerse primero y la home móvil no debía alargarse. El coste: en desktop, la atención se sesga hacia dos disciplinas; en móvil, siete tarjetas quedan detrás de un gesto, sin indicador de posición.
Que el visitante reconociera de un vistazo las dos líneas centrales y pudiera abrir cualquier disciplina sin buscarla en el menú.
Tres salidas de distinto compromiso al cierre de la home
Al final de la home no todos están listos para una reunión, y un único botón de reserva pierde a quien solo quiere escribir.
Un cierre con tres botones escalonados: "Reservar una consulta de 45 minutos" como principal, "Completar formulario de calificacion" como secundario y "Escribir a nuestro equipo corporativo", que abre el correo, como tercero.
Valoré repetir el botón del hero; preferí escalonar por compromiso porque al final de la home conviven quien quiere una reunión y quien solo quiere escribir. El coste: tres botones compiten por la atención justo en el punto en que el visitante decide.
Que cada visitante eligiera la salida que se ajustaba a su momento, en vez de irse sin contactar.
Calificar por pasos antes de pedir los datos
Para preparar una sesión, el equipo necesita el tipo de proyecto, el presupuesto y el plazo, y un formulario largo en una sola pantalla frena al comprador.
Un formulario de cuatro pasos con una pregunta por paso: el dominio del proyecto, con seis opciones; el rango de presupuesto; el plazo; y al final nombre y email obligatorios, con empresa y mensaje opcionales. Al lado, el email y el teléfono de la empresa.
Valoré un formulario de una sola pantalla con todos los campos; preferí los pasos porque cada uno es una elección de un toque y los datos personales llegan al final, cuando ya hay compromiso. El coste: más clics antes de enviar.
Consultas que llegaran calificadas por tipo de proyecto, presupuesto y plazo, sin una llamada previa de descubrimiento.
Sistema
Quedó una home con una acción principal en el hero (Fig. 0), un header bilingüe con un solo botón, que en móvil se repite en el panel y en una pastilla flotante (Fig. 1), una grilla de ocho capacidades que en móvil pasa a carril (Fig. 2), un cierre con tres salidas (Fig. 3) y un formulario de calificación en cuatro pasos (Fig. 4). Cada tarjeta abre su página de servicio, y también diseñé y desarrollé las páginas de servicios, portafolio y recursos.
El alcance cerró en entrega e instrumentación, no en reporting de impacto, así que este caso no reporta cifras.
Hipótesis posterior: qué se podría probar
Propuesta de experimento del relato original. No es una intervención ejecutada ni un resultado obtenido.
Hoy los botones de reserva de la home y de los servicios llevan a la página de contacto, que avisa de que no hay agenda pública (Fig. 0 frente a Fig. 4). Probaría a alinear la promesa con el destino: que el botón diga lo que pasa y abra el paso 1 del formulario.
Si los botones que hoy dicen "Reservar" prometen lo que ocurre de verdad ("Cuéntanos tu proyecto") y abren directamente el paso 1 del formulario, más sesiones que hacen clic terminan el formulario, sin que bajen los clics en esos botones.
Formularios de calificación enviados por sesión que hace clic en un botón de reserva, medidos en GA4.
Clics en los botones de reserva por sesión que entra por la home: si caen, la promesa nueva atrae menos que "Reservar".
Los botones actuales con "Reservar", que llevan a la página de contacto. Reparto 50/50 hasta el tamaño de muestra calculado sobre la línea base; con tráfico B2B bajo, probablemente varias semanas.
