Pyxis y Gamma

De Casiopea


TítuloPyxis y Gamma
Tipo de ProyectoProyecto de Titulación
Palabras Clavediseño gráfico, diseño web, framework, tema wordpress, wordpress, responsive
Período2014-2014
AsignaturaTaller de Diseño Gráfico Titulación 3
CarrerasDiseño Gráfico
Alumno(s)Juan Antonio Godoy, Idar González
ProfesorHerbert Spencer
URLhttp://eadpucv.github.io/pyxis/, http://eadpucv.github.io/gamma/


Verificación e iteración

Carta Gantt

Etapa titulo 3.png

Gamma

Implementación

El paso de maquetas a theme en wp

Correcciones de diseño

Ajustes en el diseño por la administrabilidad, usabilidad y legibilidad

Testeo del sitio

Evaluación de la plataforma (software)

  1. Validador de código y accesibilidad
    1. w3 [[1]]
    2. Browser screenshots [[2]]
  2. Velocidad del sitio
    1. Pingdom [[3]]
  3. Observaciones generales (velocidad, usabilidad, estándard de códigos)
    1. Google developer PageSpeed insight [[4]]
W3C Markup Validation Service

Existe un estándar de escritura en estructura de documentos para la web. Entre las validaciones se toma en cuenta la arquitectura de elementos, la semántica, la correcta declaración de elementos, etc. Frente a la primera evaluación, el sitio en su versión alfa muestra más de 180 errores y 2 advertencias graves. Tras corregir errores de semántica se logran reducir las advertencias y diversos errores de semántica. Sin embargo, hay errores que se deberán ir limpiando con el transcurso del tiempo incluso una vez ya implementado el sitio.


Google developer insight

Al someter la versión alfa del sitio [alfa.ead.pucv.cl], nos arroja una serie de elementos que pueden ser mejorados en función de usabilidad y del funcionamiento del sitio como un sistema, básicamente asegurando estándares de elementos gráficos y un mejor rendimiento en el sitio.

  • Velocidad: 42/100 en Desktop y 27/100 en móvil
    • Optimizar imágenes: Esto implica un tratado de imagen por parte de la persona que suba las imágenes. Es decir, reducir datos de la foto sin perder la definición. [5]
    • Habilitar compresiones: Para optimizar el tiempo de carga del sitio se recomienda habilitar la compresión de archivos mediante el uso de gzip. [6]. Esto además de asegurar un menor tiempo de carga, le puede ayudar a ahorrar datos a alguien que navegue por el sitio con banda-ancha restringida (datos por navegación). Éste es el enlace de cómo se configura el archivo .htaccess que permite comprimir contenidos. [7]
    • Eliminar bloqueo de render en archivos JavaScript y CSS: Para que un navegador pueda mostrar una página al usuario, antes debe analizarla. Si encuentra un script externo que bloquee la visualización del contenido durante el análisis, debe detenerse y descargar el archivo JavaScript. Cada vez que sucede esto, se crea un nuevo flujo de datos en la red que retrasa la carga de la página. [8]. En este caso, se dejan sólo nos javascript más necesarios para el funcionamiento directo del sitio, como jquery el carrusel y los otros se dejan en el footer, cosa que carguen al final. Además se les agrega una extensión llamada async, que desincroniza la descarga de los javascript.
    • Especifiación del caché en el navegador: El almacenamiento en caché del navegador para recursos estáticos puede ahorrarle tiempo al usuario si este visita tu sitio en más de una ocasión. El almacenamiento en caché de las cabeceras debería aplicarse a todos los recursos estáticos que puedan almacenarse en caché, no solo a un pequeño conjunto (como imágenes). Entre los recursos que se pueden almacenar en caché se incluyen los archivos JS y CSS, archivos de imágenes y otros archivos de objetos binarios (archivos multimedia, archivos PDF, etc.). En general, el código HTML no es estático y no debería considerarse apto para almacenarse en caché de forma predeterminada. Debes tener en cuenta qué política de almacenamiento en caché sería la más adecuada para el código HTML de tu sitio.
  • Consideraciones
    • Minificar JavaScript, HTML y CSS: Se propone minificar estos archivos, eliminando espacios vacíos, tabulaciones inecesarias (para la lectura de software), que permite que la lectura del sitio sea mucho más rápida. Actualmente.
    • Reducir tiempos de respuesta del servidor: Por el momento se supone que en el servidor que está alojado la versión alfa del sitio no es la óptima. Por lo tanto esto tendremos que comprobarlo una vez que el sitio esté implementado en el servidor real.
  • Pruebas cumplidas
    • No tener landing page
    • Priorizar contenido visiblemente
  • Experiencia de usuario 98/100
    • Elementos a considerar
      • Aplicar el tamaño adecuado a los botones táctiles
    • Pruebas cumplidas
      • No utilizar plugins
      • Configuración de Viewport
      • Ajustar el tamaño del sitio a Viewport
      • Usar tamaños tipográficos legibles

Personas y escenarios

Objetivos | Estructura | Proceso

La siguiente metodología busca representar de manera especulativa con las personas que frecuentan el sitio e[ad] en sus diferentes escenarios o situaciones ficticias para una posterior realización de pruebas de usuario. Dichas pruebas comprometen la usabilidad y adaptación de la plataforma digital, al punto de re-plantear la rama de los contenidos, la interacción y la gráfica del sitio con respecto al registro, el estudio y el resultado de las pruebas.

El método contempla una serie de arquetipos con nombre, edad, ocupación y residencia. La descripción antecede al escenario y la consecuente problemática que debe ser atendida en el proceso de evaluación.

Arquetipo I
Externo - Postulante
Persona I
  • Nombre: Felix Muñoz.
  • Edad: 20 años.
  • Ocupación: Estudiante.
  • Residencia: Santiago, Chile.

Descripción: Felix es un joven estudiante de arte de la Universidad Católica de Chile. Su inquietud por esta disciplina es herencia de su padre, quien postuló a la facultad de arquitectura de la misma escuela, y donde hoy ejerce como docente. Desde muy pequeño Felix se ha ligado poco a poco a los trabajos manuales y de carácter análogo: En especial fotografía y técnicas de grabado. Aunque sus estudios hoy en día no requieren por completo de dicho interés, y aun dudando de su proyección laboral, Felix ha perseverado durante todo un año para comprometerse con la carrera.

Escenario: Felix comienza a pensar que su carrera no cumple las expectativas que tenía para sí, y, junto a su familia, mantienen conversaciones sobre un posible traslado de carrera. Su padre le ha recomendado arquitectura o diseño, y felix -entusiasmado-, no duda en revisar por internet las diferentes opciones. Vía Google se encuentra con el enlace del sitio e[ad], y se propone echar un vistazo a la malla curricular. Se introduce por el rótulo de navegación "Carreras y postgrados" y pincha en "Diseño gráfico". El sitio le redirige a una página donde se halla descrita la concepción de la escuela sobre el oficio del diseño y la malla curricular disponible para descargar en formato .PDF. Felix ha considerado estudiar en la PUCV dicha carrera, cursar durante un año el plan común de la malla, y luego decidir la mención de gráfico u objetos. Felix ha revisado también el "perfil del egresado" y ha enviado un mensaje a través de la sección de "contacto" del sitio, presentándose como posible postulante. A fin de año han acabado discutiendo, junto a su padre, el necesario traslado a la región de Valparaíso.

Tareas a diagnosticar:

  1. Encontrar la "malla curricular".
  2. Encontrar el "perfil del egresado".
  3. Contactar a la escuela a través del formulario de "contacto".
Arquetipo II
Interno - Primer año
Persona II
  • Nombre: Mario Vargas.
  • Edad: 18 años.
  • Ocupación: Estudiante.
  • Residencia: Viña del mar, Chile.

Descripción: Mario cursa primer año de arquitectura en la facultad de Arquitectura y diseño e[ad] PUCV. Lleva una semana de bienvenida, y una de la cosas que le han llamado la atención radica en la concepción poética que caracteriza la enseñanza de la escuela llevada al acto y el oficio. Como es de costumbre, ha participado por primera vez en el taller de américa impartido en Ciudad abierta y la casa de estudios, y con ello su acercamiento a la poesía dejó de ser insospechado. A sólo unos días de haber ingresado, Mario tuvo que consultar por la localización de Ciudad abierta en Ritoque, puesto que debía asistir a su primera clase de "Cultura del cuerpo". De modo que, al ser atendido por uno de sus compañeros, le fue aconsejado visitar el sitio e[ad] para encontrar la dirección exacta y el geo-punto presente en el mapa digital de Google, de manera que pudiese rastrearlo con su propio Smartphone.

Escenario: Pasado un tiempo, en clases de taller, Mario comienza a recibir semanalmente dos encargos relacionados con la práctica del dibujo en base a la "observación". Nuevamente se halla ante una técnica y ámbito desconocidos, por lo que, curioso, resuelve investigar a través del sitio e[ad]. Al ingresar, hace click en el primer rótulo (donde anteriormente apeló por la información del campus), en la sección "Escuela", y luego el primer sub-rótulo: "Historia". Mario encuentra allí descrita la Historia originaria de la facultad y quiénes fueron los fundadores de dicha metodología y enseñanza de concepción tan particular. Además ah revisado la sección "Amereida" y ha leído sobre la publicación de la obra con el mismo nombre. Ahora, más informado sobre el propósito en las cualidades de su facultad, Mario a recomendado a sus compañeros revisar el sitio e[ad] para estar al tanto si surgen dudas.

Tareas a diagnosticar:

  1. Buscar la localización de "Ciudad abierta" en Ritoque.
  2. Revisar la "historia" y origen de la e[ad].
  3. Buscar la sección "amereida".
  4. Buscar la sección de "noticias".
Arquetipo IV
Externo - Egresado
Persona IV
  • Nombre: Elena Sánchez.
  • Edad: 24 años.
  • Ocupación: Egresada ingeniería civil industrial.
  • Residencia: Reñaca, Chile.

Descripción: Elena es una joven egresada de ingeniería en la Universidad Federico Santa María de Viña del mar. Su carácter es entusiasta, y cada vez que tiene la oportunidad de participar en un proyecto particular -de preferencia humanista-, se introduce rápidamente al debate de ideas y conjeturas, cauta y disciplinadamente, aporta su punto de vista y conocimiento. Hace sólo una semana que Elena concursó a un fondo para la inversión de su proyecto de tesis, el cual salió ganador y fue digno de aceptación por el gobierno.

Escenario: El proyecto consiste en la debida gestión de una empresa inmobiliaria que busca reunir jóvenes egresados de arquitectura y diseño de objetos, con el fin de afrontar el conjunto ecológico y urbanista de forma integral y equilibrada, administrando los fondos para generar una marca coorporativa. A Elena le hace ilusión llevar a cabo el proyecto con algunas personas de su edad promedio y de espíritu emprendedor. De modo que el primer paso es contactar estudiantes o profesionales en las áreas respectivas, y comienza a investigar por internet. Sin embargo, uno de sus amigos es estudiante de diseño en la e[ad], y le ha recomendado visitar el sitio y los proyectos que ha realizado la PUCV con respecto al eco-urbanismo. Elena no duda en revisar la información recomendada, y ya en el sitio se dirige a la "malla curricular", con el objetivo de estudiar la rama de contenidos presentes en la carrera. Luego apela por el "perfil del egresado" para observar la formación y visión de la facultad en sus alumnos. Finalmente, Elena debe "publicar un trabajo" en la sección "Bolsa de trabajo" para agendar el proyecto en el sitio y que éste se encuentre disponible para el conjunto-escuela a través de la plataforma digital. Con esperanzas, Elena cree que tendrá buenos resultados, y acaba anotando la "dirección" exacta de la facultad de arquitectura y diseño para visitarla si fuera necesario.

Tareas a diagnosticar:

  1. Descargar la "malla curricular".
  2. Encontrar el "perfil del egresado".
  3. "Publicar un trabajo" como aviso para los estudiantes de la facultad.
  4. Encontrar la "dirección" de la casa de estudios e[ad].
  5. Encontrar la "edición digital:" "El acto arquitectónico", por Alberto Cruz..
Arquetipo V
Externo - Apoderado
Error al crear miniatura: Falta archivo
Persona V
  • Nombre: Ernesto Gómez.
  • Edad: 52 años.
  • Ocupación: Empresario.
  • Residencia: Rancagua, Chile.

Descripción: Ernesto es padre de tres hijos. Dos de ellos cursan en la universidad y están en la mitad de su carrera. Escogieron vivir en Santiago para estudiar en la capital, en la Universidad de Chile y la Universidad Diego Portales. El tercer hijo, Agustín, es el más pequeño y está por ingresar a la educación superior. Al igual que sus hermanos, pretende estudiar en a capital, y esperanzado en su ardua preparación para la PSU, quiere postular a la carrera de arquitectura en la universidad Católica de Chile. Sin embargo, Ernesto ha reparado en investigar otras opciones, guiado por la idea de ampliar las oportunidades para su hijo, e incitarlo a que pongo ojo en los establecimientos regionales.

Escenario: Ernesto, desde su oficina, decide buscar por internet información sobre la carrera de Arquitectura en el país, y específicamente impartida en regiones. Vía Google se encuentra con el enlace del sitio e[ad], donde pincha "Carreras y postgrados" para ingresar en "Arquitectura", y de inmediato se encuentra con el "perfil del egresado"; se le ocurre guardar el enlace y mostrárselo a su hijo, cuando llegue a casa. Antes salir del sitio, se pregunta por los profesores que imparten las clases, y desde "Escuela" hace click en "cuerpo académico". Allí se le presenta un listado de todos los profesores con su respectiva información profesional. Finalmente, con un mayor interés, revisa la sección de "becas y ayudas estudiantiles" y la sección de "Servicios" implementados por la facultad. En casa, ambos visitaron el sitio juntos para especular opciones.

Tareas a diagnosticar:

  1. Encontrar el "perfil del egresado".
  2. Revisar qué docentes erigen el "cuerpo académico".
  3. Encontrar las opciones de "becas y ayudas estudiantiles".
  4. Buscar los "servicios" implementados por la facultad.

Pruebas de usuario

Registro

Silverback es una aplicación para Apple capaz de registrar la interacción del usuario con el sistema. Además graba la respuesta gesticular de éste con la web-cam y lo dispone en una sub-pantalla. Esta aplicación es muy útil a la hora de realizar pruebas de usabilidad con personas reales, registrar todo el proceso de pruebas con una plataforma web y de manera ulterior estudiar los resultados para finalmente generar una parametrización de cada prueba, con el fin de obtener resultados estadísticos y racionalizables de acuerdo al criterio de los desarrolladores.

Silverback-app
Tipos de usuarios

Los tipos de usuario representan -de forma pseudo-realista, sin apelar específicamente a la situación descrita en "personas y escenarios"- los arquetipos identificados; siendo así el paso siguiente para llevar a la praxis la metodología de evaluación y replanteamiento sobre el diseño y la estructura de los contenidos en sito e[ad].

  • Los tipos de usuario son los siguientes:
Usuario Externo (postulante) - Arquetipo I
Error en widget YouTube: Unable to load template wiki 'YouTube'


  • ¿Encontrar el perfil del egresado?

Análisis cuantitativo:

  1. Tiempo: 80 segundos
  2. Número de clicks erróneos: 8
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Cuerpo académico > Home > Carreas & postgrados > Arquitectura > Perfil de egreso
  2. Confusiones/dificultades: Al reconocer la palabra o concepto "perfil", tendió a buscar una sección que tuviese contemplado una "fotografía de perfil".
  3. Observaciones: El concepto "perfil" tal vez sea confuso para ser asignado a la rama de los concetidos.


  • ¿Encontrar la malla curricular?

Análisis cuantitativo:

  1. Tiempo: 6,8 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Carreras & postgrados > Arquitectura > Malla curricular
  2. Confusiones/dificultades: No presenta dificultad.
  3. Observaciones: Luego de hallar el "perfil del egresado", la malla curricular es predecible en la sección de "carreras & postgrados".


  • ¿Encontrar el cuerpo docente?

Análisis cuantitativo:

  1. Tiempo: 6 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Cuerpo académico
  2. Confusiones/dificultades: No presenta dificultad.
  3. Observaciones: Al estar bajo el rótulo: "Escuela", y ser de los sub-rótulos más extensos, el cuerpo académico se halla muy presente en la rama de los contenidos para el usuario.


  • ¿Encontrar la ubicación de la facultad?

Análisis cuantitativo:

  1. Tiempo: 30,5 segundos
  2. Número de clicks erróneos: 3
  3. Número de clicks acertados: 1

Análisis cualitativo:

  1. Recorrido de Navegación: Carreras & postgrados > Diseño gráfico > Home > (Footer)
  2. Confusiones/dificultades: Se cuestiona si el sitio representa la universidad o sòlo la facultad. Entra a la sección "Diseño gráfico" para revisar datos.
  3. Observaciones: Se dirige al Footer inmediatamente para revisar la dirección de la casa de estudios.


  • ¿Compartir una noticia?

Análisis cuantitativo:

  1. Tiempo: 17,8 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Noticia > (botón compartir)
  2. Confusiones/dificultades: No presenta dificultad.
  3. Observaciones: Se encuentra con el botón "compartir" y sólo desplegable con la interacción del :hover.


  • ¿Encontrar información sobre intercambio estudiantil?

Análisis cuantitativo:

  1. Tiempo: 6,8 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 1

Análisis cualitativo:

  1. Recorrido de Navegación: Estudiantes > Estudiar en el extranjero
  2. Confusiones/dificultades: No presenta mayor dificultad.
  3. Observaciones: Vacila entre los rótulos "Estudiantes" y "Extensión" para esxcoger dónde iniciar la búsqueda de la sección. Ambos conceptos son útiles para razonar una relación con "Estudiar en el extranjero".


  • ¿Contactar a la e[ad]?

Análisis cuantitativo:

  1. Tiempo: 13 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: (Footer) > Contacto (formulario)
  2. Confusiones/dificultades: No presenta dificultad.
  3. Observaciones: Se dirige inmediatamente al footer para revisar "contacto" y hacer click en el link para ser redirigido al formulario.


Usuario Interno (Primer año) - Arquetipo II
Error en widget YouTube: Unable to load template wiki 'YouTube'


  • ¿Encontrar el perfil del egresado?

Análisis cuantitativo:

  1. Tiempo: 48,9 segundos
  2. Número de clicks erróneos: 3
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Extensión > Ex-alumnos > Carreras y postgrados - Arquitectura - Perfil de egreso.
  2. Confusiones/dificultades: Se dirige a Ex-alumnos en el rótulo "Estudiantes". De cierta forma, el concepto "egreso" se relaciona con el estado de "Ex-alumno".
  3. Observaciones: Debe existir un concepto diferente para asignar el "perfil del egresado". En perimer lugar, el concepto "perfil", como se observa en la prueba anterior, está vedado por la convención de "perfil" en una red social. Por otro lado, el concepto "egreso" es genérico y se toma por confusión con el arquetipo de "Ex-alumno".


  • ¿Encontrar la ubicación de Ciudad abierta?

Análisis cuantitativo:

  1. Tiempo: 38,7 segundos
  2. Número de clicks erróneos: 2
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Amereida > Escuela > Campus
  2. Confusiones/dificultades: No presenta mayor dificultad.
  3. Observaciones: Se dirige al rótulo "Escuela" y luego "Amereida". La relación entre "amereida" y "Ciudad abierta" es evidente para el usuario de primer año, por lo que conectar ambos puntos le lleva a buscar los datos de una dentro de la otra.


  • ¿Compartir una noticia?

Análisis cuantitativo:

  1. Tiempo: 60 segundos
  2. Número de clicks erróneos: 1
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Evento > Home > Noticia > (botón redes sociales)
  2. Confusiones/dificultades: No se dirige a la "noticia" sino a un "evento".
  3. Observaciones: Al ingresar se percata de que no existe botón "compartir", por lo que vuelve a la Home y luego ingresa a la "Noticia".


  • ¿Contactar a la e[ad]?

Análisis cuantitativo:

  1. Tiempo: 14 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Contacto
  2. Confusiones/dificultades: No presenta mayor dificultad.
  3. Observaciones: El sub-rótulo "contacto" está muy a la mano para ser hallado y utilizar el formulario.


  • ¿Encontrar el cuerpo docente?

Análisis cuantitativo:

  1. Tiempo: 19,6 segundos
  2. Número de clicks erróneos: 5
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Cuerpo académico
  2. Confusiones/dificultades: No presenta mayor dificultad.
  3. Observaciones: Una vez realizadas las pruebas anteriores, la persona ya reconoce ciertas lecturas o patrones que pueden ser revisadas para realizar la tarea.


Usuario Interno (Primer año) - Arquetipo II
Error en widget YouTube: Unable to load template wiki 'YouTube'


  • ¿Encontrar el cuerpo académico?

Análisis cuantitativo:

  1. Tiempo: 17,7 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Cuerpo docente
  2. Confusiones/dificultades: No presenta dificultad
  3. Observaciones:


  • ¿Encontrar la ubicación de la escuela?

Análisis cuantitativo:

  1. Tiempo: 32,9 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Campus
  2. Confusiones/dificultades: No presente mayor dificultad
  3. Observaciones:


  • ¿Compartir una noticia?

Análisis cuantitativo:

  1. Tiempo: 33 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Noticia (Carousel) > Compartir (botón)
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Contactar a la e[ad]?

Análisis cuantitativo:

  1. Tiempo: 18,3 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Contacto
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Encontrar la malla curricular?

Análisis cuantitativo:

  1. Tiempo: 16,2 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Carreras & postgrados > Arquitectura > Malla curricular
  2. Confusiones/dificultades:
  3. Observaciones:
Usuario Interno (Curso superior) - Arquetipo III
Error en widget YouTube: Unable to load template wiki 'YouTube'


  • ¿Encontrar el perfil del egresado?

Análisis cuantitativo:

  1. Tiempo: 120 segundos
  2. Número de clicks erróneos: 10
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Extensión > Ex-alumnos > Home > Ex-alumnos > Carreras & postgrados > Arquitectura > Perfil de egreso
  2. Confusiones/dificultades: Se dirige a "Ex-alumnos" para encontrar el "perfil de egreso".
  3. Observaciones: Se torna más necesario aún el reemplazo de las palabras confusas en la rama de contenidos.


  • ¿Encontrar el cuerpo docente?

Análisis cuantitativo:

  1. Tiempo: 8 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Cuerpo académico
  2. Confusiones/dificultades: no presenta dificultad.
  3. Observaciones: Como en casos anteriores, el cuerpo docente es uno de los sub-rótulos visibles en comparación con los demás.


  • ¿Compartir una noticia en la e[ad]?

Análisis cuantitativo:

  1. Tiempo: 14,6 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Noticia > (botón redes sociales)
  2. Confusiones/dificultades: Se dirige a una noticia y al ingresar, hace scroll sin ver el botón que contiene al ícono convencional de "compartir". En cambio, se dirige al final de la noticia y busca los botones de "redes sociales".
  3. Observaciones: El botón de "compartir" y el de "redes sociales" son reiteraciones de la misma interacción. La convención en la web permite generar una observación u otra.


  • ¿Contactar a la e[ad]?

Análisis cuantitativo:

  1. Tiempo: 10,7 segundos
  2. Número de clicks erróneos: 1
  3. Número de clicks acertados: 1

Análisis cualitativo:

  1. Recorrido de Navegación: (Footer) > contacto (formulario)
  2. Confusiones/dificultades: Primeramente se dirige al rótulo "Extensión", luego hace rápidamente scroll para revisar la información presente en el Footer.
  3. Observaciones: Relación de palabras "Extensión" - "Contacto o contactar". Luego se apela por la convención de datos de contacto en la zona inferior del sitio (footer).


  • ¿Encontrar requerimientos para intercambio estudiantil?

Análisis cuantitativo:

  1. Tiempo: 6,9 segundos
  2. Número de clicks erróneos: 1
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Estudiantes > Estudiar en el extranjero
  2. Confusiones/dificultades: No presenta dificultad.
  3. Observaciones: Se dirige primeramente a "Extensión", luego a "Estudiantes", para observar los sub-rótulos. Allí encuentra fácilmente la información requerida.


  • ¿Encontrar ofertas de trabajo (bolsa de trabajo)?

Análisis cuantitativo:

  1. Tiempo: 25,4 segundos
  2. Número de clicks erróneos: 4
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Extensión > Estudiantes > Bolsa de trabajo
  2. Confusiones/dificultades: Vacila entre los rótulos de la navegación. Finalmente arriba a la sección, pero no presiona el botón de "publicar un trabajo" sin antes hacer scroll y observar la página.
  3. Observaciones: "Bolsa de trabajo" es el concepto muy útil para la tarea "publicar un trabajo". La reiteración de las palabras se aplica en la obviedad de la información para ser obtenida.


  • ¿Encontrar noticias de diseño gráfico?

Análisis cuantitativo:

  1. Tiempo: 36,4 segundos
  2. Número de clicks erróneos: 2
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Carreras & postgrados > Diseño gráfico > Home > Noticias > Diseño gráfico
  2. Confusiones/dificultades: Para encontrar las "noticias de diseño gráfico" se dirige a la sección de "Diseño gráfico". Al no hallar pistas, regresó a la Home. Desde ahí pinchó en "Noticias" y luego en "Diseño gráfico".
  3. Observaciones: Las "noticias de Diseño gráfico" no se encuentran en la sección de la carrera, de manera explícita, sino a través del "aside" en donde se hallan las "últimas noticias" relacionadas con la carrera.
  • ¿Encontrar malla curricular de diseño industrial?

Análisis cuantitativo:

  1. Tiempo: 27,8 segundos
  2. Número de clicks erróneos: 2
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación:
  2. Confusiones/dificultades:
  3. Observaciones:
Usuario Interno (Curso superior) - Arquetipo III
Error en widget YouTube: Unable to load template wiki 'YouTube'


  • ¿Encontrar el cuerpo académico?

Análisis cuantitativo:

  1. Tiempo: 12,5 segundos
  2. Número de clicks erróneos: 1
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación:
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Encontrar la dirección de la casa de estudios?

Análisis cuantitativo:

  1. Tiempo: 7 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 0

Análisis cualitativo:

  1. Recorrido de Navegación: (Footer)
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Compartir una noticia en la e[ad]?

Análisis cuantitativo:

  1. Tiempo: 29,1 segundos
  2. Número de clicks erróneos: 3
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación:
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Encontrar la malla curricular?

Análisis cuantitativo:

  1. Tiempo: 10,3 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Carreras y postgrados > Arquitectura > Malla curricular
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Contactar a la e[ad]?

Análisis cuantitativo:

  1. Tiempo: 55,5 segundos
  2. Número de clicks erróneos: 1
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: (Footer) > Extensión > (footer) > Escuela > Contacto
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Encontrar el perfil del egresado?

Análisis cuantitativo:

  1. Tiempo: 25,4 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación:
  2. Confusiones/dificultades:
  3. Observaciones:
Usuario Externo (egresado) - Arquetipo IV
Error en widget YouTube: Unable to load template wiki 'YouTube'


  • ¿Descargar .pdf de la malla curricular?

Análisis cuantitativo:

  1. Tiempo: 9,3 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 4

Análisis cualitativo:

  1. Recorrido de Navegación: Carreras y postgrados > Arquitectura > Malla curricular > Descargar malla curricular.
  2. Confusiones/dificultades: Ninguna.
  3. Observaciones: Tomándose el debido tiempo de lectura, su interacción es expedita, intuitiva, sin dudas prolongadas o vacilación en secciones diferentes.


  • ¿Encontrar el perfil del egresado?.

Análisis cuantitativo:

  1. Tiempo: 45,8 segundos
  2. Número de clicks erróneos: 7
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Estudiantes > Ex-alumnos > Carreras y postgrados > Arquitectura > Perfil de egreso.
  2. Confusiones/dificultades:
    1. Movimiento duditativo en el gesto de las manos.
  3. Observaciones: Al no saber dónde buscar, se pasea por todos los rótulos principales, buscando algo que de cuenta del "egresado". Al relacionar el concepto "estudiantes" con "egresados", ingresa en "Ex-alumnos".


  • ¿Publicar un trabajo?

Análisis cuantitativo:

  1. Tiempo: 57,5 segundos
  2. Número de clicks erróneos: 8
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Recorrido de Navegación: Escuela > Contacto > Estudiantes > Bolsa de trabajo > Publicar un trabajo.
  2. Confusiones/dificultades:
    1. Se confunde de manera conceptual con "publicar un trabajo" (cree que refiere a un trabajo universitario).
  3. Observaciones: Ingresa a "contacto", creyendo que allí encontrará las publicaciones.


  • ¿Encontrar la "dirección" de la casa de estudios?

Análisis cuantitativo:

  1. Tiempo: 17,8 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: (footer) > Escuela > contacto.
  2. Confusiones/dificultades:
  3. Observaciones:


  • ¿Encontrar la "edición digital:" "El acto arquitectónico"?

Análisis cuantitativo:

  1. Tiempo: 8,7 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Recorrido de Navegación: Extensión > ediciones e[ad].
  2. Confusiones/dificultades:
  3. Observaciones:


Usuario Externo (apoderado) - Arquetipo V
Error en widget YouTube: Unable to load template wiki 'YouTube'
  • ¿Encontrar el "perfil del egresado"?.

Análisis cuantitativo:

  1. Tiempo: 3,9 minutos
  2. Número de clicks erróneos: 14
  3. Número de clicks acertados: 3

Análisis cualitativo:

  1. Navegación: Nav Carreras y posgrados > Nav Escuela > Nav Estudiantes > Asuntos estudiantiles > Nav Estudiantes > Asuntos estudiantiles > Nav Extensión > Nav Carreras y Posgrados > Nav Escuela > Portada información académica > Nav Extensión > Nav Estudiantes > Ex-alumnos > Nav Carreras y Posgrados
  2. Confusiones/dificultades:
    1. Tras buscar en información académica ya no encuentra dónde y vuelve a revisar el menú de navegación.
    2. "¿Podrá estar en ex-alumnos?"
    3. "¿Quizás en la Carrra?"
  3. Observaciones: Los rotulados dificultan la comprensión natural del sitio. Por esa razón el usuario entra a rótulos como "Información académica", "Asuntos estudiantiles", se cae en la duda de "Extensión", incluso en "Ex-alumnos". Esta tarea nos demuestra que el funcionamiento de los aside en esta etapa no están cumpliendo su rol principal (puesto que ahora sólo enlaza a noticias). Se tiende a acceder a la sección "Estudiantes" en busca del perfil del egresado sobre todo al encontrar el rótulo "Ex-alumnos", pareciera que hay una mayor relación entre ambos conceptos. "Información académica" se entiende como un portal donde se encuentra información en relación a lo académico, a lo que pueda venir de la facultad hacia el alumno, mientras que nosotros planteamos un canal de comunicación específico de secretaría de docencia / administración hacia los alumnos. El hecho de que al entrar al Enunciado y el último rótulo aparezca encendido (rojo), hace que comience a leer de abajo hacia arriba.


  • ¿Revisar qué docentes erigen el "cuerpo académico"?


Análisis cuantitativo:

  1. Tiempo: 10,8 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Navegación: Nav Escuela > Cuerpo académico
  2. Confusiones/dificultades: Ninguna.
  3. Observaciones: La tarea no presenta dificultad. El rotulado y el contenido es claro.


  • ¿Encontrar las opciones de "becas y ayudas estudiantiles"?.


Análisis cuantitativo:

  1. Tiempo: 3,3 minutos.
  2. Número de clicks erróneos: 19
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Navegación: Nav Estudiantes > Asuntos Estudiantiles > Nav Estudiantes > Servicios > Nav Escuela > Portada información académica > Nav Estudiantes > Asuntos estudiantiles > Servicios > Nav Extensión > Nav Amereida > Nav Escuela > Nav Estudiantes > Cuerpo Coordinador > Enlace externo PUCV > Enlace externo Fondo Solidario > Nav Admisión > Becas y ayudas estudiantiles
  2. Confusiones/dificultades:
    1. "¿Ahí está? En el DAE"
    2. Titubea en entrar al rótulo "Admisión" sin embargo prefiere Estudiantes y vuelve a buscar en Asuntos estudiantiles.
    3. "No imaginé que estuviera en Admisión porque lo relaciono con Asuntos estudiantiles, ahora que lo veo le encuentro relación pero no pude pensarlo antes"
  3. Observaciones: Se tiene por concepción que becas y ayudas está dentro del rótulo "Estudiantes", ya que ahí se despliega también "Asuntos estundiantiles", rótulo que redirecciona y además se asemeja a DAE (Dirección de Asuntos Estundiatiles". Al ver que no estaba ahí, ve en "Servicios", de nuevo nada que sirva. Nuevamente "Información académica" es parte de la búsqueda, a pesar de que ya ha ingresado el rótulo pareciera ofrecer otro contenido. Incluso "Cuerpo Coordinador" ofrece enlaces a otros sitios que hablan de créditos y la Federación de estudiantes de la PUCV.Nuevamente el aside no cumple su mejor función, la utilidad de enlazar páginas no está funcionando. Existe una tendencia de ordenar los contenidos de una cierta forma a nivel general y si tratamos de cambiar eso, puede que los usuarios no encuentren el contenido de una forma fácil.


  • ¿Buscar los "servicios" implementados por la facultad?

Análisis cuantitativo:

  1. Tiempo: 8,3 segundos
  2. Número de clicks erróneos: 0
  3. Número de clicks acertados: 2

Análisis cualitativo:

  1. Navegación: Nav Estudantes > Servicios
  2. Confusiones/dificultades:
    1. "Lo encontré altiro porque ya había pasado por ahí"
  3. Observaciones: La tarea no presenta dificultad. Con las tareas anteriores ya había encontrado el rótulo Servicios, por lo que se le hizo fácil volver a encontrarlo.
Evaluación de resultados de pruebas de usuario
Pruebas genéricas

Las pruebas genéricas hacen referencia a el tipo de tareas donde están involucrados 5 usuarios base para establecer, posteriormente, estadísticas gráficas y determinadas por la reaccción de dichos usuarios. Estas pruebas están basadas en el análisis cuantitativo, implementando los parámetros de tiempo y número de clicks de interacción que realiza la persona.

La evaluación del análisis cualitativo implica establecer parámetros que dilucidan -de acuerdo a las estadísticas- las descripciones del nivel de complejidad, la problemática sugerida desde los datos y su respectiva corrección para amplificar el diseño y la rama de los contenidos del sito.

1. ¿Encontrar la malla curricular?

ESTE AÚN FALTA 1 USUARIO
  1. Observación:En términos generales, la prueba se observa con resultados positivos. Contabilizando a cinco de los usuarios, el promedio de tiempo fue de 14,08 segundos para realizar la prueba. Sólo uno de ellos hizo presneta clicks de interacción errada para navegar el sitio.
  2. Nivel de complejidad: facilitado.
  3. Problemática sugerida Ninguna en particular.
  4. Correción de problemática Ninguna en particular.

2. ¿Encontrar el perfil del egresado?

Texto de descripción de la imagen
  1. Observación: Esta prueba presenta variadas dificultades. El promedio de duración es de 114,44 segundos para realizar la prueba. Los clicks errados de interacción abundan por cada persona que navega los contenidos.
  2. Nivel de complejidad: muy complejo.
  3. Problemática sugerida: Esta problemática contiene un error de conceptos; en primer lugar, la palabra "egreso" sugiere a la persona buscar en "ex-alumnos", dentro del rótulo "Estudiantes". El "egresado" se entiende como una persona, en este caso, el "estudiante", y no como un devenir del oficio o de la carrera. De manera tal se observa este error en reiteradas ocasiones. Por otro lado, el rótulo "Extensión" en la barra principal de navegación, hace pensar en el concepto de "egresado". Por último, también, el concepto de "perfil" contempla -según estándares actuales de la red como redes sociales-el perfil de una persona, su "fotografía", y una breve o extensa información sobre ella. Esta imagen o expectativa es lo que hace al usuario navegar con problemas.
  4. Correción de problemática:
    1. El concepto "egresado", que refiere a una persona, será cambiado por "egreso". Además, para evitar errores,
    2. Se complementará en el sub-rótulo "Ex alumnos", como contenido, dentro de la sección "Estudiantes".

3. ¿Encontrar el cuerpo académico?

Texto de descripción de la imagen
  1. Observación: Esta tarea se observa positiva en cuanto a sus resultados. El tiempo de realización para la tarea es de 12,34 segundos, con la mayoría de sus interacciones acertadas. Sólo uno de los usuarios vaciló entre todos los rótulos de la navegación para hallar el subrótulo "cuerpo académico".
  2. Nivel de complejidad: muy complejo.
  3. Problemática sugerida: Ninguna en particular.
  4. Correción de problemática: La corrección está fundamentada en reiterar que el rótulo será "cuerpo académico", lo cual incluye al "staff" de la e[ad] y no "cuerpo docente", que no lo hace.

4. ¿Contactar a la e[ad]?

Texto de descripción de la imagen
  1. Observación: El promedio de tiempo para realizar la prueba es de 22,3 segundos. Este tiempo más holgado se justifica en lo "duditativo" que se observa por parte de la persona. los clicks de interacción, aunque correctos, albergan un estado de confusión por parte del usuario.
  2. Nivel de complejidad: Complejo.
  3. Problemática sugerida: La persona, al escuchar la palabra "contacto", suele asociar el patrón estandarizado en los medios populares y tiende a hacer scroll para revisar la información en la parte inferior del sitio (footer). Actualmente, el link de contacto se halla en el footer, y sin embargo no está del todo visible. Al no hallar los datos requeridos, la persona vuelve a la barra de navegación principal y hace click en "Escuela"; allí es facilmente encontrable el rótulo "contacto", y de esta manera ingresar al formulario de contacto. Por otro lado, uno de los usuarios erró la navegación al ingresar en "Extensión" para hallar el contacto. El concepto "Extensión" fue asociado con "Contacto" o "contactar"; es de aquí que devino el problema.
  4. Correción de problemática: Dentro de las resoluciones, se tienen en consideración las siguientes:
    1. El link de "contacto" dentro del Footer tendrá una leve resaltación en el color tipográfico, para hacer más evidente su estado "linkeable". Además, el orden correcto de la jerarquía en los contenidos del footer será reestablecido.
    2. Por la presencia del "mapa" implementado desde "mapbox" (Open-street-map), el foter queda dividido en una sección superior y otra inferior. Esta gráfica y disposición de los elementos ha sido críptica para comprender la jerarquía de datos. Por esta razón, el mapa será repuesto e incorporado en la parte inferior del footer. Los elementos de datos serán reordenados para generar un horizonte de información superior y otro inferior. El link de contacto será de color rojo.

5. ¿Encontrar la dirección de la casa de estudios?

Texto de descripción de la imagen
  1. Observación:El tiempo promedio para la su realización es de 25,38 segundos. Esta tarea está directamente relacionada con la anterior. La información de localización -dentro del sitio-, se halla en dos secciones diferentes. Una es propiamente en la Home, incrustada en el footer de la página, y otra en la sección "Escuela", en el sub-rótulo "Campus".
  2. Nivel de complejidad:Facil.
  3. Problemática sugerida:Es evidente que el tiempo promedio para una tarea de esta índole es mayor de lo que se esperaría. El problema se hace presente por -nuevamente- la jerarquía de los contenidos en el Footer. Otro punto relevante es el hecho de que el usuario se halle ante una prueba y no ante una situación real de requirimiento de información. Esto provoca ciertas fisuras en el contexto que se busca evaluar. Un ejemplo de lo anterior tiene que ver con la presencia del extenso mapa en el footer de la Home. Cuando se le pregunta a la persona por obtener la dirección de la casa de estudios, aun bajando al footer por convención, sin hallar la información escrita, no recurre al mapa para consultar la dirección. Esta paradoja es, aparentemente, resultado de la tarea en sí.
  4. Correción de problemática:El footer será re-diseñado con jerarquías de contenido ordenado en diferentes horizontes de lectura.

6. ¿Compartir una noticia de la e[ad]?

Texto de descripción de la imagen
  1. Observación: El promedio de duración para realizar la prueba es de 30,9 segundos: Los clicks de interacción fueron bastante acertados. El hecho se fundamenta en las dos formas existentes de compartir una noticia. La primera es desde el botón alineado a la derecha de la noticia. La segunda es a través de los íconos de redes sociales al final de ella.
  2. Nivel de complejidad: facil
  3. Problemática sugerida: Uno o dos usuarios pasaron de largo con el ícono de "compartir" alineado a la derecha de la noticia. Al parecer, en su color gris y en el hecho de no estar desplegado desde el principio, el ícono pasó desapercibido un par de veces. Esto ocurre además por la convención que tienen las personas de buscar las redes sociales al final de la noticia.
  4. Correción de problemática: Tanto el ícono de "editar" como el de "compartir" (situados uno bajo el otro) tendrán el color rojo desde su estado inactivo. Esto permite que la persona se fije de forma más inmediata en los íconos.
Pruebas específicas

Las tareas específicas involucran una menor cantidad de usuarios (3, 2 o 1) y están determinadas por la especialidad del usuario investigada en el preceso de "Personas y escenarios". Estos datos son útiles para estudiar las reacciones a tareas más específicas o requeridas por una persona en particular.

  • (3, 2 usuarios por tarea)
  • (1 usuario por tarea)

Iteración en uso

Una vez implementado

Pyxis

Incorporación de clases extendidas

Versatilidad del framework (cómo funciona)

Documentación extensiva en gh-pages

Reflexión del proyecto

Paper