Case Study· Homepage + Portal · UX Redesign · 2026

Del caos informativo a un portal que
los estudiantes realmente entienden

Rediseño del homepage y portal de la Universidad de Pamplona. Dos usuarios primarios, un sistema claro. Menos ruido, más claridad.

🎓Portal Universitario Público
🗺️IA · UX Research · UI Design
👥Estudiantes activos como usuarios primarios
📉~70% menos elementos por pantalla
Antes
🛡 GOV.CO  |  ✉   🔍   🎓   📄   🔑   💰   D   ⊕
UNIVERSIDAD DE PAMPLONA
Aspirantes
Universidad
Rectoría
Organismos
Acreditación
Dependencias
SIG
Concursos
Adm. EmpresasArquitectura BacteriologíaBiología Com. SocialDerecho EconomíaEnfermería FilosofíaFisioterapia Ing. AlimentosIng. Sistemas Ing. EléctricaIng. Electrónica + 10 más…
Atención al ciudadanoTransparencia ParticipaLínea atención ☎

ELECCIÓN DEL REPRESENTANTE DE LOS DOCENTES AL
CONSEJO SUPERIOR 2026–2028

Después
Unipamplona
Mi academia Trámites Servicios Contacto
📊Notas
📅Horario
📋Trámites
📚Biblioteca
📆Calendario
💬Soporte
📌 Próximas fechas
Mar 24 Cierre inscripción de materias
Abr 02 Inicio semana de receso
Abr 14 Publicación de notas finales

El portal existe. Pero nadie sabe bien cómo usarlo.

La Universidad de Pamplona tiene un portal estudiantil en línea — pero el acceso a la información está fragmentado en múltiples subsitios, menús profundos y páginas sin jerarquía visual clara. El estudiante promedio necesita realizar tareas cotidianas: ver notas, consultar horarios, hacer trámites, revisar el calendario académico. Ninguna de estas tareas es obvia desde la página principal.

El resultado es un ciclo conocido: el estudiante entra, no encuentra lo que busca, regresa, entra de nuevo, pregunta a un compañero o va directamente a la secretaría. El portal existe, pero no reduce fricción — la genera.

El problema

Un portal con años de capas de contenido acumulado sin una estrategia de arquitectura de información clara. Cada dependencia agrega sus propios enlaces, banners y secciones sin sistema.

🏛
El hero está secuestrado por comunicados institucionales

El espacio más valioso de la página rota entre campañas internas. No hay orientación al usuario nuevo — solo noticias para quien ya conoce la institución.

🗂️
Doble dropdown desde el primer segundo

La navegación superior despliega 24 programas académicos antes de que el usuario sepa dónde está. Dos niveles de dropdown apilados en el primer fold.

🔄
Duplicación de contenido noticioso

Debajo del hero rotativo hay tres columnas con "Más noticias", "Está pasando" y "Enlaces" — información sin valor para las tareas reales del usuario que ya vio noticias en el hero.

🚪
No existe una entrada clara para Estudiantes

El tab activo por defecto es "Aspirantes". El estudiante activo tiene que buscarse su propio camino — no hay punto de entrada dedicado visible desde el homepage.

"Profe, ¿dónde están las notas? Entré a la página y no encuentro nada."

— Patrón de conversación repetido en cada inicio de semestre

Qué tiene el portal hoy — y qué debería tener

Análisis heurístico del portal actual bajo los principios de Nielsen y las guías de accesibilidad WCAG 2.1. Se evaluó la página principal, la sección de estudiantes y las 5 tareas más frecuentes.

5
Barras de navegación apiladas verticalmente antes del contenido
8
Tabs en el menú principal — ninguna dice "Estudiantes"
24
Programas listados en dropdown abierto por defecto en el fold
0
Accesos directos a tareas frecuentes (notas, horario, trámites)
⚠ Estado actual — problemas encontrados

Menú con 11 ítems al mismo nivel de jerarquía — sin agrupación lógica

Hero con carrusel de imágenes institucionales que ocupa el 60% del fold sin valor funcional

Sección "Estudiantes" no está visible en la navegación principal — está enterrada

Múltiples calls-to-action compitiendo en la misma pantalla sin prioridad visual

Tipografía pequeña, contraste insuficiente, sin sistema de espaciado consistente

✓ Rediseño — qué se corrige

Navegación reducida a 5 categorías principales con submenu claro y predecible

Hero reemplazado por buscador + accesos directos a las 6 tareas más frecuentes

"Estudiantes" como entrada principal de navegación — visible desde el primer momento

Una sola acción primaria por sección — todo lo demás es secundario

Sistema tipográfico con escala definida, contraste AA mínimo garantizado

Problemas encontrados en la auditoría del homepage actual — la capa pública de entrada antes del portal estudiantil.

📰
Hero = noticia institucional
Alta

El primer fold rota entre campañas. No hay CTA principal ni orientación al usuario nuevo.

🗂️
Doble dropdown en la nav
Alta

Dos menús desplegables apilados al entrar: categorías institucionales + 24 programas académicos.

🔄
Contenido noticioso duplicado
Media

El hero ya es una noticia. Las tres columnas debajo repiten "Más noticias", "Está pasando", "Enlaces" — sin valor para tareas reales.

🚪
Estudiante sin entrada propia
Alta

El tab activo por defecto es "Aspirantes". El estudiante activo no tiene punto de entrada visible desde el homepage.

No es el rector. Es el estudiante de quinto semestre.

El portal de una universidad puede querer servir a múltiples audiencias — aspirantes, egresados, docentes, comunidad. Pero si falla con el estudiante activo, falla en su misión principal. Este rediseño se enfoca en el usuario recurrente con tareas específicas.

S
Sebastián Rojas
Estudiante — 5to semestre · Ingeniería de Sistemas · 21 años
Usuario recurrente Mobile-first Poco tiempo Consulta notas semanalmente Hace trámites cada semestre
"Entro al portal, doy vueltas, no encuentro lo que necesito, le pregunto a alguien y al final lo encuentro por accidente. No me da confianza."
Paso 01

Entra al portal

Busca "unipamplona estudiantes" en Google. El primer resultado no es el sitio correcto.

Confundido Desconfiado
Paso 02

Busca en el menú

Ve 11 opciones en el menú. Ninguna dice "Notas" o "Calificaciones". Prueba varias.

Frustrado Paciente
Paso 03

Encuentra el acceso

Después de 4+ clics llega al sistema académico. Ahora tiene que hacer login de nuevo.

Resignado
Paso 04

Completa la tarea

Finalmente consulta sus notas. La tarea tardó ~5 minutos. Debería tardar 30 segundos.

Aliviado No volvería sin ayuda

Tres principios que gobiernan cada decisión

En lugar de rediseñar "por instinto visual", cada decisión del rediseño responde a uno de estos tres principios. Si una decisión no puede justificarse con alguno de ellos, no entra.

🎯

Tarea primero

El estudiante entra para hacer algo específico. El portal debe llevarle a esa tarea en el menor número de pasos posible. La comunicación institucional es secundaria.

🧹

Reducción radical

Cada elemento que no ayuda al usuario a completar una tarea ocupa espacio cognitivo innecesario. Si está en duda, no está. Menos siempre gana.

📐

Jerarquía legible

El usuario no debería tener que "leer" el portal para entenderlo. La jerarquía visual debe hacer el trabajo — tamaño, contraste y espacio antes que etiquetas y explicaciones.

Organizar antes de diseñar

Antes de tocar Figma, el trabajo fue de clasificación. ¿Qué contenido existe? ¿Qué buscan realmente los estudiantes? ¿Qué puede vivir en un segundo nivel? El diagnóstico empezó por entender la estructura actual — organizada por jerarquía institucional, no por usuario.

⚠ Sitemap actual — organizado por estructura organizacional

├── Aspirantes (6 items)
├── Universidad (8 items)
├── Rectoría (2 items)
├── Organismos (2 items)
├── Dependencias
├── Facultades (7 items)
├── Vicerrectorías (3 items)
└── Oficinas Administrativas (16 items)
└── Otros enlaces (16 items) ← cajón de sastre

Nadie busca "Oficina de Gestión de Pagaduría y Tesorería". Buscan "pagar matrícula".

✓ Rediseñado — organizado por usuario

├── Aspirantes → Programas, Inscripción, Costos y becas, Campus
├── Estudiantes → Mi academia, Trámites, Pagos, Bienestar
├── Universidad → Quiénes somos, Facultades, Normatividad
└── Egresados

Desglose de la arquitectura rediseñada:

🏠 Inicio

  • Buscador global
  • Accesos rápidos
  • Calendario académico
  • Noticias destacadas

🎓 Mi academia

  • Consultar notas
  • Horario de clases
  • Inscripción de materias
  • Historial académico
  • Certificados

📋 Trámites

  • Paz y salvo
  • Solicitud de documentos
  • Transferencias
  • Grados
  • Estado de solicitudes

📚 Servicios

  • Biblioteca
  • Bienestar universitario
  • Laboratorios
  • Deportes
  • Becas y financiación

📞 Contacto

  • Directorio de facultades
  • Mesa de ayuda
  • PQRS
  • Mapa del campus

Menos ruido, más claridad, misma información

El rediseño no elimina contenido — lo organiza. La información que el portal tenía sigue estando, pero ahora responde a una jerarquía clara: lo que el 80% de los estudiantes busca el 80% del tiempo está a un clic de distancia.

Pantalla cero — Homepage · La bifurcación

El homepage ya no intenta ser todo para todos. Su única responsabilidad: orientar al usuario hacia su camino en menos de dos segundos.

Universidad de Pamplona
Aspirantes Estudiantes Universidad Egresados
¿Qué buscas hoy?
Universidad de Pamplona — portal de servicios
🎓
Quiero estudiar aquí
Programas, inscripciones, costos
📚
Soy estudiante
Notas, trámites, horario
O busca directamente…
🔍 Buscar en el portal…
← Mi academia
Notas — 2026-1
Cálculo II 3.8
Bases de Datos 4.2
Redes I 3.1
Inglés Técnico 4.5
Promedio semestral: 3.9 / 5.0

Mi academia — notas en 2 clics

Notas, horario e historial accesibles desde el menú principal sin sub-submenús.

← Trámites
Mis solicitudes
Certificado de notas Listo
Solicitado 12 mar · Listo para descargar
Paz y salvo En proceso
Solicitado 15 mar · Estimado: 2 días hábiles
+ Nueva solicitud

Trámites con estado visible

El estudiante ve el estado de cada solicitud en tiempo real — sin llamar a ninguna oficina.

🔍 Buscar…
📊
Notas
📅
Horario
📋
Trámites
📆
Calendario
PRÓXIMO
Mar 24 — Cierre inscripción

Mobile-first desde el inicio

Diseñado para el teléfono — donde los estudiantes realmente consultan el portal.

Métricas que importan cuando el usuario es un estudiante

Sin datos de producción aún — esto es un proyecto de portafolio. Las métricas se definen basadas en los benchmarks de rediseños similares de portales universitarios y en los problemas identificados en la auditoría.

−70%
Elementos en el fold principal vs. estado actual
2
Clics máximos para llegar a cualquier tarea frecuente (vs. 4+)
AA
Contraste mínimo garantizado en todo el sistema (WCAG 2.1)

Lo que este proyecto me enseñó

✅ Lo que funcionó

Empezar por la auditoría antes de abrir Figma fue la mejor decisión. Documentar los problemas reales del sitio actual me dio criterio claro para justificar cada decisión de diseño.

La arquitectura de información primero. Organizar antes de diseñar evita el error común de hacer bonita una mala estructura.

🔍 Lo que aprendí

Rediseñar un producto público sin acceso a métricas reales obliga a ser más riguroso en la investigación cualitativa. Las heurísticas de Nielsen y el journey map son más valiosos cuando no tienes analytics.

El usuario universitario tiene contexto y urgencia específicos. Diseñar para "estudiante" es tan diferente a diseñar para "consumidor" como diseñar para "médico".