UOC · De catálogo complejo a experiencia de decisión

La Universitat Oberta de Catalunya (UOC) es una universidad online con una oferta académica extensa y diversa. Durante mi etapa en Fail Fast, trabajé como UX Designer en el rediseño de su Oferta Formativa, replanteando la forma de organizar, explorar y evaluar la oferta en la web: desde el primer contacto con el catálogo hasta la solicitud de información o la matrícula.

Rediseñar la Oferta Formativa suponía dar coherencia a un ecosistema extenso de titulaciones, contenidos y puntos de entrada. El desafío era atender tanto a quienes querían explorar posibilidades como a quienes llegaban con un objetivo concreto, sin perder claridad en ningún punto del recorrido.

• El menú exponía muchas opciones a la vez y resultaba difícil de escanear.
• La nomenclatura de algunas categorías no siempre coincidía con el modelo mental de los usuarios.
• Durante la auditoría de navegación, identifiqué que un mismo objetivo — encontrar un programa — podía seguir hasta cinco lógicas distintas según el tipo de oferta.
• Las páginas de listado, la búsqueda y las fichas de programa necesitaban hacer visible la información decisiva. Estas últimas concentraban mucho contenido y requerían una estructura más navegable.
• Las personas que comparaban alternativas no contaban con una herramienta específica para hacerlo.

El objetivo fue construir una experiencia coherente desde el primer contacto con el catálogo hasta la solicitud de información o la matrícula.

El equipo de research había trabajado previamente con estudiantes actuales, personas candidatas y stakeholders. Recibí los hallazgos a través de presentaciones, documentos, boards de Miro y hojas de cálculo, y los traduje en decisiones de producto.

Los resultados mostraban dos necesidades complementarias:

• Claridad para orientarse: la diferencia entre navegar por titulación y por área no siempre resultaba evidente; algunas etiquetas y agrupaciones generaban dudas.
• Información para decidir: precio, plan de estudios, calendario, requisitos de acceso, créditos y carga lectiva debían aparecer con una jerarquía clara. Los testimonios adquirían relevancia cerca del momento de decisión.

Convertí estos hallazgos en prioridades de contenido y principios de experiencia.

La auditoría del menú reveló dos problemas conectados: muchas opciones visibles al mismo tiempo y hasta cinco lógicas distintas para llegar a un programa según su tipología.

A partir de la auditoría y los insights, propuse un mega menú de hasta tres niveles para organizar la exploración sin ocultar la diversidad de la oferta. La estructura debía servir tanto a quien quería descubrir opciones por tipo de programa o área de estudio como a quien llegaba buscando una titulación concreta.

En lugar de imponer la misma profundidad a todos los recorridos, definí una regla común y variantes explícitas: primer nivel para los tipos de oferta, segundo nivel para áreas cuando aportaban contexto y un tercer nivel para llegar a programas o listados relevantes. Las rutas directas se mantenían cuando una capa adicional no aportaba valor.

Los casos de menú de dos y tres niveles permitieron comprobar que el sistema respondía a las variaciones reales del catálogo sin perder previsibilidad.

Una navegación coherente era solo el primer paso. La experiencia también necesitaba ayudar a reducir un catálogo amplio a opciones manejables, sin obligar a las personas a empezar a filtrar antes de entender qué estaban explorando.

Los insights de usuarios mostraban que, en páginas de listado muy extensas, era fácil perder el foco. Para responder a esto, la exploración combinó dos capas:

• El mega menú conducía a listados ya prefiltrados por tipo de programa o área de estudio, reduciendo el punto de partida.
  
• Cuando el listado necesitaba mantener una oferta amplia, incluía búsqueda y filtros para organizarla y acotarla sin perder el contexto.
  

La página de entrada a cada área resolvía además una pregunta prioritaria: entregar información relevante sobre el modelo de estudio de la UOC desde una primera lectura. El acceso a solicitud de información se integró como apoyo durante la exploración.

Con esta estructura, las personas podían explorar por tipo de programa o área de estudio, empezar desde un conjunto de resultados relevante, buscar por curso, área o titulación combinando filtros, y pasar de un listado a la ficha de un programa con un camino claro.

Cuando varias opciones podían encajar, el comparador permitía reunir alternativas relevantes y contrastarlas antes de pasar a la solicitud de información o a la matrícula. Se incorporó dentro de la experiencia de listado, en el momento en que la persona todavía exploraba y necesitaba decidir entre programas, evitando que tuviera que abrir varias fichas y recordar sus diferencias.

El objetivo fue facilitar la exploración de programas con una vista más rápida y una búsqueda más simple, tanto para quienes querían descubrir opciones como para quienes llegaban con una necesidad concreta.

La ficha de programa concentraba una cantidad extensa de información académica y era uno de los puntos decisivos del recorrido. El reto era hacerla más clara, escaneable y navegable. Además, debía alinear las prioridades de contenido identificadas para estudiantes y stakeholders.

Principales problemas detectados:

• El modelo de estudio online y asíncrono no se entendía con suficiente claridad. Era una duda recurrente en las entrevistas y debía comunicarse desde la presentación de cada titulación.
• La información relevante se dispersaba a lo largo de una página muy extensa. Datos como precio, requisitos, plan de estudios o modalidad podían requerir demasiado esfuerzo para encontrarse.
• El menú existente recargaba la ficha en cada cambio de sección. Esto interrumpía la lectura, añadía tiempos de espera y dificultaba localizar contenido específico.
• La priorización de contenidos debía conciliar dos perspectivas. Las necesidades de estudiantes y stakeholders se recogían en rankings diferentes, que no siempre coincidían.
  

Decisiones de diseño:

1. Construir una jerarquía a partir de una matriz de priorización. Crucé los rankings de estudiantes y stakeholders con los hallazgos de research y los patrones revisados en el benchmark para ordenar los contenidos.

   

2. Hacer explícito el modelo de estudio desde la presentación. La introducción de la titulación debía situar desde el inicio el carácter online y asíncrono de la experiencia.

3. Agrupar la información en tres capas: resumen para decidir (título, descripción, precio, créditos, fechas, modalidad, plazas disponibles y acciones de información o matrícula), navegación local por temas (presentación, plan de estudios, matriculación, salidas profesionales, calidad y experiencias) y contenido progresivo (detalle académico, económico y de experiencia según las preguntas que aparecen durante la evaluación).

4. Sustituir los cambios de página por navegación con anclajes. El menú superior acompañaba la ficha y permitía saltar entre secciones sin recargarla, manteniendo el contexto y reduciendo los tiempos de espera.

   

La arquitectura agrupó la información académica, económica, de acceso y de experiencia en bloques progresivos, de modo que cada persona pudiera profundizar según sus dudas.

Tras validar la arquitectura, los patrones de navegación, las páginas de listado, la búsqueda, la ficha y el comparador, el equipo de UI aplicó el lenguaje visual. Mi trabajo continuó con revisiones UX para asegurar que las decisiones de jerarquía, contenido y navegación se mantuvieran en la interfaz final.

Nota de atribución: La investigación inicial fue responsabilidad del equipo de research y la aplicación visual correspondió al equipo de UI. Mi contribución se centró en la síntesis aplicada, arquitectura de información, navegación, priorización, páginas de listado, búsqueda, wireframes y revisión UX.

A fecha de esta revisión, la Oferta Formativa rediseñada continúa publicada y los patrones definidos siguen presentes en la web pública de la UOC.

• El catálogo se estructura por tipo de programa y área de estudio.
• Las páginas de listado ofrecen búsqueda y filtrado.
• Las fichas organizan información académica extensa en secciones navegables.
• La solicitud de información conserva una presencia clara.
• El comparador de programas se incorporó a la experiencia.

El resultado fue una transformación estructural llevada a producción, construida de forma colaborativa entre research, UX, UI, cliente y desarrollo.

Ver la Oferta Formativa actual (se abre en una pestaña nueva) · Ver estudios por área (se abre en una pestaña nueva)