Back to portfolio
UX/UI & CROCompu-Med Vocational Careers

Compu-Med Vocational Careers

Compu-Med requeria una experiencia mas clara para orientar admisiones, servicios y programas de formacion en salud hacia una audiencia hispana en Estados Unid…

Editorial hero mockup for Compu-Med Vocational Careers

Cliente / Producto

Compu-Med Vocational Careers

Industria

Healthcare Education / Admissions

Modelo

Institución de formación en salud orientada a admisiones

Rol

Diseño UX/UI · Desarrollo WordPress · Tracking en GA4 · Mapas de calor · Optimización CRO

Fecha

August 2024

Audiencias activas en el flujo

Futuros estudiantesAdmisionesComunidad hispana en EE.UU.

Lo esencial del caso

  • Diseño UX/UI, desarrollo funcional y optimización continua dentro del mismo delivery.
  • El sitio debia equilibrar multiples programas, campus, servicios estudiantiles y mensajes institucionales sin volverse…
  • Los futuros estudiantes pueden identificar más rápido el camino correcto, aumentando la probabilidad de inquiries de m…
  • La narrativa visual se alineó con la tipografía validada en el sitio live: Inter / Inter.
WordPressGA4HeatmapsFigmaCRO Iteration

El desafío

Qué necesitaba resolverse

El sitio debia equilibrar multiples programas, campus, servicios estudiantiles y mensajes institucionales sin volverse pesado ni confuso. La prioridad era reducir friccion en discovery y contacto, mejorar la confianza en el proceso de admision y asegurar que la experiencia mobile no diluyera la propuesta de valor.

El enfoque

Cómo se estructuró la respuesta

Redefini la arquitectura de informacion para priorizar programas, admisiones y servicios de apoyo al estudiante dentro de una narrativa de progreso profesional. Disene patrones visuales para bloques academicos, formularios y CTA de inscripcion, y desarrolle una capa WordPress flexible para contenido institucional y landings. Con GA4 y heatmaps fui iterando la jerarquia, los accesos rapidos y el rendimiento del sitio para mejorar la calidad del trafico y la capacidad de respuesta del funnel. La dirección visual se ancló a la tipografía live Inter / Inter.

Fase 01

Diagnóstico de fricción, claridad de valor y lectura de intención

El sitio debia equilibrar multiples programas, campus, servicios estudiantiles y mensajes institucionales sin volverse pesado ni confuso. La prioridad era reducir friccion en discovery y contacto, mejorar la co…

Auditoría heurística

01

El sitio debia equilibrar multiples programas, campus, servicios estudiantiles y mensajes institucionales sin volverse pesado ni confuso. La prioridad era reducir friccion en discovery y contacto, mejorar la confianza en el proceso de admision y asegurar que la experiencia mobile no diluyera la propuesta de valor.

Compu-Med requeria una experiencia mas clara para orientar admisiones, servicios y programas de formacion en salud hacia una audiencia hispana en Estados Unidos. Lidere el diseno UX/UI y el desarrollo integral de la plataforma, desde la capa funcional en WordP…

Sistema UX/UI: Se reorganizaron admisiones, servicios y páginas de programa alrededor de una narrativa de progreso más clara.

Se diseñaron bloques educativos con tono institucional sin volver la interfaz visualmente pesada.

Se mejoró el escaneo para audiencias multilingües y mobile-first que evalúan rutas de carrera.

Síntesis de oportunidades

02

La síntesis del caso combinó lectura de fricción, jerarquía editorial y priorización sobre señales reales de intención para mover la experiencia hacia una conversión más clara.

El encargo consistió en traducir una oferta compleja en una historia más legible, convincente y accionable para la audiencia correcta.

La tipografía de marca validada en el sitio live se incorporó al sistema editorial del caso: Inter / Inter

Vista desktop principal de Compu-Med Vocational Careers.
Captura desktop representativa usada para explicar el diagnóstico de la experiencia.
Fase 02

Sistema visual, arquitectura y continuidad de experiencia

Redefini la arquitectura de informacion para priorizar programas, admisiones y servicios de apoyo al estudiante dentro de una narrativa de progreso profesional. Disene patrones visuales para bloques academicos,…

Sistema visual y estructura

01

Redefini la arquitectura de informacion para priorizar programas, admisiones y servicios de apoyo al estudiante dentro de una narrativa de progreso profesional. Disene patrones visuales para bloques academicos, formularios y CTA de inscripcion, y desarrolle una capa WordPress flexible para contenido institucional y landings. Con GA4 y heatmaps fui iterando la jerarquia, los accesos rapidos y el rendimiento del sitio para mejorar la calidad del trafico y la capacidad de respuesta del funnel.

La dirección visual se trabajó para sostener una lectura editorial más clara, densa y coherente con el nivel del servicio, sin perder claridad funcional.

Sistema UX/UI: Se reorganizaron admisiones, servicios y páginas de programa alrededor de una narrativa de progreso más clara.

Se diseñaron bloques educativos con tono institucional sin volver la interfaz visualmente pesada.

Se mejoró el escaneo para audiencias multilingües y mobile-first que evalúan rutas de carrera.

La dupla tipográfica de marca se trasladó al board y al sistema del caso: Inter / Inter

Workflows y entregables

02

Entrega web: Se implementaron plantillas en WordPress para programas, puntos de contacto y actualizaciones institucionales.

Se soportó contenido académico dinámico y expansión futura entre campus u ofertas.

Se estabilizaron formularios mobile y módulos responsive ligados a intención de inquiry y admisiones.

La macroestructura editorial se mantuvo consistente con la skill ux-ui-design-pro para conectar apertura, sistema, ejecución, impacto y lectura responsive.

Board editorial de Compu-Med Vocational Careers.
Mockup editorial que resume el sistema visual del caso.
Fase 03

Implementación funcional, analítica y optimización continua

Diseño, desarrollo, instrumentación y mejora continua se ejecutaron como una sola capa de entrega. Marco de referencia aprobado: 45% de aumento en leads.

Implementación y refinamiento

01

Entrega web: Se implementaron plantillas en WordPress para programas, puntos de contacto y actualizaciones institucionales.

Se soportó contenido académico dinámico y expansión futura entre campus u ofertas.

Se estabilizaron formularios mobile y módulos responsive ligados a intención de inquiry y admisiones.

La implementación preservó reutilización, contenido dinámico y continuidad responsive para que el caso pueda seguir evolucionando sin romper la coherencia del sistema.

Medición y aprendizaje

02

CRO y analítica: Se trazaron CTAs de admisiones, interacciones con servicios y exploración profunda de programas en GA4.

Se usó análisis de comportamiento para simplificar secciones de alta fricción alrededor de admisiones y financiamiento.

Se ajustó el flujo de página para que el tráfico de inquiry llegue al siguiente paso correcto con menos duda.

Referencia aprobada: 45% de aumento en leads.

Referencia aprobada: 25% de aumento en accesibilidad con una referencia de 98/100 WCAG.

Vista mobile principal de Compu-Med Vocational Careers.
Captura mobile representativa para la implementación y optimización responsive.
Impacto

Lo que cambió después de rediseñar el flujo

Esta capa evita inflar cifras o forzar narrativa de performance donde no corresponde. El foco está en cambios observables de claridad, operación y experiencia.

Resultado sintetizado

Referencia comparable de la categoría: 45% de aumento en leads.

Referencias aprobadas

Marco cuantitativo validado desde la data estática del caso. Se muestra como referencia aprobada, no como promesa pública bajo NDA.

  • 45% de aumento en leads.
  • 25% de aumento en accesibilidad con una referencia de 98/100 WCAG.

Agilidad operativa

Los futuros estudiantes pueden identificar más rápido el camino correcto, aumentando la probabilidad de inquiries de mayor intención. Referencia comparable de la categoría: 45% de aumento en leads.

Estabilidad técnica

Módulos más claros para programas, admisiones y soporte reducen la incertidumbre en una decisión educativa de alto impacto.

Aprendizaje del equipo

Una jerarquía visual más fuerte ayuda a que el sitio se mantenga legible y accionable en tráfico mobile de admisiones. Referencia comparable de la categoría: 25% de mejora en accesibilidad. CRO y analítica: Se trazaron CTAs de admisiones, interacciones con servicios y exploración profunda de programas en GA4. Se usó análisis de comportamiento para simplificar secciones de alta fricción alrededor de admisiones y financiamiento. Se ajustó el flujo de página para que el tráfico de inquiry llegue al siguiente paso correcto con menos duda.

Algunos detalles operativos, capturas o nombres se condensan para proteger contexto sensible y mantener el foco en las decisiones de producto, experiencia y sistema.

Keep exploring

This case is one piece of the full system, not an island.

If you want to review another project or talk about product, UX, and front-end execution, here is the next best route.

UX/UI & CRO

Aquinas Network

El reto era agrupar biblioteca online, consultoria, compliance, content development, IT solutions y educational marketing bajo una sola promesa…

View next case