Una diatriba contra los diseños de aplicaciones bonitos

“Guardaos de esa vanidad que corteja un cumplido, o se alimenta de él.” –Chalmers

Navegando por algunos sitios de inspiración de diseño con mis ojos críticos de rayos UX :) A menudo salgo con humo saliendo de mis oídos. Como dice el título, esto es una diatriba, pero no lo tomes demasiado en serio. Estoy tratando de hacer un punto.

Sí, sé que algunos de estos sitios de exhibición de diseño no están destinados necesariamente a productos del mundo real, pero aún así digo que deben reflejar un enfoque reflexivo del diseño, principalmente al hacer la pregunta principal "¿Para quién es esto? ”, “¿Cómo usarán las personas mi producto?” y “¿Es realmente utilizable?”.

¡Los diseños de aplicaciones superficiales que siguen las últimas modas e ignoran descaradamente las convenciones básicas de usabilidad, las mejores prácticas de UX y los principios fundamentales del diseño de interacción probablemente fallarían en el mundo real! Afortunadamente, por lo general no van más allá de la tierra de fantasía generalmente ridícula y engreída en Dribbble y Behance.

Desafortunadamente, estos "diseños conceptuales", una sola pantalla en una aplicación imaginaria, solo sirven para perpetuar que los diseñadores sean etiquetados como artistas, como pretendientes que solo se preocupan por la apariencia, los colores bonitos y las tipografías. Hoy en día, cualquier diseño de aplicación tiene que ir mucho más allá.

Estoy hablando de UX.

Si las personas en el mundo real intentaran usar estas aplicaciones, les garantizo que más del 50 % tendría dificultades para hacerlo y, posteriormente, se daría por vencido por la confusión.

Los diseñadores de productos digitales que se precien y deseen mejorar su juego saben que es esencial dejar su ego en la puerta y mantenerse alejado de florituras innecesarias, exhibiciones públicas egoístas y seducción de audiencia sin sentido. #UXFail!

Abandonar la usabilidad por la adulación

Las excelentes experiencias de usuario son imprescindibles para que el diseño de productos digitales tenga éxito en el mercado. Sin duda, la estética: los diseños de excelente apariencia y sensación son importantes, pero son solo el toque final que complementa un producto utilizable que también es un placer de usar. Esforzarse solo por la perfección estética y abandonar la usabilidad es, en última instancia, un juego de perdedores.

Como dijo Don Norman, el a menudo apodado "gurú de la tecnología funcional", "los grandes diseñadores producen experiencias placenteras".

Las experiencias placenteras son aquellas que crean la menor cantidad de fricción mientras brindan una interacción fluida y fluida y experiencias anticipatorias (es decir, hacer que las cosas aparezcan como por arte de magia. Las cosas correctas, en el momento correcto, de la manera correcta).

La forma de llegar definitivamente no es ignorar las mejores prácticas establecidas y las convenciones de diseño y simplemente centrarse en la fachada. Es evidente, Dribbble se pavonea: 1) No entiendes a tu usuario, y 2) Estás copiando modas.

Ignore las convenciones bajo su propio riesgo

Las convenciones de diseño, ya sea en el diseño de productos digitales o en el diseño industrial (por ejemplo, un automóvil o una bicicleta), tienen sus raíces en el comportamiento humano, la mecánica, la física, las ciencias y una extensa investigación. Siguen las mejores prácticas y la expectativa humana de cómo funcionan las cosas porque estamos acostumbrados a ellas, habiendo seguido esas convenciones durante eones. Estas son convenciones que han sido elaboradas por prueba y error, y han demostrado ser muy efectivas con el tiempo; un poco como la evolución.

Es temerario y algo arrogante ignorar o violar las convenciones de diseño. Son fundamentales y sirven como base a partir de la cual podemos luego innovar. Se trata de lo que se espera. Sin ellos, corre el riesgo de molestar a la gente. Imagínese si cada bicicleta, cada manija de la puerta, o los pedales y el volante de cada automóvil, funcionaran de manera diferente, todo puramente en nombre de la "innovación".

Dos palabras: caos total.

Una interfaz de usuario es como una broma. Si hay que explicarlo, no funciona.

Cuidado con la heurística

Las aplicaciones bien diseñadas que se esfuerzan por ser productos utilizables siguen convenciones de diseño bien establecidas, pautas básicas de uso y principios de diseño de interacción (entre otras cosas) y pasan la evaluación heurística con gran éxito. ("Heurísticas" porque son reglas generales generales, no pautas específicas de usabilidad).

Para que los diseños de aplicaciones funcionen bien en el mundo real, deben observar las 10 heurísticas de usabilidad para el diseño de interfaz de usuario definidas por Nielsen Norman Group, una voz líder en el campo de la experiencia del usuario durante 20 años. Estos son:

1. Visibilidad del estado del sistema
2. Coincidencia entre el sistema y el mundo real
3. Control y libertad del usuario
4. Coherencia y estándares
5. Prevención de errores
6. Reconocimiento en lugar de recuerdo
7. Flexibilidad y eficiencia de uso
8. Diseño estético y minimalista.
9. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores
10. Disponibilidad de ayuda (esto puede ser "recorridos rápidos" o tutoriales)

Lea acerca de estos 10 principios generales para el diseño de interacción con más detalle aquí.

Enamoramiento en nombre de la innovación

A menudo, las pantallas de conceptos de aplicaciones están diseñadas por diseñadores que buscan muchos Me gusta en los sitios de exhibición de carteras con el objetivo de abrirse camino hasta la sección de tiros calientes diarios en Dribbble. Un par de diseños de interfaz de usuario elegantes y minimalistas no son el producto. Es similar a diseñar la puerta de un automóvil sin ofrecer ninguna idea de cómo se ve el resto del automóvil o cómo funciona en un escenario del mundo real.

¡No me malinterpreten! La innovación en el diseño es necesaria. Es saludable y crítico para que florezca cualquier disciplina o dominio creativo. Pero no debería suceder a expensas de una buena UX. Hagamos una distinción aquí y llamémoslo experimentación de diseño. Bajo la presunción de un diseño limpio y minimalista, que simplemente quiere ser diferente y genial, muchos de los llamados diseños innovadores que desfilan en estos sitios sacrifican la usabilidad básica.

Usabilidad 101

La usabilidad, la base de las excelentes experiencias de usuario, es un atributo de calidad que evalúa qué tan fáciles son de usar las interfaces de usuario. La palabra usabilidad también se refiere a las prácticas para mejorar la facilidad de uso durante el proceso de diseño.

La utilidad de una aplicación se define en términos de utilidad y facilidad de uso. La utilidad proporciona a los usuarios las funciones que necesitan; la facilidad de uso es lo fácil y agradable que son usar esas funciones. Por lo tanto, los diseños de aplicaciones sofisticados que ignoran estos principios básicos de usabilidad terminan siendo inútiles por definición.

Es comprensible que los diseñadores busquen formas innovadoras e interesantes de diseñar la navegación de su aplicación. Pero hay una delgada línea entre lo inesperado y lo inutilizable. Tres cosas a considerar en el diseño de navegación son la consistencia, las expectativas del usuario y las pistas contextuales. No importa cuán elegante sea su comercio electrónico, por ejemplo, el diseño del concepto de la aplicación. Si los usuarios no pueden encontrar el producto, no pueden comprarlo.

Diseño útil

Como dijo Steve Jobs: “No se trata solo de cómo se ve y se siente. El diseño es cómo funciona”.

Hablaba de diseño útil .

Si un diseñador se mete demasiado con el modelo mental de una persona sobre cómo deberían funcionar las cosas, la aplicación fallará. Si hay una gran discrepancia entre el modelo mental de los usuarios y el modelo conceptual, la aplicación es un brindis. Los modelos mentales, como su nombre lo indica, son modelos conceptuales en la mente de las personas que representan su comprensión de cómo funcionan las cosas.

Uno de los principios más básicos del diseño de interacción es que una interfaz de usuario debe tener significantes para que sea útil. Si los usuarios no tienen señales visuales en la interfaz de usuario que señalen las acciones disponibles o las interacciones de gestos disponibles para ellos (llamados significantes ), el diseño de su producto es DOA.

Por mucho que usted, como diseñador, esté enamorado de su producto, los usuarios se preocupan mucho más por la utilidad. No quieren aprender su aplicación, y no quieren emprender un viaje de descubrimiento o experimentación para ver qué funciona al intentar deslizar cosas en la interfaz de usuario. Como dijo Steve Krug, consultor de usabilidad durante más de 20 años, en su libro Don't Make Me Think , "[La usabilidad] es el principio primordial, el desempate definitivo al decidir si un diseño funciona o no".

Sin duda, como dijo Dieter Rams, un legendario diseñador alemán de Braun en los años 70 y una inspiración para todo lo relacionado con Apple:

La calidad estética de un producto es parte integral de su utilidad porque los productos que usamos todos los días afectan nuestra persona y nuestro bienestar. Pero sólo los objetos bien ejecutados pueden ser bellos.

En otras palabras, el diseño tiene que funcionar en todos los niveles.

Estos son los 10 mandamientos del buen diseño según Dieter Rams:

Recordemos que el diseño visual, la estética, es solo un aspecto del diseño de UX. Es la capa final que debe elevar todo lo que tuvo lugar antes en el proceso de diseño de UX, es decir, definir los objetivos comerciales, identificar al usuario principal (personajes), investigación del usuario, bocetos, ideación, estructura de alambre, maquetas, prototipos y pruebas de usabilidad. . Es el barniz final que eleva la experiencia general del usuario en alineación con el diseño para las emociones.

Reducir el esfuerzo mental

Con un mal diseño en acción, lo que el Sr. y la Sra. Diseñador están haciendo es pedirle a la gente que descifre e interprete íconos y simbolismos vagos, aumentando así su carga cognitiva (la cantidad total de esfuerzo mental que se usa en la memoria de trabajo). Por otro lado, un buen diseño de experiencia de usuario reducirá la carga cognitiva. Este tipo de diseño egoísta (sí, fui allí) arroja obstáculos en el camino de las personas, lo que aumenta la fricción y la frustración. ¿Es ese realmente el objetivo?

Los diseñadores deben proporcionar etiquetas claras (enlaces y botones) y señales obvias (navegación clara) para ayudar a los usuarios a formar un mapa mental de la aplicación e intuir dónde están las cosas y cómo usarlas. La navegación debe ser clara, orientada a tareas y lógica (p. ej., los controles de pantalla sugieren cómo usarla), y su ubicación debe ser coherente (p. ej., en una barra de menú) en todo momento.

Haga que sea obvio dónde deben tocar los usuarios, si pueden deslizar y hacer que los objetivos sean lo suficientemente grandes como para tocarlos fácilmente. Prevenir errores. No hagas que la gente adivine lo que significa algo. No seas perezoso. Evite los menús de hamburguesas y kebab (los tres puntos) ya que ocultan la navegación y hacen que el contenido sea menos reconocible. En particular, ¡evita las hamburguesas que ni siquiera parecen menús de hamburguesas! Sí, el espacio es limitado, pero se ha comprobado que la combinación de pestañas (superior inferior) y menús de hamburguesas funcionan mucho mejor que una sola hamburguesa.

No es un mundo perfecto

Si su producto llegara a las manos de los usuarios, ¿podrían encontrar cosas y realmente usarlas? Es posible que no tengan acceso a una configuración super-duper como la que usó para diseñar estas pantallas. Piense nuevamente en la usabilidad y la accesibilidad (discapacidad visual, discapacidad física, discapacidad cognitiva). Según los datos del censo, en los Estados Unidos al menos el 19 % de las personas tienen una discapacidad y es probable que el porcentaje sea mayor en los países menos desarrollados. Si alguien con una visión menos que perfecta recogiera su aplicación, ¿podría usarla?

¿Es su diseño "amigable con los dedos" o literalmente un dolor de usar? ¿Cuánto tienen que esforzarse las personas para llegar a diferentes partes de la pantalla de la aplicación? ¿Está considerando los flujos de tareas de los usuarios, poniendo elementos prácticos al alcance de la mano de las personas en lugar de hacerlos saltar alrededor de las cuatro esquinas de la pantalla? ¿El diseño es realmente táctil? ¿Ha tenido en cuenta el área oscurecida debajo de la mano que sostiene el móvil?

Como señala Luke Wroblewski en Designing for Large Screen Smartphones, ¿ha considerado cómo se comportarían sus diseños en pantallas más grandes?

¿Su diseño realmente sigue la recomendación de las Pautas de interfaz humana de iPhone de Apple de un tamaño objetivo mínimo de 44 píxeles de ancho por 44 píxeles de alto? La Guía de diseño e interacción de la interfaz de usuario de Windows Phone de Microsoft sugiere un tamaño de destino táctil de 34 px con un tamaño mínimo de destino táctil de 26 px.

No se enamore del contraste súper mínimo entre el texto y el fondo o el texto diminuto e ilegible porque hace que sus diseños sean "modernos, limpios y minimalistas".

Mejor experiencia de usuario

Necesitamos más diseño mejor

Entonces, ¿qué es un buen diseño? Esa discusión podría llenar un libro pero, en términos generales, "buen diseño" es cuando todo se une para el usuario de ese diseño.

Eso significa que para que un diseño sea "bueno" y útil para los usuarios, debe tener en cuenta múltiples niveles y factores en los que debe cumplir para tener éxito.

Las tendencias de diseño van y vienen. La tendencia de diseño promedio solo se mantiene durante uno o dos años; la buena usabilidad, la base del diseño UX, llegó para quedarse.

Los productos que han sido diseñados de acuerdo con los siete factores de gran UX durarán más que cualquier tendencia de diseño, garantizado. Los diseñadores que prestan atención a la gran facilidad de uso, las mejores prácticas de UX, las convenciones de diseño de interacción y los factores que influyen en la experiencia del usuario tendrán un mayor impacto que aquellos que no lo hacen. Al final del día, serán recompensados ​​y sus productos digitales tendrán una mayor aceptación y éxito en el mercado.

Si, como diseñador, desea mejorar en UX, para crear aplicaciones móviles y de escritorio útiles, no solo bonitas, invierta algo de tiempo en aprender al menos los conceptos básicos de UX. Comience siguiendo los blogs de UX y suscríbase a boletines y publicaciones en línea como Toptal Design Blog, UX Magazine, UX Matters, UserTesting, uxdesign.cc, UX Design Weekly o Interaction Design Foundation.

Lea los estudios de usuarios realizados con participantes que viven y respiran: personas reales. Como dicen, los números no mienten; todo lo demás es hipótesis y suposición.

Siga a los líderes de opinión de UX en Twitter. Lea los artículos y documentos técnicos de UX, siendo la crema de la crema The Nielsen Norman Group y Adaptive Path.

Medium es uno de mis destinos favoritos para leer artículos de diseño de UX/UI en línea. Diseñadores de todo el mundo lo utilizan para leer sobre diseño, experiencia de usuario, facilidad de uso y otros temas relacionados con la creación y construcción de excelentes productos digitales. Aquí hay diseñadores para seguir en Medium.

Lea algunos de los libros clásicos fundamentales que todos los UXer que conozco tienen en su estantería y trátelos como si fueran escrituras.

1. El libro seminal de Don Norman sobre diseño The Design of Everyday Things
2. El diseño emocional de Don Norman: por qué amamos (u odiamos) las cosas cotidianas
3. No me hagas pensar de Steve Krug
4. Lean UX de Jeff Gothelf: aplicación de principios Lean para mejorar la experiencia del usuario
5. Ingeniería de usabilidad de Jakob Nielsen
6. Las 100 cosas que todo diseñador debe saber sobre las personas de Susan Weinschenk

Lea recursos informativos en línea sobre pautas de usabilidad, principios de diseño de interacción y mejores prácticas de UX: estudios, informes, artículos, etc.

1. Primeros principios del diseño de interacción
2. Conjunto completo de 2397 pautas de usabilidad (en varios informes) de NNGroup
3. 10 heurísticas de usabilidad para el diseño de interfaz de usuario de NNGroup
4. Artículos del Instituto Baymard: Baymard estudia el comportamiento en los sitios web de comercio electrónico
5. Artículos de UX Mastery: todo lo relacionado con UX

Y finalmente, agrega estos cinco podcasts de UX a tu biblioteca de iTunes:

1. UX Pod: Discusiones con diseñadores de UX y sobre usabilidad en general
2. Inside Intercom: entrevistas con los mejores diseñadores en empresas líderes
3. Podcast de UX para personas apasionadas por equilibrar el negocio, la tecnología y los usuarios
4. UIE Podcast: Perspectivas de User Interface Engineering sobre el mundo del diseño
5. True North: descubrir historias de diseño que destacan las pruebas de diseño y la investigación

• • •

Lectura adicional en el blog de diseño de Toptal:

• Mejores prácticas de diseño de interfaz de usuario y errores comunes
• Estados vacíos: el aspecto más pasado por alto de UX
• La simplicidad es clave: exploración del diseño web mínimo
• Principios heurísticos para interfaces móviles
• Diseño para la legibilidad: una guía para la tipografía web