Diseño de Sitio Web Rolando Rojas - Etapa II

De Casiopea


TítuloDiseño de Sitio Web Rolando Rojas - Etapa II
Tipo de ProyectoProyecto de Titulación
Palabras Clavesitio web, rolando rojas
Período2014-2014
AsignaturaTaller de Diseño Gráfico Titulación 2,
Del CursoTaller de Diseño Gráfico Titulación 2,
CarrerasDiseño Gráfico"Diseño Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property.
Alumno(s)José Miguel Ortega
ProfesorSylvia Arriagada


Antecedentes

Planificación del Proyecto

Objetivos del Proyecto

Esquema etapa II rolando rojas.png

Objetivo General

Definir una metodología de difusión para la obra fotográfica de Rolando Rojas, esto a partir desde tres aristas del diseño gráfico: soporte web, editorial y expositivo. Teniendo en cuanta las relaciones gráficas entre estas diferentes realidades.

Metodología de Trabajo

Se consideran 5 etapas para el desarrollo del proyecto, de las cuales 4 el alumno se propone desarrollar durante sus etapas de proyecto de titulación. No se considera la última ya que esta se considera y piensa que es el culmine de su trabajo, el momento en que el alumno deja reposado el trabajo en una situación real.


CATALOGACIÓN DEL MATERIAL Corresponde a la etapa realizada por el alumno junto a dos compañeras de trabajo durante la etapa de titulación pasada. En ella los alumnos se acercaron a la otra fotográfica de Rolando, diseñando un código de catalogación del material y el ponerlo en práctica con todo el archivo que Marisol Rojas posee en sus manos.


DISEÑO DE LIBRO DE FOTOGRAFÍA Se trata de la etapa de diseño que está llevando a cabo Carolina Núñez, compañera de trabajo. En esta etapa se propone el diseño de ediciones que difieren de contenido en cuanto a las series fotográficas que contienen.


DISEÑO DE SITIO WEB Etapa que se lleva acabo durante la presente etapa de titulación. Dentro de esta propuesta de sitio web se considera el presentar el proyecto a un fondo concursable para el desarrollo font de este mismo. Para lo cual se vuelve necesario el diseño de un Manual de Estilos Web, el cual evoca a todas aquellas decisiones gráficas tomadas desde la sensibilidad del diseñador.


EXPOSICIÓN Se plantea como el cierre del proyecto de titulación, no confundir con la finalidad del proyecto, ya que este es la instancia última de difusión. En ella se planea exponer el material fotográfico de Rolando y presentar los proyectos tanto de edición como web. Para aquello, durante esta etapa de titulación se trabaja en un catálogo previo se selección de posibles fotografías a exponer.

Marco Teórico

Abstract

La presente revisión bibliográfica tiene su finalidad en abrir un campo de estudio entorno al retrato y su composición en diferentes oficios; fotografía, pintura, teatro, etc. Esto como un planteamiento a modo de marco teórico para el diseño de un sitio web que albergue y presente todo el trabajo artístico realizado por Rolando Rojas ligado al retrato fotográfico. Cabe menciona que Rolando se desempeñó como fotógrafo social en Valparaíso y sus alrededores durante la segunda mitad del siglo pasado. Reconocido como el “fotógrafo de las novias”, Rolando trabajó principalmente el retrato en blanco y negro, siendo este el principal motivo por lo que es recordado hasta el día de hoy.

Durante una etapa anterior se llevó a cabo un proceso de levantamiento de información ligado a la catalogación del archivo fotográfico de Rolando Rojas; el organizar y analizar el contenido según su tipología (tipo de fotografía, formato, soporte, año de capturada, etc.). El encuentro directo con el material tangible y las reuniones con Marisol Rojas -hija de Rolando- permitió entender a grandes rasgos el proceso creativo del fotógrafo, en donde la manera de componer el retrato a través de una mirada indirecta por parte de la persona fotografiada (en la mayoría de los casos) se vuelve un punto de interés, situación con la cual se busca otorgarle un sentido al modo de presentar las fotografías en el sitio web.

Tras lo anterior, la siguiente revisión bibliográfica pretender poner en discusión la pregunta ¿Cuál es el rol de la mirada dentro de la composición de un retrato? Y ¿cómo esta se relaciona con el resto de los elementos que están en juego? (luminosidad, encuadre, pose, etc.), esto con el fin de poder describir de manera precisa el retrato de Rolando Rojas, y así presentarlo de un modo elocuente con el carácter de su fotografía.

La Mirada como Elemento que Define una Intención Fotográfica

Se decide que para realizar un planteamiento entorno al modo de presentar las fotografías de Rolando Rojas en un sitio web se vuelve necesario definir y expresar el carácter de su obra fotográfica, con lo cual se busca abstraer esta observación y convertirla en un experiencia al momento en que el usuario se encuentre con dicho material.

Para esto se vuelve primordial entender que la interrogante entorno a esta parte de la investigación se plantea en base a dos situaciones, por un lado el proceso o método de composición de un retrato en su sentido más amplio –a través de diferentes oficios-, por otro lado, la relación de esta realidad con otras situaciones que se presentan de manera paralela: la luminosidad, la pose, encuadre, etc.

El retrato como una interpretación desde la sensibilidad

A través de la historia, el retrato ha tenido una gran presencia en el ámbito de la creación artística, cuya principal función en muchos casos ha sido definida como un modo de mantener la imagen de la persona retratada a través del tiempo: ya sea el rostro de los reyes persas en monedas en el siglo VI a.C., como en un retrato particular de simplemente de un ser cercano. Ahora bien, en cuanto al modo de definirla, muchos han aportado desde distintos oficios una diversidad de visiones en cuanto a este tema. Georg Simmel, filósofo alemán, en 2011 definió al retrato como “una representación de lo que vemos de manera puramente sensible, es decir, lo que podríamos ver si nuestra sensibilidad fuera bastante autónoma”. Bajo este sentido se podría comenzar a entender que el retrato no responde de manera completa a una representación fidedigna de la realidad, sino más bien se relaciona de manera directa con el mundo sensible. Algo similar nos señala Pedro Azara en El Ojo y La Sombra: “todo retrato consiste en una representación… mediante la perfecta y plausible reproducción de la apariencia.” , a lo que más adelante agrega una cita de Clito, antiguo escultor griego, “además de lo visible, un buen retratista tenia que se capaz de transmitir la vives del alama del modelo. Es más, la obra era válida y se desmarcaba de las reproducciones artesanales carente de vida, si comunicaba el espíritu del modelo los espectadores. El artista, por tanto debía conseguir que la materia hiciera visible algo tan impalpable, secreto y oculto como el alma del modelo”. Esta representación más bien subjetiva relacionada con los retratos, y que alude al mundo del retratado es una concepción que a través de la historia ha ido cambiando, los antiguos neerlandeses se interesaban más bien en que el retrato fuese una representación exacta de la realidad, en donde se cerraban a la interpretación psicológica, situación que para el siglo XV cambia, ya que en esta época el retrato “comienza a comunicar el estado de ánimo, el talante, la actitudes intelectuales y morales”, en donde “se llega tan lejos que, por una inversión dialéctica, esta representación psicológica desemboca en un temor a exponer los propios sentimientos e ideas”. (Norbert Schenieder, Historiador del Arte).

Si se observa detenidamente cada una de las posibles definiciones de retrato, es posible notar que todas aluden a la representación del retratado mediante el mundo sensible, de las emociones. Ahora, representar significa “hacer presente algo con palabras o figuras que la imaginación retiene” , en donde este presentar muestra la realidad física, concreta del retratado mediante el mundo sensible de las emociones.

El rol del rostro en la composición de un retrato

Al señalar que un retrato se compone mediante un complemento entre la realidad y el mundo de las emociones, se vuelve necesario entender como este último punto hace presencia en un hecho tangible como es el retrato. Para muchos, el rostro representa el medio de reconocimiento de un ser, lo que caracteriza su individualidad, en donde el retrato pone en evidencia la identidad de una persona. En una conversación con José Balcells (diseñador Gráfico y Escultor), este señala que “en el rostro de una persona lo que le entrega individualidad son 4 rasgos: los 2 ojos, la nariz y la boca” , a lo que él llama “primer milagro”, en donde el segundo correspondería al hecho en que a pesar de que “la mayoría de las personas poseen estos rasgos, nunca estos son igual a otros”, y es mediante la configuración de estas realidades que el ser expresa su mundo interior. George Simmel señaló en 2011 que “el alma se expresa con mayor claridad a través el rostro… el rostro es lo que posee en mayor medida una unidad interna. Baste una prueba: un cambio, real o aparente, en un solo de los elementos del rostro modifica de inmediato todo su carácter y expresión, por ejemplo, la contracción de los labios, la forma de mirar, de fruncir las cejas.” Pareciera que mediante la cualidad de expresión del rostro y de los elementos que lo componen, el artista es capaz de dar cuenta del mundo interior del retratado a través de la singularidad: “el retrato singulariza al ser humano. El artista lo aísla de la multitud. Luego, hurga, en su faz para sacar a la superficie algún rasgo, un deje que lo personaliza: el alma amanece a través del brillo de los ojos, como sostenía Sócrates” (Pedro Azara, 2002).

Se vuelve interesante como a través de diferentes escritos se reitera en la función del rostro y el modo de componer la expresión que este conlleva dan cuenta, o más bien, se relacionan con el área sensible de las personas. Ahora bien, un retrato no sólo se compone de un rostro, sino también de luminosidad, de un fondo, de una pose, sin olvidar el contexto histórico, político y social al que este puede pertenecer y la técnica con que este fue llevado a cabo, situaciones que en este caso, como se señaló en un inicio de la revisión bibliográfica, no tienen cabida. Bajo este contexto se vuelve primordial indagar en el rol de la mirada dentro del retrato.

El Rol de la Mirada en la Composición de un Retrato

Anteriormente, y de manera reiterativa se ha señalado la importancia de la mirada dentro del retrato y su capacidad de expresión, en donde Simmel señala: “en la capacidad de alcanzar un máximo de expresión con el menor movimiento, el ojo no tiene parangón…”a lo que más adelante agrega “a mismo tiempo el ojo lleva al punto máximo la capacidad del rostro de reflejar el alma, el ojo también lleva a cabo, en el plano puramente formal, la realización más sutil: interpretar el fenómenos sin necesidad de remitirse a una espiritualidad invisible que se ocultarías detrás de fenómeno”. Bajo este contexto se comienza a entender como la mirada, a través del ojo, posee una importancia en cuanto al complemento entre lo real y lo espiritual –se mueve entre ambos mundos-, otorgándole así una importancia clave dentro de la realización de un retrato. En cuanto a la mirada en la fotografía Roland Barthes en su libro La Cámara Lúcida: Nota sobre la fotografía señala que “la fotografía separa la atención de la percepción, y que sólo muestra la primera, a pesar de ser imposible sin la segunda; se trata de lo aberrante, de una noesis sin noema, de un acto de pensamiento sin pensamiento… lo que ocurre es que, ahorrándose la visión, la mirada parece estar retenida por algo interior”. En este sentido se vuelve a hacer hincapié en el contexto de la sensibilidad que se entrega a través de la mirada, pero en este caso, en una situación indirecta, en el mirar sin mirar, como si le hecho que conlleva y el problema relacionado con la mirada fuese algo únicamente ligado a la sensibilidad, algo que Pedro Azara comparte hasta cierto punto, señalando: “Un buen retrato es inconfundible; manifiesta lo rasgos personales e un determinado individuo, lo cual no quiere decir, curiosamente, que la imagen deba necesariamente parecerse físicamente al modelo. Debe, ante todo, evocarlo espiritualmente, permitiéndole manifestarse a través de la obra antes los sentidos de espectador, en donde la luz pareciera ser un elemento de reconocimiento”. El hecho de citar al autor anterior revela una intención dicha anteriormente al iniciar esta revisión bibliográfica: la relación del rostro con otro –específicamente la mirada con el resto de los elementos que conforman un retrato. Se comienza a entender la capacidad que posee la mirada –y el ojo- de revelar el alma del retratado, a partir de un hecho formal, en donde el destaque de esta realidad a través de la luz pareciera ser un hecho digno de estudiar.

La Luz en la Mirada del Retrato como Revelador de una Intención

Se ha señalado en repetidas oportunidades como el retrato busca representar de alguna manera tanto el alma como la realidad física del retratado, en donde la mirada pareciera ser el eje fundamental para la realización de dicha acción. La luz en este caso se plantea como una herramienta que permite responder una interrogante ligada a “qué aspecto de la personalidad o qué imagen del sujeto se desea ilustrar”. (Michael Freeman, 2000). Es mediante esta realidad tan primordial del retrato que se logra otorgarle una personalidad al retrato, y así destacar de una manera más óptima la mirada del retratado, Freeman continúa señalando: “en la mayor parte de los retratos, el interés está más en la personalidad que se transmite… situación en donde la luz puede resaltar o difuminar ciertas realidades… la iluminación lateral produce un contraste bastante definido en ambos lados de la cara, para un efecto más natural, el relleno de sombra tendría que tener un nivel aproximado a una cuarta parte de la iluminación principal. La luces secundarias, producen el efecto de un halo reluciente.”

El entender el rol de la luz en el retrato como una realidad que pretende destacar la personalidad con la que se busca representar a la persona retratada da cuenta de cómo esto se logra mediante el juego entre un hecho real y el mundo sensible al que evoca esta expresión artística. Situación que la propia mirada –a través del ojo- la cual “trae consigo la intuición, incluso la garantía, de que la solución dada a los problemas artísticas, problemas de pura visibilidad, de representación visual de las cosas, es también la solución a otros problemas que se entrecruzan entre el alma y el fenómeno, problemas de ocultación y revelación.” (Simmer, 2011). En pocas palabras la mirada podría ser el eje central del retrato, reveladora de un mundo interior, que mira sin mirar a través de situaciones tanto sensibles (como la dicha anteriormente) y formales, ya que es un hecho real, esto con una composición lumínica que sirve para destacar dicha realidad.

La Mirada de Rolando

La Mirada Indirecta a través de una Luminosidad Diagonal Una vez estudiado el retrato y su composición se vuelve necesario que Rolando Rojas debe ser presentado a través de la mirada. Rolando en sus retratos se destaca -en su mayoría- por realizar composiciones en donde el ser retratado no mira a la cámara, aun así logra transmitir una historia, una personalidad propia de este mismo ser. La luz por su parte se compone a partir de una diagonal -característica señalada por su propia hija Marisol Rojas-, cuyo juego de luces y sombra destaca la mirada y pose del propio retratado. Bajo este contexto, se decide presentar a Rolando a través de la mirada de su retratados, cuya composición luminosa se construye en base a una luz diagonal que destaca la mirada de sus retratados.

Fotografía de Estudio

Fotografía de Exterior

Vida Social

Mirada de Rolando - Completa

Archivo:Ambitos fotografías de rolando - ortega - 05-05.png

Arquitectura de la de Información

Propuesta 1

Propuesta 2

Propuesta 3

Propuesta 4

Propuesta Final

AI FINAL rolando rojas. titulo II.png

Mapas de Clase

Propuesta de Mapa de Clase I

Mapa de Clase I Sitio de Rolando Rojas .png

Propuesta de Mapa de Clase II

Mapa de ClaseII rolando rojas-02.png

Propuesta Final Mapa de Clase

Mapa de clase final rolando rojas titulo II.png

Partituras de Interacción

Propuesta I de Partituras de Interacción

Navegación de Fotografías desde la Home

Navegación de Fotografías desde Menú de Navegación

Navegación de Galería de Imágenes

Navegación de Biografía

Navegación de Contacto

Propuesta II de Partituras de Interacción

Navegación de Fotografías


Acceso a Galería de Imágenes


Navegación de Biografía y Cronografía


Navegación de Contacto

Diseño de Wireframes

Propuesta I

Propuesta II

Desktop

Tablet

Propuesta III

Desktop

Propuesta VI

Desktop

Tablet

Smartphone

Pruebas de Usuario

Luego de realizar una cuarta propuesta de wireframes en base a diferentes correcciones anteriores, se decide armar una maqueta navegable y probarla en 3 usuarios objetivos. El testeo se divide principalmente en 2 momentos: una primera etapa se le pide a los usuarios explayarse en relación a la home del sitio de Rolando Rojas a través de ideas acerca contenido y su disposición: lo que esperarían encontrar cada una de las diferentes secciones. Una segunda etapa y última etapa, se decide proponer a los posibles usuarios realizar 5 tareas dentro de esta misma maqueta, dando la posibilidad de hacer comentarios mientras navegaban la maqueta, estas tarea eran:

  1. Encontrar la galería de imágenes de "Borde Costero de Valparaíso y Viña del Mar"
  2. Encontrar la última fotografía de la galería de "Novias"
  3. Informarse en cuanto a la aparición de Rolando Rojas en Libros y Prensa
  4. Enviar un mensaje al administrador del sitio.
  5. Encontrar el evento realizado el 28 de Diciembre.

Las 5 pruebas de usuario fueron realizadas con la ayuda de Invisionapp para la construcción de la maqueta http://invis.io/RM1N7NO2U, y de SilverBack tanto para la grabación de la navegación, las reacciones faciales de los usuarios al realizar sus tareas como también para grabación de las voces en los momentos en que se hacían comentarios.

Usuarios

A continuación los perfiles de usuarios con sus videos correspondientes de la navegación de la maqueta, un resumen de las tareas hechas y una conclusión relacionada con los cambios que fueron hechos tanto en el mapa de navegación como en los wireframes.

Usuario 1

  • Nombre: Romina Lizama
  • Edad: 20 Años
  • Ocupación: Estudiante de Ingeniería Civil
  • Nivel de Usuario: Medio
Usuario 2

  • Nombre: Luis Ortega
  • Edad: 51 Años
  • Ocupación: Profesor
  • Nivel de Usuario: Bajo
Usuario 3

  • Nombre: Melany Marin
  • Edad: 22 Años
  • Ocupación: Estudiante Diseño Gráfico
  • Nivel de Usuario: Avanzado
Usuario 4

  • Nombre: Bárbara Jachura
  • Edad: 24 Años
  • Ocupación: Estudiante Diseño Industrial
  • Nivel de Usuario: Avanzado

Preguntas y Respuestas en Pruebas de Usuario

¿Qué tipo de contenido esperas encontrar en la Home del sitio?

  • U1: Encontrar fotografías de él, que al hacer click en cada una de las palabras destacadas se abra una galería con las fotografías de esa misma tipología.
  • U2: Links que me dirijan a su trabajo, tanto fotográfico como de otro tipo.
  • U3: Sitios con contenido específico, quizás no queda claro que es de fotografía, sería bueno dar a conocer.
  • U4: Se entiende que cada link se llevará a una galería fotográfica específica. Existe contenido de fotografía y otro de datos (otro menú).

¿Qué tipo de contenido esperas encontrar en "Acerca de Rolando"?

  • U1: Una foto de él, datos de su vida: como una biografía, información distinta a la de sus fotografías.
  • U2: Todo su despliegue como fotógrafo, datos de su vida y trabajo.
  • U3: Su historia, el despliegue de su trabajo, su relación con otros trabajos, como libros.
  • U4: Su vida, su trabajo, en qué se enfocó.

¿Qué tipo de contenido esperas encontrar en "Eventos"?

  • U1: Actividades relacionadas a Rolando, como también un registro de situaciones pasadas.
  • U2: Situaciones en las que él haya participado, u otras que próximamente vayan a suceder, exposiciones.
  • U3: Actividades relacionadas con el fotógrafo, tanto actuales como antiguas.
  • U4: Diferentes exposiciones que ha hecho.

¿Qué tipo de contenido esperas encontrar en "Contacto"?

  • U1: El modo de llegar a él, a su trabajo, un "contacto" con quien comunicarme para acceder a más información: un teléfono, un mail, cosas así.
  • U2: Alguien que me pueda ayudar si necesito comunicarme con el archivo de fotos, alguien que me pueda resolver una duda, información, más que nada un espacio de consulta.
  • U3: Un formulario para obtener material o un acceso para conocer a la persona quien está a cargo del archivo, un contacto con el administrador.
  • U4: El contacto de a su familia cercana, un acceso al material a través de su familia.

Observaciones en Cuanto a las Tareas a Realizar

Tarea 1: Encontrar la galería fotográfica de "Borde Costero de Valparaíso y Viña del Mar"

  • U1: Lo hace de manera rápida y eficaz.
  • U2: Llega a las fotografías de novias, pero confunde el esquema de la galería con la galería misma, cree que los cuadros pequeños será miniaturas de las fotografías mismas. Luego de rehacerle la pregunta hace click en la galería y logra acceder.
  • U3: Cree que el esquema de la galería corresponde a la galería en sí, luego se da cuenta que en ese mismo espacio existe un link que permite al acceso de la galería. Señala que de alguna forma se debería dar a entender que se puede acceder a la galería.
  • U4: Tienes problemas en entender el cómo a llegar a la galería desde una fotografía particular, señala que falta la palabra "galería", luego de un segundo intento logra la tarea.

Tarea 2: Buscar información relacionada al trabajo de Rolando publicado en libros y diarios

  • U1: Regresa a la home del sitio y realiza la tarea de manera rápida.
  • U2: Se dirige de manera rápida a "Acerca de Rolando" pero cree que al leer la biografía encontrará el contenido, luego de observar el menú lateral logra acceder al contenido y cumplir la tarea.
  • U3: Regresa a la home del sitio y cree que a través de "estudio" puede acceder al contenido. Una vez que se da cuenta que ese no es el camino correcto se dirige a "Acerca de Rolando" y luego a "En Libros y Prensa".
  • U4: Regresa a la home del sitio y realiza la tarea de manera rápida.

Tarea 3: Enviar un Mensaje al administrador

  • U1: Regresa a la home y se dirige rápidamente a "Contacto".
  • U2: Regresa a la home y se dirige rápidamente a "Contacto".
  • U3: Regresa a la home y se dirige rápidamente a "Contacto".
  • U4: Regresa a la home y se dirige rápidamente a "Contacto".

Tarea 4: Llegar a la última fotografía de la galería de Novias

  • U1: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.
  • U2: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.
  • U3: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.
  • U4: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.

Tarea 5: Encontrar un evento-exposición realizada el pasado 28 de Diciembre

  • U1: Llega de manera directa desde la home, indica que es necesario poner el año de realización.
  • U2: Se dirige a relevantes, al darse cuenta que no es posible llevar a través de esa vía, se dirige a eventos, busca la fecha indicada y cumple la tarea. Señala que pensó que en relevantes encontraría el contenido por el significado de la palabra misma.
  • U3: Se dirige desde la home, y cumple la tarea de manera rápida.
  • U4: Se dirige desde la home, y cumple la tarea de manera rápida.

Observaciones de los Participantes

  • U1: Lo que más se destaca en la home son las palabras claves que definen y ordenan las galerías de fotografías. Cada una de las opciones del menú central está claro en cuanto a su contenido, quizás el menú podría ser más grande y ubicarse en la parte superior del sitio.
  • U2: Cuidar un poco más las palabras, quizás utilizar conceptos para no confundir, pero en general el acceso al contenido está claro.
  • U3: Se vuelve necesario, sobretodo en la home, dar cuenta que se trata de un sitio web de un fotógrafo. Al ver los textos se piensa más en un relato que en un fotógrafo. Me gusta que no haya mucho scroll ni elementos que distraigan del contenido central: la fotografía.
  • U4: Se ve un sitio claro en cuanto al contenido y su acceso, nada distrae de su contenido central, se ve medido.

Observaciones Personales

  • El hecho de disponer un menú en la parte inferior del sitio no permite que los usuarios los vean y lo utilicen, más bien, para volver a la home utilizar el botón para ir atrás.
  • Se vuelve necesario redefinir algunas palabras a modo de concepto para no confundir a los usuarios y darle mayor tamaño.
  • A partir de lo dicho por Melany Marin se propone presentar ua nueva home, que mantenga la idea original haciendo partícipe de algún modo a las fotografías para así dar a entender que Rolando era fotógrafo.

Conclusiones

Diseño de Wireframes 4

WIREFRAMES5-01.png

Desktop

Diseño de Interfaz

Primera Propuesta de Diseño de Interfaz

Desktop

Segunda Propuesta de Diseño de Interfaz

Cuarta Propuesta de Diseño de Interfaz

Segunda Prueba de Usuario

Luego de realizar una primera prueba de usuario y realizar una segunda versión de diseño de interfaz, se decide armar una segunda maqueta navegable y realizar una nueva jornada de pruebas de usuario, esto con el fin de corroborar la usabilidad del sitio y generar feedback con posibles usuarios. En cuanto a los usuarios a los cuales se les aplicará el testeo, todos corresponden a alumnos de tercer año de diseño gráfico de la e[ad], esto con la finalidad de tener una opinión más crítica del sitio, tanto de su usabilidad como del diseño. Al igual que el testeo anterior, esta jornada de pruebas de usuario se divide principalmente en 2 momentos: una primera etapa en donde se les pide a los usuarios explayarse en relación a la home del sitio de Rolando Rojas a través de ideas acerca contenido, disposición y navegación: lo que esperarían encontrar cada una de las diferentes secciones. Una segunda etapa y última etapa, se basa en proponer a los usuario 5 tareas las cuales deben realizar dentro de la misma maqueta navegable, dando la posibilidad de hacer comentarios mientras la navegaban, cabe mencionar que algunas tareas se repetirán pero desde una orden más compleja, las tareas son:

  1. Encontrar la galería de imágenes de "Novias"
  2. Informarse en cuanto a una exposición llamada "Memoria del Puerto".
  3. Ponerse en contacto con el administrador del sitio.
  4. Encontrar la última fotografía de la galería de "Borde Costero"
  5. Investigar en cuanto a fotografías de Rolando Publicadas en Libros.

Las 5 pruebas de usuario fueron realizadas con la ayuda de Invisionapp para la construcción de la maqueta http://invis.io/261PWN73N, y de SilverBack tanto para la grabación de la navegación, las reacciones faciales de los usuarios al realizar sus tareas como también para grabación de las voces en los momentos en que se hacían comentarios.

Usuarios

A continuación los perfiles de usuarios con sus videos correspondientes de la navegación de la maqueta, un resumen de las tareas hechas y una conclusión relacionada con los cambios que fueron hechos tanto en el mapa de navegación como en los wireframes.

Usuario 1

  • Nombre: Daniela Gallardo
  • Ocupación: Estudiante de Diseño Gráfico
  • Nivel de Usuario: Avanzado
Usuario 2

  • Nombre: ‎Catalina Fairlie
  • Ocupación: Estudiante de Diseño Gráfico
  • Nivel de Usuario: Avanzado
Usuario 3

  • Nombre: ‎Isidora Correa
  • Ocupación: Estudiante de Diseño Gráfico
  • Nivel de Usuario: Avanzado
Usuario 4

  • Nombre: ‎Camilo Escobar
  • Ocupación: Estudiante de Diseño Gráfico
  • Nivel de Usuario: Avanzado
Usuario 5

  • Nombre: Claudio
  • Ocupación: Estudiante de Diseño Gráfico
  • Nivel de Usuario: Avanzado

Preguntas y respuestas en las pruebas de usuario

¿Qué tipo de contenido esperas encontrar en la Home del sitio?

  • U1: Encontrar fotografías de él, que al hacer click en cada una de las palabras destacadas se abra una galería con las fotografías de esa misma tipología.
  • U2: Links que me dirijan a su trabajo, tanto fotográfico como de otro tipo.
  • U3: Sitios con contenido específico, quizás no queda claro que es de fotografía, sería bueno dar a conocer.
  • U4: Se entiende que cada link se llevará a una galería fotográfica específica. Existe contenido de fotografía y otro de datos (otro menú).


¿Qué tipo de contenido esperas encontrar en "Acerca de Rolando"?

  • U1: Una foto de él, datos de su vida: como una biografía, información distinta a la de sus fotografías.
  • U2: Todo su despliegue como fotógrafo, datos de su vida y trabajo.
  • U3: Su historia, el despliegue de su trabajo, su relación con otros trabajos, como libros.
  • U4: Su vida, su trabajo, en qué se enfocó.


¿Qué tipo de contenido esperas encontrar en "Eventos"?

  • U1: Actividades relacionadas a Rolando, como también un registro de situaciones pasadas.
  • U2: Situaciones en las que él haya participado, u otras que próximamente vayan a suceder, exposiciones.
  • U3: Actividades relacionadas con el fotógrafo, tanto actuales como antiguas.
  • U4: Diferentes exposiciones que ha hecho.


¿Qué tipo de contenido esperas encontrar en "Contacto"?

  • U1: El modo de llegar a él, a su trabajo, un "contacto" con quien comunicarme para acceder a más información: un teléfono, un mail, cosas así.
  • U2: Alguien que me pueda ayudar si necesito comunicarme con el archivo de fotos, alguien que me pueda resolver una duda, información, más que nada un espacio de consulta.
  • U3: Un formulario para obtener material o un acceso para conocer a la persona quien está a cargo del archivo, un contacto con el administrador.
  • U4: El contacto de a su familia cercana, un acceso al material a través de su familia.

Observaciones en cuanto a las tarea a realizar

Tarea 1: Encontrar la galería fotográfica de "Borde Costero de Valparaíso y Viña del Mar"

  • U1: Lo hace de manera rápida y eficaz.
  • U2: Llega a las fotografías de novias, pero confunde el esquema de la galería con la galería misma, cree que los cuadros pequeños será miniaturas de las fotografías mismas. Luego de rehacerle la pregunta hace click en la galería y logra acceder.
  • U3: Cree que el esquema de la galería corresponde a la galería en sí, luego se da cuenta que en ese mismo espacio existe un link que permite al acceso de la galería. Señala que de alguna forma se debería dar a entender que se puede acceder a la galería.
  • U4: Tienes problemas en entender el cómo a llegar a la galería desde una fotografía particular, señala que falta la palabra "galería", luego de un segundo intento logra la tarea.


Tarea 2: Buscar información relacionada al trabajo de Rolando publicado en libros y diarios

  • U1: Regresa a la home del sitio y realiza la tarea de manera rápida.
  • U2: Se dirige de manera rápida a "Acerca de Rolando" pero cree que al leer la biografía encontrará el contenido, luego de observar el menú lateral logra acceder al contenido y cumplir la tarea.
  • U3: Regresa a la home del sitio y cree que a través de "estudio" puede acceder al contenido. Una vez que se da cuenta que ese no es el camino correcto se dirige a "Acerca de Rolando" y luego a "En Libros y Prensa".
  • U4: Regresa a la home del sitio y realiza la tarea de manera rápida.


Tarea 3: Enviar un Mensaje al administrador

  • U1: Regresa a la home y se dirige rápidamente a "Contacto".
  • U2: Regresa a la home y se dirige rápidamente a "Contacto".
  • U3: Regresa a la home y se dirige rápidamente a "Contacto".
  • U4: Regresa a la home y se dirige rápidamente a "Contacto".


Tarea 4: Llegar a la última fotografía de la galería de Novias

  • U1: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.

+U2: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.

  • U3: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.
  • U4: Se dirige de manera rápida a la galería correcta desde la home, y mediante el esquema de la galería fotográfica ubicada en el lado lateral pantalla accede a la fotografía.


Tarea 5: Encontrar un evento-exposición realizada el pasado 28 de Diciembre

  • U1: Llega de manera directa desde la home, indica que es necesario poner el año de realización.
  • U2: Se dirige a relevantes, al darse cuenta que no es posible llevar a través de esa vía, se dirige a eventos, busca la fecha indicada y cumple la tarea. Señala que pensó que en relevantes encontraría el contenido por el significado de la palabra misma.
  • U3: Se dirige desde la home, y cumple la tarea de manera rápida.
  • U4: Se dirige desde la home, y cumple la tarea de manera rápida.

Observaciones de los Participantes

  • U1: Lo que más se destaca en la home son las palabras claves que definen y ordenan las galerías de fotografías. Cada una de las opciones del menú central está claro en cuanto a su contenido, quizás el menú podría ser más grande y ubicarse en la parte superior del sitio.
  • U2: Cuidar un poco más las palabras, quizás utilizar conceptos para no confundir, pero en general el acceso al contenido está claro.
  • U3: Se vuelve necesario, sobretodo en la home, dar cuenta que se trata de un sitio web de un fotógrafo. Al ver los textos se piensa más en un relato que en un fotógrafo. Me gusta que no haya mucho scroll ni elementos que distraigan del contenido central: la fotografía.
  • U4: Se ve un sitio claro en cuanto al contenido y su acceso, nada distrae de su contenido central, se ve medido.


Observaciones Personales

El hecho de disponer un menú en la parte inferior del sitio no permite que los usuarios los vean y lo utilicen, más bien, para volver a la home utilizar el botón para ir atrás. Se vuelve necesario redefinir algunas palabras a modo de concepto para no confundir a los usuarios y darle mayor tamaño. A partir de lo dicho por Melany Marin se propone presentar ua nueva home, que mantenga la idea original haciendo partícipe de algún modo a las fotografías para así dar a entender que Rolando era fotógrafo.

Etapa de Re-Diseño

Luego de hacer las pruebas de usuario se vuelve necesario realizar una etapa de re-diseño, en donde se decide adoptar ciertas convencionalidades en el diseño del sitio para así mejorar la navegación y la experiencia de usuario.

Diseño de Wireframes Finales

Se disponen los wireframes de las 5 páginas tipo. Estos en las 3 soportes web: desktop, tablet y smartphone.

Diseño de Interaz Final

Manual de Estilos Web

En consideración que dentro del proyecto no se planea del desarrollo font del sitio se decide diseñar un Manual de Estilos Web, cuyo contenido se centre en todas las decisiones tomadas detrás del diseño de interfaz y que no se pueden dar a entender sólo con las imágenes del diseño de interfaz.

El manual se diseña a partir de 2 horizontes de lectura, el superior corresponde a imágenes y esquemas que explican el proceso de diseño, mientras que el inferior son notas de texto que aclarecen las decisiones. Este horizontes se compone por dos voces, uno técnico y otro más bien de observación el cual alude a la sensibilidad del desarrollador web.

El manual posee un formato de 23x23 centímetros y es impreso en papel Collum de 90 gramos. En cuanto a la tapa esta esta hecha de papel StarLight de 200 gramos. Se imprime en una impresora láser Xerox 7500, y se empasta en formato tapa blanda.

A continuación de dispone el pdf del / Manual de Estilos Web para el sitio de Rolando Rojas.

Catálogo Fotográfico

A partir de la proyección del proyecto hacia la tercera etapa en donde se plantea la realización de una exposición que muestre la obra fotográfica de Rolando Rojas, se plantea el diseño de un catálogo que contenga un pre-selección de posibles fotografías que se presentarían en dicho evento. Se definen 3 tipos de contenidos básicos: fotografías, material de registro y un anexo.

Contenido

Fotografías

Se seleccionan 68 fotografías, todas correspondientes a retratos en blanco y negro. Todas estas se albergan dentro de 5 grandes categorías: Novias, De Estudio, Experimentales, Pablo Neruda y Otros Personajes. Este órden de contenido fue definido a partir del mismo que se propone en el sitio web, la idea es continuar con las decisiones de jerarquía de contenido tomadas en dicha parte del proyecto.

El idea de mostrar retratos se plantea desde el reconocimiento social que posee Rolando en relación a este tipo de fotografía, como tambien pensando en una posible exposición, en la cual se vuelve más interesante poder ver el despliegue interno de un sola categoría: retratos. Las fotografías son presentadas en dos oportunidades, primero en un tamaño mayor: a doble página, una fotografía por página o bien 2 cuando se trata de series. Una vez que esta presentación acaba, todas las fotografías se vuelven a presentar a modo de catálogo, todas en miniatura con su código de catalogación pertinente.

Información de Registro

Este contenido se centra primordialmente en la biografía de Rolando, la cual se redacta a partir de la extensa biografía escrita durante la etapa anterior y la cronografía. Esto con la idea de disponer un texto de poca extensión que permita al lector conocer a Rolando a grandes rasgos y de manera rápida.

ANEXO

Durante la presente etapa de titulación se dedican un par de jornadas a la catalogación de material de tipo prensa escrita en donde se hable de Rolando en relación a su oficio de fotógrafo. Muchos diaros fueron catalogados pero no todos fueron seleccionados para estar dispuestos dentro del catálogo, esta decisión se tomar a partir de no querer quitarle protagonismo la fotografóa. Razón por la cual se decide que este tipo de contenido se imprime en otro tipo de hoja.

Estilos Gráficos

Fuente Tipográfica

Continuando con la decisiones gráficas tomadas a lo largo de todo el proyecto, se decide continuar trabajando con la familia tipográficas lato. Sus usos se limitan a Bold para títulos, regular para cuerpo de texto y light para códigos, número de páginas y número de serie de cada fotografía. El uso de la tipografía lato es de dominio público y es posible de adquirir a través de google fonts.

Paleta de Colores

Al igual que el uso tipográfico, la paleta de colores se define a partir de decisiones tomadas con anterioridad, para lo cual se mantiene el uso de una escala de grises. En donde el gris claro se utiliza para número de página y el oscuro para número de serie fotográfica. El uso de grises para este tipo de datos se decide para no distraer al lector de la fotografía.

Catálogo de Estilos en PDF

A continuación se dispone en pdf correspondiente al / Catálogo Fotográfico de Rolando Rojas

Proyección del Proyecto

En la etapa actual en la que se encuentra el proyecto se tienen cubiertas 2 de las 3 aristas del diseño gráfico con cuales en un inicio se consideró llevarlo a cabo. Por otro parte se vuelve necesario el generar un espacio de encuentro en donde se pueda presentar los productos finales del trabajo con el material de Rolando.

Para esto se considera oportuno la realización de una exposición que presente todo aquel material con el cual Rolando se hizo tan reconocido en Valparaíso y sus alrededores. Retratos en blanco y negro que hablan de la sociedad porteña del siglo pasado.

La realización de una exposición permitiría el generar un plan de trabajo entorno a un tema específico desde 3 áreas distintas del diseño gráfico: soporte web, editorial y expositivo, generando así una experiencia completa en los asistentes. Por otra parte sería una instancia oportuna para traer de vuelta a Rolando a Valparaíso, ciudad en donde se hizo reconocido y muchas personas lo recuerdan.

Antecedentes del Proyecto

Por más de 6 meses se ha estado trabajando con todo el material relacionado a Rolando, no sólo con fotografías y contenido de archivo sino que por un lado se ha trabajado entrevistando a personas relacionadas con él, se han tenido instancias de participación con su familia amigos, etc., acercándose cada vez a cierta apropiación del material (se reconoce).

Por otro lado, se han realizado investigaciones entorno al estado actual de la fotografía, personalmente en la web, entendiendo el cómo se construye un discurso a partir de la navegación y las rutas de acceso al contenido.

Definición del Problema a Investigar

Se vuelve necesario entender y saber presentar el trabajo de Rolando desde un lenguaje expositivo, teniendo en consideración toda la identidad gráfica y discurso construído en el sitio web y en el catálogo de Retratos. Es el paso de un formato a otro manteniendo lo definido hasta el momento. Es de suma importancia definir las normas gráficas de todo material relacionado con la obra fotográfica de Rolando, ya que al tratarse de una exposición será necesario llevar a cabo una etapa de difusión basada en afiches y material de ese tipo.

Estado Actual del Problema

Actualmente no se tiene mayor registro en cuanto a exposiciones realizadas por Rolando en el pasado, y de lo poco se encuentra disponible, esto corresponde a exposiciones de pintura. El respaldo que existe es de carácter fotográfico y de archivo de prensa escrita.

Una de las principales problemáticas en este momento en la calidad del material fotográfico, muchos negativos ya no existe, por lo cual será necesario realizar una nueva faena de scanea y codificación del material seleccionado. A pesar de tener a grandes rasgos seleccionado el material que se presentarla, es necesario realizar una segunda selección de fotografías.

En cuanto a la importancia de resolver el problema

Como se mencionó anteriormente, la importancia de realizar una exposición que presente el material fotográfico de Rolando se relaciona directamente con la connotación que el posee en Valparaíso, es traer a presencia a un personaje reconocido por muchos, es traerlo de vuelta a la ciudad puerto. Por otra parte el hecho de generar una instancia de encuentro entorno al tema “Rolando”, es una buena oportunidad para dar cuenta de todo el trabajo hecho; presentar el sitio web, el libro de autor y el catálogo fotográfico.

Trabajo Adelantado

Durante la segunda etapa del proyecto se han iniciado conversaciones entorno a 5 temas importantes relacionado con el archivo fotográfico de Rolando: Marisol Rojas tiene actualmente todo el poder legal sobre las fotografías, se ha conversado con sus hermanos, los cuales no tienen ningún en problema en apoyar el proyecto y muestran disposición de entregar cualquier tipo de ayuda que sea necesaria.

En cuanto a la proyección del sitio web, se han iniciado conversaciones con Felippe Codduo, actual encargado del Área de Fotografía del Ministerio de Cultura. Por razones de tiempo de Felipe no ha sido posible reunirse con él. Situación que se llevará a cabo el día 22 de diciembre de 2014. Él se comprometió con ayuda para la postulación del sitio a algún fondo concursable que el considere pertinente para el desarrollo font de éste y para encontrar algún otro sitio que albergue a este mismo una vez que se encuentre completado.

En cuanto a la exposición se tiene considerado dos posibles lugares para llevarla a cabo. Por un lado el TUC, ubicado frente a la Iglesia La Matriz, para lo cual se considera el uso de inmobiliario diseñado por el taller de cuarto años de diseño industrial de la e[ad]. Por otro lado, la fundación Neruda también mostró interés en cuanto a cualquier tipo de ayuda, incluyen el uso de sus instalaciones.

En cuanto al financiamiento la fundación Neruda también ha mostrado interés, al igual que en la disposición de material. Cabe señalar que la última exposición realiza por Rolando el año 2012 fue financiada completamente por la misma fundación.

Para el cierre de la presente etapa se realizó un catálogo fotográfico de retratos, el cual tiene como funcionalidad servir como una pre-selección del posible material a exponer. Para lo cual se considera que de las 68 fotografías presentadas cerca 40 serán las expuestas, todas en un formato cercano a los 40x60 centímetros, para lo cual, como se señaló anteriormente, podría ser utilizado el inmobiliaro de cuarto año de diseño industrial de la e[ad].


Objetivos del Proyecto

Objetivos Generales

Determinar y diseñar espacios de difusión real para la obra fotográfica de Rolando Rojas en el área web y editorial, a través de los cuales se pueda reconocer su valor de patrimonio socio-cultural.

Objetivos Específicos

Construir una muestra expositiva de la obra de Rolando Rojas, a partir de las decisiones tomadas en el sitio y catálogo fotográfico. Con lo cual generar un espacio de encuentro que traiga de vuelta a Rolando a Valparaíso y sirva como instancia de presentación de los proyectos relacionados con el fotógrafo.

Definir y diseñar un manual normas gráficas para todo aquel material relacionado a Rolando, esto a partir del actual Manual de Estilos Web.

Realizar una apropiada selección fotográfica que permita construir un discurso gráfico adecuado que de cuenta del tipo de material fotográfico que realizaba Rolando.

Determinar un espacio donde repose todo el archivo fotográfico de Rolando, desde las fotografías hasta los proyectos de diseño pensando en su difusión; sitio web, libro, etc.

Plan de Trabajo

Se definen 4 posibles instancias de trabajo: por un lado una relacionada con la logística detrás de la exposición, definición del espacio en donde se vaya a realizar dicha actividad y búsqueda de fondos que financien el gasto económico que este conllevará.

Una segunda etapa se centra en el contenido de la exposición: selección de contenido a exponer y definición de las piezas de montaje. Es última se vuelve primordial para la definición del discurso gráfico con el cual se pretende presentar a Rolando.

La difusión de la exposición corresponde a una cuarta etapa: afiches, invitaciones, entre otros elementos gráficos.

El quinto punto y cierre corresponde a la búsqueda y definición de un espacio en donde repose el proyecto, ya sea la postulación a algún fondo, una identidad que quede a cargo del sitio web o del desarrollado de éste, etc.