7 Equilibrar la forma y la función

El diseño no es sólo cómo se ve, sino también cómo funciona. Equilibrar de manera inteligente esas dos mentalidades es el santo grial del arte de un diseñador.

¿Y si te decimos que ambos lados de su cerebro son igualmente valiosos como diseñador?

Objetivo

Explorar los conceptos básicos del diseño gráfico y cómo se traducen a los productos digitales.

Empecemos por romper el mito de que el diseño sólo se trata de hacer cosas bonitas. Dada la naturaleza del medio con el que jugamos, en el diseño de productos digitales la mayor parte de nuestro esfuerzo se centra en averiguar la lógica detrás de una interfaz: cómo funcionan las cosas entre bastidores, cómo los usuarios navegan a través de la experiencia, cómo el sistema de diseño que estamos creando escala a través de varios casos de uso y escenarios. Una gran parte de nuestro día se pasa usando el lado racional de nuestros cerebros y pensando en cómo hacer que funcionen las interacciones de manera refinada.

También queremos que nuestros productos se vean hermosos y simples. Sabemos que la estética juega un papel esencial en la forma en que la gente percibe una experiencia, y por consiguiente, una marca. Visuales limpios, jerarquía tipográfica bien definida, estructura de páginas armónica, son algunos de los ingredientes que un diseñador puede utilizar para construir un producto visualmente equilibrado. Además, con el uso correcto del color, las imágenes y el movimiento, los diseñadores pueden crear productos que evoquen diferentes respuestas emocionales de los usuarios.

Este acto de equilibrio entre la función (usabilidad) y la forma (estética) es una de las partes más desafiantes y gratificantes de ser un diseñador digital. Escucharás mucho sobre esto. En algunas empresas, esas dos mentalidades están separadas, y terminamos viendo a dos profesionales diferentes mirando a cada lado de este tema; mientras que el Diseñador UX (o Diseñador de Interacción) está más enfocado en la función, el Diseñador Visual (o Diseñador de UI, o Diseñador de Marca) está más enfocado en la forma. En otras compañías veremos a un profesional siendo responsable de ambos. La realidad es que la forma y la función no pueden estar separadas. Mientras que algunas personas podrían estar más enfocadas en un lado del espectro, como diseñador necesitas entender y continuar evolucionando en ambos.

“La información sólo es útil cuando puede ser comprendida”. Muriel Cooper

El Diseño Gráfico puede definirse como el proceso de comunicación visual y de resolución de problemas mediante el uso de la tipografía, la fotografía, la iconografía y la ilustración. Está en todas partes a nuestro alrededor. En la portada del libro que guardas junto a la cama. En la etiqueta de la botella de jugo de naranja que tomaste para el desayuno. En los pósters de las películas que guardas en la pared de tu salón. En las ilustraciones de este sitio web. Crear cosas visualmente atractivas, provocar emociones y contar historias a través del diseño es un concepto que ha existido desde los orígenes de la humanidad.

Las cualidades de lo que se considera visualmente convincente han cambiado bastante drásticamente a lo largo de la historia. Si haces clic en las aplicaciones que tienes instaladas en tu teléfono, notarás que cuando se trata de diseño de productos digitales, los diseñadores han seguido un espectro bastante estrecho de estilos visuales. Incluso dentro de ese estrecho estilo, vemos que las tendencias visuales específicas van y vienen, año tras año.

“Los estilos vienen y van. El buen diseño es un lenguaje, no un estilo.” Massimo Vignelli

Será muy importante para ti, como diseñador, estudiar la historia del arte, así como la historia del diseño gráfico. Más importante que memorizar los nombres y las fechas de los movimientos artísticos es entender lo que representaban en su época. La mayoría de las veces, los artefactos de arte y diseño (ya sea una pintura, un póster, una escultura, un edificio) son un mensaje que el creador envía sobre cómo ven la vida, la sociedad o la política.

Puede que hayas oído hablar del Modernismo, un movimiento artístico que se desarrolló a principios del siglo XX y que se opuso a la excesiva ornamentación de los estilos anteriores. O la Bauhaus, una escuela de arte alemana que pretendía unificar los principios de la producción en masa con la visión artística individual, fusionando la estética agradable con la función cotidiana. Muchos de los principios de trabajo y diseño definidos durante ese período aún influyen en los productos digitales que vemos hoy en día. Comprender el pasado es importante para ayudarnos a crear lo que viene: ¿cuáles son los principios que vale la pena mantener y de los que tenemos que alejarnos para llegar a un lugar mejor como sociedad?

Estudiar los principios fundamentales de nuestra disciplina, en lugar de saltar demasiado rápido a las mejores prácticas y tendencias de la interfaz de usuario (UI), te asegurará el estar construyendo habilidades que pueden durar más que unos pocos meses. Nuestra lista de lecturas a continuación es sólo un punto de partida, pero siéntete libre de explorar más a fondo cada uno de estos conceptos introductorios a medida que encuentres los que más le entusiasmen.

Lista de lectura

• Universal Principles of Design — Clear explanations of foundational design principles featured with visual examples applied in practice. By William Lidwell, Jill Butler, Kritina Holden.
• Refactoring UI — How to design beautiful interfaces using specific tactics explained from a developer’s point-of-view. By Adam Wathan, Steve Schoger. Borrow these books from local public libraries or buy from local bookstores.
• Graphic design history — Encyclopædia Britannica (35 min)
• Why the Bauhaus lives on as the most influential school of art and design — Michelle Chiu (5 min)
• The fundamentals behind visual hierarchy — Pascal Potvin (9 min)
• The power of visual in product design — Jonny Czar (10 min)
• Laws of UX Jon Yablonski (25 min)
• The ultimate guide to proper use of animation in UX — Taras Skytskyi (11 min)
• Designercize

Lista de reproducción

• Design is one: Lella & Massimo Vignelli — Kathy Brew & Roberto Guerra
• Dieter Rams — a brave new world of product design — Victoria and Albert Museum
• Designing meaningful animation — Val Head
• 100 years of Bauhaus — BBC

Reflexión

¿Cuál fue el principio de diseño que más te sorprendió? ¿Cómo se aplica ese principio a algunos de los productos que usas a diario?

Verlo en la práctica

El secreto para perfeccionar nuestras habilidades de interfaz de usuario es aprender de todas partes. Cuantas más técnicas y repertorio tengamos, más fácil será transmitir nuestras ideas y soluciones en las interfaces. Miralo en la práctica con casos de estudio de otros diseñadores que están empezando sus carreras, observa los recorridos de rediseño y lee cómo empresas como Slack abordan sus grandes proyectos de interfaz haciendo que sus usuarios se involucren.

Para aprender diseño visual, necesitas practicar. Intenta reconstruir las interfaces de las aplicaciones que te gustan en la herramienta de diseño que elijas y aprovecha esta oportunidad para aprender también cómo funciona la herramienta. Hay muchas plantillas de diseño y guías para copiar, experimentar y sobre las que construir encima.