Prácticas Diseño Interfaces de Usuario 2019-20 (Economía Colaborativa)
Grupo: DIU1_Cohete. Curso: 2019/20
Proyecto: Pazifika
Descripción: Pretendemos desarrollar una aplicación para poder buscar compañeros de viaje de una manera sencilla y ágil, con muchas opciones para filtrar por viajes y una interfaz clara y limpia.
Logotipo: 
Miembros
- 👤 Francisco Domínguez Lorente
- 👤 Miguel Ángel Posadas Arráez
En esta práctica estudiaremos un caso de plataforma de economía colaborativa y realizaremos una propuesta para su diseño Web/movil. Utilizaremos herramientas y entregables descritos en el siguiente CheckList (https://github.com/mgea/UX-DIU-Checklist)
Qué es economia colaborativa: Martínez-Polo, J. (2019). El fenómeno del consumo colaborativo: del intercambio de bienes y servicios a la economía de las plataformas, Sphera Publica, 1(19), 24-46. http://sphera.ucam.edu/index.php/sphera-01/article/view/363/14141434
Este documento es el esqueleto del report final de la práctica. Aparte de subir cada entrega a PRADO, se debe actualizar y dar formato de informe final a este documento online.
Pazifiko es una plataforma que permite buscar compañeros de viaje, tanto organizar un viaje de modo que usuarios de la plataforma se unan, como buscar viajes ya organizados por otros usuarios. Se puede leer el análisis completo a través de este enlace.
Se detalla la decisión de incluir estar personas en el informe disponible a través de este enlace.
Se comenta brevemente cada User Journey Map en el siguiente enlace.
- Enlace al documento
- Valoración final (numérica): 66
- Comentario sobre la valoración: Tras un exhaustivo análisis, el cual queda reflejado en este documento, hemos llegado a la conclusión de que la página ofrece una experiencia de usuario aceptable, sin fallos sustanciales de diseño, pero cuenta con problemas de disponibilidad que perjudican a su imagen y a los usuarios.
| Interesante |
Críticas |
|---|---|
| - Diseño limpio. Se destaca lo importante y utiliza una paleta de colores agradable a la vista. - Interfaz amigable. La información está concentrada y se destaca lo importante. - El panel de control de usuario destaca las opciones importantes y es claro. |
- Añadir un sistema de mensajes para poder establecer contacto de manera más fácil con compañeros de viaje. - Permitir la búsqueda de viajes por varios aspectos. - Permitir añadir en la descripción el número de integrantes que se buscan y los integrantes que buscan compañeros. - Algunos botones requieren de haber iniciado sesión o haberse registrado previamente en la aplicación para poder utilizarlos. |
Preguntas |
Nuevas ideas |
| - Hay un fallo a la hora de mostrar el mapa de ubicación. ¿Se podría mejorar? - ¿Se podrían añadir más opciones para filtrar viajes? - Estaría bien tener una opción adicional para hacer amigos en la plataforma y poder hacer viajes conjuntos. |
- Mostrar ejemplos de viajes que estén activos actualmente, de diferentes categorías. - Intentar que cuando un usuario se registre, este consiga publicar un viaje o se inscriba en uno existente en las primeras visitas del usuario. - La plataforma no cuenta con redes sociales de ningún tipo. No se puede contactar con ellos más allá del correo. |
Proponemos una aplicación que incluya una gran variedad de opciones de búsqueda, así como poder publicar un viaje con las etiquetas suficientes para que personas con gustos similares puedan encontrar tu viaje más fácilmente.
Incorporamos también una galería de imágenes donde los viajeros puedan publicar las imágenes de sus viajes y otros usuarios puedan admirar los lugares donde recientemente han ido otros usuarios que han usado la plataforma.
Con la incorporación de filtros adicionales de búsqueda y la posible mejora de los botones en relación a Publicar Viaje (hay que iniciar sesión o registrarse antes de poder publicar un viaje) se solventan los problemas propuestos por los usuarios anteriormente.
Matriz de Tareas/Usuarios
| Grupos de Usuarios | Usuario Logueado | Usuario No Logueado |
|---|---|---|
| Iniciar Sesión | H | |
| Registrarse | M | |
| Publicar Viaje | M | |
| Apuntarse a Viaje | M | |
| Consultar viajes disponibles | H | M |
| Contactar con Soporte | H | M |
| Publicar un comentario | M |
Sitemap
| Etiqueta | Nota |
|---|---|
| Buscar | Herramienta para filtrar por viajes según a unos criterios que estima el usuario |
| Galería | Recopilación de imágenes realizadas durante los distintos viajes de la plataforma que ya han tenido lugar |
| Contacto | Página en la que se incluyen los distintos medios de contacto con el soporte técnico de la plataforma |
| Viajes | Sección donde se publican y se pueden ver los distintos viajes que se pretenden organizar en la plataforma |
| Perfil | Sección donde se sitúan todas las opciones de configuración disponibles para el usuario |
| Iniciar Sesión | Procede a la identificación de los usuarios ya registrados previamente en la plataforma |
| Registrarse | Procede a dar de alta a un usuario en la plataforma |
Página principal
Cuando una empresa empieza a diseñar una aplicación, primeramente hace un estudio previo sin tener en cuenta la opinión de los usuarios. Posteriormente, una vez hayan planteado el esquema inicial de la aplicación, se entrevistan con los usuarios y obtienen los problemas y las preocupaciones reales de los usuarios potenciales. A continuación, comienzan a desarrollar los mockups y bocetos en base a eso.
En el siguiente enlace accedemos a una descripción más detallada. Enlace a la especificación detallada
El logotipo diseñado es el siguiente:
Hemos usado una herramienta online de logos prefabricados y la hemos adaptado a nuestras necesidades. La resolución empleada es la mejor que ofrecía la página mencionada y creemos que es suficiente para la página. El logotipo se podría usar como foto de perfil en las redes sociales, pero se necesitarían más diseños para cubrir las cabeceras y otros aspectos de los perfiles.
Hemos optado por aplicar los patrones Call-to-Action Buttoms para que el usuario tenga siempre presente que acciones puede realizar, así como Progress Trackers en los formularios ya que es importante conocer el progreso realizado miestras estos son rellenados y Search Resulsts Design ya que un buen diseño de la página de resultados en fundamental.
En el siguiente enlace detallamos mucho más lo anteriormente comentado, así como comentar los detalles que hemos utilizado siguiendo la guideline de Google y especificación de la paleta de colores y fuente utilizada. Enlace a la especificación detallada
https://drive.google.com/open?id=1sPXz_SW_37V6XT4Jr1sQY5hqU069t2Sx
Para el primer caso los compañeros han analizado una plataforma de economía colaborativa para la organización de viajes o incluso la búsqueda de compañero de viaje. Como propuesta de valor sobre la página que han analizado en la práctica 1 proponen principalmente una mejora del deiseño de la página principal.
Repositorio || Hoja de evaluación
Para este caso 2, el compañero ha analizado una aplicación para alquiler de pisos por habitaciones o completos, incluyendo una agenda cultural para ver los eventos cercanos a los nuevos alojamientos. Como propuesta de valor, se aporta que la agenda cultural sea más completa de modo que se puedan añadir eventos a la misma así como observar los eventos antes de alquilar una habitación, de modo que estos eventos aporten un valor añadido a cada habitación. También propone la introducción de ayudas como comandos de voz.
Repositorio || Hoja de evaluación
Para el caso 3 los compañeros han analizado una aplicación para aprender a cocinar en vivo, degustar comida y hacer tours gastronómicos. Como propuesta de valor los compañeros proponen la creación de un diseño en el que prime la eficiencia y la velocidad del sistema ya que en el análisis de la práctica 1 han detectado que el principal problema de la plataforma que analizaban era el tiempo invertido por parte del usuario en el uso de la aplicación.
Repositorio || Hoja de evaluación
Hemos escogido como persona ficticia a María Teresa. Recordamos que esta persona ficticia tenía pareja y un hijo. Vive con su pareja en Madrid, es fisioterapeuta y le gustan los viajes tranquilos.
A María Teresa le surge la misma preocupación que con Pazifika. Ella y su familia desea hacer un viaje con otra pareja de estructura similar: una pareja con un hijo. María Teresa no sabe si PlanBClub tendrá las opciones y los filtros disponibles para poder satisfacer todas sus necesidades.
María Teresa y su familia han alquilado un piso cerca de una zona céntrica de su próximo viaje a Budapest. No tienen mucho tiempo que perder ya que será un viaje corto. Ella y su familia ya han mirado los eventos cercanos e incluso habían obtenido las entradas de varios eventos. Cuando ya están en Budapest, se preparan para ir a uno de esos eventos en el teatro. Una vez llegan allí, les informan de que la obra se había cancelado varias horas antes por enfermedad de varios actores. No han tenido forma de saber que eso iba a pasar y la aplicación no les ha informado de la situación.
María Teresa y su familia quieren probar un sitio nuevo para cenar cerca de su urbanización. Un amigo de la pareja de María Teresa le recomienda una aplicación llamada SweetIt! Inicialmente ilusionados la pareja comienza a mirar los diversos restaurantes por categorías en los que pueden hacer una reserva. A medida que van viendo más restaurantes, se dan cuenta que en muy pocos de ellos se incluye una opción clara de "Menú Infantil", quizás directamente porque no tienen menú infantil en el restaurate, o porque no figura en la aplicación. Al final acaban recurriendo a una de las opciones de siempre al no tener información clara sobre el menú infantil para su hijo.
Para concluir con la práctica, creemos que ha sido una práctica interesante de realizar porque hemos tenido que mirar en detalle el trabajo de nuestros compañeros: su propuesta de valor, cómo han efocado el diseño de su aplicación, los bocetos y una de las partes más interesantes: el vídeo de introducción a su propuesta de valor.
También nos ha parecido interesante el tener distintas temáticas entre los diferentes grupos. Con el primero de los grupos, al ser el mismo que el nuestro teníamos algo más de experiencia y familiarización, pero con los otros dos, al ser nuevos y tratar de temáticas algo diferentes ha sido curioso analizarlos y ver cómo han planteado sus prácticas.
Por último, para concluir con un pequeño ranking, queremos destacar el Caso 2, por su completitud y de una buena extensión y cuidando los detalles sobre todo del vídeo de introducción y de los bocetos. Los otros dos casos los ponemos un poco por debajo, pero ambos también son muy buenos y merecen también su reconocimiento.
La versión anterior de las prácticas de la asignatura se encuentra disponible, según lo especificado en el guión de la entrega adicional en la branch beta. Se puede acceder a ella seleccionándola en el menú superior o a través de este enlace.
Este rediseño de la práctica se realiza siguiendo las evaluaciones de nuestros compañeros, así como del checklist proporcionado por el profesor. Se adjuntan enlaces a cada una de ellas:
- Evaluación de DIU1.Cereza: PDF/Excel
- Evaluación de DIU2.EscuadrónMapache: PDF/Excel
- Evaluación de DIU3.AMRM: PDF/Excel
- Checklist: PDF
Obtenemos información tanto del checklist elaborado por el profesor tanto de las tres evaluaciones de nuestros compañeros de que el análisis competitivo es algo pobre y escaso de información. Tienen razón estas valoraciones y por tanto hemos hecho un análisis competitivo de algunas otras aplicaciones que podrían hacer competencia a Pazifika.
Se puede leer el análisis completo a través de este enlace.
Otro de los posibles puntos de mejora que se detallan tanto en el checklist proporcionado por el profesor como por los compañeros de clase son las Personas ficticias propuestas y los User Journey Map correspondientes.
En cuanto a las personas, algunos detallan que María Teresa es una Persona adecuada, que encaja perfectamente y no tiene ninguna incosistencias. Sin embargo, en cuanto a José Luis consideran que es una Persona ficticia demasiado forzada para encajar en el propósito de la propuesta de valor y que debería ser cambiada.
En cuanto a esta persona, a José Luis, hemos considerado que no tiene mucho sentido utilizar una Persona que tiene grandes capacidades para socializarse porque esta persona se adaptaría a cualquier circustancia, sería más interesante que sea una persona con menos capacidades sociales con objetivo de observar como se desarrollaría su uso en una aplicación de este estilo.
Para los User Journey Maps hemos recibido críticas de que estos carecen de conflictos de uso. Hemos mejorado acordemente los Journey Maps para reflejar cambios más relevantes y situaciones más realistas.
Los cambios en las imágenes y algunas conclusiones adicionales están disponibles en P1/README.md.
Para la mejora de este apartado se han tenido en cuenta las anotaciones que el profesor propone en la checklist "Conclusion no acorde con puntuacion", y es que en nuestra conclusión inicial poníamos una calificación de 66 y en la conclusión nos centrabamos demasiado en los errores de rendimiento.
Consideramos que la calificación es la misma (66 puntos - Moderate) ya que el análisis se realizó correctamente, pero efectivamente la conclusión era bastante mejorable, ahora hacemos hincapié en que efectivamente la página tiene un diseño correcto, sin olvidar aquellos problemas de disponibilidad que lastran un poco a la plataforma.
Con respecto a las indicaciones propuestas por nuestros compañeros como valoración de este apartado en concreto hay disparidad de opiniones, un grupo nos lo califica como excelente, argumentando que está bien realizado y que ha servido para detectar errores. Por otro lado nos encontramos a dos grupos que lo califican como pobre y muy pobre, uno de ellos no aporta ningún comentario realizando una crítica constructiva y el otro grupo dice que es muy breve.
Pensamos que es posible que estos dos últimos grupos hayan enfocado su análisis en la conclusión que aparece en el README, sin haber consultado el documento incluido en la carpeta de la Práctica 1 donde se elabora un análisis detallado.
Uno de los principales factores que también requerían mejoras según el checklist del profesor era el Feedback Capture Grid. Como punto bueno, identificaba los problemas correctamente y en general estaba bastante bien, pero le faltaba un punto importante y del que casi carecía de sentido si no se incluía: ¿resuelve los conflictos de los usuarios planteados en la primera parte del estudio?
Evidentemente en nuestras primeras versiones esto no se contemplaba, y ahora se ha mejorado para incluir y mejorar los problemas que los usuarios se han encontrado según lo comentado en los User Journey Maps. Este Feedback Capture Grid mejorado se puede encontrar anteriormente en este documento.
Adicionalmente, también se nos indica que no se incluye una propuesta de valor. Cabe indicar que esto se habló con el profesor en una tutoría y se incluyó posteriormente.
Se han aplicado pequeñas mejoras al belling, que incluyen el inicio de sesión y el registro.
El sitemap también se ha mejorado para que sea más acorde a lo que se pide como sitemap. Tanto en el checklist como en las evaluaciones de los compañeros, se argumenta que el sitemap aportado anteriormente era bastante pobre.
Por tanto, está disponible anteriormente en este documento el sitemap actualizado. Además, también se puede acceder a través de este enlace.
En cuanto a los wireframes proponemos a continuación dos nuevos bocetos que contienen algunos cambios que venían reflejados tanto en la checklist proporcionada por el profesor como por las evaluaciones delos compañeros. Hemos decidido dejar en la sección correspondiente los wireframes antiguos, y solo proponer dos versiones de los mismos. Los cambios realizados (listados abajo) se aplicarían idealmente para todos los wireframes, pero consideramos que no es necesario volver a hacerlos todos de nuevo.
Página principal
Contacto
La diferencia con respecto a los wireframes anteriores es que se ha añadido la navegación (las tres barras horizontales que hacen las veces de menú en versión móvil), los botones de inicio de sesión y registrarse en la página principal, así como u buscador simple y una sección de footer. Consideramos que ahora los bocetos se adaptan mejor al rediseño propuesto.
Estos bocetos también están disponibles a través de este elace.
Para concluir con este documento, dejamos una conclusiones finales sobre la realización de esta práctica extra de la asignatura.
En primer lugar hemos podido observar cómo hemos ido mejorando conforme realizamos las prácticas. Concretamente la Práctica 1, según la checklist y las evaluaciones de nuestros compañeros estaba muy mejorable. La Práctica 2 estaba algo mejor, pero aún había algunas cosas que mejorar bastante y otros detalles. Finalmente, la Práctica 3 es que la generalmente ha gustado más y estaba mejor hecha.
La opción de poder subir nota y mejorar algunos aspectos que nos parecían necesarios para que las prácticas estuviesen mejor, nos ha dado una oportunidad para pulir esos aspectos que el profesor había comentado previamente en clase y que nuestros compañeros también nos indicaron a través de sus evaluaciones.
También cabe destacar que gracias a toda la información que tenemos ya disponible de la asignatura y más concretamente de la realización de las Prácticas, no ha sido una tarea especialmente difícil mejorar los aspectos comentados en esta sección del documento.