Publicado por

R5 – Prototipo y síntesis del proyecto

Publicado por

R5 – Prototipo y síntesis del proyecto

Propuesta de valor Una de las principales necesidades de Clara era encontrar y acceder rápidamente a la colección de imágenes de World…
Propuesta de valor Una de las principales necesidades de Clara era encontrar y acceder rápidamente a la colección de…

Propuesta de valor

Una de las principales necesidades de Clara era encontrar y acceder rápidamente a la colección de imágenes de World Press Photo, con la posibilidad de descargarlas y compartirlas para utilizarlas en el aula. Para satisfacer esta necesidad, determinamos que la colección de imágenes debía ocupar un lugar destacado en la aplicación, ya que constituye uno de los principales motivos por los que los usuarios visitan el sitio web. Por ello, decidimos ubicarla como la primera opción accesible desde el menú principal.

Al seleccionar esta opción, el usuario encontrará un subapartado que organiza las colecciones por años: la colección más reciente (“Colección 2024”) y las colecciones anteriores disponibles hasta la fecha (“Colección 1995 – 2024”) . Dentro de la página dedicada a la colección, priorizamos la facilidad y agilidad de uso, incorporando una función de búsqueda avanzada con filtros. Estos filtros permiten al usuario acotar su búsqueda según criterios específicos.

Cuando el usuario selecciona una imagen, decidimos mostrar las opciones de descarga o compartir la imagen antes que la información detallada. Esto responde a la necesidad de usuarios como Clara, que buscan rapidez y eficiencia. El proceso de descarga es intuitivo y rápido: con un solo clic, la imagen se descarga automáticamente al dispositivo móvil. Esta solución asegura una experiencia fluida y centrada en las necesidades de los usuarios.

SKETCHING

Uno de los desafíos clave planteados por el primer usuario fue la necesidad de acceder de manera rápida y sencilla a la colección de imágenes ganadoras para mostrar más tarde en el aula. Para solventar esta necesidad se nos ocurrió la posibilidad de descargar o poder compartirlas las imágenes desde la aplicación móvil para luego utilizarlas en el entorno educativo.

Para resolver este problema, hemos diseñado un prototipo de baja fidelidad en papel:

PROTOTIPO NAVEGABLE

También hemos creado un prototipo de alta fidelidad utilizando la herramienta Figma. Este prototipo permite visualizar de manera detallada y realista cómo se implementarán las funcionalidades y el diseño de la aplicación. Puedes acceder al prototipo interactivo haciendo clic en el siguiente enlace:

https://www.figma.com/proto/F1ea6Sqt9Wi1AiLHBr0EcG/Untitled?t=yMs6eB2N3UbJru47-0&scaling=min-zoom&content-scaling=fixed&page-id=0%3A1&node-id=5-67

Debate0en R5 – Prototipo y síntesis del proyecto

No hay comentarios.

Publicado por

R4 – REFERENCIAS Y ANÁLISIS CRÍTICO

Publicado por

R4 – REFERENCIAS Y ANÁLISIS CRÍTICO

  Para comparar nuestra propuesta, una aplicación de World Press Photo, hemos realizado un análisis crítico de dos plataformas relevantes en el…
  Para comparar nuestra propuesta, una aplicación de World Press Photo, hemos realizado un análisis crítico de dos plataformas…

 

Para comparar nuestra propuesta, una aplicación de World Press Photo, hemos realizado un análisis crítico de dos plataformas relevantes en el ámbito de la fotografía: Magnum Foundation y National Press Photographers Association (NPPA). El objetivo de este análisis es comprender cómo estas plataformas gestionan aspectos clave, como la promoción de eventos y la compra de entradas, para evaluar cómo podemos implementar y mejorar estas funcionalidades en nuestra aplicación.

Para llevar a cabo esta evaluación, hemos utilizado como marco de referencia los 10 principios generales para el diseño de interacción propuestos por Jakob Nielsen. A continuación, detallamos cada principio y su importancia en el diseño de la interfaz:

1- Visibilidad del estado del sistema

Es esencial que los usuarios estén siempre informados sobre las acciones que están cometiendo en la aplicación o sitio web, lo que les permite comprender qué está sucediendo en cada momento mientras navegan.

2- Correspondencia entre el sistema y el mundo real

Se debe utilizar un lenguaje claro y comprensible, evitando tecnicismos o jergas, para garantizar que cualquier usuario, independientemente de su experiencia, pueda entender la interfaz.

3- Control y libertad del usuario

Es importante ofrecer al usuario la posibilidad de deshacer acciones de forma sencilla. Los errores son comunes durante la navegación, y un diseño eficaz debe permitir corregirlos sin procesos complicados.

4- Coherencia y estándares

La estructura y organización del sitio web o aplicación deben ser coherentes, siguiendo convenciones establecidas que faciliten la navegación para el usuario.

 

5- Prevención de errores

Diseñar la interfaz para minimizar errores comunes, incorporando confirmaciones previas en acciones críticas que puedan derivar en errores.

6- Reconocimiento en lugar de recuerdo

Los elementos clave deben ser visibles y accesibles en todo momento, evitando que los usuarios deban memorizar acciones o ubicaciones dentro de la plataforma.

7- Flexibilidad y eficiencia de uso

Proveer accesos directos para usuarios avanzados, sin comprometer la accesibilidad y facilidad de uso para los usuarios nuevos en la plataforma.

8- Diseño estético y minimalista

Optar por un diseño visual limpio y relevante, eliminando elementos innecesarios que puedan generar confusión o distracción.

9- Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores

Incluir mensajes de error claros y comprensibles, acompañados de soluciones concretas que permitan a los usuarios resolver los problemas de manera eficiente.

10- Ayuda y documentación

Ofrecer una sección de ayuda bien estructurada y con un lenguaje claro, que proporcione información concisa y útil para resolver cualquier duda o problema.

Diagrama de flujo y análisis según los 10 principios de Jakob Nielsen: MAGNUM FOUNDATION

1- Visibilidad del estado del sistema Durante la navegación por el sitio web, se indica claramente en qué página o sección se encuentra el usuario. Además, durante el proceso de compra de entradas, se muestra de forma explícita la fase en la que se encuentra, lo que ayuda al usuario a orientarse y entender el progreso del proceso.
2- Correspondencia entre el sistema y el mundo real El lenguaje utilizado en la página web es claro y accesible, evitando tecnicismos o jergas que puedan dificultar la comprensión por parte de los usuarios. Esto garantiza que la interacción sea intuitiva y adecuada para un público diverso.
3- Control y libertad del usuario La plataforma permite al usuario retroceder fácilmente durante la navegación o el proceso de compra de entradas. Esto se logra mediante una flecha de retroceso (back) que está visible en todo momento, lo que facilita la corrección de errores o la revisión de pasos previos.
4- Coherencia y estándares Los elementos presentes en el sitio web están organizados y etiquetados de manera coherente y clara. Por ejemplo, si el usuario desea acceder a eventos de la plataforma, puede encontrarlos bajo la etiqueta Events, siguiendo una convención estándar.
5- Prevención de errores Al completar la información personal del usuario o al realizar el pago de las entradas, el sistema notifica inmediatamente si hay errores o si la información proporcionada no es válida. Esto permite corregir cualquier inconveniente antes de realizar el pago.
6- Reconocimiento en lugar de recuerdo Durante el proceso de compra de entradas, el precio de las mismas se muestra de forma constante, lo que elimina la necesidad de que el usuario tenga que memorizar esta información. Esto facilita la experiencia de compra y mejora la usabilidad.
7- Flexibilidad y eficiencia de uso La navegación en el sitio web es accesible tanto para usuarios noveles como para expertos. Sin embargo, hemos observado que, en el proceso de compra de entradas, no existen atajos claros para los usuarios más experimentados. La interfaz es bastante uniforme y no ofrece opciones de personalización para facilitar la navegación a usuarios avanzados.
8- Diseño estético y minimalista El diseño del sitio web es visualmente sencillo y está enfocado en la funcionalidad, evitando información o secciones irrelevantes. Este enfoque contribuye a una experiencia de usuario más clara y directa.
9- Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores Cuando el usuario comete un error al ingresar datos durante la compra de entradas, el sistema señala el error de forma clara y proporciona sugerencias sobre cómo corregirlo.
10- Ayuda y documentación No tiene una sección o página de ayuda clara para el usuario. La inclusión de una sección de ayuda concisa y bien estructurada mejoraría significativamente la experiencia del usuario.

 

Diagrama de flujo y análisis según los 10 principios de Jakob Nielsen: National Press Photographers Association.

1- Visibilidad del estado del sistema El sistema no proporciona una indicación clara de en qué fase se encuentra el usuario durante el proceso de compra de entradas, lo que puede generar confusión y dificultar la realización de la acción.
2- Correspondencia entre el sistema y el mundo real Aunque el sitio web emplea algunos términos técnicos o de jerga utilizados en el ámbito de la fotografía, como «Shoot ‘n Edit», se proporciona una explicación sobre su significado, lo que facilita la comprensión para los usuarios no familiarizados con esos términos.
3- Control y libertad del usuario Durante el proceso de registro como miembro, se observan dificultades debido a la falta de una opción clara para retroceder o salir del proceso. No existe una flecha de retroceso («back») ni una opción de «cerrar» que permita al usuario salir fácilmente de la acción en curso.
4- Coherencia y estándares Los elementos del sitio web están bien organizados y etiquetados de forma clara. Por ejemplo, los eventos de la plataforma se encuentran bajo la sección «Community», ya que están destinados a los miembros de la plataforma. La estructura es coherente y fácil de entender.
5- Prevención de errores Durante el proceso de rellenado de la información personal o la compra de entradas, el sistema informa al usuario si hay errores o si la información proporcionada no es válida, lo que facilita la corrección de los problemas antes de finalizar la acción.
6- Reconocimiento en lugar de recuerdo En el proceso de compra de entradas, el precio de las mismas se muestra de manera constante, lo que elimina la necesidad de que el usuario tenga que recordar esta información durante el proceso.
7- Flexibilidad y eficiencia de uso En la barra de menú principal, los eventos se presentan como subcategorías con el nombre de los mismos. Los usuarios más avanzados pueden acceder directamente a esta sección sin necesidad de pasar por la página principal de eventos, lo que facilita una navegación más eficiente.
8- Diseño estético y minimalista El diseño de la navegación es sencillo, pero la barra de menú contiene muchas subcategorías, lo que podría resultar abrumador para los usuarios novatos, ya que se presentan demasiadas opciones de forma simultánea.
9- Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores Al rellenar la información para registrarse como miembro de la plataforma, el sistema informa al usuario de los errores cometidos y ofrece soluciones claras y fáciles de seguir para corregirlos.
10- Ayuda y documentación El sitio web carece de una sección de ayuda clara y accesible para los usuarios, lo que dificulta la resolución de dudas o problemas sin contar con una guía específica.

 

Debate0en R4 – REFERENCIAS Y ANÁLISIS CRÍTICO

No hay comentarios.

Publicado por

R3 – Árbol de Contenido

Publicado por

R3 – Árbol de Contenido

Dejo aquí mi árbol de contenido sobre la aplicación para móvil de World Press Photo:   …
Dejo aquí mi árbol de contenido sobre la aplicación para móvil de World Press Photo:   …

Dejo aquí mi árbol de contenido sobre la aplicación para móvil de World Press Photo:

 

Debate0en R3 – Árbol de Contenido

No hay comentarios.

Publicado por

R3 | Árbol de contenidos

Publicado por

R3 | Árbol de contenidos

Resumen de los datos obtenidos en el estudio: Al observar las diferentes analíticas de los resultados podemos distinguir 5 grupos definidos por los participantes: Educación: “Proyectos/Programas” y “Línea de investigación”. Concurso: “Última edición del concurso”, “Histórico del concurso” e “Inscripción al concurso”. Agenda: “Calendario de exposiciones/eventos” y “Compra de entradas”. Sobre nosotros/La fundación: “Momentos clave de la fundación” y “Noticias”. Área personal: “Datos personales del usuario”, “Datos profesionales del usuario”, “Configuración”, “Me interesa” y “Mis entradas”.2 tarjetas se quedan al…
Resumen de los datos obtenidos en el estudio: Al observar las diferentes analíticas de los resultados podemos distinguir 5…

Resumen de los datos obtenidos en el estudio:

Al observar las diferentes analíticas de los resultados podemos distinguir 5 grupos definidos por los participantes:

  • Educación: “Proyectos/Programas” y “Línea de investigación”.
  • Concurso: “Última edición del concurso”, “Histórico del concurso” e “Inscripción al concurso”.
  • Agenda: “Calendario de exposiciones/eventos” y “Compra de entradas”.
  • Sobre nosotros/La fundación: “Momentos clave de la fundación” y “Noticias”.
  • Área personal: “Datos personales del usuario”, “Datos profesionales del usuario”, “Configuración”, “Me interesa” y “Mis entradas”.2 tarjetas se quedan al margen de esos grupos principales según la categorización de los participantes:

Las tarjetas que más costaron organizar a los participantes fueron:

  • Suscripción educativa: A pesar de contar con la información que proporciona actualmente la organización sobre el contenido de este apartado, esta tarjeta ha sido una de las que más dificultad de agrupamiento ha ocasionado a los participantes, no coincidiendo ninguno de ellos en la agrupación con otros contenidos. Este hecho nos hace replantearnos si debemos ubicarla dentro de alguna de las secciones o dejarlo como un apartado a parte.
  • Espacio colaborativo: Esta es la otra tarjeta que más dificultad de agrupamiento ha ocasionado a los participantes, no coincidiendo ninguno de ellos en la agrupación con otros contenidos. Igual que en el caso anterior, debemos plantearnos si hay que ubicarla dentro de alguna de las secciones o dejarlo como un apartado a parte, además de re-plantear su etiquetado por si hubiera sido el motivo de la variedad de opiniones ya que no hemos obtenido ningún comentario al respecto.

Con todo esto y valorando las aportaciones y agrupaciones de los participantes tendremos 5 categorías:

  • “Espacio colaborativo” pasará a llamarse “Comunidad”. Este nombre fue expuesto por un participante para esta tarjeta y se considera que refleja mejor el contenido y opciones que muestra esta sección.
  • Las tarjetas “Proyectos/Programas” y “Líneas de investigación” se agruparán dado el alto porcentaje obtenido en el estudio y se le sumará a este grupo la “Suscripción educativa” al tratarse de contenidos que están enfocados al ámbito educativo.
    Este grupo recibirá el nombre de “Educación” coincidiendo con la actual etiqueta y organización de la web.
  • “La fundación” albergará los espacios de “Momentos clave de la fundación” y “Noticias”.
  • Las tarjetas “Calendario de exposiciones/eventos” y “Compra de entradas” se agruparán juntas y lo harán bajo el paraguas “Agenda”. Este término se escoge por englobar tanto la programación de eventos como la gestión de entradas, y transmite la idea de organización de actividades.
  • “Área personal” contendrá las secciones de “Datos personales del usuario”, “Datos profesionales”, “Configuración”, “Me interesa” y “Mis entradas”. Esta agrupación y denominación viene dada también por el también alto porcentaje de similitud entre las respuestas de los participantes.

Con la información obtenida en el card sorting, el inventario de contenidos y los requisitos de diseño, se presenta el árbol de contenidos en torno al que se organizará la app de World Press Photo una vez el usuario ha iniciado sesión o el registro.
Veremos como la aplicación se estructura bajo la pantalla principal teniendo todas las secciones la misma importancia para el usuario. Sin embargo, el apartado de información legal queda relegado a un espacio secundario. Aunque cohabitará con el resto de secciones no tendrá la misma importancia en la barra/menú de navegación ni en la pantalla principal ya que es una información de apoyo para el usuario. Aunque no haya una sección de contacto como tal, se decide añadir el término “Contacto”, a la sección de información legal para que el usuario intuya mejor que tiene la información de cómo contactar con la fundación para resolver las dudas de los servicios.
Podremos ver también que se han añadido algunas secciones como las que se muestran en el apartado “Comunidad” y que no se han contemplado en el card sorting. Éstas son las herramientas que se marcan en el inventario y en los requisistos de diseño como apartados dentro del denominado “Online Magazine” en la actual página web. Se decidió no incluiras en el estudio ya que son funciones que dependen de la herramienta del blog y que están destinadas a estar en ese espacio de colaboración.

Debate0en R3 | Árbol de contenidos

No hay comentarios.

Publicado por

R2. PRESENTACIÓN ESCENARIO Y USER JOURNEY

Publicado por

R2. PRESENTACIÓN ESCENARIO Y USER JOURNEY

Los escenarios fueron desarrollados a partir de la navegación que realiza el usuario a través de la web actual para cumplir su objetivo. Identificando tanto oportunidades como áreas de mejora relevantes para los elementos que se integrarán en la aplicación, dado que será el punto de partida para el diseño y desarrollo de la misma. Cada escenario representa una situación específica en la que un usuario interactúa con la aplicación para cumplir un objetivo, como la compra de entradas, la…
Los escenarios fueron desarrollados a partir de la navegación que realiza el usuario a través de la web actual…

Los escenarios fueron desarrollados a partir de la navegación que realiza el usuario a través de la web actual para cumplir su objetivo. Identificando tanto oportunidades como áreas de mejora relevantes para los elementos que se integrarán en la aplicación, dado que será el punto de partida para el diseño y desarrollo de la misma.

Cada escenario representa una situación específica en la que un usuario interactúa con la aplicación para cumplir un objetivo, como la compra de entradas, la búsqueda de contenido educativo, el registro en un taller o la verificación de resultados en un concurso.

Se ha seleccionado el escenario 2, ya que resultó ser la interacción más confusa de los cuatro escenarios, para finalmente cumplir el objetivo. Es el escenario donde más pain points he detectado y me parece interesante compartirla para poner en común mi punto de vista en cuanto a esta acción.

 

ESCENARIO 2: Clara busca contenido educativo para enriquecer sus clases.

Clara se encuentra en el colegio, tiene un rato libre antes de su próxima clase, asique aprovecha para buscar contenidos que pueda aplicar la próxima semana, ya que comienzan un nuevo tema: La Segunda Guerra Mundial. Es una profesora comprometida y utiliza muchos recursos visuales para captar la atención de sus alumnos. Sin embargo, a menudo tiene dificultades para encontrar imágenes específicas con fines educativos en otras plataformas.

Recuerda haber escuchado a un compañero del colegio hablar sobre una exposición reciente que realizó World Press Photo sobre “ICONIC – Defendiendo la libertad de prensa y la democracia desde 1955”, y piensa que le vendría muy bien poder mostrarles a sus alumnos ese material, al finalizar el contenido sobre la Segunda Guerra Mundial.

Decide abrir la app, la cual ya tiene instalada, ya que sigue de cerca las actividades que realiza World Press Photo, pero aún no había interactuado con la aplicación. Al abrirla observa que en el menú hay varias opciones, entre ellas “Educación”, que se subdivide en “Programas”, “Alfabetización visual” e “Investigación”. Esto le agrada, ya que una de sus principales frustraciones con otras plataformas es la dificultad para encontrar contenido específico para educadores, así que procede a investigar los apartados. Entra en cada uno de ellos para hacerse una idea de lo que ofrecen. Decide decantarse por la sección de “Alfabetización visual”, dado que observa que es la sección donde puede encontrar el material que necesita.

Dentro de la sección, encuentra un archivo donde se le ofrece la opción de explorar el archivo en línea o directamente descargar la presentación del tema y sus descripciones en formato PDF. Decide explorar primero el archivo para cerciorarse de la información que contiene, y para su sorpresa, se da cuenta de que el PDF contiene toda la información sobre las colecciones de fotografías de todos los años. Es muy abrumador. Y se da cuenta de que no le da opción a descargar solo la información sobre el tema que le interesa.

Igualmente procede a descargar todo el documento, pensando que posteriormente seleccionará el material que le interese para sus clases. Al descargar el documento, la app le pide que se registre, se da cuenta de la hora que es y en menos de dos minutos debería entrar en clase, pero necesita la información asique procede a rellenar el formulario, introduciendo sus datos personales, así como el fin de uso de el PDF: maestro, alumno, visitante etc. Una vez registrada el documento se descarga directamente en su móvil, mientras se descarga, recoge sus cosas y se dirige a su clase, donde ya le están esperando sus alumnos.

USER JOURNEY 2.

Debate0en R2. PRESENTACIÓN ESCENARIO Y USER JOURNEY

No hay comentarios.

Publicado por

R2 – Presentación Escenario y User Journey

Publicado por

R2 – Presentación Escenario y User Journey

ESCENARIO Clara Martínez – Acceder a contenido educativo para mostrar en el aula Clara Martínez es profesora de secundaria y utiliza fotografías…
ESCENARIO Clara Martínez – Acceder a contenido educativo para mostrar en el aula Clara Martínez es profesora de secundaria…

ESCENARIO

Clara Martínez – Acceder a contenido educativo para mostrar en el aula

Clara Martínez es profesora de secundaria y utiliza fotografías premiadas por World Press Photo como recurso educativo en sus clases. Desea poder tener una aplicación móvil de World Press Photo que le facilite un acceso rápido y sencillo al catálogo de imágenes, ya que ello le sería de gran utilidad en su labor docente. Además, Clara encuentra dificultades para acceder a plataformas que se orienten específicamente a la enseñanza y que ofrezcan acceso fácil a contenido educativo.

Para obtener imágenes de alto impacto y relevancia histórica, que sirvan de apoyo visual en sus clases, Clara sigue los siguientes pasos:

  • Accede al sitio web de World Press Photo.
  • Desde la página de inicio, accede al menú y selecciona “Collection” o desplaza la pantalla hacia abajo hasta encontrar el apartado denominado “Collection”, donde la descripción indica: “See the complete collection of prize-winning photos and stories.” Este proceso resulta tedioso, especialmente para usuarios que no están familiarizados con la navegación en el sitio.
  • Una vez en la sección de la colección, debe elegir entre visualizar imágenes de la colección actual (2024) o las fotografías premiadas entre 1955 y 2024.
  • Para enseñar imágenes de momentos históricos, Clara selecciona “Archive 1955 – 2024”, lo cual la redirige a una página en la que puede explorar las imágenes ganadoras por año.
  • Aquí tiene la opción de desplazarse por la página hasta encontrar el año deseado o, bien, seleccionar el año específico en la parte superior de la página.
  • Si, por ejemplo, Clara desea mostrar una imagen de la guerra en Ucrania del año 2023, debe buscar el año correspondiente, identificar la imagen y hacer clic en ella.
  • Tras hacer clic, se accede a una descripción detallada de la fotografía y su contexto histórico.

Como se puede observar, este proceso no proporciona a Clara un acceso rápido ni fácil para encontrar las imágenes que desea mostrar en clase. Además, cada vez que necesite mostrar una imagen específica debe repetir la búsqueda. Contar con una aplicación móvil de World Press Photo le permitiría buscar y acceder a las imágenes desde cualquier lugar y le facilitaría descargarlas o guardarlas para utilizarlas posteriormente en el aula.

USER JOURNEY

Debate0en R2 – Presentación Escenario y User Journey

No hay comentarios.

Publicado por

¡Bienvenidos y bienvenidas!

¡Bienvenidos y bienvenidas!
Publicado por

¡Bienvenidos y bienvenidas!

¡Hola! Esta publicación se ha generado automáticamente en el Ágora. Te encuentras en el Ágora de la asignatura. En este espacio se…
¡Hola! Esta publicación se ha generado automáticamente en el Ágora. Te encuentras en el Ágora de la asignatura. En…

¡Hola!

Esta publicación se ha generado automáticamente en el Ágora.

Te encuentras en el Ágora de la asignatura. En este espacio se recogerán todas las publicaciones relacionadas con las actividades que hagan los compañeros y compañeras del aula a lo largo del semestre.

El Ágora es un espacio de debate en el que estudiantes y docentes pueden ver, compartir y comentar los proyectos y las tareas de la asignatura.

Si solamente ves esta publicación, puede ser porque todavía no se ha hecho ninguna más, porque no has entrado con tu usuario de la UOC o porque no perteneces a esta aula. Si no eres miembro de la UOC y ves alguna publicación, es porque su autor o autora ha decidido hacerla pública.

¡Esperamos que esta Ágora sea un espacio de debate enriquecedor para todos y todas!

Debate0en ¡Bienvenidos y bienvenidas!

No hay comentarios.

Las intervenciones están cerradas.