He consultado más de 150 sitios móviles: esto es lo que sé sobre UX eficaz

Como líder de Mobile UX en Google que trabaja con equipos de desarrollo web de pequeñas empresas, hice muchas observaciones y aprendí a evitar las trampas

Esta es una lista actualizada de las ideas de asociarse con más de 150 equipos de desarrollo web en los últimos 2 años.

Me uní a un equipo en Google en 2016 llamado Equipo de transformación móvil. Nuestro equipo tenía un objetivo simple pero muy ambicioso: mejorar la web móvil para todos. Nos centramos en ayudar a las pequeñas y medianas empresas a mejorar sus experiencias web móviles. Más específicamente, éramos consultores de UX que trabajarían con equipos de desarrollo web y proporcionarían recomendaciones sobre cómo pueden optimizar mejor el rendimiento, la usabilidad y la accesibilidad.

Defendemos a los usuarios finales.

Estos son los aprendizajes, observaciones y dificultades que reunimos después de ver literalmente cientos de sitios web:

Las primeras impresiones importan. Los usuarios móviles están muy orientados a objetivos y son muy impacientes. Evite distraer a un usuario de sus objetivos. Mantenga su página de inicio y las principales páginas de destino simples. Asegúrese de tener una llamada a la acción clara y una propuesta de valor en la mitad superior de la página. Un usuario debe saber qué hacer y por qué debe permanecer en su sitio móvil en un momento.

De izquierda a derecha: Warby Parker, Stash Invest, Drizly

Haz menos. La recomendación número uno que hice consistentemente fue: "Hacer menos". Eso significa menos imágenes, menos campos de formulario, menos patrones de navegación complicados, menos complementos, menos píxeles de terceros, menos paredes de texto, menos superposiciones de pantalla completa, menos js de bloqueo de renderizado , menos clics ... menos formas de distraer al usuario de sus objetivos.

La velocidad acentúa el buen diseño. No sorprende que los sitios móviles más rápidos tengan una mejor participación del usuario. Incontables estudios de caso, pruebas de usabilidad y estoy seguro de que sus propias anécdotas personales dejan en claro que la velocidad impulsa las conversiones. Las tres métricas de rendimiento que realmente reflejan la experiencia del usuario son First Contentful Paint (FCP), Speed ​​Index y Time to Interactive (TTI). Es fundamental establecer un presupuesto de rendimiento y responsabilizar a su equipo. Es una pena, cuando su sitio bellamente diseñado resulta en un usuario rechazado porque olvidó comprimir su imagen de héroe de 2MB. Use herramientas como Lighthouse (que se muestra a continuación) para controlar estas métricas.

Puntos de referencia recomendados:
 <2s Primera pintura de contenido (FCP)
Índice de velocidad <3s (SI)
<5s Tiempo de interactividad (TTI)

Captura de pantalla del faro

Habla con tus clientes. Esto puede parecer increíblemente obvio, pero no puedo decir cuántas miradas en blanco he instigado preguntando: "¿Cuándo fue la última vez que habló con sus usuarios?" Nuestro objetivo como clientes potenciales de UX móvil no era solo hacer recomendaciones, sino ser la voz del usuario Ponte en el lugar de tus usuarios e intenta completar las tareas más comunes (realiza un seguimiento del número de clics y el tiempo total para completar).

Usa datos para justificar el diseño. La tendencia del "diseño respaldado por datos" no es nada nuevo. Después de priorizar un proyecto móvil, es importante realizar un seguimiento de los KPI móviles. Para los minoristas, controle el Valor promedio de pedido (AOV) y la tasa de salida en la página donde comienza el embudo de pago. Para las empresas de generación de leads, enfóquese en el CTR del botón primario Call-to-Action y la relación de leads a cierre (ventas exitosas / número de leads * 100). Si tiene un sitio de viajes, concéntrese en las sesiones de retorno (retención de clientes) y el tráfico específico del canal (es decir, están aumentando las acciones sociales). Considere monitorear las microconversiones, así como suscripciones a boletines por correo electrónico, comentarios sobre un artículo, reseñas de usuarios, vistas de videos o acciones compartidas en las redes sociales. Consejo profesional: le recomiendo que aproveche este brillante panel de control de Datastudio que hizo una de mis colegas (Damla Cakirca) para monitorear la participación de los usuarios en su sitio.

La recaída es real. La mayoría de las compañías con las que trabajamos vieron mejoras significativas en la velocidad del sitio y / o el compromiso del usuario. Sin embargo, 30 a 60 días después de la consulta (cuando no deseábamos mirar por encima del hombro) veríamos resurgir los malos hábitos. Para evitar este escollo, use un presupuesto de rendimiento. También recomiendo usar la herramienta Chrome Dev para encontrar códigos CSS y JS no utilizados con la pestaña Cobertura. Cuando carga o ejecuta una página, la pestaña le indica cuánto código se usó y cuánto se cargó. Puede reducir el tamaño de sus páginas enviando solo el código que necesita. Es crítico monitorear y auditar su sitio móvil de manera continua.

Sé optimista con las nuevas tecnologías. Si está buscando una experiencia móvil moderna transformadora, busque construir una PWA. Si está buscando optimizar su tráfico pagado, considere usar AMP para sus principales páginas de destino. Si es un minorista, busque formas de acelerar el proceso de pago, como reducir los campos, habilitar el autocompletado o implementar Google Pay. La clave del éxito es agregar tecnologías de forma incremental con un enfoque en mejorar la experiencia del usuario. Si no agrega valor a sus usuarios, no invierta en él.

De izquierda a derecha: American Tin Ceilings, Rhone, SnapDeal

La compra funcional cruzada es clave. Obtener a todos los interesados ​​clave en la misma página es un recordatorio obvio, pero importante. Mejorar su experiencia web móvil es un esfuerzo de equipo. Todos los equipos deben asumir la responsabilidad de monitorear la experiencia móvil. Los equipos de marketing deben observar el uso de píxeles de seguimiento de terceros. Los equipos de ingeniería deben centrarse en optimizar la ruta crítica de representación (eliminar los activos de bloqueo de representación). Los equipos de UX deben asegurarse de que las imágenes estén optimizadas y centrarse en reducir los puntos débiles de usabilidad (es decir, controles deslizantes automáticos). Es fundamental establecer objetivos interfuncionales y responsabilizar a todos los equipos.

Observaciones de tendencias móviles. Esta última sección es una captura de todas las mejores tendencias de UX de las que he visto resultados positivos durante 2018.

  • Sé instantáneo usando AMP
  • Brinde una experiencia confiable al obtener independencia de la red
  • Sea confiable con un mejor almacenamiento en caché
  • Usar componentes web de diseño de materiales
  • Brinde la misma experiencia consistente a todos los usuarios sin importar la plataforma que elijan para interactuar con su marca
  • Sé agradable con una autenticación más fácil
  • Agilice la finalización de tareas optimizando formularios
  • Facilite el regreso al habilitar las notificaciones web
  • Sé digno de estar en la pantalla de inicio
  • Use Lighthouse para monitorear el rendimiento
  • Prueba las nuevas herramientas de desarrollo web

Recuerde que no hay una bala mágica para resolver todos sus problemas de UX. Mejorar su sitio móvil requiere paciencia, análisis y compromiso interfuncional. Inicie el proyecto web adecuado para sus usuarios y su negocio.

@RyanWarrender