Una página web puede tener toda la información correcta y, aun así, hacer que el visitante trabaje demasiado para encontrar lo que necesita. Ese fue el punto de partida del rediseño de CallZent, una empresa de servicios de call center y BPO con operaciones en México y equipos bilingües para clientes que necesitan atención en inglés y español.

Desde Creativa Norte Marketing trabajamos en una nueva experiencia para que su propuesta fuera más fácil de reconocer: qué hace CallZent, cómo funciona su modelo de servicio y cuál es el siguiente paso para una empresa interesada. El trabajo abarcó la página principal y distintos bloques de páginas de servicios e industrias, con una dirección visual común.

El reto: explicar un servicio amplio sin perder claridad

CallZent ofrece soluciones para necesidades distintas: atención al cliente, soporte técnico, reservaciones, investigación telefónica y procesos de back office, entre otras. Cada servicio tiene su propio contexto, pero todos deben sentirse parte de la misma marca.

El reto de diseño consistía en ordenar esa información para que un visitante pudiera identificar rápidamente tres cosas: el tipo de apoyo disponible, la forma en que el equipo se adapta a su operación y la manera de iniciar una conversación. Para lograrlo, la arquitectura visual debía ayudar tanto a quien llega por primera vez como a quien ya busca un servicio específico.

Una primera impresión centrada en México y en las personas

El nuevo hero de la página principal pone al frente la propuesta de CallZent: servicios bilingües de call center y BPO en México . La fotografía ocupa el espacio completo y muestra a las personas detrás del servicio. Ajustamos la composición en pantallas grandes y móviles para que los rostros siguieran visibles y las tarjetas informativas no compitieran con ellos.

La tipografía también cumple una función concreta. En el sitio de CallZent, los titulares en Outfit crean una jerarquía reconocible y Inter mantiene legibles los textos, las tarjetas y los botones. Usamos una base clara y acentos en morado, rojo, amarillo y verde para guiar la lectura sin llenar cada sección de color.

Del bloque visual a una ruta de navegación

Una tarjeta útil debe hacer algo más que verse bien. En el rediseño, las tarjetas resumen servicios, beneficios o capacidades y ayudan a decidir dónde profundizar. Por eso cuidamos el tamaño del texto, la separación entre elementos y los estados de interacción: cuando alguien pasa el cursor sobre una tarjeta, recibe una señal visual clara sin perder el contenido de vista.

Los botones de llamada a la acción siguen el mismo criterio. Revisamos su contraste, el tamaño de letra, las flechas animadas y los enlaces para que acciones como solicitar una propuesta o explorar un servicio resulten fáciles de identificar. En móvil, la composición conserva la lectura y el acceso a esas acciones.

Este sistema se extiende a páginas de industrias y servicios. Así, una empresa interesada en soporte de salud, servicios financieros, comercio electrónico, SaaS o soporte técnico puede encontrar contenido específico sin sentir que salió del universo visual de CallZent.

El efecto liquid glass, al servicio de la lectura

Una de las decisiones visuales fue incorporar superficies translúcidas en determinadas tarjetas y paneles. El efecto liquid glass aporta profundidad mediante transparencias, desenfoque y reflejos suaves. Lo usamos con cuidado, sobre todo cuando el contenido se superpone a fotografías o fondos de color.

En esos casos, el contraste sigue siendo la prioridad: los textos deben poder leerse en reposo y durante el hover. También ajustamos tamaños pequeños que podían pasar desapercibidos en monitores grandes o resultar incómodos en pantallas reducidas. La interacción aporta carácter cuando refuerza el mensaje, no cuando exige esfuerzo adicional para leerlo.

Diseñar también para la operación real

Una página de servicios BPO necesita comunicar más que una promesa visual. Debe explicar cómo puede integrarse un equipo a los procesos del cliente: canales de atención, herramientas aprobadas, documentación, escalaciones y cobertura. Por eso trabajamos bloques que traducen esos temas operativos en información más fácil de recorrer.

También cuidamos que las páginas conservaran llamadas a la acción pertinentes en distintos momentos de lectura. Un visitante puede estar listo para contactar desde el hero o necesitar primero entender los servicios, las industrias y el modelo de trabajo. La estructura contempla ambos recorridos.

Herramientas y proceso: del concepto visual al código

Para desarrollar el rediseño combinamos dirección creativa, producción visual y construcción web. Adobe Illustrator nos ayudó a trabajar elementos gráficos y detalles de identidad; Photoshop, a preparar y ajustar recursos visuales. Adobe Stock y Adobe Firefly formaron parte de la búsqueda y creación de material visual, mientras que Magnific se incorporó al flujo de mejora de imágenes. También usamos Hey Tony como parte del conjunto de herramientas creativas del proyecto.

En la implementación, WordPress y Elementor sirvieron como entorno para componer y ajustar las páginas. ChatGPT se integró como colaborador de programación en HTML y CSS: ayudó a desarrollar bloques, ajustar diseños responsivos, afinar hovers y animaciones, y revisar detalles de tipografía y contraste. Cada propuesta se evaluó dentro del diseño general y se corrigió según cómo funcionaba en pantalla.

La combinación de estas herramientas nos permitió pasar de una intención visual a secciones editables y consistentes. La dirección creativa —qué mostrar, qué priorizar y cómo debía sentirse la marca— guió las decisiones en cada etapa.

Lo que nos deja este proyecto

El rediseño de CallZent muestra cómo una dirección visual consistente puede ayudar a explicar una oferta compleja. Fotografías con presencia, tipografía legible, tarjetas con propósito y botones claros construyen una experiencia en la que cada sección responde a una pregunta del visitante.

El resultado del trabajo es una nueva propuesta de página y un conjunto de bloques diseñados para presentar a CallZent con mayor claridad. Su efecto en conversiones, posicionamiento o negocio deberá evaluarse con datos una vez publicados los cambios; el diseño establece una base para medir y seguir mejorando.

En Creativa Norte Marketing diseñamos páginas para marcas que necesitan comunicar mejor lo que hacen y facilitar el camino entre la primera visita y una conversación comercial. Si tu sitio ya no representa el nivel de tu empresa, hablemos de cómo renovarlo.