Título 3: Camila Valenzuela

De Casiopea





TítuloTítulo 3: Camila Valenzuela
Tipo de ProyectoProyecto de Titulación
CarrerasDiseño Gráfico
Alumno(s)Camila Valenzuela
ProfesorSylvia Arriagada

Planificación del Proyecto: 3º etapa

Carta Gantt: Plataforma de Eventos Académicos

Carta Gantt T3 imagen.png

Área Arquitectura de la Información

  1. Revisión del Mapa de Navegación
  2. Revisión de Mapa de Clases (y Diagramas de Casos de Uso)

Área Diseño de Interacción

  1. Partituras de Interacción
  2. Wireframes
    1. Pruebas de Usuario

Actividad con Taller

  1. Sesión 1: Usabilidad
  2. Sesión 2: Elementos de Interfaz

Área Diseño de Interfaz

  1. Definición de los componentes de la Interfaz
  2. Diseño Cromático
  3. Diseño Tipográfico
  4. Diseño Icónico
  5. Maqueta Diseño de Interfaz
  6. Entrega: Carpeta y Lámina

Propuesta

Se propone el diseño de una Plataforma de Eventos Académicos que permita organizar, gestionar y difundir dichas actividades.
El proyecto nace a partir de la experiencia en el desarrollo de un congreso académico-científico de la PUCV, la Semana de la Matemática, desde su planificación, ejecución de las tareas, realización del evento y posterior evaluación.
En conclusión a esto se identifica la necesidad de sistematizar el proceso de desarrollo de un evento tomando en cuenta la participación de todos los actores involucrados (organizadores y asistentes) a través de una plataforma web.
Es, por lo tanto, un sitio dirigido a la comunidad universitaria, para este caso, de la PUCV.

Objetivos

Objetivo general

Gestionar eventos académicos de la PUCV

Objetivos específicos

  1. Facilitar la planificación y desarrollo de las etapas previas al evento.¿Cómo? a través de un calendario de tareas en donde cada actividad tiene un estado de ejecución y una persona a cargo de manera que todos los involucrados están en conocimiento de ello.
  2. Difundir eventos de la universidad tanto dentro de la unidad académica que gestiona el evento como en las demás.¿Cómo? los eventos serán publicados en un único sitio dispuestos temporalmente y con la posibilidad de ser mostrados al usuario en función de la categoría que este quiera ver. Opcionalmente se notificará de forma periódica sobre nuevos eventos publicados a las personas registradas que así lo deseen.
  3. Difundir eventos de la universidad en otras instituciones y organismos a nivel regional, nacional e internacional, según sea el caso.¿Cómo? la web, en el ámbito de difusión, se apoyará del registro y formación de comunidades en torno a esta. Así, la información podrá ser compartida en redes sociales dirigida a públicos específicos, mediante listas de correo, etc.
  4. Constituir una fuente de documentación de los eventos y los contenidos presentados en estos.¿Cómo? un evento pasado no es eliminado sino que pasa a formar parte de un registro de eventos pasados. Además, cada evento podrá tener asociada a él una "versión anterior" del mismo. Es decir, que en eventos que se realizan de forma periódica no será necesario "crear" un nuevo evento sino que crear una nueva versión del mismo.
  5. Contribuir al posicionamiento de la PUCV por medio de la difusión de los eventos académicos que en ella se realizan.¿Cómo? el sitio por sí mismo lo irá logrando a medida que se cumplan los objetivos anteriores.

Metodología

Posterior al planteamiento de la propuesta, en la que se identificaron los objetivos y las audiencias (Personas y Escenarios), corresponde el desarrollo de las siguientes etapas:

Benchmarck

Plataformas de Gestión y Organización

  1. Portal de Congresos Universidad Nacional de la Plata
  2. Plataformas de Gestión de Conferencias
  3. Plataformas online de Gestión de Eventos

Plataformas de Difusión de Universidades: Agenda

  1. Se puede buscar por: "organizador", "lugar", "tipo de evento" y tiempo: hoy, mañana, una semana, dos semanas, un mes.
  2. Se cruza la información entre los filtros y la búsqueda.
  3. Hay un calendario permanente del mes.
  4. Hay un recuadro informativo para quien quiere publicar un evento: ¿Quieres subir tu evento a la Agenda UC? Si quieres subir tu evento o actividad a la Agenda UC, debes identificarte como administrador de tu unidad o facultad al mail agenda@uc.cl y te habilitaremos una cuenta para subir tus propios eventos y administrar tu propio calendario.
  5. Los eventos se muestran desde los más próximos. Al parecer, si hay más de un evento en un día, el orden que sigue es alfabético.
  6. Contenido de la vista previa de los eventos: Imagen, título, fecha, hora y lugar.

Arquitectura de la Información

Al definir la Arquitectura de la Información en la etapa anterior, se determinaron las siguientes estructuras:
Mapa de Contenidos

Archivo:Eventos.pucv.cl mapa de navegación2-01.png
Segundo Mapa de Contenidos de la Plataforma

Mapa de Navegación

Archivo:Eventos.pucv.cl mapa de navegación2-02.png
Mapa de Navegación Nivel 1, Vocabulario Visual J.J.Garrett

Diagrama de Clases

Mapa de clases 1

Diseño de Interacción

Pasando al área del diseño de interacción, se realizaron algunos Wireframes que definieron en parte algunas estructuras visuales y relaciones (como el calendario, las etiquetas y la forma de ubicar los eventos). Sin embargo el estado de estos es aún débil.
La planificación de esta etapa del proyecto propone un rediseño de los wireframes a partir de una revisión a la arquitectura de la información.
Esta vez se tomará como punto de partida los conceptos de Mobile First y Responsive Web Design.

Sesiones con taller

UNO: Corrección de wireframes
Se realizarán correciones sobre los wireframes para incorporar los diferentes comentarios e ideas que surjan de la sesión. Esto de hará con lápices y papeles, luego de explicado el sentido del proyecto y el estado actual de la propuesta, para mayor libertad de los alumnos. A partir de estas correcciones se realizará la última maqueta antes de pasar a la etapa del diseño visual.
Objetivo: Realizar correcciones estructurales al sitio que permitan pasar a la etapa del diseño visual
DOS: Elementos de Interfaz
Para la segunda sesión se solicitará el diseño de determinados elementos de la interfaz (íconos, botones, tipografía, color, etc) definidos previamente y dentro de parámetros establecidos.
Objetivo: Visualizar otras posibilidades en el diseño que ayudarán o complementarán la propuesta

Diseño de Interfaz

Arquitectura de la Información: correcciones

Mapa de Navegación: versión 3

Es extraño que existan 2 tipos de perfil si la única diferencia entre ellos es que el organizador tiene la opción de crear (y gestionar) eventos. El problema es que no cualquier persona debe poder crear un evento, ya que son eventos académicos de la PUCV. Entonces ¿dónde crear un "filtro"? La opción es crear un único perfil y que al activar el botón de creación de un evento solicite un correo electrónico @ucv.cl en caso de que la persona no lo tenga asociado a su cuenta.
Hay un error de términos en "Eventos Creados" por el Organizador, ya que los eventos a los que asiste o en los que expondrá no necesariamente los ha creado él mismo. Se propone la opción de separar los eventos creados de los eventos en los que participa como asistente o expositor.

Sobre este mapeo, reordené algunas cosas para no repetir contenidos y agregué contenidos a la información general.

Wireframes 2da etapa

Wireframes Navegación Smartphone

Navegación Wireframes Smartphone

Wireframes Notebook

Tareas de los Eventos

  1. Invitaciones y Programa: Listado de invitados, Tarjetas de invitación, Fecha despacho, Fecha confirmación, Imprenta, Programa, Invitados especiales, Autoridades.
  2. Espacio e Implementos: Reserva de espacio, Podio, Mesa de trabajo, Banderas, Mástiles, Mesas de apoyo, Arreglos florales, Fondo escenario, Sillas, Estacionamiento, Mapa del lugar y accesos, Señalética.
  3. Requerimientos Audiovisuales: Música Ambiental, Iluminación, Amplificación, Data y control remoto, Telón de proyecciones, Puntero, Probar presentaciones, Micrófono, Fotógrafo, Camarógrafo, Conexión a internet, Adaptadores.
  4. Otros: Reconocimientos, premios, regalos, diplomas, certificados, etc; Carpetas, lápices, documentos, etc; Coffe, coctel, cena, etc; Transporte; Ubicación de invitados especiales y autoridades; Maestro de ceremonias; Etiquetas de asientos; Agua; Libreto; "Staff" (Personal de Apoyo)

Wireframes Tercera versión

Correciones a partir de Pruebas de Usuario

Sobre la "Convocatoria"
Usualmente no se llama convocatoria, sino que se llama "anuncio". Dentro del formulario de registro para estos casos, además del nombre de la persona (llamada autor) se pide la filiación (de dónde viene, normalmente una universidad), el país, el título del trabajo, el resumen y qué tipo de intervención será (plenaria, subplenaria, conferencia, poster, etc) cuando hay de distintos tipos.
El "descargar bases" no se entiende. En caso de que existan archivos para descargar, estos deberían estar indicados en el mismo texto de descripción para que estén dentro de un contexto en donde se explica de qué de trata.

Sobre el menú del perfil
Las opciones que se despliegan: "mis eventos" y "crear evento" son innecesarias. Sólo debería ir al perfil porque "mis eventos" está inmediatamente en la página del perfil y para crear un evento hay un botón al lado.
Sobre los contenidos del evento
Falta agregar al comité científico y al comité organizador.
Sobre la programación
En las actividades debería ir por separado el título y el tipo de actividad.
Sobre los expositores
La descripción de los expositores no debería ser obligatoria, debería ser opcional.
Sobre las tareas
Las tareas deberían poderse ver todas en una misma lista. Al crear una nueva tarea tengo que poder clasificarla (si es de tipo académica, financiera, etc.)
Sobre los listados de inscripción
"Se podrían filtrar de acuerdo a la información que se recopila en la ficha de inscripción y que se pueda exportar a excel". El botón "descarga" era para descargar a excel, pero no se entiende. Mejor cambiar "descargar" por "exportar".
Sobre la inscripción
Es mejor crear un único botón de inscripción en donde se seleccione que tipo de entrada se va a pagar, si es que es de pago. De esta forma no es necesario hacer tantos formularios distintos, sino que se hace un único formulario.

Diseño de Interfaz

Tipografía

Color

Header y Footer

Header

Header-log-out.gif


Header-log-in.gif


Footer

Eventos PUCV Footer.jpg


Eventos PUCV Footer hover.jpg


Home

Comportamiento de los cuadros de vista previa de los eventos:
En un estado normal o inactivo se muestra el título y el tipo de evento. Luego, al pasar el cursor sobre el cuadro se agrega la información de la fecha en la parte superior por ser el dato de mayor relevancia en el momento en que la persona se interesa por un título y luego al tipo de evento se le agrega la o las unidades que lo organizan. El título del evento pasa a un segundo plano para la correcta visualización de la información que lo complementa.

Cuadro-vista-previa-evento.gif

Perfil

Comportamiento de los elementos del perfil:

Eventos-PUCV-Perfil.gif

Configuración de Evento

Contenidos

Tareas y Presupuesto

Invitaciones y Difusión

Configuración de Evento: correcciones al 29 de mayo

Sitio del Evento

Elementos de Interfaz Gráfica

Correcciones hasta el 2 de junio

Visualización de Evetos

Prueba 1

Archivo:Visualización de Eventos 1.png
Visualización de Eventos: Marzo-Mayo 2014 Prueba 1

Prueba 2

Archivo:Visualización-de-Eventos-2.png
Visualización de Eventos: Marzo-Mayo 2014 Prueba 2

Bibliografía

Paper

  1. Celso Gonzales Cam: Arquitectura de la Información

Web

  1. Principios del Diseño de Interacción de Bruce Tognazzini
  2. Principios Heurísticos del Diseño de Interfaz de Jakob Nielsen
  3. Event Manager Blog
  4. Tipografía Digital
  5. Patterntap

Recursos

  1. Random User