Líneas: separar y unir - Excelencia en UX

Líneas: separar y unir Las lineas, los fondos, las sombras y otros elementos gráficos muy sutiles juegan un rol sustantivo para agrupar, separar y relacionar los elementos que se despliegan en la pantalla. Parece tan básico que todos lo damos por hecho, pero el uso de elementos gráficos muy sencillos para agrupar, separar, unir o relacionar muchas veces presenta más dificultades de las que debería, al menos por las inconsistencias y errores que se aprecian en numerosas interfaces. Se trata de uno de los fundamentos del diseño y por tanto los diseñadores deberían dominarlo con fluidez total si aspiran al diseño de excelencia. El ojo es muy eficaz en la percepción de pequeños detalles y la utilización de esos detalles a nuestro favor es uno de los ingredientes sustanciales del diseño de calidad. Agrupar Como explicamos en el artículo Frente y Fondo, nuestro cerebro separa lo que percibe en lo que le va a prestar atención (frente) y lo que descartará (fondo) en base a la creación de grupos, la menor cantidad posible y nunca más de 4. El diseño debe estar pensado específicamente para este proceso de separación en frente y fondo, y una herramienta fundamental es la utilización de líneas que separen lo que va separado y agrupen lo que va junto. El ojo humano tiene una enorme sensibilidad y por tanto este proceso supone la utilización de pistas muy sutiles: ir agregando elementos pequeños, apenas visibles, e ir aumentando lentamente su destaque, para generar los grupos que permitan separar frente y fondo a nivel miro y entiendo. En el ejemplo que sigue, se ve un conjunto de tarjetas a las que se les van agregando detalles para separarlas: 1 - Sin separadores 2 - Líneas 3 - Cuadros (esta es la original) 4 - Cuadros y sombra 5 - Cuadros y fondo 6 - Cuadros, sombra y fondo Lo importante del ejemplo no es definir cuál es la mejor sino apreciar que pequeñísimos detalles resuelven el problema sin prácticamente modificar la composición gráfica general. Líneas de color Las líneas no necesariamente tienen que ser grises, se puede utilizar color, y aquí vale aún más el tema de la sutileza: pequeñísimos detalles de un color vivo son notados por nuestra percepción con total precisión y con muy poco se puede conseguir mucho. Sumado a ello, las lineas de colores permiten trabajar sobre la estética y la agrupación simultáneamente. En el ejemplo se puede ver como un toque de color bien utilizado puede corregir el problema de agrupación, a la vez que decora. En resumen, todos los pixeles que se muestran en la pantalla contribuyen a la agrupación visual, y dentro de ellos las líneas juegan un rol central. Tanto cuando se utilizan específicamente como separadores como cuando se incorpora color para decorar, el manejo sutil de los detalles hace la diferencia. ___   ONLINE Curso de Psicología Cognitiva y experiencia de Usuario Una oportunidad única de dar un salto en su formación como diseñador de experiencias de Usuario. Próximo comienzo 22 de octubre - Cupos limitados Ver programa y detalles

 

No quiero recibir información sobre cursos de Concreta

 

Concreta, Soriano 903 of 501, Montevideo, Montevideo, 11100, Uruguay, concreta.com.uy