Antes de que puedas dominar el diseño, primero debes dominar los fundamentos

La semana pasada, uno de mis lectores envió una pregunta: ¿Cómo me convierto en un mejor diseñador visual?

Mientras pensaba en cómo responder a esta pregunta, mi mente se desvió hacia mi experiencia con el aprendizaje del chino mandarín. Recientemente, decidí enseñarme mandarín. Cuando se trata de aprender un nuevo idioma, primero debes comenzar con los fundamentos. Los sustantivos, pronombres y verbos forman la base para transmitir ideas más complejas.

El lenguaje es una forma en que las personas comunican conceptos entre sí. El diseño visual es un lenguaje visual. Y aprender diseño visual no es diferente de aprender un nuevo idioma.

Los buenos diseños visuales no nacen. Ellos estan hechos. La clave para convertirse en un mejor diseñador visual es el rigor. Solo mejorarás como diseñador visual si haces un esfuerzo consciente.

Aquí hay algunos fundamentos que debes dominar para que puedas llevar tu diseño visual al siguiente nivel.

Fundamental # 1: regrese a lo básico con tipo

Puedes decir mucho sobre un diseñador mirando su tipografía. Esto se debe a que el tipo es una base fundamental para el diseño.

Escribir como imágenes

Puede crear diseños completos con solo escribir. También puede basar los diseños en el tipo, tomando colas sutiles de las fuentes que elija. Para mejorar la tipografía en sus diseños, primero comience por aprender los conceptos básicos.

Desarrolle un vocabulario para describir el tipo. Conozca qué significan términos como seguimiento, interletraje y liderazgo. El artículo Un glosario bellamente ilustrado de términos tipográficos que debe conocer es un excelente recurso visual para aprender esos términos.

Luego, si desea una comprensión integral de cómo aplicar la tipografía a la web, lea Tipografía web: los elementos del estilo tipográfico aplicado a la web.

El emparejamiento de fuentes puede hacer o deshacer un diseño

Finalmente, aprenda a emparejar fuentes. Un gran recurso para esto es FontWolf y FontPair. Ser capaz de emparejar fuentes juntas cambiará drásticamente la dinámica de su diseño.

Para una exploración más profunda de la tipografía, puede leer mi artículo: La tipografía puede hacer su diseño ... o romperlo.

Fundamental # 2: usa el espacio para crear equilibrio

El espaciado ayuda a establecer movimientos verticales y horizontales en sus diseños. Es fundamental para crear jerarquía visual y formar asociaciones entre elementos.

Crea equilibrio y armonía visual

Siempre puedes mirar sitios como Behance y Dribbble para inspirarte en cómo espaciar elementos. Pero es importante desarrollar su propia intuición para usar el espacio para crear equilibrio y armonía visual.

Al estudiar la tipografía, es posible que haya notado la importancia del espacio entre los tipos. Ajustar el interletraje y guiar las fuentes es un gran ejercicio para desarrollar su ojo para el espaciado. Por esta razón, le recomiendo que pruebe KernType, un juego en el que compara su solución de interletraje con la solución de un tipógrafo.

Simplificación del galardonado póster de Craig Welsh

Otro ejercicio que ayudará a desarrollar su ojo es el siguiente: tome un diseño existente, dibuje un eje xey, simplifique el diseño en formas básicas, analice cómo se equilibra el diseño y luego reorganice los elementos. Presta mucha atención a cómo el espacio negativo afecta el equilibrio de los elementos.

Fundamental # 3: use el tamaño para establecer la jerarquía visual

Cuando se trata de crear una jerarquía visual, el tamaño es insuperable. Al usar el tamaño para transmitir relaciones visuales entre elementos, puede establecer el flujo.

El dimensionamiento es una de las razones por las que las cuadrículas son útiles.

El dimensionamiento es una de las razones por las cuales las cuadrículas son útiles. Puede usar cuadrículas para ayudarlo a dimensionar elementos usando proporciones para transmitir importancia.

Una vez que haya determinado el tamaño de un elemento, manténgalo igual en todas las instancias del mismo. En diseño, la consistencia es el rey.

Usa el tamaño para establecer la jerarquía visual

Aquí hay un ejercicio que ayudará a desarrollar su ojo para el tamaño.

La clave es pedir comentarios.

Dibuja o traza una página de aterrizaje. Luego pídale a un amigo que mire su diseño. Haz que circulen los elementos que más se destacan. Luego, haga que numeren los elementos marcados con un círculo en función del peso visual. ¿Son los resultados lo que esperabas?

Al hacer este ejercicio, tenga en cuenta las siguientes preguntas:

  • ¿Cuál es el objetivo de conversión de la página de destino? ¿Cómo puede optimizar para alcanzar su objetivo?
  • ¿Cuál es la relación entre los diferentes elementos? ¿Qué elementos quieres enfatizar?
  • ¿Su diseño guía con éxito la mirada de un usuario a través de la página?

Fundamental # 4: Usa el color para transmitir significado

El color juega muchos papeles. Transmite significado, crea resonancia emocional y aporta unidad a los diseños.

El color ayuda a transmitir significado en el diseño

Para una inmersión profunda en el color, puede leer mi artículo Diseño en color. Aquí hay algunos puntos clave del artículo.

  • Identifique el propósito de su diseño antes de elegir una paleta de colores. Un buen diseño alinea su paleta de colores con su propósito.
  • Identifica a tu audiencia. Las personas perciben los colores de manera diferente. Los colores tienen diferentes efectos sobre las personas en función de sus preferencias personales, educación cultural y experiencias.
  • Al elegir una paleta de colores, la simplicidad es clave. Elige un color de fondo neutro. Luego elija un color de acento primario y secundario. Finalmente, en función de sus otros colores, elija un color de error y éxito para sus diferentes estados de IU.

Una vez que tenga una buena comprensión de los conceptos básicos de la teoría del color, el color se reduce a la experimentación y la iteración. Intenta activamente salir de tu zona de confort y probar nuevas paletas de colores.

Las películas y los espectáculos son una gran fuente de inspiración para el color.

Aquí hay un ejercicio que ayudará a desarrollar su ojo para el color.

Pase tiempo compilando paletas de colores para cosas a su alrededor, como fotografías, revistas y sus programas favoritos. Luego tome un diseño existente y aplique nuevas paletas de colores.

Tome nota de cómo cambia el estado de ánimo y el tono del diseño. ¿Cambia también el significado?

Trate su trabajo como un oficio, ya que siempre hay algo que puede mejorar. Confíe en usted mismo para ser la motivación para convertirse en un mejor diseñador.

¿Cuáles son sus estrategias para mejorar como diseñador? Déjame una nota o envíame un tweet en Twitter.

Si te ha gustado este artículo, también puedes disfrutar de CSS en Javascript con Aphrodite, una biblioteca de Khan Academy.

Puedes encontrarme en Medium donde publico todas las semanas. O puede seguirme en Twitter, donde publico divagaciones no sensoriales sobre diseño, desarrollo front-end y realidad virtual.

PD Si disfrutaste este artículo, significaría mucho si haces clic en y lo compartes con amigos.