UX / UI
análisis & cariño
Intuitivo
Hay un largo camino recorrido en relación al diseño de interfaces así como los comportamientos esperados en determinadas funcionabilidades.
Hacer buen uso de este camino permite que el usuario juege de memoria y eso se traduce en éxito.
hacer / saber / pensar
Complejidad
Demasiadas opciones
Ambigüedad
Hacer pensar, descifrar.
Estándares
Pocas opciones y claras
Jeraquización de la información
Agrupar contenido relacionado
Guiado
Ante de empezar a diseñar ya tenemos que tener claro que es lo que queremos que el usuario haga.
Guiar al usuario, recomendar, destacar genera conversiones altas. Cuanto más tenga que decidir / leer menos lo va a hacer.
Listar y solo listar
Pasear al usuario
Confiar en la interpretación
Contenido desconectado (no story)
Recorrido visual primero
Recomendar
Limitar los CTAs por página
Opciones por defecto ya selecionadas
Ayudar, explicar sin molestar
Jerarquizar, de nuevo
Fidelizar, enganchar de a poco
Performante
A nadie le gusta esperar y menos cuando hay un puñado significativo de opciones.
El tiempo de carga es un factor decisivo en el éxito de un sitio/app así como en su SEO.
La ansiedad de los usuarios solo crece, dale algo y dáselo ya.
Servir todo a todos
Multiples requests
Ignorar las mil técnicas que hay
Segmentar contenido/funciones
Analizar, paso a paso, decisión por decisión que afecta y cómo.
AC/DC
Analizar el contenido, diseñar el contenido.
Diseñar sin analizar el contenido y los objetivos de la pieza no es diseñar, es decorar.
Saber que estamos diseñando nos da herramientas para saber que hay que destacar y que espera el usuario.
Distraerse con colores y tendencias
Aburrir
Destacar contenido solo por balance visual
Diseño a medida bloque a bloque
Prototipar
Leer, analizar y entender lo que hay que jerarquizar
Entender el tono, el lenguaje
Mostrar lo relevante de una
Reglas rule
Grillas, biblioteca de elementos y recursos gráficos, el propio branding y en incluso la ley de gravitación universal.
Acostumbrar al usuario a patrones, reglas propias del diseño, aprovecharse de las leyes universales.
Un UI consistente, lógico, coherente lleva a una UX fluida.
No re-inventar la Rueda - Alguien 1578 A.C.
Innovar en convenciones
Una estructura/grilla por sección
No documentar decisiones claves
Planificar y utilizar bibliotecas
Definir patrones, paletas
Minimizar líneas de fuerza
Tener en cuenta las reglas que el usuario ya aprendió: la luz proyecta sombra, es es un menú y otros grandes éxitos de la vida misma.
Antropocentrismo
Todo está centrado en el usuario. Desde el primer análisis de requerimientos, el diseño, el desarrollo y el testing.
El usuario es experto
El usuario va a entender
El usuario no se equivoca
El usuario va a esperar
Cada click duele
Investigar quién es, qué, cuándo dónde y porqué usa nuestra UI
Hablarle, darle feedback
Siempre decirle dónde está, cómo llegó y cómo volver
Recompensar el esfuerzo
https://smartypins.withgoogle.com/
APA
Análisis, Pruebas, Análisis
No hay ninguna teoría ni reglas ni grillas que aseguren un buen diseño de interfaz y mucho menos una óptima experiencia de usuario.
La única forma de lograrlo es probando, analizando, preguntando, sistematizando.
Testear solo
Testear al final
No considerar el error
Todos los posibles caminos/resultados
Contenido cero
Errores humanos y lógicos
Mejor y Peor escenario
Preguntar, mostrar, interactuar
Documentar lo que se testea
Conclusiones
Si bien está todo muy mezclado podemos pensar en niveles de conclusiones
Generales
Si no es fácil nadie lo usa
Si no es rápido todos abandonan
Si no dice lo que hacer nadie hace nada
Si no es simple, no es fácil
Apoyarse en todo feedback
Re utilizar patrones familiares
Evitar complejidad innecesaria
Prototipado y testeo desde el inicio
Documentar
Cliente
Objetivos
Publico objetivo
Requerimientos funcionales
Requerimientos de negocio
Requerimientos técnicos
Establecer parámetros de éxito
Contenido
Mensajes claros, instrucciones claras, explicar
Objetivos simples
Narrar una historia y guiar
Pedir solo la información justa
Repetir y volver a repetir
Recomendar en vez de listar
Lenguaje común, no formularios robóticos.
El Humor paga, la curiosidad también
Manejar expectativas claras
Contemplar los mensajes de error, o contenido cero
Diseño
Análisis
- Objetivos
- Requerimientos
- Usuarios
Recorrido visual y jerarquía
Simpleza
CTAs claros
Errores y contenido cero
Centrado en el usuario
Guiar hacia los objetivos
Diseñar contenido
Desarrollo
Pedir requerimientos iniciales
Generar requerimientos técnicos
Monitorear desde 0
Performance es $
Minimizar esfuerzo de usuario
Participar/Ayudar en el diseño UI
Gracias
Nota: las imágenes fueron tomadas de google sin escrúpulos, mal yo.
Links y cosas
https://developer.apple.com/design/tips/
https://medium.com/@erikdkennedy/7-rules-for-creating-gorgeous-ui-part-1-559d4e805cda#.yvjhpq9py
http://www.ambysoft.com/essays/userInterfaceDesign.html
http://www.goodui.org/#31
http://www.designforfounders.com/web-app-ux/
https://www.google.com/about/company/philosophy/
http://conversionxl.com/intuitive-web-design-how-to-make-your-website-intuitive-to-use/
http://sitetuners.com/blog/6-common-user-experience-design-fails-that-make-ux-experts-cringe/
http://www.martinibuster.com/fundamentals/user-experience-marketing/
https://color.adobe.com/es/
https://dribbble.com/colors/BADA55
https://balsamiq.com/
Tutsplus
http://webdesign.tutsplus.com/articles/the-basics-of-great-ux--webdesign-8823
http://webdesign.tutsplus.com/articles/a-beginners-guide-to-wireframing--webdesign-7399
http://webdesign.tutsplus.com/articles/designing-for-user-habits-and-routines--cms-24337
http://webdesign.tutsplus.com/articles/how-to-become-a-conversion-centered-designer--cms-19664
https://webdesign.tutsplus.com/courses/web-design-basics-rules-of-great-form-design/lessons/organize-the-form-properly
http://webdesign.tutsplus.com/articles/ux-tip-consider-the-empty-states--cms-23692
UI/UX - 2015
By Miguel Vallvé
UI/UX - 2015
Short about UX
- 720