Si bien los proveedores de front-end conocen y aprecian mucho a
Vitaliy Fridman (cofundador de
Smashing Magazine ), este nombre puede ser mucho menos conocido por los desarrolladores y probadores de dispositivos móviles. Pero Vitaliy, quien recientemente logró tomar dos primeros lugares a la vez en los
principales informes de HolyJS 2018 Piter, ahora llegó a conferencias móviles y de prueba con el nuevo informe "Extremos de prueba: trucos desde los rincones oscuros de las interfaces móviles".
Por lo tanto, en anticipación de
Heisenbug y
Mobius, le hicimos preguntas sobre las pruebas de UX y sobre las interfaces móviles: desde cómo se realizan tales pruebas específicamente en Smashing Magazine, y hasta los teléfonos inteligentes.
- La pregunta es para aquellos que no están profundamente inmersos en las pruebas de UX: ¿entendemos correctamente que, aunque se relaciona con las pruebas, es un área bastante peculiar y aislada? La prueba de la unidad es verde o roja, y tiene mucha materia aquí."Exactamente". En las pruebas que realizo, no se puede decir "verde" o "rojo". Aquí hay mucha subjetividad: los diferentes usuarios vienen con una cierta cantidad de prejuicios y con las habilidades aprendidas en otros sitios. Por ejemplo, una persona solo puede ir al sitio web de intercambio o al sitio de noticias. La forma en que ve Internet e interfaces es muy diferente de nosotros y de otras personas. Por lo tanto, en este contexto, es muy importante estudiar el público objetivo de un sitio en particular, ver qué otros sitios visita, cómo los usa, cuáles son sus hábitos.
Lo más difícil es lo subjetivo que a alguien le puede gustar, pero no a alguien, seleccionar algo objetivo en la interfaz para que la idea llegue a diferentes usuarios, todos entiendan qué y cómo hacer. Hay que buscar no lo que se hace "bien", sino lo que tiene una buena experiencia de recuperación.
Es decir, incluso si una persona viene con una experiencia de usuario diferente y comete un error en el sitio, es necesario que pueda regresar rápidamente a un estado normal y continuar su camino donde quiera que vaya. Esta es la parte más importante que es difícil de proporcionar completamente con la cobertura del código, por ejemplo.
Así que ahora tengo problemas con un plan ligeramente diferente. Miro cómo puedes cambiar pequeños detalles, por ejemplo, el texto de los errores adaptativos. Suponga que, si el pago con tarjeta no ha pasado, no solo necesita informar esto, sino también decir qué sucedió exactamente y cómo solucionarlo.
Mi tarea es mirar todos estos detalles, y la prueba automática de tales procesos es imposible. Necesito mirar a la gente. Por lo tanto, creo que hasta cierto punto me convertí en terapeuta o psicólogo. Miro constantemente a las personas, las observo y saco conclusiones basadas en cómo miran la pantalla, dónde hacen clic, dónde no hacen clic, cómo se mueve el cursor del dedo o del mouse. Este es un lado ligeramente diferente, más abstracto, humano.
- En las pruebas "habituales", la humanidad ya ha llegado a la conclusión de que es importante incluso sin pruebas. ¿Y en el caso de las pruebas de UX, donde todo es más abstracto, a menudo agitan sus manos y no prestan suficiente atención?- Sí, muy a menudo. El problema es que para mí, UX es siempre una gran cantidad de experimentos. Hay una idea: debe probarla y ver cómo cambiará la conversión o el compromiso. A menudo, el problema es que suponemos que puede cambiar algo y sacarlo a la luz de inmediato. Pero en UX, el efecto suele ser muy largo, a largo plazo.
Si cuelga una ventana emergente y ve cuántas personas hacen clic en él, este es un efecto a corto plazo, será fácil de medir. Por supuesto, si hay errores graves, por ejemplo, al comprar (una persona no entiende lo que se requiere de él para completar un pedido), lo notan rápidamente. Pero algunas cosas solo aparecen por mucho tiempo.
Hay algunas cosas relacionadas, por ejemplo, con textos en los que no está claro qué significa una característica, un producto o su propósito: debe dar un tiempo para ver si las personas usan esta característica, la vuelven o la tiran, porque inicialmente no entendieron lo que estaba haciendo. Esto se puede medir por las tasas de clics y las métricas de interacción, pero el problema puede no ser que las personas no necesiten esta función, sino que no esté claro cómo ayuda al usuario o cuándo exactamente usarla. Por lo tanto, lo único que hacemos para sistematizar de alguna manera este proceso es llevar a cabo una entrevista de usuario con al menos seis usuarios todos los viernes.
Hay alguna versión del producto, tenemos una implementación continua, algunas características: estamos buscando para ver si una persona entiende lo que está sucediendo en la interfaz. ¿Es más rápido para él cambiar a pagar el pedido o la información que necesita? Observamos la conversión y cómo una persona entiende lo que está sucediendo en la interfaz en general, ¿es más rápido para él pasar a la información que está buscando? Esta es la única forma de llevar a cabo de alguna manera la automatización, que es en las pruebas clásicas.
- Los gigantes de TI se acercan cuidadosamente a las pruebas de UX utilizando el seguimiento ocular y similares. Pero las pequeñas empresas pueden pensar: "Este Google está listo para asignar un laboratorio especial, pero para nosotros algo para entrometerse en las pruebas UX". Sin grandes recursos, ¿es posible lograr resultados aquí?- por supuesto. Hay tantos recursos, incluidos los gratuitos, que permiten realizar pruebas. El seguimiento ocular puede ayudar, pero en situaciones difíciles. Se puede utilizar, por ejemplo, en el caso de las rutas, cuando las personas no pueden encontrar cómo llegar a algunas habitaciones del museo. En este caso, es útil saber dónde miran las personas cuando van al museo y por qué no encuentran lo que parece ser muy fácil de encontrar. Puede verificar en la interfaz dónde miran las personas, a qué prestan atención y qué ven.
Los mapas de calor son un método bastante simple, hay muchas herramientas para crearlos. Analizan el tráfico y generan flujo, puede grabar videos para cada usuario: dónde fue, dónde estaba su mouse, dónde se movió, dónde hizo clic, dónde regresó, etc.
Por otro lado, existen herramientas que le permiten contratar personas del grupo de evaluadores que reciben dinero por cada prueba y les asignan una tarea, por ejemplo, el sitio web usertesting.com. Esto ya es mucho más costoso ($ 49 por prueba de video), pero puede elegir los datos demográficos que le interesan, asignarle una tarea a la persona, y allí se utiliza el llamado "protocolo de pensar en voz alta". Esto significa que cuando una persona va a la página principal de la interfaz y se mueve de una a otra, completando la tarea, debe decir si comprende todo, qué ve, de qué trata este sitio, qué espera cuando hace clic en el botón. Si recopila 6-7 de esos videos para dispositivos móviles y 6-7 para el escritorio, puede ver muchos patrones. Además, debe controlar cuidadosamente dónde se ven las personas y cómo se comportan con el mouse o el panel táctil.
Muy a menudo hay situaciones en las que alguien no entiende algo en la interfaz. La gente ama los botones y cualquier elemento interactivo. Comienzan a moverse en su dirección, pero no hacen clic en él, sino que giran el mouse alrededor del botón. Y solo entonces hacen clic. Esta es una de las señales de que una persona no comprende lo que sucederá si presiona un botón. Tales cosas se pueden encontrar fácilmente sin dispositivos muy caros.
"En el caso de otros tipos de pruebas, existe una idea de la separación de tareas:" aquí tenemos a los desarrolladores que escriben pruebas unitarias para el código, pero los probadores manuales lo harán ". Y pruebas de UX: ¿de quién es el cuidado?- Creo que depende de la estructura de la empresa. Las empresas occidentales a menudo tienen un diseñador de experiencia de usuario o incluso un comprobador de usabilidad, está claro que lo hacen todo el día. Pero si la empresa es pequeña, la otra persona será responsable. Si hay un diseñador front-end (que está más cerca de UX, no de JavaScript), entonces tiene uno. Y cualquier persona que trabaje con prototipos tendrá la responsabilidad de realizar tales pruebas si no hay un probador de usabilidad separado.
- ¿Y cómo se realizan las pruebas de UX específicamente en el caso de Smashing Magazine?- Todo es muy simple con nosotros: tan pronto como aparecen nuevas ideas, reunimos de 5 a 7 personas a quienes personalmente les asigno tareas y realizo entrevistas.
La tarea es encontrar información o intentar realizar un pago. Miro cómo lo hacen, con su consentimiento grabo el comportamiento y la cara, y veo muy, muy lentamente cada video. Me toma una hora y media para que un video eche un vistazo detallado de cómo se mueven las personas, usan el mouse, dónde miran, qué notan y qué no.
También generamos automáticamente un mapa de calor: donde la gente hace clic, hay algo que no notan. Según estos datos, estamos mejorando la interfaz y haciendo lo mismo una semana después. Tenemos una pequeña empresa, menos de 20 personas. En compañías más grandes, se verá aproximadamente igual, solo que la diferencia será que varias pruebas irán en paralelo a la vez.
Y monitoreamos no solo lo que sucede si cambia el botón, su ubicación o texto en la página. Hay dos tipos de pruebas: por un lado, pruebas A / B: botones y otras cosas pequeñas. Por otro lado, puede intentar cambiar algo por completo, esto se llama prueba A / Z. Por ejemplo, cuando reemplazamos completamente el diseño y lo probamos.
Puede tener colores similares, tipografía, pero será completamente diferente en términos de organización de información, diseño, con una disposición completamente diferente de todos los componentes. Si simplemente cambia la posición del botón, lo más probable es que alcancemos un máximo local, una conversión local, sin importar cuál sea el KPI. Un diseño completamente diferente puede permitirle romper y lograr un nivel de conversión completamente diferente, lo cual es difícil de hacer con pequeñas mediciones locales.
- ¿Puedes dar un ejemplo específico cuando hiciste algo por primera vez en Smashing Magazine y luego cambiaste significativamente después de las pruebas?- Por ejemplo, cuando introdujeron una suscripción paga con diferentes capacidades. Teníamos tres planes de tarifas, pensamos durante mucho tiempo cuánto podrían pagar las personas por cada uno de ellos.
Y luego probamos y descubrimos que para muchos de nuestros lectores estos planes son completamente inadecuados. Ellos, especialmente las personas en grandes corporaciones, necesitaban un plan anual: para no informar cada mes, a donde se destinaron $ 7– $ 9. La gente no pudo encontrar el plan anual, aunque fue a pedido, pero simplemente no pudieron encontrarlo. Como resultado, agregamos el botón correspondiente, cambiamos un poco la interfaz y la gente comenzó a notarlo.
- Pasemos al destino de las interfaces móviles. Anteriormente, a menudo se podía escuchar cómo crece la participación de Internet móvil, y ¿qué pasa con esto en 2018, cuando las ventas de teléfonos inteligentes dejaron de crecer?- En 2018, esto continúa. Además, diría que este es un año muy importante, porque este año vimos muchos puntos de inflexión.
No importa lo que tomemos (venta minorista, consumo de música y contenido de video, incluso radio) en casi todas partes vemos que el tráfico móvil ha cruzado el tráfico de escritorio. No diría que el tráfico de escritorio está cayendo dramáticamente, simplemente no crece, y el tráfico móvil está creciendo mucho.
El tráfico móvil llega a India, Asia, África y América del Sur solo ahora: hay un crecimiento tremendo, mucho más alto que el que tenemos ahora en Europa o América.
Y al final, el tráfico móvil es muy importante, porque por primera vez en todo este año, la conversión móvil ha excedido la computadora de escritorio. Durante muchos años, los especialistas en marketing han dicho que especialmente no vale la pena invertir en el mercado móvil, porque la conversión allí es pequeña. Este año todo ha cambiado: ahora no hay nada más importante que el tráfico móvil.
No se trata solo de cosas como teléfonos, sino también del Apple Watch, cualquier otro dispositivo, IoT. Los refrigeradores conectados a Internet también pueden mostrar cierta información. Por supuesto, también estamos hablando de cosas como la interfaz de conversación y los bots de chat, que están optimizados principalmente para uso móvil.
- Incluso hace años, el móvil primero (la creación de interfaces principalmente para dispositivos móviles) se convirtió en la palabra de moda en la interfaz de usuario, ¿y el "punto de inflexión" actual significa que para muchas empresas esto se está convirtiendo en la práctica principal de la palabra de moda?"Lo es". Actualmente estoy trabajando con una empresa que ha pensado seriamente en cómo organizar a toda la corporación. Inicialmente, ignoraron el mercado móvil, y el escritorio ha existido durante 15 años, es un gran minorista de comercio electrónico. Y de repente apareció un mercado móvil.
Por supuesto, hicieron optimización, diseño receptivo. Esto ya es bueno, pero todavía hay aplicaciones de Android e iOS. Como resultado, resultó que la gran mayoría de los desarrolladores y diseñadores trabajaron en el sitio de escritorio, y un pequeño grupo trabajó en el sitio móvil. Ahora están pensando mucho en lo que necesitan cambiar, porque notan esta tendencia.
El escritorio es estable, en su caso no crece, pero el mercado móvil y el tráfico están creciendo mucho. Por lo tanto, planean cambiar toda su arquitectura para que tengan todo para comenzar primero desde dispositivos móviles, algunas características primero solo llegarán a dispositivos móviles y luego al escritorio.
Tenían que pensar mucho sobre lo que esto significa para organizar un equipo, ya que un equipo pequeño ahora tiene una gran responsabilidad. Y también pensaron en cómo pasar al móvil primero, no solo en términos de interfaces, sino también cómo hacer una "transformación digital" de toda la organización.
Para ellos, como para muchos, es más probable que ni siquiera sea móvil, sino contenido primero. Se trata de cómo es posible organizar la información en cualquier factor de forma: relojes, teléfonos, tabletas, etc. Se presta más atención a la organización, a los filtros, a la visualización de la información de manera accesible, para que no sea demasiado, para que sea conveniente que una persona la use. Nuevamente, este es el momento en que las pruebas apropiadas se vuelven muy, muy importantes.
- ¿Vale la pena hacer interfaces significativamente diferentes para la versión móvil del sitio y el escritorio, o más bien algo adaptable con cambios mínimos?- Creo que hay situaciones en las que debes ser muy diferente. Por ejemplo, hubo un proyecto de IKEA que le permite diseñar la "cocina de sus sueños". Dicho proyecto no puede simplemente "transferirse" entre el escritorio y los dispositivos móviles, sino que tienen capacidades diferentes. En el escritorio, se ve como una aplicación de escritorio normal, y en el móvil como una aplicación AR / VR, donde puede ver el objeto directamente frente a usted en 3D. Este es un escenario completamente diferente, aprovechando el dispositivo.
Y para los sitios clásicos, diría que lo más simple es crear un sitio con cambios mínimos. Esto, por supuesto, no excluye la existencia de aplicaciones. Además, ahora con la ayuda de PWA (Progressive Web Apps) es posible hacer que el sitio también sea una aplicación que se pueda instalar a nivel del sistema. Pero, en general, para la mayoría, sería más razonable tener un sitio y una base de código, y usarlo tanto como sea posible en diferentes dispositivos.
- Smashing Magazine también es una aplicación web progresiva, ¿verdad?- Sí, puede usar el sitio sin conexión, agregarlo como una aplicación, hay almacenamiento en caché. Pero esto no es nada especial. Y hay compañías que están tratando de crear algo como "comercio electrónico fuera de línea", cuando una persona puede hacer una compra fuera de línea. No es tan fácil de hacer, pero la idea es buena, porque si usa PWA, tendrá un muy buen rendimiento. Esto significa que puede realizar rápidamente (o al menos preparar) un pedido, sin errores y acceso constante al servidor.
¿Cómo hacemos esto, por ejemplo, en el caso de git, cuando escribí algún tipo de confirmación, y luego hay un empuje al servidor, pero todos los cambios ocurren primero localmente? La idea es similar, y creo que podría funcionar bastante bien. Esta es una gran ventaja de PWA.
- Smashing Magazine tiene estadísticas de usuarios atípicas (por ejemplo, los recursos compartidos del navegador no se distribuyen en absoluto como en Internet en su conjunto), por lo que me gustaría aclarar: ¿cuál es su proporción de visitantes móviles y de escritorio?- Hace tres años teníamos el 11% del tráfico móvil, ahora alrededor del 22%. Honestamente, esto es muy pequeño. El hecho es que tenemos artículos muy largos. Leerlos lleva 40-50 minutos. Leer tanto desde el teléfono es bastante difícil. En promedio, los sitios ahora tienen mucho más tráfico móvil, pero debido a nuestras características, todavía no hemos llegado a este punto.
- Artemy Lebedev criticó las interfaces móviles, diciendo "cuanto más grande sea la pantalla, mejor será la interfaz". ¿Tiene la sensación de que con la transición a pantallas pequeñas se ha vuelto más difícil hacer un buen diseño?- Creo que hacer un diseño hermoso, por el contrario, se ha vuelto más conveniente. Soy un gran admirador de cualquier tipo de restricciones. Cada proyecto necesita algún tipo de restricción. Al desarrollar un concepto, a menudo tratamos de obligarnos a pensar fuera de las formas habituales. Comenzamos a diseñar y crear un diseño, estableciendo límites para nosotros mismos.
Por ejemplo, "en este proyecto no podemos usar más de dos colores". Esto no significa que usaremos solo dos colores, pero nos llevará a una solución inusual. O decimos que no usaremos triángulos, círculos y cuadrados. ¿Y qué podemos usar además de esto? El tamaño de los dispositivos móviles es una gran limitación en sí mismo. Y nos hace llegar a soluciones interesantes.
Creo que puedes dibujar una interfaz hermosa en cualquier lugar. Por supuesto, surgen dificultades en algún momento. Por ejemplo, los bots de chat no tienen componentes visuales en términos de colores o tipografía, solo envía el texto. Pero también puede haber belleza en ello.
Cuanto más avanzamos en la dirección del reloj o dispositivos pequeños o interfaz de conversación, más se pierde visibilidad, solo queda la esencia. , , , , , . , , , . .
— ? , , , . - ?— , , . , , . , . , — , , . , . , , , .
, . , . , , .
— , , , ?— , . IKEA. , WebVR, , - , . , , . , , .
, , , mobile first content first. , desktop last. . , Smashing Magazine . mobile first, 1800 , .
. , . . , mobile first, , . , , mobile , . . mobile first and desktop first.
— «» . «» , . , , UX?— . , . 2% , «» . 98% , .
, . , , . , «» . .
: Heisenbug ( 6-7 ) Mobius (8-9 ). , , , — .
