Tres consejos de diseño de interfaz de usuario para mejorar la experiencia del usuario
La belleza visual significa que necesitamos comprender profundamente el significado de cada componente en la interfaz y su expresión tentativa. El principio básico es cómo evitar la fealdad. Los más representativos son los seis principios de la psicología Gestalt, que consisten en emitir juicios estéticos a través de sentimientos duales de imágenes desconocidas y recuerdos retenidos. Yo lo llamo memoria asociativa.
Por tanto, seguir los principios de Gestalt nos permite diseñar una interfaz estéticamente agradable. Veamos los seis principios de la Gestalt.
1. Alineación: Su esencia es una forma completa y una exploración de la estética humana.
2. Contraste: El contraste puede hacer que la información principal se destaque instantáneamente, pero debemos controlar el número de niveles en una página entre 4 y 6.
3. Intimidad: La intimidad, como su nombre indica, es el principio de proximidad. En términos de diseño de interfaz, se puede dividir en cuatro niveles (usar espaciado: máximo, segunda línea divisoria, línea divisoria y tarjeta). En la aplicación, también encontraremos que la superficie formada por elementos también puede entenderse como división de intervalos. Una cosa a la que debemos prestar atención es que cuando cualquier módulo de información, como una tarjeta, tiene mucha información, podemos dividirla dos veces a través de la línea divisoria, por lo que se intercala en la operación real.
4. Similitud: debemos seguir reglas similares en la interfaz, no solo por estética, sino también por la conveniencia de desarrollar y escribir documentos. Por lo tanto, cuando diseñamos, debemos aplicar el principio de similitud en estos aspectos (color, fuente, control, esquinas redondeadas, íconos, proyección, segmentación) para mantener la similitud en el diseño. Sobre la base de la similitud, debemos realizar diferencias formales en el diseño de acuerdo con diferentes procesos para evitar que la toma de decisiones del mismo proceso afecte la elección del usuario.
Caso: por ejemplo, al diseñar botones, crearemos botones físicos, botones de cristal, botones fantasma, botones de texto y botones de íconos de acuerdo con diferentes niveles para guiar el proceso de operación del usuario. Al diseñar una misma página, necesitamos clasificar la información y distinguir diferentes elementos. Por ejemplo, para que la interfaz sea más fácil de leer, los colores del texto forman una cierta lógica: el texto del título es 333333, el texto del contenido es 66666 y el texto de la nota es 99999, que es adecuado para el diseño del producto.
5. El principio de cierre es que la paciencia tiene una función asociativa, por lo que el cerebro conectará los elementos en un todo, que será más fácil de entender. El diseño sigue la ley del cierre visual, que reduce el tiempo que tarda el cerebro en asociarse y cerrarse activamente, mejorando directamente la experiencia visual del usuario. Aplique diseños más regulares, clasifique por color de fondo, diseño de tarjeta, etc.
6. Piénsalo. Todos sabemos que algo que hace que los usuarios se sientan avanzados debe estar más allá de su comprensión, por lo que los elementos abstractos pueden hacer que los usuarios piensen, pero debemos prestar atención al equilibrio entre legibilidad y sensación de alto nivel.
Estos seis principios estéticos son suficientes para que ante las necesidades elijamos el camino adecuado para lograr las necesidades. La belleza es una herramienta.
¿Cómo conseguir efectos bonitos? El núcleo es mejorar la calidad de nuestros productos. Necesitamos conocer el origen psicológico de la calidad, que en definitiva son dos puntos: detalle y sencillez. Lo que hay que señalar aquí es que la simplicidad no es simplicidad, sino aprovechar las fortalezas y evitar las debilidades. Todos ellos están diseñados para reducir la carga sobre el cerebro y permitirle reconocer lo que desea expresar de un vistazo. Se trata de ampliar los elementos exquisitos para que los usuarios puedan ver el lado bueno de un vistazo e ignorar el lado peor, logrando el propósito de la simplicidad pero no la simplicidad. Entonces, ¿cómo se hacen los detalles?
Caso: Para los gráficos, tenemos tres direcciones que afectan la legibilidad y la belleza. El primero es la extracción del modelado. El contorno debe ser claro, incluido el ángulo de visión, el tamaño del filete, el principio de fractura, el ángulo de inclinación y el grosor de la línea. El segundo es la itinerancia del eje Z, que incluye gráficos principales, elementos auxiliares y capas de fondo. El tercero es la textura, que incluye ángulos de luz y sombra degradados, valores de proyección y textura.
¿Qué es mala impresión? ¿Significa cómo diseñar una interfaz con tu propio estilo basándose en la belleza? A continuación, aprendamos qué es la diferencia de impresiones. Nuestro primer objetivo es comprender en profundidad las características y los estilos de diseño aplicables de productos con diferentes atributos y utilizar herramientas para extraer el ADN único y los puntos de memoria del producto.
Hay dos factores principales que determinan el estilo del producto.
Uno es el grupo de usuarios (jóvenes y mayores).
Caso: Yudu, usuario: Necesidad de aumentar la rigidez emocional del usuario. El tablero tiene baja densidad aparente, colores intensos y alta saturación. Los íconos tienen ricos efectos visuales, se integran más actividades y se pone más énfasis en la conversión de datos. Sina Finance, usuario: énfasis en 100% de previsibilidad de los costos operativos (principio de prioridad para la prevención de errores), máximo uso del espacio del tablero, compacidad, alta densidad, pequeñas esquinas redondeadas, visualización autorizada y confiable, pocas decoraciones de íconos y transmisión clara de información .
2. Atributos del producto (negocio, contenido, herramientas, redes sociales), complemento: Cómo distinguir, en forma de eje de coordenadas, la fuerza de las capacidades de la comunidad se compara con la fuerza del contenido generado por el usuario.
1. Categoría de negocios: gente rica: uso de procesos comerciales para conectar a las personas (comercio electrónico, compras grupales, viajes). Debido al contenido complejo, los colores ricos y las interacciones en el tablero de ajedrez, el tablero está muy segmentado y rara vez hay una gran área de espacio en blanco. Debido a que la primera pantalla es muy importante, se enumeran muchas entradas de funciones.
2. Tipo de contenido: conectando información y personas (persistente), los usuarios pueden obtener la información más efectiva lo más rápido posible.
3. Herramienta; conecta personas y eventos (fácil de entender). El propósito de abrir un producto es muy fuerte. Generalmente se cierra después de su uso y el contenido es generalmente monótono. A menudo se utilizan ilustraciones o estilos de textura para resaltar la sensación de sofisticación.
4. Tipo social: conectar personas (sentido de ritual), porque el valor generado por un gran número de personas es difícil de explotar, pero una vez exitoso, es difícil ser reemplazado. valorado. Dividido en comunidad de conocidos y comunidad de extraños.
Uso del color: Cuantos menos colores, más profesional. Cuantos más colores, más ricas son las emociones. Cuanto más disperso esté el color, más inestable será el producto. La distribución del color es más profesional. Cuanto menor es la saturación, más profesional es, y cuanto mayor es la saturación, más entretenido es.
Los usuarios recuerdan prioridades: posición, color, forma, texto.
A través de los arreglos anteriores, se puede explorar en profundidad el ADN del producto. Los pasos son * * * cuatro pasos: determinar la emoción, extraer palabras clave, generar una versión emocional y crear una atmósfera. El modelo de incubación de productos incluye definición de personalidad, modelo de carácter, ADN del producto, propiedad intelectual de la imagen y detalles.
¿Cómo debemos ser científicos y razonables en el proceso de implementación? El objetivo es tener dimensiones y enfoque perfectos para el diseño de la interfaz. El contenido específico tiene como objetivo interpretar los objetivos de navegación del usuario y trazar razonablemente la ruta visual. El núcleo de la racionalidad científica es la transmisión de información, que incluye tres puntos. Primero, la experiencia básica de la visión es razonable. A través de experimentos científicos, sabemos que los puntos de acceso de navegación toman la ruta de las líneas F y Z. En segundo lugar, los usuarios pueden obtener información rápidamente. Al implementar la interfaz, debemos eliminar el contenido y organizarlo de manera razonable para lograr diferencias en la jerarquía visual. En tercer lugar, la comunicación visual también es muy importante. La diferencia visual impresiona a la marca y le permite ocupar instantáneamente la mente del usuario.
Para garantizar que toda la información sea necesaria, recuerde verificar si hay omisiones y completar los vacíos durante el proceso de diseño. Comience con el proceso, a qué proceso pertenece la página (interacción del proceso), qué problemas debe resolver el proceso (idea central), cuáles son las necesidades del usuario y del producto (comparación de demanda) y utilice la menor cantidad de contenido posible para resolverlo. el problema. Cuando analizamos las necesidades de información, podemos usar el modelo kano, que es el contenido del análisis de producto del artículo anterior, para eliminar información según la información necesaria, las necesidades esperadas, resaltar las necesidades, las necesidades indiferentes y disminuir las necesidades inversas.
En segundo lugar, es necesario garantizar la racionalidad del nivel de diseño y el nivel de información de la informática para garantizar que los usuarios puedan obtener información útil más rápidamente al navegar por la página. Hay dos pasos para dividir la estructura jerárquica:
1. Priorizar las secciones funcionales: según la intención y la frecuencia del usuario, combinado con el análisis de los productos de la competencia de KOL, los requisitos exitosos del producto requieren mejoras iterativas.
2. Divide los niveles de información en secciones: Utiliza la ley de Eisenhower y ordena la información importante por la urgente. El segundo cuadrante es adecuado para las necesidades centrales de los usuarios de productos de nueva creación, y el cuarto cuadrante es el núcleo de productos maduros, como la publicidad. Si no puede juzgar, continúe utilizando los datos de kano para el análisis, y también se pueden priorizar otros factores.
Después de organizar la información, el siguiente paso es la jerarquía visual. Debes saber que el diseño de la interfaz es en realidad una etapa de resolución de problemas. La mejor manera de dividir niveles es resaltar el contraste, y se debe diseñar un marco de referencia para reflejar los niveles. Al diseñar una interfaz, evite darles a los usuarios demasiadas opciones. Según la lección de la ley de Hyman, cuantas más opciones, más tiempo lleva, lo cual no está en línea con las características de la experiencia del usuario (el próximo artículo hablará sobre la experiencia del usuario), porque el cerebro humano puede manejar hasta 5-9 cosas al mismo tiempo.
Si hay demasiado contenido, utilice un enfoque cognitivo paso a paso para resolver el problema del exceso de información. El orden que afecta visualmente la prioridad del usuario es el siguiente: posición (orden de navegación y hábitos del usuario) - color (fondo - saturación - multicolor) - espacio en blanco (cuanto más espacio en blanco, mayor nivel) - espacio (espacio en tarjeta) .
Los puntos de inserción efectivos guían la interacción del usuario en función de los datos de comentarios esperados del producto. En este proceso, nuestro objetivo es guiar a los usuarios para que tomen las decisiones que quieran sobre el producto, determinar indicadores que incluyan no solo datos centrales sino también datos de variables dependientes, determinar variables de evaluación y evaluar soluciones multidimensionales, incluido el contenido. visual, interacción, emoción.
Estos son los tres elementos centrales del diseño de UI. Con tanto contenido, ¿cómo aplicamos estos conceptos? Podemos dividirlos en tres veces, y cada vez que diseñemos, sacaremos un punto y lo estudiaremos repetidamente en la interfaz, para que podamos usar estos contenidos de manera más efectiva y obtener una comprensión más profunda.
Gracias por leer, * * * He progresado, tengo experiencia en salida de contenidos y he forzado el diseño.