diseño wireframes lc3
TRANSCRIPT
Diseño Participativo de Wireframes
Introducción
Para realizar el diseño de los wireframes armamos una
paleta de elementos de la página (botones, imágenes, video, buscador, etc.) que cada
persona debía ordenar en el espacio.
Las personas que realizaron la actividad fueron elegidas
en base a los arquetipos definidos en la etapa de “Personas y Escenarios”.
Nos enfocamos en los 3 tipos de estudiantes de una
universidad: el alumno de colegio que es su potencial
“futuro estudiante” y que ingresará a pregrado; el
alumno que pertenece a la institución y que en este caso acaba de entrar a pregrado y un profesional o
estudiante egresado que busca continuar sus estudios
tomando un postgrado.
Actividad en Proceso
Arquetipos Definidos
Arquetipo Definido 1: Alumno 4º medio. Busca
información sobre postulantes.
Arquetipo Definido 2: Alumno UFTSM. Debiera conocer
más el sitio y podría diferenciar entre jerarquías de
contenidos.
Arquetipo Definido 3: Egresado. Busca un magíster.
Persona 1: Margarita
Arquetipo Definido:
Alumno de Colegio. “Postulante”
Caso Real de Estudio
Nombre: Margarita Peña
Edad: 18 años.
Ocupación: Estudiante de 4º medio, Colegio Compañía
de María.
Quiere estudiar Ingeniería en Diseño de Productos en la UTFSM. Necesita acceder tanto a la inscripción de ensayos
PSU que realiza la universidad como a información de la
carrera, puntajes, aranceles, etc.
Wireframe de Margarita
Caso: Estudiante de Colegio
Ubica el Nombre sobre
el logo y este último a la izquierda.
La barra de búsqueda
también está bajo el
nombre, pero a la
derecha.
Ubica los botones
Carreras, Ensayos PSU y Becas en ese orden, en
el lado derecho y bajo
el calendario.
Persona 2: Cristian
Arquetipo Definido:
Alumno UTFSM
Caso Real de Estudio
Nombre: Cristián Cortés
Edad: 19 años.
Estudios: Egresado del Colegio Mackay, generación 2012.
Ocupación: Estudiante de Ingeniería Civil en la UTFSM.
Fue elegido ya que como estudiante activo de la
Universidad debiese usar con más frecuencia el sitio web
de ésta.
Wireframe de Cristian
Caso: Estudiante UTFSM
Ubica el logo arriba a la
derecha.
Luego el título, la barra
de búsqueda y la barra
de menú.
Los botones de
Becas, Ensayos PSU y
Carreras se ubican a la
derecha en ese orden.
Persona 3: Renzo
Arquetipo Definido:
Egresado. Busca un magíster.
Caso Real de Estudio
Nombre: Renzo Baldassare.
Edad: 25 años.
Estudios: Ingeniería Comercial, Universidad Adolfo Ibáñez.
Ocupación: Área de Desarrollo, Entel empresas.
Fue elegido como posible usuario del sitio web debido a
que existen postgrados de su interés, como el Magíster en
Gestión de Activos y Mantenimiento.
Wireframe de Renzo
Caso: Estudiante Egresado
Ubica el logo arriba a la
izquierda.
No hay barra de menú
superior.
Los botones de
Carreras, Becas y
Ensayos PSU se ubican a
la izquierda en ese
orden.
Conclusiones sobre los usuarios
Estudiante Colegio: Desconoce los contenidos del
sitio, no relaciona los links. Dice que son muchos contenidos y que debiesen desplegarse, pero no
identifica las jerarquías.
Estudiante UTFSM: Aclara que ellos como alumnos de la
UTFSM nunca o casi nunca ingresan al sitio de su universidad, sino que utilizan otro sitio. Es por esto que
desconoce sus contenidos.
Estudiante Egresado: No pertenece a la institución y
reconoce dos aspectos importantes: el sitio debe captar
la atención de los futuros alumnos y debe haber un menú exclusivo para los alumnos de la universidad.
Conclusiones sobre los wireframes
Para los 3 usuarios los elementos más importantes son el
título, el logo y el buscador, y por esto los ubican en la parte superior.
Las redes sociales siempre se ubican juntas, en un
espacio definido y sin mezclarse entre el resto de los
contenidos. Además, dos de las tres personas las ubicaron en la parte superior. Esto nos indica que hay
interés por la información que en estas redes se
transmite.
Las secciones “eventos” y “noticias” se ubican en un
mismo nivel, demostrando una relación entre ambos contenidos.
Conclusiones sobre los wireframes
Los tres usuarios ubican el calendario en la zona lateral
derecha, cerca de la sección eventos y noticias. Se crea así una relación entre los elementos que tienen que ver
con el tiempo.
El video institucional es casi irrelevante. Lo utilizan como
accesorio o lo dejan a un lado.
Para el área relacionada con los futuros alumnos, los
elementos más relevantes según los usuarios son Carreras
USM, Ensayo PSU, Becas y Admisión Especial.
Los tres coinciden en que la información de contacto(teléfonos, e-mail, dirección, etc.) deben estar en la
parte inferior del sitio.
Nuevo Mapa de Navegación
“home”
Propuesta Wireframe Home
Versión web y móvil
LC3, 2013
Franco Baldassare
Josefina Borja
Caterina Da Silva
Javiera Rojas
Camila Valenzuela