📷 ㊗️ 🤝 UX-research de RBS: nuestra experiencia, errores y descubrimientos 👰 👨🏾‍🚒 🕺🏾

Oye. Soy Denis Elianovsky, Director de Diseño en JTC y Líder en Opium Pro. Trabajamos en segmentos muy estrechos del mercado de TI relacionados con las finanzas y el flujo de trabajo. Ciertamente no has oído hablar de estas compañías y hoy no sabrás mucho sobre ellas, porque este artículo trata sobre la investigación de UX.

He estado diseñando durante los últimos 12 años (8 de ellos son precisamente el diseño de interfaces complejas) y quiero decir cómo realizamos las pruebas de usabilidad de la aplicación RBS. Y también sobre qué errores se cometieron y cuáles sacaron conclusiones de esto. En el proceso, recomiendo un par de libros. Todas las imágenes son clicables.

¿Qué es la RBS?Es sinónimo de servicio de banca remota. Estas aplicaciones también se denominan bancos en línea. Seguramente todos ustedes ya tienen esto en su teléfono. Aquí somos uno de los que diseñan y desarrollan tales aplicaciones.

Probablemente encontrará algo útil en el artículo si ya ha escuchado sobre la investigación de UX y desea probar su aplicación, pero no sabe por dónde comenzar. Si ya tienes experiencia en pruebas, será aburrido y poco interesante, perdóname.

¿Quién es más conveniente para ver el video? Aquí hay una grabación

¿Qué son las pruebas?

Si solicita poner una descripción de la investigación de UX en 23 palabras usando tres comas, un guión y un guión, entonces la investigación de UX es una acción rápida y útil que se puede hacer en las primeras etapas de desarrollo y, por lo tanto, evitar errores en producción. Pero el lanzamiento de una aplicación bancaria en producción no es solo un gran estrés, sino también una gran pérdida de dinero. UX-research le permite probar su aplicación en usuarios reales mucho antes de que comience a descargar KAMAZ con dinero en los bolsillos de desarrolladores y vendedores.

Por supuesto, cada diseñador (cada buen diseñador) prueba su aplicación antes del lanzamiento. Pero generalmente esto se hace "en casa". Es decir, se prueba en sus seres cercanos y queridos, y muy rara vez se sistematiza de alguna manera. En este artículo quiero transmitir que en aplicaciones grandes y complejas, las pruebas de diseño deben regularse e integrarse en el proceso de diseño mismo.

Primero, la investigación puede ser cuantitativa y cualitativa. Cuando hablamos de investigación cuantitativa, nos referimos a la cobertura de la audiencia: nos esforzamos por aumentar el número de personas que evaluamos. Cuando hablamos de investigación de calidad, evaluamos a pocas personas, pero con cada una de ellas llevamos a cabo una entrevista más detallada y profundizamos en cada caso específico.

Plano coordinado. Derecha: cuantitativa. Izquierda - Calidad

El mismo plano de coordenadas. Arriba está el comportamiento. Abajo - Actitud

Se puede dividir más investigación en conductual y relacional. Cuando realizamos pruebas de comportamiento, monitoreamos lo que una persona hace con nuestra aplicación. En relacional es importante que la persona hable sobre nuestra aplicación.

En este artículo, nos centraremos en las pruebas de usabilidad. Se relacionan con las pruebas de calidad de comportamiento. En este caso, un pequeño número de personas participan en las pruebas y, básicamente, lo que están haciendo con la aplicación se estudia cuidadosamente.

El mismo plano de coordenadas. Marca de círculo superior izquierda

El proceso de diseño se refleja bien en el calendario de Damien Newman. Y como dije anteriormente que el diseño y las pruebas deberían ser un todo único, el gráfico refleja tanto el proceso de creación de un diseño como su prueba. Se pueden sacar dos conclusiones de este gráfico. 1) El diseño y las pruebas son un proceso no lineal. 2) Y también es un proceso iterativo. Esto es obvio a primera vista en el gráfico, ¿no? ¿Qué quiero decir con no linealidad?

Un enredo enredado que se desenreda en una línea plana

Inicialmente, tenemos tantas teorías diferentes que queremos probar a través de prototipos. Y solo hacia el final del proceso de diseño, de alguna manera se establecen. De vez en cuando, de iteración en iteración, las sesiones de prueba se vuelven más similares entre sí y los cambios en el diseño se vuelven cada vez menos: son más profundos, más elaborados, pero externamente es más difícil notarlos.

Al llamar al proceso iterativo, quiero decir que no puede probarlo una vez y detenerse allí. Las pruebas deben llevarse a cabo regularmente. Es entonces cuando tiene sentido. Especialmente considerando que el diseño también está cambiando dramáticamente en el proceso.

¿Cómo prepararse para un estudio de UX?

Usability- . ? , . . , , ( ), User Story Map. User Story Map .
. , . , . , 10–15 , 20 ( : , , ). , 5–7 -. , . , «» «», -, .
. (5–7 ). , . -. , « » .

Daré una respuesta inmediata a la pregunta más popular de nuestros clientes, que suena así: "¿Probablemente prueba todo por su cuenta para garantizar buenos resultados?" No. No solo no incluimos nuestros resultados en las pruebas, también tratamos de no incluir a personas con deformaciones profesionales en las pruebas, es decir, aquellos que se dedican profesionalmente a pruebas de dinero. Y también excluimos a diseñadores, programadores y otros que también están sujetos a esta deformación profesional.

Repitamos lo que necesitamos para prepararnos para consolidarnos.

1. Hipótesis

La siguiente imagen muestra varias opciones posibles para visualizar este proceso. La pantalla de la izquierda es cómo puedes hacer el Mapa de historia del usuario por medios improvisados. Para hacer esto, solo use pegatinas de papel. Al conectarlos con cadenas, mostramos suposiciones sobre cómo el usuario recorrerá la aplicación. La segunda opción es el Mapa de historia del usuario, dibujado en Miro. De hecho, los mismos trozos de papel, solo se transfieren a forma electrónica por conveniencia. Y la tercera pantalla es un prototipo en el que se puede hacer clic en Figma.

Se indican las herramientas específicas anteriores, pero de hecho no hay ninguna vinculación con ellas, y se pueden construir hipótesis en lo que sea conveniente para usted. Por ejemplo, en nuestro equipo hay entusiastas que realizaron todas las pruebas en papel. También tenían un prototipo en el que se podía hacer clic en trozos de papel, y esto también se puede comenzar.

2. Elaboración de preguntas

Preguntas abiertas. Genial si serán en forma de historias. Es decir, si suponemos que una persona debe bloquear la tarjeta para resolver su problema, no decimos "Bloquear la tarjeta" en nuestra frente , le contamos una historia. Idealmente, la historia debe sumergir a una persona en sí misma y provocar que responda también con la historia.

Ejemplo:

3. Reuniendo a los encuestados

Este calendario fue compilado por Jacob Nielsen en la década de 1990. Incluso entonces, se realizaron estudios de UX. La línea horizontal muestra la cantidad de personas que estamos probando, y la línea vertical muestra la cantidad de errores encontrados. Vale la pena señalar que después de aproximadamente la quinta persona que se está evaluando, el horario se vuelve más suave, pero ¿qué significa esto? Esto significa que después de 5 personas, la eficiencia de encender cada nueva persona de prueba disminuye, y con ello encontramos cada vez menos errores. Jacob Nielsen hizo tal conclusión, y compartimos plenamente esta conclusión.

Es más eficiente hacer pequeñas muestras, pero hacerlo con frecuencia.

Al principio quería aconsejar el libro de Jacob, pero en general ya es viejo. Hay algo mejor El autor continúa participando en la investigación de UX, y aquí está su sitio web, hay muchos artículos: nngroup.com

Proceso de prueba

Maldición, es importante grabar todas las pruebas en video. El video es el artefacto más importante de las pruebas. Si no tiene un video, podemos decir que no realizó la prueba.

El primero. Antes de comenzar las pruebas, dado que estamos probando una aplicación móvil, le damos el teléfono a una persona. Le pedimos que se relaje y asegúrese de expresar todo lo que está sucediendo. Es importante para nosotros entender el tren de pensamiento del sujeto.

En segundo lugar, y llamamos a esta regla "5 ¿por qué?", en el proceso de pasar el guión, debe provocar que una persona explique cualquiera de sus paradas o dudas en sus acciones. Aquí tales preguntas ayudan mucho: "¿Qué esperaba ver en esta pantalla?", "¿Por qué hizo clic en este botón?". Esto no siempre es exactamente el 5 por qué, pero el deseo de hacer tantas preguntas como sea posible y sumergirse en la cabeza de la persona tanto como sea posible siempre ayuda.

Y el tercero. En base a los resultados de la prueba, preguntamos: “¿Crees que has completado la tarea? ". Además, no solo el encuestado responde a esta pregunta, sino también la persona que realiza la prueba. Por qué hacemos esto, lo diré a continuación.

Ahora pasamos directamente a nuestras pruebas.La tabla muestra cómo se verían los resultados resumidos de la investigación. Estos son los resultados reales de nuestra primera prueba. A la izquierda hay una lista de preguntas e historias, seguida de columnas para cada uno de los encuestados. Si cuesta 1, significa que tanto el sujeto de prueba como el evaluador consideraron que la tarea se completó. Si es 0.5, significa que alguien solo cree que la tarea no se ha completado. Si 0, ambos acuerdan que la tarea no se ha completado. A partir de estos datos, podemos entender qué escenarios tenemos son fuertes, cuáles son débiles. A partir de los datos de la tabla, podemos concluir que, por ejemplo, estamos haciendo bien en bloquear la tarjeta, todos se las arreglaron. Y con la transferencia de dinero, no muy bueno, esto es en lo que deberíamos trabajar.

Probamos nuestra aplicación móvil RBS para individuos. En total, en el momento de la creación de este informe, se aprobaron dos iteraciones de pruebas, en cada una de las cuales se evaluaron 6 personas. Solo 7 mujeres, 5 hombres de 20 a 50 años. Inicialmente, no intentamos hacer una selección muy amplia de profesiones, pero resultó ser bastante diversa: maestros, médicos, administradores de restaurantes, etc. Debido a la solicitud de nuestro cliente, en la segunda sesión se incluyeron más personas mayores de 40 años en la muestra. Y fue en esta audiencia donde se identificaron la mayoría de los errores. La mayoría de las veces tropezaron en alguna parte, se detuvieron en alguna parte y tuvieron que hacer la mayoría de las preguntas.

Resultados de la prueba

Los resultados de la prueba desde el punto de vista de "afrontado / fallado": Resultó que la prueba hizo frente al 93% de las tareas. Además, ellos mismos creían que habían logrado solo el 83%. Esta diferencia del 10%: esos momentos en que una persona fue de acuerdo con el escenario deseado, nuestro evaluador ve que hizo frente a la tarea, pero el encuestado no está seguro de los resultados. Y estos también son problemas en los que hay que trabajar. Después de todo, entendemos que en esos momentos la aplicación no le da a la persona la retroalimentación deseada y esto debe corregirse. En promedio, una sesión tomó 12 minutos. Un buen resultado, teniendo en cuenta el hecho de que nos centramos en 10-15 minutos. A continuación se muestra el diseño de la aplicación que se utilizó en la primera iteración de las pruebas. Permítanme explicar lo que decidimos cambiar de acuerdo con los resultados de la prueba.

Lo diré en nombre del usuario que metió un dedo en esta aplicación.

Supongamos que necesito pagar un teléfono móvil. Probablemente, debería haber un botón de "pagar" en alguna parte. No encuentro el botón y me voy a buscarlo en el menú de hamburguesas en la esquina superior izquierda.

¿Cuál es el problema? Hay dos botones de "pago" en la pantalla, nadie ha notado ninguno de ellos. Esto fue en 3 casos de 6.

Otro problema. La sección de análisis, que encontramos muy útil, desafortunadamente, los usuarios no la encontraron como tal. Solo confundía a la gente.

En general, si mira globalmente, esta pantalla está sobrecargada, es difícil para el usuario clasificar en sus cabezas qué y dónde se encuentra.

La segunda pantalla es la pantalla de pago / transferencia: durante las pruebas, encontramos que las personas están interesadas en ver sus pagos regulares y los están buscando en la pantalla de pagos. En la primera versión del diseño, estaban en el borde y parcialmente ocultos por un desplazamiento horizontal. Bueno, en principio, estaban en una pestaña separada, lo que también hacía difícil encontrarlos. La tercera pantalla es una pantalla con productos bancarios:

Todas las personas que probamos (ok, casi todas) notaron que esta pantalla es útil. Sabían dónde llamarlo, a menudo lo usaban. Aquí creamos un problema para nosotros al hacer una llamada a esta pantalla en el menú de hamburguesas superior izquierdo. En el video, notamos que cuando una persona intenta presionar este botón, muchos interceptan el teléfono, y esto no es conveniente para todos.

Ahora los teléfonos se han vuelto grandes, pueden caerse y decidimos que esto es un problema para nosotros, trabajaremos con él. Por cierto, ¿adivina por qué el autor del artículo camina con un teléfono roto?

Las siguientes imágenes muestran el diseño significativamente cambiado de la segunda iteración.

Como puede ver, la pantalla se ha vuelto mucho más fácil. Ahora, cuando pedimos a los usuarios que nos digan lo que ven, nos dijeron esto de la misma manera que nosotros mismos imaginamos. La sección de análisis se eliminó con un botón adicional, ahora no carga espacio. En la pantalla de pago, los pagos regulares se realizan de tal manera que se noten. Pero la gente todavía está atrapada aquí, lo que implica que definitivamente lo mejoraremos y lo facilitaremos. La tercera pantalla es una pantalla con una lista de productos bancarios que tiene una persona. Y aquí lo accedimos desde la parte inferior del teléfono en lugar de llamarlo desde el menú de hamburguesas superior izquierdo.

Ahora este objeto se encuentra directamente debajo del dedo del usuario y no necesita alcanzarlo, simplemente deslice hacia arriba o haga clic en él para abrir la lista de productos.

Algunas observaciones y conclusiones más que hicimos durante las pruebas. ¿Quién sabría que hay personas zurdas y personas en el mundo que simplemente están acostumbradas a sostener el teléfono en la mano izquierda? Y tienen sus propias características de uso. Si una persona común intercepta el teléfono, el zurdo no intercepta para presionar el botón del menú de hamburguesas. Tomamos nota de que los zurdos solo usan los dispositivos de manera diferente, y continuaremos probando y descubriendo si podemos mejorar la experiencia para ellos. Todavía hay personas con mala vista.

Gráfico de barras. 3 barras: 10%, 13%, 50%

Todo el mundo lo sabe, y todos lo olvidan (me refiero a los diseñadores). ¿Cómo puedo ayudar a las personas con baja visión? En primer lugar, puede aumentar los objetos en el diseño. En segundo lugar, puede aumentar el contraste en el diseño. Y hay otro punto menos obvio: puede separar la información, aumentar la distancia entre bloques, lo que también ayudará a las personas a leer mejor las interfaces.

Según las estimaciones más conservadoras que se pueden encontrar en Wikipedia, tenemos un 10% de personas zurdas y un 13% de personas con baja visión. Según el inmodesta, las personas zurdas están en algún lugar alrededor del 15%, y las personas con baja visión, el 30%.

Y algunas chicas tienen uñas largas.Estas chicas también usan el teléfono de manera diferente. Les resulta difícil presionar algo en la esquina inferior derecha, porque en lugar de presionar con la punta del dedo descansan con una uña y, por lo tanto, también tienen que interceptar de alguna manera. No hay estadísticas oficiales aquí, pero puedo suponer que de vez en cuando hasta el 50% de la población adulta del planeta puede estar en esta situación.

Además de las pruebas de usabilidad resaltadas anteriormente, hay muchas formas diferentes de probar UX. Entre ellos:

Registro visual
Pruebas A / B
Encuestas en línea
Entrevistas en profundidad

En el primer plano de coordenadas hay círculos con los métodos de prueba mencionados anteriormente.

Cuanto más tiempo pasamos las pruebas, más claramente entendemos que las pruebas de UX están muy cerca de una ciencia como la psicología cognitiva. Y especialmente a un concepto como "distorsión cognitiva".

Para aquellos que quieran profundizar en esto, les aconsejo el libro de Daniel Caniman "Pensar, rápido y lento" (Piense despacio, decida rápidamente). Ella no le dirá nada sobre las pruebas, pero proporcionará un buen terreno para la reflexión, mostrando cómo las mismas personas pueden responder diferentes preguntas de la misma manera.

¿Le ayudó este artículo a acercarse a comenzar a probar las interfaces usted mismo? ¿Qué resultó ser útil (si algo resultó ser) y qué es inapropiado?

Gracias a todos los que ayudaron a realizar el estudio y preparar el informe.

Investigación UX:
equipo JTC - análisis de negocios, diseño, investigación UX
Denis Krasilnikov - diseño
Anton Kazakov - investigación UX
Ekaterina Kashkovskaya - investigación UX
Dmitry Dobrodeyev - investigación UX
Irina Ponomareva - filmación y edición

Preparación del informe:
equipo JTC - generación de informes
Maxim Blokhin - diseño de
Irina Ponomareva - filmación y edición de
Nadezhda Molodtsova - filmación de
Tatyana Kitaeva - edición

UX-research de RBS: nuestra experiencia, errores y descubrimientos