Habilidades de diseño de la interfaz UI: ¿Cómo mejorar el sentido de alto nivel de la interfaz UI?
1. Mejore la estructura jerárquica para que la interfaz de usuario sea más clara.
Ordenar, reorganizar y ordenar conscientemente el nivel visual para que los usuarios puedan percibir claramente el contenido. En la jerarquía de información, normalmente consta de elementos de texto comunes, como títulos, subtítulos, texto del cuerpo y notas de referencia.
Una jerarquía de texto clara depende de un estilo que corresponda a la jerarquía del texto mismo para garantizar la legibilidad. El título debe ser destacado y el texto debe ser claro. El subtítulo debe ayudar a explicar el título, por lo que debe reducirse adecuadamente para aclarar la relación de tamaño y posición delante de los elementos del texto.
Una regla general es que modificando el tamaño de fuente y reduciendo el tamaño de fuente, puedes eliminar rápidamente la relación entre ellos. Por ejemplo, utilice 32 px para el texto del título y 16 px para la fuente del texto principal para crear este contraste.
Para escenarios de uso más complejos y variados, el tamaño de fuente de los títulos de texto comunes es el doble. Si es necesario resaltar el título, el tamaño de fuente del texto puede ser tres veces. o cuando se necesita énfasis, se puede mostrar con un tamaño de fuente cuatro veces mayor.
2. Crear conscientemente una atmósfera de formato.
El espaciado, la altura de la línea y el interlineado son los atributos que se ajustan con mayor frecuencia en la composición tipográfica. La falta de espacio suficiente puede dificultar la lectura del texto, pero demasiada dirección indirecta puede hacer que los usuarios se sientan incómodos mientras leen.
(1) Altura de fila
El concepto de "altura de fila" se puede expresar en diferentes términos en diferentes lugares. Por ejemplo, el "interlineado" en PS se describe como "distancia". Básicamente, lo describen con dos líneas de caracteres espaciados verticalmente.
No existe un valor estándar para la colección en sí y suele depender de las características y requisitos de diseño de la propia fuente. En términos generales, en muchos diseños, la altura de la línea suele establecerse en 1,5 veces la altura de la fuente. En el diseño real, se deben realizar ajustes razonables en función de las características de diseño y los escenarios de aplicación de la fuente en sí (el volumen de lectura en los terminales móviles puede aumentar adecuadamente y los relojes inteligentes pueden configurarse más alto en este escenario de aplicación). Esta regla se puede utilizar directamente. Si su texto usa fuente 16, ha sido verificado durante mucho tiempo.
(2) Espaciado entre palabras
El kerning se refiere al espacio entre caracteres horizontales. Casi nadie dedica mucho tiempo a configurar el interletraje horizontal, pero tiene un impacto en la lectura. Cuando se utilizan fuentes en inglés, el ajuste del interletraje suele seguir los siguientes principios:
Cuando se utilizan letras mayúsculas, es necesario aumentar el espacio entre las palabras.
Cuando aumenta el tamaño de la fuente, se debe reducir adecuadamente el espacio entre palabras.
Al aumentar el grosor de la fuente, reduzca adecuadamente el espacio entre palabras.
El software ajustará automáticamente el espaciado entre letras durante la composición. Al mismo tiempo, preste atención al problema del espaciado uniforme en el diseño visual.
(3) Presidente
El número de línea se refiere esencialmente al ancho del párrafo de texto y la longitud de cada línea de texto. En términos generales, la extensión del texto es relativamente corta, por lo que es fácil de leer. Para computadoras portátiles, como pantallas grandes con un ancho de 1440 px, use entre 60 y 80 caracteres por línea (el chino generalmente se controla entre 35 y 42 caracteres por línea), pero si está en una pantalla móvil, la cantidad de caracteres por línea debe se reducirá a 35-45 (los caracteres chinos están limitados a 35-45 caracteres).
3. Elija fuentes según el contenido
Al elegir fuentes de texto, considere la experiencia de lectura de los lectores potenciales. Varias fuentes traerán diferentes experiencias a la interfaz y la experiencia, y la elección de fuentes afectará la primera impresión que tiene el usuario de la interfaz.
Nota: Generalmente no hay muchas opciones para fuentes en inglés. En este sentido, China, Japón y Corea del Sur obviamente tendrán más problemas con las tipografías de sus textos. Sin embargo, en las aplicaciones móviles, muchas aplicaciones pueden elegir fuentes de terceros no predeterminadas, pero en las páginas web es más problemático de implementar, por lo que generalmente solo se llaman fuentes locales.
“Los buenos diseñadores ven el texto como contenido, los grandes diseñadores ven el texto como una interfaz de usuario - Cameron Moore
Elegir la fuente correcta puede ser tanto informativo como visual. Los niveles transmiten información y las elecciones incorrectas. puede dar lugar a malentendidos y confusión.
4. Utilice la misma familia de fuentes
Si no es lo suficientemente rico en combinar diferentes fuentes, utilice el mismo diseño de fuente. Esta es la opción más segura. En términos generales, las tipografías se diseñan con un objetivo claro en mente. Tienen un aspecto más uniforme y cohesivo y son más fáciles de diseñar y utilizar.
Otro beneficio de utilizar una familia de fuentes es que puede adaptarse rápidamente a las necesidades de diferentes elementos de texto. Puede hacer comparaciones más rápido y presentar diferentes efectos visuales ajustando el tamaño, el peso, el tamaño del texto y el color de la fuente.
Además, en la misma familia tipográfica, le corresponden las cursivas, monoespaciadas, etc. A menudo se adjunta para que se puedan cumplir algunos requisitos especiales sin modificaciones manuales.
5. Utilice la alineación hacia la izquierda siempre que sea posible para mejorar la legibilidad.
En la mayoría de los países y regiones del mundo, el texto se escribe de izquierda a derecha (a diferencia del árabe) y la fluidez se escribe de arriba a abajo. Determina que la alineación a la izquierda es un punto de referencia importante para garantizar la legibilidad.
En el proceso de lectura a largo plazo, la alineación izquierda proporciona una posición de escaneo básica para el ojo humano, lo que reduce en gran medida la presión de lectura, mientras que la alineación central obviamente no puede hacer esto.
Además, se debe prestar especial atención a evitar tener una sola palabra en la última línea de un párrafo, y se deben evitar las líneas de una sola palabra en la tipografía.
El diseño tipográfico es una habilidad importante que todo diseñador necesita aprender y dominar en la era digital. No importa en qué tipo de proyecto de diseño esté trabajando, estos principios básicos siempre le brindarán mejores resultados. Pero estas técnicas tipográficas son sólo las más básicas. En el diseño real, estarán involucradas muchas disposiciones más complejas, pero estos conceptos básicos son siempre los más importantes. Si quieres una mejor tipografía y diseño, toma una clase de tipografía~