Mejores Prácticas del Diseño UI y sus Errores Más Comunes

Aunque el título diseñador de UI sugiere una desviación del diseñador gráfico tradicional, el diseño de UI sigue siendo parte de la tradición histórica de la disciplina diseño visual.

Con cada movimiento o medio, la disciplina ha introducido nuevos lenguajes gráficos, diseños y procesos de diseño. Entre generaciones, el diseñador ha recorrido la transición de prensa a Xerox, o de papel a píxel. A través de estas generaciones, el diseño gráfico ha llevado a cabo la responsabilidad de representar el lenguaje visual de cada época.

A medida que el diseño de la interfaz de usuario pasa de su infancia, ¿qué tipo de mundo gráfico podemos esperar desarrollar? De acuerdo con la trayectoria actual, el futuro parece sombrío. Gran parte del diseño de la interfaz de usuario hoy en día se ha estandarizado y repetible. Las discusiones de diseño en línea se centran en las reglas de aprendizaje para lograr que los diseños funcionen de forma segura en lugar de ir más allá o imaginar cosas nuevas.

La tendencia de los diseñadores de UI a recurrir a patrones y tendencias no solo ha creado un entorno visual insulso, sino que también ha disminuido el valor del diseñador a medida que los procesos se vuelven más y más fórmulas.

A medida que revisamos las mejores prácticas de la interfaz de usuario y los errores comunes, la preocupación más apremiante no es la competencia técnica sino evitar una avalancha de diseños repetitivos y visualmente aburridos.

Los cinco errores de diseño de la IU más comunes son:

1. Los diseñadores de UI se han obsesionado con las reglas.
2. La grilla está restringiendo el proceso creativo de los diseñadores de UI.
3. El diseño de la interfaz de usuario se ha estandarizado con patrones.
4. Las tipografías son trágicamente mal interpretadas.
5. El contraste no es una panacea de diseño.

Error común n.°1: los diseñadores de interfaces de usuario se obsesionan con las reglas

El mundo del diseño gráfico siempre ha seguido conjuntos de reglas y estándares. Dentro de las disciplinas de diseño, los errores comunes coinciden estrechamente con una regla estándar que se ha roto. Desde esta perspectiva, las reglas de diseño parecen ser guías confiables.

Sin embargo, en todas las disciplinas del diseño, nuevos movimientos e innovaciones creativas han resultado de romper las reglas conscientemente. Esto es posible porque el diseño es condicional y requiere discreción del diseñador. El diseño no es un proceso con respuestas finitas. Por lo tanto, las reglas de diseño deben considerarse como pautas en lugar de hechos fríos y duros. El diseñador experimentado conoce y respeta el libro de reglas lo suficiente como para poder salir de la caja.

La forma en que se discute el diseño en línea a menudo gira en torno a listas de lo que se debe y lo que no se debe hacer. ¡Domina los 10 sencillos pasos para diseñar la perfección! Desafortunadamente, el diseño requiere una comprensión mucho más sólida de los principios y las tendencias. El camino hacia un buen diseño no se ejecuta a través del cumplimiento sistemático de las listas de verificación.

Curiosamente, si los diseñadores dejan de romper las reglas, entonces no se pueden lograr avances creativos. Si los diseñadores de UI solo desarrollan la capacidad de seguir las directrices en lugar de perfeccionar sus habilidades de toma de decisiones, pueden volverse irrelevantes rápidamente. ¿De qué otra manera podemos argumentar que nuestro trabajo agrega un mayor valor que las plantillas listas para usar?

Ten cuidado con las reglas de diseño del tipo “Top 10”

El problema con las reglas de diseño en el mundo actual del diseño de UI es su abundancia. Si los diseñadores necesitan resolver problemas, simplemente pueden consultar la comunidad de UI existente y su conjunto de soluciones. Sin embargo, la plenitud de estas guías y reglas socava su credibilidad.

Una búsqueda en Google de “Errores de diseño de UI principales” arroja medio millón de resultados. ¿Cuáles son las probabilidades de que la mayoría de estos autores si quiera estén de acuerdo el uno con el otro? ¿Cuál es la probabilidad de que cada consejo de diseño ofrecido coincida con precisión con los problemas de diseño de un lector?

A menudo, los artículos educativos en línea discuten problemas agudos en lugar de los principios rectores de diseño detrás de un problema. El resultado es que los nuevos diseñadores nunca aprenden por qué el diseño funciona de la manera en que lo hace. En cambio, se vuelven dependientes de lo que ha venido antes. ¿No es preocupante que tan pocos de estos artículos fomenten la experimentación de diseño o juego?

Los diseñadores deben recurrir a un conjunto de herramientas de principios rectores en lugar de un libro de reglas predeterminadas y plantillas de diseño. “Presiona x para desplazarse por paralaje e y para carruseles. Antes de elegir, consulta la publicación de blog más reciente en la que la herramienta de navegación está en tendencia”. ¡A-b-u-r-r-i-d-o!

Las sugerencias y las “10 principales” listas siguen las tendencias predecibles

Las tendencias son como comida chatarra para los diseñadores. Siguiéndolos produce soluciones baratas que ofrecen una recuperación inicial pero poco valor a largo plazo. Los diseñadores que siguen la tendencia quedan pasados de moda rápidamente. ¿La recompensa por seguir el camino del diseño de otra persona? Una sensación de roedura de vacío profesional.

Es cierto que trabajar para inventar tus propios estilos y sistemas es un trabajo duro, pero vale la pena el esfuerzo. Las ganancias diarias y los avances son todos tuyos. Hay algo sobre la copia que nunca parece alimentar el alma del diseñador.

Error común n.°2: la cuadrícula restringe el proceso creativo de los diseñadores de interfaces de usuario

A pesar de mi despotricar contra las reglas, aquí hay una: es imposible para un diseñador de UI trabajar sin una grilla. Las interfaces web y móviles se basan fundamentalmente en la organización píxel por píxel; no hay forma de evitarlo.

Sin embargo, esto no significa que los diseñadores de UI solo se esfuercen por tener apariencia de red. Del mismo modo, no hay ninguna razón para que todas las decisiones relacionadas con el diseño se basen en una cuadrícula.

Evita usar la cuadrícula como una herramienta de moda

En general, el diseño en respuesta a las tendencias da como resultado un diseño deficiente. En el mejor de los casos, las tendencias conducen a resultados satisfactorios, pero es casi seguro que el impacto general será decepcionante. Estar a la moda es ser ordinario.

Por lo tanto, cuando emplee una grilla en un diseño, comprenda lo que la grilla tiene que ofrecer como herramienta y lo que podría transmitir. Las grillas generalmente representan la neutralidad ya que todo dentro de las restricciones de una grilla aparece igual.

Las rejillas también permiten una experiencia de navegación imparcial. Los usuarios pueden saltar de un elemento a otro sin ninguna interferencia de la mano curatorial del diseñador. Con otras estructuras de navegación, el diseñador puede ser capaz de agrupar contenido y establecer secuencias deseadas de manera más intencional.

No predeterminar a la cuadrícula como un flujo de trabajo

Dylan Fracareta, docente de la Escuela de Diseño de Rhode Island (RISD) y directora de PIN-UP Magazine, señala que “la mayoría de las personas comienzan con una grilla de 12 columnas…porque puedes obtener 3 y 4 fuera de eso”. El peligro aquí es que los diseñadores inmediatamente predeterminan su trabajo.

Para evitar esto, Fracareta solo usa la herramienta de movimiento con cantidades establecidas, en lugar de colocar físicamente las cosas en una línea de cuadrícula. Esto tiene el doble efecto de establecer el orden y abrir el potencial de resultados inesperados.

Diseñar para el navegador solía significar que íbamos a ingresar código y esperar a ver qué sucedía. Hoy en día, el diseño web es similar al diseño de diseño tradicional, donde el proceso es “más parecido al ajuste de dos hojas de papel transparente”. ¿Cómo podemos nosotros, como diseñadores, beneficiarnos de este proceso?

Aunque las grillas pueden ser restrictivas, son una de nuestras formas más tradicionales de organización. La grilla es intuitiva. La cuadrícula es neutral y sin pretensiones. Las grillas permiten que el contenido hable por sí mismo y que los usuarios naveguen fácilmente por una interfaz. A pesar de mis advertencias sobre la restricción de las grillas, las diferentes matrices permiten distintos niveles de orientación o libertad.

Error común n.°3: el diseño de la interfaz de usuario se ha estandarizado con patrones

El concepto de elementos de diseño estandarizados es anterior al diseño de la interfaz de usuario. Los detalles arquitectónicos se han repetido y aplicado a circunstancias de diseño similares durante siglos. Esta práctica tiene sentido para partes de un edificio que las personas rara vez perciben.

Sin embargo, una vez que los arquitectos estandarizaron los elementos comunes como las dimensiones de los muebles y las alturas de las barandillas, las personas comenzaron a expresar desinterés por los entornos físicos beige que resultaron.

No solo esto, sino que las dimensiones estandarizadas resultaron ser ineficaces. Con base en promedios estadísticos, a menudo fallaron en atender a grandes segmentos de la población. Los detalles repetibles tienen su lugar, pero no deben usarse de manera acrítica.

Los diseñadores no deberían usar patrones como productos

Muchos diseñadores de UI ven los patrones como algo más que una simple herramienta para ahorrar tiempo. Los ven como soluciones listas para usar para problemas de diseño complicados. Los patrones están destinados a estandarizar tareas recurrentes y artefactos para facilitar el trabajo del diseñador. Lamentablemente, ciertos patrones como carruseles, paginación y patrones F se han convertido en la estructura completa de muchas de nuestras interfaces.

¿El patrón de uso es justificable?

Los diseñadores se dicen a sí mismos que el patrón F existe como resultado de la forma en que las personas leen en la web. Espen Brunborg señala que tal vez la gente lea de esta manera como resultado de nuestro uso excesivo del patrón F. “¿De qué sirve tener diseñadores web si todo lo que hacen es seguir la receta?” Brunborg pregunta.

Error común n.°4: las tipografías son trágicamente mal interpretadas

Muchas listas de diseño de “sugerencias rápidas” sugieren reglas duras y rápidas para las fuentes. Cada regla se grita religiosamente, “¡Solo una familia de fuentes! ¡Las fuentes monoespaciadas están muertas! ¡Evita las fuentes delgadas a toda costa!” Esto no es más que aire caliente.

Las únicas reglas legítimas sobre el tipo, el texto y las fuentes se centran en hacer cumplir la legibilidad y transmitir el significado apropiado. Siempre que el texto sea legible, puede haber oportunidades para emplear una variedad de tipos de letra. El diseñador de UI debe asumir la responsabilidad de conocer la historia, los usos y las intenciones de diseño de cada fuente implementada en una interfaz.

La legibilidad de la tipografía: la reina suprema

Las tipografías transmiten significado y afectan la legibilidad. Con toda la discusión sobre las reglas de legibilidad en los dispositivos, los diseñadores olvidan que el tipo está diseñado para imbuir un cuerpo de texto con una sensibilidad estética. La legibilidad es fundamental, esto no debe discutirse, pero realmente debería ser un objetivo obvio. De lo contrario, ¿por qué tendríamos necesidad de algo más allá de Helvetica o Highway Gothic?

Lo importante para recordar es que las fuentes no están diseñadas solo para diferentes contextos de legibilidad. También son esenciales para transmitir el significado y dar a los cuerpos de texto matices de humor.

Evitar las fuentes delgadas a cualquier precio es imprudente

Ahora que la tendencia ha ido y venido, una crítica de diseño común aboga por evitar las fuentes delgadas por completo. ¿Pero necesitamos más regulaciones? ¿No debería el objetivo ser una comprensión más profunda de los principios de diseño que respaldan los tipos de letra?

Algunos diseñadores están convencidos de que las fuentes finas son imposibles de leer o que no son confiables entre los dispositivos. Puntos legítimos Sin embargo, esto representa una condición en la discusión actual del diseño de la interfaz de usuario donde los tipos de letra solo se entienden como una elección técnica relacionada con la legibilidad. Si la legibilidad es la única preocupación del diseño, ¿por qué no desterrar completamente las fuentes delgadas?

Un enfoque más holístico comienza con la comprensión de por qué una fuente delgada podría ser ventajosa y dentro de qué contextos. El texto en negrita y grueso es en realidad mucho más difícil de leer que un texto más delgado. Sin embargo, como las fuentes en negrita tienen más peso visual, son más apropiadas para encabezados o contenido con poco texto.

Las fuentes delgadas a menudo emplean serifas, lo que las hace adecuadas para el texto del cuerpo. ¿Cómo es eso? Los caracteres Serif fluyen juntos cuando se ven en rápida sucesión, lo que los hace más cómodos durante largos períodos de lectura.

Además, las fuentes delgadas a menudo se eligen porque transmiten elegancia. Si un diseñador es contratado para crear una interfaz para un cliente cuyo mandato es la sofisticación visual, sería difícil encontrar un tipo de letra más pesado para hacer el trabajo.

Las fuentes requieren variación para establecer la jerarquía

Un error de diseño de UI común no proporciona la variación adecuada entre las fuentes. Cambiar fuentes es una buena herramienta de navegación que ayuda a establecer una jerarquía visual dentro de una interfaz. En general, los artículos más grandes (o las fuentes más audaces) son los más importantes y tienen el mayor peso visual. La significancia visual ayuda a los usuarios a identificar los títulos de contenido y las funciones que se usan con frecuencia.

Demasiada variación socava la jerarquía

El problema de hacer que cada elección de fuente sea única, especialmente cuando una interfaz contiene muchos tipos de letra, es que nada realmente se destaca. Si cada fuente es diferente, se vuelve difícil para los usuarios reconocer contenido importante o establecer un sentido de orden visual.

Error común n.°5: el contraste no es la cura de diseño

Un hilo común que aparece en muchas listas de “Errores principales” alienta a los diseñadores de UI a evitar las interfaces de bajo contraste. Es cierto que hay muchos casos en los que los diseños de bajo contraste son ilegibles e ineficaces. Sin embargo, mi preocupación, similar a mis puntos sobre fuentes delgadas, es que el uso del lenguaje absoluto conduce a una cultura de diseño homogénea y de alto contraste.

La predeterminación a alto contraste es un descuido

Las imágenes de alto contraste son innegablemente estimulantes y emocionantes. Sin embargo, hay muchos más estados dentro del rango emocional humano que vale la pena transmitir. Ser visualmente estimulante también puede ser visualmente seguro.

Tomemos, por ejemplo, toda la industria de la película contemporánea de ciencia ficción. Parece que todas las producciones han recurrido a imágenes en negro y azul neón como una forma de engañar a los espectadores para que se emocionen. ¿No sería más efectivo entrelazar narrativas con imágenes de contraste alto y bajo que provocan un alcance más amplio de respuestas emocionales?

Funcionalmente, si cada elemento en una interfaz está en alto contraste con otro, entonces nada se destaca. Esto derrota el valor potencial del contraste como una herramienta jerárquica. Considerar diferentes movimientos de diseño como herramientas, en lugar de reglas, es esencial para evitar el diseño estancado y moderno.

Conclusión

En el mejor de los casos, las reglas de diseño son guías. Brindan seguridad en la toma de decisiones y advierten a los diseñadores sobre los peligros de las elecciones irreflexivas.

Por el contrario, las reglas de diseño no son leyes. No son irrompibles, y ciertamente no merecen nuestra rendición indiscutible. De hecho, las reglas de diseño, cuando se siguen imprudentemente, pueden convertirse en muletas graves que debilitan nuestra capacidad para resolver problemas de forma creativa.

Los diseñadores no son científicos. No estamos obligados a proporcionar evidencia empírica para cada decisión estética que hacemos. Es cierto que nuestra profesión es una de juicios deliberados y de proceso, pero hay espacio para el instinto y el ingenio. De hecho, nuestra capacidad para ayudar a nuestros clientes a destacar en un mundo desordenado de contenido de moda depende de nuestra voluntad de imaginar nuevas posibilidades.

Debemos experimentar Debemos jugar.

Las reglas de diseño existen para ser aprovechadas para una ventaja visual. Pueden estar doblados, incluso rotos, pero nunca deben seguirse ciegamente.