Guía de diseño UI / UX para entender su esencia y tendencia

usted sabe que el diseño define el éxito de la mayoría de los productos de software. Y el desarrollo de software descubre nuevas formas de usar el diseño para varios productos. Hablo de diseño para sitios web y aplicaciones. No hay una gran aplicación sin elementos de estilo y facilidad de uso. La efectividad de la aplicación se mide por la combinación óptima de funcionalidad y atractivo. La comunicación visual debe ser simple, intuitiva y atractiva.

El papel del diseño UI / UX

El diseño de aplicaciones y sitios web plantean desafíos especiales:

  1. Facilitar tareas complejas y flujos de trabajo,
  2. permitiendo a los usuarios comprender y gestionar datos complejos,
  3. teniendo en cuenta una amplia variedad de roles, necesidades y procesos de usuario.

Pero eso vale la pena! Debido a que un diseño e implementación de aplicaciones efectivas puede tener implicaciones profundas y positivas para la productividad, la eficiencia, la precisión y la satisfacción en una amplia gama de entornos, desde el entretenimiento hasta la atención médica.

Podría haber escuchado sobre el diseño de UI o UX antes, pero en realidad nunca tuvo la oportunidad de obtener qué, dónde y por qué se utiliza. Y no, UI y UX no son las mismas cosas. Si quiere saber más sobre el tema puede leer, principales diferencias entre UI y UX antes de continuar. UX es la experiencia general que un usuario tiene con el producto, y la UI es lo que realmente interactuará y verá.

Un valor de un gran diseño.

La clave para el diseño exitoso de una aplicación no es una buena idea o una buena característica: todo se reduce a la experiencia del usuario (UX) y la interfaz del usuario (UI). No importa cuán buena sea tu idea si la aplicación se ve horrible e imposible de usar fácilmente.

Si está desarrollando una aplicación web o móvil, una de las principales cosas que necesita para hacer las cosas bien es cómo se ve y se siente su aplicación. Por ejemplo, si su campo es el comercio electrónico, una aplicación mal diseñada perderá muchos clientes potenciales.

Por ejemplo, ¿qué ve primero el usuario de la aplicación cuando abre la aplicación? Lo primero que ve el usuario es la página de destino . ¿Qué es una página de destino? Este es un punto de inicio desde el cual el usuario entiende si la aplicación o un sitio cumplirán sus requisitos y cumplirán sus necesidades. Debe ser atractivo y contener algunos botones de llamada a la acción para que el usuario sepa qué hacer a continuación.

Para agregar el valor al trabajo de los diseñadores de UI y UX, aquí puede encontrar algunas comparaciones interesantes de UI vs UX :

  • El diseñador de UX es como un arquitecto. Esta persona cuida de los usuarios y ayuda a su empresa a mejorar los parámetros medibles (reducir la tasa de rebote, mejorar el CTR, etc.). El diseñador de UX entiende el comportamiento y la psicología del usuario, sabe mucho acerca de la ergonomía de la interfaz y es capaz de analizar las necesidades empresariales para convertirlo en los flujos de usuarios.
  • El diseñador de IU al mismo tiempo es como un decorador. Esta persona cuida cómo la interfaz refleja la marca. Se trata más de cosas que no se pueden medir (por ejemplo, cuán acogedora es una interfaz, si tiene el estilo suficiente, etc.). El diseñador de IU sabe mucho sobre colores y combinaciones de colores, sabe leer libros de marcas y convertirlos en elementos de UI.

A veces, el diseñador de UI y UX es la misma persona que está a cargo de todo el proceso de diseño. Pero vamos a discutir cada tipo de diseño por separado.

¿Qué es el diseño UX?

El diseño UX (Experiencia de usuario) es el proceso de creación de productos, sistemas o servicios que proporcionan experiencias significativas y relevantes para los usuarios. Esto implica el diseño de todo el proceso de adquisición e integración del producto, incluidos los aspectos de la marca, el diseño, la usabilidad y la función. También incluye los aspectos significativos y valiosos de la interacción persona-computadora y la propiedad del producto. UX maneja la arquitectura del contenido y el mapa del sitio.

Como spoiler, me gustaría decir que el diseño de UI (Interfaz de usuario) del que hablaremos en la próxima parte, es un aspecto importante del diseño de UX, es un subconjunto de él. Porque el diseño de UX cubre una amplia gama de otras áreas. La Arquitectura de la Información (IA) es el segundo aspecto más viable del diseño de UX.

El diseño de UX ayuda a los usuarios a lograr objetivos. No se enfoca solo en la creación de productos que son utilizables, sino que también cubre los otros aspectos de la experiencia del usuario, tales como:

  • Placer,
  • eficiencia,
  • estado anímico,
  • divertido.

Hasta ahora, la buena experiencia del usuario es aquella que satisface las necesidades de un usuario particular en el contexto específico donde el público objetivo utiliza el producto. El diseño de UX está centrado en el usuario  : el tipo de usuario define el tipo de diseño.

Es por eso que el diseño de UX es dinámico y se modifica constantemente con el tiempo debido a las cambiantes circunstancias de uso y los cambios en los sistemas individuales, el contexto de uso en el que se pueden encontrar, etc. Aquí puede encontrar algunas tendencias de diseño de UX que se esperan en 2019 . También, podemos decir que la experiencia del usuario se trata de la interacción y experiencias del usuario-producto.

La tarea principal del diseño de UX es crear productos que puedan adaptarse para satisfacer las necesidades específicas de un usuario, pero que proporcionen una funcionalidad predecible. En otras palabras, UX Design es estudiar el comportamiento del usuario y comprender las motivaciones del usuario con el objetivo de diseñar mejores experiencias digitales.

Vamos a hablar de los principales requisitos para el diseño de UX. ¿Cuál debería ser el diseño perfecto de la experiencia del usuario? La respuesta a esta pregunta puede presentarse como la lista de requisitos de diseño de UX que deben cumplirse en diferentes niveles. Estos niveles forman la pirámide de diseño UX .

Principios de UX y de full UX stack

Los objetivos en cada nivel de la pirámide de diseño de UX podrían alcanzarse siguiendo los principios de diseño de UX principales :

  1. Jerarquía 
    jerarquía es una de las mejores herramientas de los diseñadores para ayudar a los usuarios a moverse a través de un producto fácilmente. Incluye: 
    a). Arquitectura de la información (la forma en que se organiza el contenido en la aplicación o el sitio).
    b). Jerarquía visual (que ayuda a los usuarios a navegar más fácilmente dentro de una sección o una página).
  2. Consistencia 
    En la mayoría de los casos, podría alcanzarse utilizando un conjunto formal de directrices sobre cómo diseñar productos para un dispositivo o formato en particular.
  3. Confirmación 
    Solicite confirmación de cualquier acción importante o irreversible para evitar errores que el usuario pueda cometer accidentalmente.
  4. Los controles del usuario 
    botones ‘Deshacer’, ‘atrás’, ‘búsqueda’ de Control de usuario , así como los atajos de teclado, son una excelente manera de dar a un usuario el control sobre un sitio web o una aplicación.
  5. Accesibilidad 
    Es crucial para que el producto sea fácil de usar por tantas personas como sea posible. El diseño de UX debe eliminar los obstáculos para las personas cuando usan el producto, ya sea que esos obstáculos sean temporales o más permanentes.

El diseño de UX equilibra negocios, personas y tecnología. Si bien es cierto que un producto no puede tener éxito sin un negocio saludable, una empresa no puede tener éxito sin un cliente feliz, y es el trabajo del Diseñador de UX hacer feliz al cliente.

Un diseño UX completo

Por lo tanto, hay muchas cosas involucradas en el diseño de UX. La full UX Stack  consta de:

  • Superficie (aquí aplicamos diseño de interfaz de usuario)
  • Esqueleto (hecho mediante la aplicación de Interfaz y Diseño de Interacción)
  • Estructura (formada por la arquitectura de la información y los flujos de usuarios)
  • Alcance (Especificaciones funcionales y requisitos de contenido)
  • Estrategia (necesidades del usuario y objetivos del proyecto definidos según la investigación del usuario y los objetivos comerciales)

Pero la parte de la interfaz de usuario no va primero. El diseño de UX comienza con la identificación de un problema a través de la investigación del usuario. No tiene sentido resolver los problemas que a los usuarios no les importan.

Proceso de diseño de UX

En pocas palabras, los pasos del proceso de diseño de UX son los siguientes:

  • Investigación del usuario
  • Diseño
    UX wireframing 
    UX prototipos
  •  Diseño UI (Visual e Interacción)
  • Pruebas de usuario

Acontinuación, puede encontrar una descripción general de los principales enfoques del proceso de diseño de UX.

El proceso de diseño de UX se puede describir dentro de varios de los enfoques de diseño de UX más populares.

Principales enfoques del proceso de diseño de UX.

Actualmente, hay tres enfoques bien conocidos del proceso de diseño de UX:

  1. Clásico
  2. Lean
  3. GV Design Sprint (GV significa Google Ventures)

Un proceso de diseño de UX clásico generalmente se enseña en las universidades y se construye utilizando la metodología de cascada . Aquí está el proceso de diseño de UX clásico :

  1. Investigación. Aquí se deben descubrir los principales problemas. Aquí puede encontrar 10 diagramas para proporcionar una investigación de usuario efectiva .
  2. Categorización de los problemas que fueron descubiertos.
  3. Crear personas y mapas de viaje (no mezclarlos con flujos de usuarios)
  4. Ejercicios de ideación para generar soluciones para un gran diseño de UX y resolución de problemas revelados.
  5. Construyendo el prototipo.
  6. Pruebas de prototipo.
  7. Enviando el prototipo final al desarrollo.
  8. Lanzamiento del producto.
  9. Recopilación de comentarios de los usuarios.
  10. Volviendo al primer paso con la retroalimentación recibida del usuario.

En pocas palabras, como esquema para describir un proceso de diseño de UX clásico, puedes imaginar algo como esto:

Pero también está el otro enfoque del proceso de diseño de UX que apareció en 2013 porque el proceso de diseño de UX clásico era incompatible con el desarrollo Agile. El nuevo proceso de diseño llamado Lean UX y permitió que UX operara dentro del cono de incertidumbre de Agile y actualice rápidamente los diseños en función de los comentarios de los usuarios. Se trajo la experiencia de diseño de nuevo en armonía con el desarrollo del producto.

En pocas palabras, Lean UX es un conjunto de principios basados ​​en los métodos ágiles de ‘Lean Startup’, donde el enfoque se lleva al presente. En lugar de lanzar entregas de diseño sobre el muro, los equipos aceptan que no se puede crear un diseño final por adelantado, y creen que las respuestas surgirán a medida que las hipótesis se prueben con el desarrollo de MVP (Producto Mínimo Viable) . El proceso de diseño de Lean UX se puede describir como un ciclo de ‘construir, medir y aprender’, o un ciclo de ‘pensar, hacer, verificar’.

Más adelante, el proceso de diseño de Lean UX pareció ser ineficiente cuando el plan de un producto no estaba bien definido, lo que resultó en un desperdicio y un retrabajo significativos.

Otro gran proceso de diseño fue sugerido por Google Ventures. Este fue Design Sprint . Les permitió a los equipos definir y probar rápidamente los prototipos de baja fidelidad. El diseño de Sprint por Google Ventures,puede ser visto como una combinación de los tres enfoques: Design Thinking, ágil, y Lean. Un componente clave del sprint es la creación de un prototipo, que es una de las mejores formas de recopilar datos y probar ideas. El esquema podría presentarse de la siguiente manera:

Todos los enfoques del proceso de diseño de UX se basan en las mismas iteraciones pero responden preguntas diferentes.

Piezas de diseño UX

En resumen, cubriré más información sobre cada parte de lo que hace el diseño de UX :

  • Diseño de interacción 
    Creando interfaces atractivas con comportamientos bien pensados. Comunicación simple y clara entre usuarios y tecnología. El diseño de interacción es responsable de las funciones que permiten la interacción entre personas e interfaces de usuario individuales o en múltiples interfaces (o sistemas).
  • Wireframes & prototypes 
    Demostrando los componentes esenciales del sitio web como modelo para la tarea o prototipo interactivo antes del diseño final. (Por cierto, un alámbrico no es un boceto y no es una maqueta).
  • Arquitecto de la información 
    Es partes iguales del arte y la ciencia. Organizar, estructurar y etiquetar el contenido de forma eficaz y sostenible.
  • Investigación de usuarios 
    Comprender los comportamientos, necesidades y motivaciones de los usuarios a través de técnicas de observación, análisis de tareas y otras metodologías de retroalimentación. La investigación del usuario define su audiencia y proporciona información esencial sobre cómo satisfacer mejor sus necesidades. Para proporcionar investigación cualitativa a los usuarios, debemos considerar la imagen completa: – ¿Quién usará la aplicación / sitio? – ¿Qué están tratando de lograr? – ¿Qué podría interponerse en su camino? – ¿Cuáles son las principales necesidades comerciales del cliente? en este post pueden leer sobre Por qué la investigación del usuario es importante para UX .
  • Escenarios 
    Descripción de la interacción del usuario con un proyecto. Estas historias son muy importantes tanto para el diseño de una interfaz como para las pruebas de usabilidad.

Pero esta no es la lista completa de las cosas que incluye el diseño de UX. ¡Encuentra las partes clave del diseño de la experiencia del usuario con su verdadera esencia!

Este es un diseño de UX para decidir si los usuarios pasarán las páginas o desplazarán el contenido. Y para asumir tal responsabilidad en los detalles y predecir su impacto, los diseñadores de UX deben saber mucho sobre el comportamiento humano. Los diseñadores de UX generalmente provienen de una variedad de fondos, como diseño visual, programación, psicología y diseño de interacción. Más adelante, también hablaré en detalle sobre las tareas principales de los diseñadores de UX.

¿Qué es el diseño de interfaz de usuario?

Comencemos con la definición de lo que es una interfaz. Una interfaz es un mecanismo de interacción de los dos sistemas. Desde este punto, una interfaz de usuario es una interfaz creada para facilitar la interacción directa entre un sistema y un usuario.

En el dispositivo de visualización, hay dos tipos comunes de interfaces de usuario :

  • la interfaz de línea de comandos (CLI), que contiene solo texto, y es utilizada principalmente por programadores;
  • y la interfaz gráfica de usuario (GUI), a la que aplicaré. Incluye imágenes, ventanas, íconos, menús, etc.

En este material, me limitaré especialmente al tipo de interfaz de usuario responsable de la percepción visual: GUI.

El diseño de interfaz de usuario o interfaz de usuario es una disciplinapara diseñar interfaces de usuario para máquinas y software, como computadoras, electrodomésticos, dispositivos móviles y otros dispositivos electrónicos, con un enfoque en la capacidad de respuesta y la estética, maximizando la usabilidad para fomentar una buena experiencia de usuario. Como parte de UX, el diseño de la interfaz de usuario se centra más en los colores y la tipografía. En pocas palabras, el diseño de la interfaz de usuario suele ser una combinación de:

  • Diseño visual (la apariencia) y
  • Diseño de interacción (como funciona).

Como ejemplo, el diseño de UX se centra en dónde colocar el botón para que el usuario lo encuentre fácilmente, mientras que el diseño de la interfaz de usuario pensará en cómo hacer que este botón se vea bien para que el usuario quiera presionarlo.

¿Por qué necesitamos una interfaz de usuario? El producto debe ser visualmente atractivo y hermoso. El diseño de IU crea un lenguaje visual y una jerarquía comunes que mejora la forma en que los usuarios se involucran con su producto.

La interfaz de usuario reúne conceptos de Diseño de interacción, Diseño visual y Arquitectura de la información.

Los elementos de la interfaz de usuario incluyen botones, campos de texto, casillas de verificación, controles deslizantes, iconos, etiquetas, buzones de mensajes, paginación, etc. Para comprender mejor qué es el diseño de la interfaz de usuario, debe hacer un pequeño recorrido por los principales elementos de diseño de la interfaz de usuario .

Piezas de diseño de interfaz de usuario

No se puede desarrollar un diseño de interfaz de usuario atractivo sin el uso de todas las técnicas de los siguientes campos:

  • Diseño visual 
    Convierta la estética del producto en general y comprometa a su audiencia con principios centrados en el usuario como diseño orientado a la web o arte conceptual. El objetivo principal del diseño visual es moldear y mejorar el UX con la ayuda de ilustraciones, fotografías, tipografías, espacios, diseños y colores. «Línea, forma, espacio negativo, textura»: todo se trata de diseño visual. Obtenga más información al respecto en la página de Interaction Design Foundation sobre Visual Design .
  • Colores 
    Elegir los colores correctos para su proyecto es muy importante debido a las asociaciones mentales con las emociones y los significados. También es importante seguir los colores de la marca y usarlos sabiamente según el diseño que desee crear y el mensaje que desee compartir.
  • Diseño gráfico: El diseño gráfico es responsable de combinar imágenes, tipografía o gráficos en movimiento para impresionar a sus clientes. Diseño gráfico tiene como objetivo perseguir la perfección de píxeles. Esto es para garantizar que los textos tengan un kerning perfecto y que los colores cumplan con las pautas de la marca. El diseño gráfico es una disciplina especializada, y hay un cierto nivel de artesanía y un conjunto de habilidades especializadas (como la tipografía y la teoría del color) necesarias para producir excelentes imágenes. A menudo se mezcla con el diseño visual.
  • Maquetas 
    Una maqueta es una escala o modelo de tamaño completo de un diseño utilizado para demostración, evaluación de diseño, promoción y otros fines. Las maquetas pretendían mostrar el aspecto final del diseño con detalles visuales, como los colores y la tipografía. Los wireframes, las maquetas y los prototipos a menudo se mezclan, pero solo representan las diferentes etapas del flujo de diseño. Un wireframe es una forma de baja fidelidad de presentar un diseño, esboza estructuras y diseños. A diferencia de una estructura alámbrica, una maqueta se parece más a un producto terminado o prototipo, pero no es interactiva y no se puede hacer clic. Las maquetas se utilizan para ofrecer una gama de opciones para estructurar pantallas en aplicaciones. Junto con los diseños, ayudan a organizar el contenido y hacen que la interfaz de usuario sea comprensible.
  • Tipografía: La tipografía es una fuerza impulsora en todas las formas de arte de la comunicación. Este es el arte y la ciencia del estilo de fuente, la apariencia y la estructura, cuyo objetivo es entregar a los lectores una copia estética y de fácil lectura. La tipografía ayuda a agregar un poder de impresión a sus mensajes en un proyecto basado en pantalla o impresión. Una buena tipografía debería: 
    a) Trabajar bien en varios tamaños; 
    b) Tener formas de letras fácilmente distinguibles; 
    c) Tener una jerarquía reconocible para una mejor percepción.

Además, en la actualidad, el diseño de la interfaz de usuario depende en gran medida del diseño de movimiento que crea retroalimentación instantánea del usuario crucial para cualquier interfaz de usuario. Las animaciones, los efectos visuales y las transiciones de pantalla tienen un impacto tremendo en cómo los usuarios primerizos se involucrarán con la aplicación. 

Tipos de prototipos de software de interfaz de usuario

Como mencioné antes, los prototipos son diferentes de los wireframes y de las maquetas. Anteriormente agregué prototipos al diseño de UX, pero en la medida en que generalmente se usan para que los usuarios prueben el producto, los prototipos deben ser de alta fidelidad, interactivos y ajustarse lo más posible a la interfaz del usuario final. Es por eso que en la siguiente parte hablaré de prototipos de interfaz de usuario.

Los prototipos simulan la interacción entre el usuario y la interfaz de la manera más realista posible.

Hay 5 tipos comunes de prototipos de software de interfaz de usuario :

  1. Prototipado de papel (bocetos) Dibujando en el proceso de prototipado para registrar las ideas principales (generalmente en papel), se limita a la generación de ideas y la comunicación con el equipo de diseño.
  2. Creación de prototipos de baja fidelidad: Los prototipos de baja fidelidad son representaciones aproximadas de conceptos que ayudan a validar esos conceptos desde el principio en el proceso de diseño. En pocas palabras, esta es una presentación en bruto de nuestras ideas. Los equipos de diseño suelen utilizar los prototipos de baja fidelidad para enfatizar las interacciones y los pensamientos.
  3. Creación rápida de prototipos: La creación rápida de prototipos es una técnica de fidelidad media basada en la investigación del usuario. La creación rápida de prototipos ayuda al diseñador a pensar qué debe hacerse para alcanzar el objetivo final. Pasa por una serie de iteraciones rápidas y sesiones de retroalimentación que podrían resolver el problema. Lo principal de la creación rápida de prototipos que lo hace muy rápido es el uso de una amplia gama de aplicaciones, diferentes prototipos digitales y herramientas de investigación de usuarios.
  4. Creación de prototipos de alta fidelidad ( creación de prototipos interactivos) A diferencia de la creación de prototipos de baja fidelidad, la creación de prototipos de alta fidelidad requiere más tiempo, habilidades y recursos especializados. Un prototipo de alta fidelidad es una representación interactiva basada en computadora del diseño que se parece más a la versión final en términos de detalles y funcionalidad. Suele presentar usabilidad y realismo todo en uno.
  5. Prototipado HTML (algunas personas no cuentan este tipo) El prototipo HTML es un prototipo desarrollado utilizando HTML. Se puede ver en el navegador. No tiene opciones estilísticas y tiene una apariencia mínima, pero el prototipo HTML puede ir a la etapa de codificación mucho más rápido que otros prototipos porque ya se ha escrito parcialmente en código.

Cada tipo de prototipado tiene su propia lista de herramientas digitales que se adaptan mejor al proceso. Desde las diapositivas de Keynote y Google hasta InVision y Adobe XD … Aquí puede explorar la lista definitiva de herramientas de creación de prototipos de IU que se utilizan para los diferentes tipos de creación de prototipos de software de IU.

Principios de diseño de interfaz de usuario

Al crear un prototipo de interfaz de usuario, un buen diseñador sigue los siguientes 6 principios de diseño de interfaz de usuario (según Larry LeRoy Constantine):

  1. Estructura . Se refiere a la arquitectura general de la interfaz de usuario y dice que los modelos deben ser claros, consistentes, reconocibles y deben contener elementos relacionados, separados no relacionados, y hacer que objetos similares se parezcan entre sí.
  2. Simplicidad . El diseño debe facilitar las tareas simples y comunes, comunicarse de forma clara y sencilla en el propio idioma del usuario. Los atajos deben estar relacionados de manera significativa con procedimientos más largos.
  3. Visibilidad . No hay información redundante y alternativas extrañas. El diseño debe hacer que todas las opciones y materiales necesarios para una tarea determinada sean visibles sin distracción.
  4. Retroalimentación . Los usuarios deben ser informados y comprender todas las acciones relevantes, cambios de estado o condición, errores o excepciones de manera clara, concisa y familiar.
  5. Tolerancia . El diseño debe ser flexible para reducir los errores y el mal uso al permitir deshacer y rehacer.
  6. Reutilizar . El diseño debe reutilizar componentes y comportamientos internos y externos, manteniendo la coherencia con el propósito en lugar de la coherencia arbitraria.

Técnicas de interfaz de usuario

Vamos a hablar sobre cómo cumplir con todos los principios de diseño de la interfaz de usuario principales que se mencionan anteriormente. Para hacer esto, los diseñadores usan algunas técnicas de interfaz de usuario simples pero beneficiosas.

En primer lugar, una técnica de interfaz de usuario ( técnica de interacción o técnica de entrada) es una combinación de elementos de hardware y software que proporcionan una manera para que los usuarios puedan realizar una sola tarea. Por ejemplo, hacer clic en un botón, presionar una tecla, realizar un gesto del mouse o pronunciar un comando de voz.

En el diseño de la interfaz de usuario hay decenas de diferentes técnicas efectivas que ayudan al usuario a realizar la tarea. Me gustaría nombrar las técnicas de interfaz de usuario más famosas .

  • Estilos de interacción como el rellenado de formularios o selección de menú , etc .
  • Patrones de diseño de interacción que representan una manera de describir soluciones a problemas comunes de usabilidad o accesibilidad en un contexto específico. En otras palabras, esta es una forma formal de documentar una solución a un problema de diseño común.
  • Organizativos estructuras y esquemas:
  1. La estructura jerárquica se basa en la capacidad del cerebro para distinguir objetos en función de sus diferencias físicas, como el tamaño, el color, el contraste, la alineación, etc.
  2. Estructura secuencial donde los usuarios siguen la ruta especial completando las tareas una por una.
  3. Estructura matricial cuando los usuarios pueden elegir el modo de navegación por sí mismos por orden alfabético, cronológico, por tema (agrupación de los temas o géneros específicos) o por grupos de usuarios (un tipo de audiencia).
  • Modelos de organización de contenidos :
  1. Modelo de una sola página.
  2. Modelo plano donde todas las páginas son iguales y se ubican en el mismo nivel de navegación.
  3. El modelo de índice permite a los usuarios acceder a las páginas a través de la lista de páginas que está disponible en cada página.
  4. El modelo de jerarquía estricta ofrece a los usuarios solo una forma de acceder a las subpáginas, desde la página principal.
  5. El modelo de jerarquía coexistente proporciona a los usuarios varias formas de acceder al contenido, pero los guía a través de cierta ruta para que tomen las acciones esperadas.
  6. El modelo Daisy destinado a guiar a los usuarios a la página de inicio cada vez que realizan una tarea.
  • Técnica de visualización que enfatiza la salida y tiene como objetivo organizar y estructurar datos numéricos y no numéricos de una manera conveniente y clara, visualmente atractiva.
  • Investigación e innovación . Algunos ejemplos: 
    capas interactivas; 
    Ilustraciones personalizadas; 
    Pantallas divididas; 
    Tipografía negrita; 
    Interfaz de usuario sin botones; 
    Animaciones; 
    Colores vibrantes y atrevidos; 
    Contenido de la foto

Hay más ejemplos, pero la mayoría de ellos se pueden clasificar dentro de los grupos anteriores.

Después de que conozcas todas las técnicas importantes de UI, debo advertirte sobre las más molestas . Por favor, considérelos para salvar a su usuario de la extinción.

Proceso de diseño de la interfaz de usuario

Hay varias fases y procesos en el diseño de la interfaz de usuario que puedo nombrar. Éstos son algunos de los más viables:

  1. Recolección de requerimientos de funcionalidad. Este paso cubre el ensamblaje de una lista de las funcionalidades requeridas para lograr los objetivos del proyecto y las necesidades potenciales de los usuarios. Por lo general, esta etapa comienza justo después de la sesión de descubrimientocon el cliente.
  2. Análisis de usuarios y tareas . Este es el estudio sobre cómo los usuarios potenciales realizarán las tareas que debe soportar el diseño. Esta etapa está relacionada con la investigación de usuarios que hacemos como parte del proceso de diseño de UX.
  3. Arquitectura de la información (IA) . Este proceso cubre el desarrollo del proceso y el flujo de información del sistema. Durante esta fase, elegimos el estilo de interacción UI, el patrón de diseño y la técnica de visualización. Muchas de las técnicas de diseño de IU que describí anteriormente se formaron durante la etapa de Arquitectura de la información.
  4. Prototipado . Esta etapa cubre el desarrollo de prototipos, wireframes, maquetas, prototipos de papel o pantallas interactivas simples.
  5. Inspección de usabilidad . La inspección de usabilidad se puede utilizar para evaluar prototipos o especificaciones para el sistema, que generalmente no se puede probar en los usuarios. Los métodos de inspección de usabilidad son un recorrido cognitivo, una evaluación heurística y un recorrido pluralista.
  6. Pruebas de usabilidad . Las pruebas de diseño de la interfaz de usuario permiten comprender la recepción del diseño desde el punto de vista del espectador. Por lo general, durante las pruebas de usabilidad, se les pide a los usuarios que completen tareas para ver dónde encuentran problemas y experimentan confusión.
  7. Diseño de interfaz gráfica de usuario (GUI) . Este es un aspecto real del diseño de la interfaz gráfica de usuario final. En esta etapa, decidimos sobre la comunicación visual y la resolución de problemas mediante el uso de tipografía, fotografía e ilustración.
  8. Mantenimiento de software . El mantenimiento ocasional va después de la implementación para corregir errores de software, cambiar características o actualizar completamente el sistema.

En las secciones anteriores, traté de recopilar, estructurar, explicar y presentar todos los términos y matices principales del diseño de UI y UX. Pero es posible que desee leer más sobre esto y aquí puede encontrar la lista de los mejores libros sobre UI y diseño de UX .

Diseño de aplicaciones web y móviles.

El diseño de UX y UI se utiliza principalmente para crear sitios web y diseños excepcionales para aplicaciones móviles. Hagamos una breve introducción al diseño web y móvil.

diseño web

En pocas palabras, el diseño web es un proceso de creación de sitios web. Se trata de la Arquitectura de la información, la estructura del sitio web, la interfaz del usuario, la ergonomía de la navegación, los diseños del sitio web, los colores, los contrastes, las fuentes y la fotografía o las ilustraciones, así como el diseño de iconos.

El diseñador web es un especialista que aplica las habilidades de UX y UI al diseño de una página web. Originalmente, un diseñador web es un diseñador de IU (un subconjunto de diseñadores de UI) centrado en el diseño y la creación de una interfaz de usuario web. Algunos de ellos pueden conocer un poco de la programación frontal, como HTML / CSS, Javascript para mostrar cómo funcionaría el diseño / prototipo en la pantalla. Además, deben saber más sobre las restricciones técnicas en la web, las redes y demás.

Un diseñador web debe:

  • Sepa cómo crear diseños web y entregables, más:

Iconos; 
Infografías; 
Logotipos 
Presentaciones etc.

  • Familiarícese con el software estándar de la industria.
  • Tener habilidades de wireframing.
  • Esté atento a los matices de desarrollo frontend.
  • Saber codificar (eso es un plus).

Diseño de UX para la web que mejora la satisfacción del usuario al mejorar la usabilidad, accesibilidad y eficiencia de la interacción del usuario con los sitios web.

Diseño de aplicaciones móviles

El diseño de aplicaciones para dispositivos móviles (de escritorio y portátiles también) plantea desafíos especiales:

  • Facilitar tareas complejas y flujos de trabajo,
  • permitiendo a los usuarios comprender y gestionar datos complejos,
  • teniendo en cuenta una amplia variedad de roles, necesidades y procesos de usuario.

El diseño de UX / UI de la aplicación mejora la experiencia del usuario y la satisfacción del cliente que, en última instancia, ayuda a aumentar el número de usuarios de la aplicación específica.

El diseño de UX móvil se refiere al diseño de experiencias positivas durante el uso de dispositivos móviles y dispositivos portátiles. Según el contexto, el diseño de la aplicación móvil impone requisitos únicos a la experiencia del usuario.

En los últimos años, dichos requisitos se cumplieron siguiendo las siguientes tendencias de diseño de aplicaciones móviles:

  • Diseño para pantallas más grandes;
  • Simplificar la interfaz de usuario;
  • Interacción por deslizamiento y gestos;
  • Añadiendo más opciones de navegación;
  • Añadiendo animación funcional;
  • Cuentacuentos;
  • Utilizando tipografía escalable;
  • Experimentos con paletas de colores, y más.

Para comprender estas tendencias, le recomiendo que lea sobre las diferencias clave entre una aplicación web y un sitio web en mi material sobre el desarrollo de aplicaciones web . 
Otra cosa a considerar son los mitos de diseño de interfaz móvil que solíamos escuchar a veces. Para ser honesto, algunos de estos mitos pudieron tener lugar en el pasado, pero hoy en día la experiencia móvil fue mucho más allá.

¿Qué hacen los diseñadores de UI / UX?

Para comenzar con lo básico de lo que hacen los diseñadores de UX, los diseñadores de UX consideran Por qué , qué y cómo para el uso del producto en el que trabajan.

  • El motivo del por qué involucra las motivaciones de los usuarios para adoptar un producto, ya sea que se relacionen con una tarea que desean realizar con él, o con los valores y puntos de vista asociados con la propiedad y el uso del producto.
  • Lo que trata las cosas que las personas pueden hacer con un producto, su funcionalidad.
  • Cómo se relaciona con el diseño de la funcionalidad de forma accesible y estéticamente agradable.

Los diseñadores de UX comienzan con el Por qué antes de determinar el Quéy luego, finalmente, Cómo para crear productos con los que los usuarios puedan formar experiencias significativas. En un diseño web o de aplicación móvil, los diseñadores deben asegurarse de que la ‘sustancia’ del producto llegue a través de un dispositivo existente y ofrezca una experiencia fluida y sin problemas.

En qué etapa, el diseñador de UX debería responder algunas preguntas fundamentales como:

  • ¿Necesitan los usuarios el producto que están haciendo?
  • ¿Los usuarios pagarán por este producto?
  • ¿Los usuarios pasarán tiempo buscándolo y aprendiendo a usarlo?
  • ¿Cuál es la característica clave que necesitarán los usuarios?
  • ¿Los usuarios necesitarán todas las características que construyes? ¿Cuántas y qué características realmente necesitan?

Las preguntas principales para la etapa Como son diferentes y relacionan la implementación:

  • ¿Cómo debe organizarse el contenido para que los usuarios puedan encontrarlo fácilmente?
  • ¿Será la aplicación fácil de usar?
  • ¿Donde los usuarios podrían confundirse o perderse? ¿Qué dificultades podrían enfrentar?
  • ¿Qué contenido se necesita y cómo debe escribirse para que sea más atractivo?

Las tareas típicas de un diseñador de UX varían, pero a menudo incluyen la investigación del usuario, la creación de personas, el diseño de esquemas y prototipos interactivos, así como los diseños de prueba.

En pocas palabras, los diseñadores de UX participan en la realización de una extensa investigación de usuarios, formulando una arquitectura de información y creando perfiles e historias de usuarios. El diseñador de UX no necesariamente posee un conjunto de habilidades de diseño gráfico o visual, sin embargo, una comprensión de la psicología y el diseño sistémico es una necesidad.

Los diseñadores de IU al mismo tiempo intentan dividir las estructuras complejas en formatos comprensibles simples para la conveniencia del usuario final. Por lo tanto, tanto UX / UI como los diseñadores web trabajan para proporcionar una experiencia agradable y efectiva para el usuario.

Los diseñadores de UI / UX deben poder entender la necesidad de los usuarios. Los objetivos y el objetivo de la aplicación siguen siendo el primer factor determinante incluso antes de que pongan en práctica sus habilidades y conocimientos para crear aplicaciones web, aplicaciones móviles, sitios web y servicios. Luego, después de comprender la necesidad del usuario y el objetivo de la aplicación, un diseñador debe poder traducirla de manera efectiva en funcionalidades. También deben poder determinar los posibles requisitos futuros de la aplicación. En cooperación permanente con otros miembros del equipo de desarrollo, los diseñadores participan en la etapa de desarrollo del producto desde la fase inicial hasta la fecha de finalización. Estas tareas y obligaciones abarcan los principales deberes del diseñador de experiencia de usuario. Pero te sugiero que leas sobre Por que se paga a los diseñadores de UX en detalles

Recursos adicionales

  1. Una gran lista de recursos para diseñadores de UI y UX para encontrar herramientas, blogs, hacks e inspiración.
  2. Los indicadores, validadores y notificaciones en el diseño de la aplicaciónpueden ayudarlo a comprender cómo se puede informar al usuario con los tres enfoques comunes para la comunicación de estado.
  3. Accesibilidad en el diseño UX .
  4. Behance , Dribbble y Muzli son excelentes fuentes para la inspiración del diseñador.
  5. Siga las mejores prácticas de diseño móvil descritas por Nick Babich.
  6. Las tendencias de diseño de UI y UX para 2019 te ayudarán con la dirección.
  7. La guía para principiantes de Arquitectura de la información (IA) es una fuente completa con las respuestas sobre qué es la Arquitectura de la información, sus metodologías comunes, herramientas, conferencias y libros de AI.
  8. Introducción al diseño de experiencias de usuario .
  9. Aprende los principales métodos y técnicas de diseño de UX .
  10. Una guía completa para el diseño de la interfaz de usuario .
  11. Más sobre diseño de interfaz de usuario en Wiki.
  12. Aprende las diferencias entre un prototipo, estructura y maqueta.

Fuente: https://medium.com

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *