Análisis Heurístico de Usabilidad en CiudApp

David Sandoval
UX / UI Design
Published in
11 min readJun 6, 2016

--

Mucho se ha dicho acerca de CiudApp, la nueva aplicación móvil de la actual administración del gobierno de Guadalajara para la gestión de la información relevante en la ciudad a través de la participación ciudadana.

Enrique Alfaro, Gobernador de Guadalajara, anunció la app durante la sesión de Campus Night el 30 de Mayo de 2016 donde dijo:

“Es una herramienta de gestión integral de la ciudad, que me parece va a marcar un antecedente muy importante a nivel nacional (…) implica, así como lo dije, Gobierno abierto; implica tener también una ciudadanía más consciente, más informada, más participativa, una ciudadanía más crítica”

Alfaro destacó que a través de CiudApp, los ciudadanos podrán realizar reportes georreferenciados para que puedan ser atendidos por las autoridades, solicitar o sugerir servicios de la autoridad, obtener noticias de interés que se generen en el municipio y recibir alertas sobre cierres viales u otros incidentes. Al mismo tiempo, el ciudadano podrá conocer temas y sitios de interés en la metrópoli. La aplicación está disponible para Android e iOS.

Fuente: http://www.informador.com.mx

Inclusive, existen alternativas locales como Avisora.mx, que intentan resolver muchos de los retos mencionados anteriormente y que ya tienen tiempo en el proceso de validación y product-market-fit.

Como a muchos, cuando el gobierno municipal anunció la app me dio mucha curiosidad el porqué habrían contratado a una empresa española como sus proveedores de software cuando el talento en Guadalajara ha demostrado en los años recientes contar con la capacidad de construir productos de calidad mundial. Inclusive sólo semanas atrás, el Washington Post había publicado un artículo muy extenso en cómo Guadalajara se está posicionando como uno de los epicentros de tecnología con mayor potencial en el continente. Pienso que naturalmente el talento local debería ser la primera opción para que se generara la solución a los problemas de la ciudad, sin embargo el gobierno no opinó lo mismo, lo cual aunque respetable, me parece una decisión extraña tomando en cuenta los retos de construir un producto digital que realmente empatice con la realidad de los usuarios.

El lanzamiento de esta aplicación se ha vuelto motivo de debate, críticas y guerra sucia, pero hoy quiero alejarme de todo eso y ver a CiudApp desde una perspectiva de UX y por lo que realmente es: un producto digital.

Antes de seguir adelante, quiero decir que no favorezco ninguna solución en particular, ni CiudApp, ni Avisora. Como diseñador de productos de software y consultor de negocios, mi trabajo se enfoca en mejorar las experiencias de los usuarios de los productos que creamos para una mejor calidad de vida. No tiene caso invertir una gran cantidad de recursos públicos en productos que no cumplen con los objetivos para los que fueron creados, sea cual sea el equipo detrás de su diseño y código.

Entonces… ¿Qué opinan los usuarios?

El juez fundamental de todo producto digital es el usuario. Es absolutamente indispensable conocer el porqué alguien va a utilizar una aplicación, ya que sin llegar a una verdadera empatía de la razón real por la que alguien podría utilizar un producto perdemos una oportunidad en generar innovación.

Una vez dicho esto, procedí a revisar las reseñas de la aplicación en el App Store y Play Store y me encontré con lo siguiente:

Opiniones divididas en el Apple App Store

En general, opiniones mezcladas y algunas sospechosamente muy positivas de manera inmediata, casi como si hubieran sido agregadas de forma intencional —asumo, aunque no tengo pruebas – para impulsar la primera impresión de los usuarios y la calificación inicial.

Después de revisar las reseñas era tiempo de analizar de forma más seria la aplicación, por esto decidí hacer una evaluación heurística de usabilidad simple para determinar qué tan buen producto es y cuántas áreas de oportunidad existen del lado de experiencia de usuario.

¿Qué es una evaluación heurística de usabilidad?

Una evaluación heurística de usabilidad es básicamente un método para inspeccionar software e identificar problemas de usabilidad en la interface de usuario. La manera de dar un juicio es a través de una comparativa con principios de usabilidad reconocidos. En este caso vamos a tomar como base los 10 principios heurísticos de usabilidad propuestos por Jakob Nielsen, sin embargo existen otras clasificaciones como las de Gerhardt-Powals o Weinshenk y Barker que son muy interesantes y las cuales recomiendo en caso de que les interese conocer más acerca de evaluaciones de usabildiad.

Nota: Una de las claves para un buen análisis heurístico de usabilidad es contar con muchos evaluadores en acción, con el propósito de encontrar la mayor cantidad de elementos de evaluación en la interface de usuario. Dado que en esta ocasión solo soy yo, les pido a los lectores de esta publicación que agreguen sus comentarios para complementar y agregar aquellas cosas que se me escaparon.

Evaluación

Dispositivos de prueba:

iPhone 6S Plus. iOS 9.3.2

iPad Pro 9.7 iOS 9.3.2

Lamentablemente no tengo dispositivos Android para probar la aplicación. De manera preliminar puedo decir que las capturas de pantallas en Google Play Store muestran un producto con una interface más consistente a lineamientos de Material Design y convenciones de lenguaje gráfico para Android que su contraparte de iOS (Osea, está mejor en Android.)

Calificaciones:

Para evaluar de forma sencilla la experiencia en CiudApp estoy asignando los siguientes valores:

  • A. Cuando el resultado en general es positivo.
  • B. Cuando el resultado general es medio o tiene claras áreas de oportunidad, aunque ligeras.
  • C. Cuando la experiencia está por debajo de lo mínimo esperado en una aplicación hecha con estándares mundiales de calidad –Le falta, pues.

Principio 1:

Visibilidad del estado del sistema

“El sistema siempre debería mantener informados a los usuarios de lo que está ocurriendo, a través de retroalimentación apropiada dentro de un tiempo razonable.”

La principal problemática que experimenté en esta área fue la constante necesidad de cargar información haciendo una petición a un servicio web, lo que limitaba mi capacidad de hacer otras cosas (o incluso cancelar la acción) hasta que el sistema me permitiera continuar. Esto puede volverse frustrante para alguien con una conexión intermitente o de baja calidad.

Calificación: B

La descarga de categorías de reporte se hace cada vez, necesitando una conexión a internet.
Los reportes son mostrados de manera agrupada para facilitar la navegación en el mapa.

Principio 2:

Relación entre el sistema y el mundo real

“El sistema debería hablar el lenguaje de los usuarios mediante palabras, frases y conceptos que sean familiares al usuario, más que con términos relacionados con el sistema. Seguir las convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico.”

En este apartado, CiudApp generalmente hace un trabajo medio, ya que cuenta con un lenguaje gráfico que se percibe como genérico y en ocasiones ambiguo. El principal problema con añadir ilustraciones e iconografía “universal” es que el usuario puede confundirse al no contar con un modelo mental apto para recibir esta información. Si no entienden los símbolos entonces probablemente no entiendan qué hacer para completar uno de sus objetivos.

Calificación: B

Los gráficos son un poco ambiguos al querer informar botones de acción y contexto de uso.

Principio 3:

Control y libertad del usuario

“Hay ocasiones en que los usuarios elegirán las funciones del sistema por error y necesitarán una “salida de emergencia” claramente marcada para dejar el estado no deseado al que accedieron, sin tener que pasar por una serie de pasos. Se deben apoyar las funciones de deshacer y rehacer.”

Creo que es relevante mencionar que en el tema de control y libertado del usuario, CiudApp hace un buen trabajo al permitir agregar, eliminar, personalizar y cancelar acciones e interrumpir flujos de manera voluntaria –la mayoría de las veces.

Calificación: A

Principio 4:

Consistencia y estándares

“Los usuarios no deberían cuestionarse si acciones, situaciones o palabras diferentes significan en realidad la misma cosa; siga las convenciones establecidas.”

En este apartado si sufrí algunas confusiones, principalmente en el tema de navegación y lenguaje. Existen algunas áreas donde la aplicación toma como referencia los ajustes de idioma de sistema para nombrar algunos elementos, como el botón de “Atrás”, que aparece como “Back” y el resto de las etiquetas las muestra con el idioma de los ajustes internos de la aplicación.

En el área de navegación, al iniciar el flujo de reportes, el usuario navega hacia otra sección que pareciera contar con los elementos de navegación de la pantalla principal pero con propósito distinto. Generalmente, en la mayoría de aplicaciones para iOS, estos elementos se utilizan sólo para la navegación principal y al querer agregar un elemento más al mapa se inicia un proceso individual a través de una pantalla “modal”, la cual puede ser interrumpida en cualquier momento.

Calificación: B

La navegación duplica funcionalidad en pantallas distintas. (Lo de la izquierda es la otra pantalla, disculpen mis garabatos).

Principio 5:

Prevención de errores:

“Mucho mejor que un buen diseño de mensajes de error es realizar un diseño cuidadoso que prevenga la ocurrencia de problemas.”

Al generar algunos reporte de prueba, y a pesar de lo dicho en el punto anterior, pude navegar de inicio a fin sin demasiados inconvenientes.

La aplicación me mantuvo informado en el momento adecuado de la información que necesitaba para seguir adelante y completar mis objetivos. Siendo esto el principal uso de la generación de contenido dentro de la aplicación, considero que cumplió con mis expectativas. De la misma manera, consumir contenido desde la sección de noticias fue bastante sencillo, aunque a ratos la información desplegada en los WebViews no tenían el mejor formato o se mostraban movidas.

Calificación: A

Principio 6:

Reconocimiento antes que recuerdo:

“Se deben hacer visibles los objetos, acciones y opciones, El usuario no tendría que recordar la información que se le da en una parte del proceso, para seguir adelante. Las instrucciones para el uso del sistema deben estar a la vista o ser fácilmente recuperables cuando sea necesario.”

El principal defecto que pude identificar es en el tema de visibilidad de acciones y opciones. Los contrastes utilizados en botones y acciones importantes para el usuario a través de la aplicación tienden a ser pobres o requerir atención a detalle para verlos, comprenderlos y saber qué hacer con ellos.

Calificación: B

Algunos ejemplos de iconografía con poco contraste.

Principio 7:

Flexibilidad y eficiencia de uso:

“La presencia de aceleradores, que no son vistos por los usuarios novatos, puede ofrecer una interacción más rápida a los usuarios expertos que la que el sistema puede proveer a los usuarios de todo tipo. Se debe permitir que los usuarios adapte el sistema para usos frecuentes.”

Considero un acierto la idea de contar con una pantalla principal para personalizar las acciones frecuentes del usuario y permitir que pueda consumir o generar información con mayor eficiencia.

Calificación: A

El administrador de tarjetas de CiudApp. Por default, todos los usuarios tienen la tarjeta “botones” activada.

Principio 8:

Estética y diseño minimalista:

“Los diálogos no deben contener información que es irrelevante o poco usada. Cada unidad extra de información en un diálogo, compite con las unidades de información relevante y disminuye su visibilidad relativa.”

Este es un tema un poco frustrante. El principal detalle que observé es que en la pantalla principal existe un espacio de tamaño fijo para que el administrador de la aplicación agregue una imagen, la cual se mantiene ahí siempre y nunca cambia de dimensiones o lugar.

Muy probablemente dicha imagen se vuelva irrelevante para el usuario la segunda vez que abre la aplicación y sin embargo no le es posible eliminarla de su lugar. Lo que eso ocasiona es que la información más relevante para el usuario se mantenga siempre por debajo y se muestre cortada en mayor o menor medida dependiendo del tamaño de pantalla del dispositivo.

Calificación: B

¿Por qué mostrar el logo todo el tiempo en lugar de facilitar el consumo o generación de la información?

Principio 9:

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

“Los mensajes de error se deben entregar en un lenguaje claro y simple, indicando en forma precisa el problema y sugerir una solución constructiva al problema.”

Generar mensajes de error descriptivos es una tarea que pocos equipos de desarrollo toman como algo prioritario, cuando en realidad se pueden volver uno de los puntos principales de bloqueo y frustración para los usuarios en sus interacciones con las aplicaciones móviles.

Para mi grata sorpresa, CiudApp cuenta con distintos tipos de mensajes de error que por lo general informan de manera adecuada y comunican al usuario qué hacer para resolver el problema y evitar el error en el futuro.

Durante mis pruebas busqué por aquellos frustantes errores generales de operaciones incompletas, problemas de servidor o de tiempo de respuesta agotado –que hacen todo menos informar adecuadamente al usuaro– y afortunadamente no econtré alguno.

Calificación: A

Principio 10:

Ayuda y documentación:

“Incluso en los casos en que el sistema pueda ser usado sin documentación, podría ser necesario ofrecer ayuda y documentación. Dicha información debería ser fácil de buscar, estar enfocada en las tareas del usuario, con una lista concreta de pasos a desarrollar y no ser demasiado extensa.”

El sistema asume que el usuario va a recordar el tour inicial del producto, ya que una vez completado no encontré manera de volver a ver la información. Aunque es cierto que las instrucciones iniciales son bastante simples, es una mejor práctica poner a disposición del usuario una manera de re-visitar información básica de la propuesta de valor del producto.

Calificación: B

Conclusiones

Calificación general: B

En general CiudApp es un producto que, aunque se siente genérico y en ocasiones incompleto, logra cumplir con un gran número de objetivos de usuario de manera que yo consideraría aceptable.

Para ser una primera versión de un intento del gobierno local por solucionar los problemas de comunicación y participación ciudadana, pienso que es un paso sólido en la implementación de nuevas tecnologías en un área que se ha quedado atrás en el tema de innovación.

Dicho lo anterior, existe algo que me preocupa más que la interface de usuario o calidad en la experiencia con el producto… este tema tiene que ver con la transparencia y manejo de la información.

¿Qué tanta confianza existe en el manejo adecuado de los reportes generados por usuarios cuando potencialmente pueden contradecir intereses políticos? Es un tema complejo que vale la pena reflexionar y levantar la voz. Me voy a detener aquí, pero te invito a unirte al debate y juntos lograr acuerdos que beneficien a los ciudadanos de Guadalajara y el resto de México.

Si este análisis fue de tu agrado, no dudes hacérmelo saber a través de Twitter en @davidzendoval

Estoy considerando hacer una segunda parte donde analice Avisora.mx, la alternativa a CiudApp creada por una empresa local en Guadalajara. Si te gustaría que lo hiciera por favor recomienda y comparte este post.

Gracias a

y a por su ayuda en la revisión y edición de este post.

--

--

David Sandoval
UX / UI Design

I like to solve problems. UX / Product Designer. MBA Marketing. Creative Manager @iTexico. I co-organize @SWGuadalajara