Introducción al diseño | LevelZero By Game of Apps | Skillshare

Velocidad de reproducción


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Introducción al diseño

teacher avatar LevelZero By Game of Apps

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Lecciones en esta clase

    • 1.

      Capítulo 0 - Introducción

      1:55

    • 2.

      Capítulo 1

      10:43

    • 3.

      Capítulo 2 Elementos del diseño

      6:11

    • 4.

      Capítulo 3

      9:05

    • 5.

      Capítulo 4 - Principios del diseño

      7:09

    • 6.

      Capítulo 5 - Sistemas de rejilla

      7:01

    • 7.

      Capítulo 6 - Diseños y composiciones

      10:32

    • 8.

      Capítulo 7 - Iconos e imágenes

      7:39

    • 9.

      Capítulo 8

      4:35

  • --
  • Nivel principiante
  • Nivel intermedio
  • Nivel avanzado
  • Todos los niveles

Generado por la comunidad

El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.

41

Estudiantes

--

Proyectos

Acerca de esta clase

ACERCA DE ESTA CLASE

Aprende las bases del diseño, sumergiéndote en la historia, la teoría y la aplicación para ganar confianza y desarrollar tus habilidades de diseño.

Conoce a tu profesor(a)

Game of Apps is an after-school program where professional software designers and developers teach and mentor students weekly as they build their own app. Its goal is to empower students with practical and life skills to help them succeed in 21st century careers.

Ver perfil completo

Level: Beginner

Valoración de la clase

¿Se cumplieron las expectativas?
    ¡Superadas!
  • 0%
  • 0%
  • Un poco
  • 0%
  • No realmente
  • 0%

¿Por qué unirse a Skillshare?

Mira las galardonadas Skillshare Originals

Cada clase tiene lecciones cortas y proyectos prácticos

Tu membresía apoya a los profesores de Skillshare

Aprende desde cualquier lugar

Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.

Transcripciones

1. Capítulo 0 - Introducción: Hola a todos, Bienvenidos al nivel-0, Introducción al Diseño. Estamos muy emocionados de tenerte aquí. Sí, soy Janice y seré una de tus instructoras de diseño enseñándote todas las teorías en diseño. Y yo soy Leah, soy tu otra instructora de diseño. Te estaré enseñando a tomar las teorías y fundamentos del diseño que aprendas y aplicarlo en la práctica. Por lo que algunos de los temas que estaremos cubriendo en este curso incluyen los fundamentos en diseño, los principios para aplicar los fundamentos. Y por último, poniéndolo en conjunto, tenemos un montón de contenido realmente divertido y emocionante para que aprendas en este curso. Nos vemos a todos en los próximos capítulos. Antes de adentrarnos en los temas del diseño, entendamos qué es el diseño y por qué debemos preocuparnos por él. El diseño se puede encontrar a nuestro alrededor y viene en muchas formas. Desde aplicaciones telefónicas hasta autos eléctricos, carteles impresos hasta carteleras digitales. Los efectos del diseño se pueden encontrar en todas partes. Cuando hablamos de diseño, la imagen que a menudo nos viene a la mente es aquella que se centra en gran medida en las miradas, pero es más que eso. A menudo vemos la salida visual cada vez que la entrada y lo que sucede en el medio. En pocas palabras, el diseño crea valor a través un proceso continuo de identificación de los problemas y refinamiento de las soluciones a los mismos. La mayoría de las cosas que usamos en la vida están diseñadas con intención. Al igual que la silla en la que puede estar sentado. El diseñador ha considerado cuidadosamente cómo y quién los puede estar usando a la hora de diseñar. Observe cómo cambia la silla dependiendo de la habitación en la que se esté utilizando. No obstante, no te asustes de inmediato. No tienes que ser un artista increíble o necesitas saber dibujarlo para ser diseñador. Pero sí hay que ser curioso y hacer preguntas para resolver los problemas correctos. Estén atentos para más. 2. Capítulo 1: Así que cada vez que pensamos en el diseño, normalmente pensamos en formas jerga y agregar color para hacer algo bonito. Pero en realidad empieza con algo más simple que eso. Y eso son las letras. Para esta lección, vamos a empezar con entender qué son las letras, cómo mirarlas, y cómo usarlas correctamente. Cuando descargamos una nueva fuente, normalmente hay un montón de archivos dentro de un paquete. ¿ Por qué son tantos archivos? Echemos un vistazo a por qué y qué significan todos esos archivos. Antes de instalar un archivo, normalmente buscaríamos Google y buscaríamos algo agradable de usar. Pero la cosa es que cuando decimos que queremos instalar un archivo, en realidad nos estamos refiriendo a una tipografía. El problema aquí es que los dos términos ahora se usan indistintamente. Entonces, ¿cuál es la diferencia entre ellos? Cuando descargamos el paquete, un montón de esos archivos tienen tamaños y pesos específicos de las tipografías. Y así usamos bonos al referirnos a cada uno de esos biles, pero todos pertenecen a la misma familia tipográfica. Por ejemplo, Times New Roman es una tipografía, pero a los 12 Times New Roman regular es una fuente y un perno Times New Roman de 10 puntos es otra fuente. Por qué tenemos estas dos diferencias es que en los tiempos antiguos, cuando la impresión de cartas seguía siendo un proceso manual, teníamos que buscar individualmente los bloques de letras con un tamaño muy particular, peso y estilo para hacer el trabajo. Ojalá esto despeje cierta confusión y avanzando, nos estaremos refiriendo a cualquier cosa que tenga que ver con los textos como tipo o tipografía. Con eso en mente, profundicemos en cómo los textos pueden ser efectivos en el diseño. Por lo que cada vez que aprendemos un nuevo idioma, generalmente no pensamos en la historia detrás de ellos. Entonces retrocedamos en el tiempo y veamos cómo las letras se desarrollaron a la forma en que lo usamos hoy en día. Antes de llegar a la letra puntos que vemos hoy, las cartas solían ser simplemente pinturas rupestres en forma de pictogramas que datan del 20 mil aC. A medida que crecía la necesidad de transmitir ideas complejas, las impulsiones se convirtieron en símbolos para representar cosas como sonidos, objetos e ideas. Y entonces los griegos comenzaron a abstraer aún más las imágenes. Y entonces los romanos hicieron refinamientos a lo que hoy conocemos como el alfabeto. Al entrar en la Edad Media, alrededor del siglo V y finales del XV, hubo un fuerte enfoque y manuscritos manuscritos que inspiraron algunas de las tipografías altamente decorativas que utilizamos hoy. ¿ Sabías que en el momento en que las impresoras eran inexistentes, realidad se contrataban escribas para replicar libros escribiendo carta, por carta a la vez. Eso tardaría al menos dos semanas en completar un libro. Por suerte, para acelerar el proceso, inventó la máquina de prensa de cartas. A pesar de que los chinos habían inventado al principio, la tecnología tipográfica no podía escalar fácilmente hasta los masivos 50 mil caracteres en el idioma chino. Sin embargo, te dirigirás ya que Gutenberg acreditado por ello porque era más fácil implementar esta tecnología en un lenguaje basado en latín de 26 caracteres. desarrollo de Gutenberg en el siglo XV se convirtió en un cambio de vida para cultura occidental porque todo lo que se necesitaba era crear un montón de letras , amortiguar, arreglarlas, conseguirlas entintadas y entonces el contenido obtiene el llamado imprimirlo. También fue alrededor de esta época cuando se creó el término fuente y tipografía para que la gente pueda encontrar los sellos correctos estado de vuelta. Los sellos también se almacenaron en una configuración de puerta superior e inferior. Es así como surgieron los términos en mayúscula y minúscula. medida que nos adentramos en la era moderna, Amedida que nos adentramos en la era moderna, desarrollamos máquinas más pequeñas y portátiles como la máquina de escribir y poco después las computadoras y teclados que usamos hoy en día. Mirando hacia atrás en la primera existencia de la comunicación escrita a la forma en que usamos las letras. Ahora, podemos ver que el desarrollo fue muy influenciado por los avances tecnológicos y los cambios en la cultura. Esa fue sólo una breve historia a tiempo. Si quieres saber más, echa un vistazo a internet. Al igual que cómo tenemos términos para describir diferentes partes de un animal. Tenemos términos para describir las letras también. Averiguemos cuáles son algunos de ellos para que sepamos qué buscar a la hora de elegir una tipografía. Las letras se construyen usando trazos. A los curvos se les llama cuenco y para aguantar todo, tenemos un tallo. Como aprendimos en las lecciones de historia. Las letras se derivan de los dibujos de los humanos. Es por eso que los nombres de los trazos llevan el nombre de las partes del cuerpo como i, yr, brazo, hombro, pierna y columna vertebral. En ocasiones podemos encontrar letras con algunos elementos decorativos llamados la Sarah y los extremos de la carta sin una Sarah se llama terminal. Todas las letras entonces se sientan en una línea invisible llamada línea de base, modo que haya un fuerte punto de anclaje para colocarlas. La altura de una letra es máxima a la altura de la tapa, y todas las letras se miden usando la altura x porque la letra X tiene un corte muy claro en la parte superior e inferior. Ahora podemos usar estos términos para describir diferentes estilos de letras. Imagina que tenemos que diseñar un nuevo sitio web para una empresa. Pasemos por el proceso de elección de tipos de letra para este proyecto. primero es lo primero, necesitaremos entender lo que ofrece nuestra empresa y la personalidad de nuestra empresa. Digamos que somos una empresa que vende muebles modernos hechos a mano. Es posible que ya tengas algunas imágenes en tu mente, y algunas de ellas pueden ser elegancia, a medida y simplicidad. Con eso en mente, una opción es utilizar una tipografía sans serif para nuestro sitio web. El motivo es que suelen transmitir un enfoque más moderno. Típicamente con los textos corporales, usaremos el peso regular, pero a veces podemos usar cursiva como una forma de agregar énfasis. Entonces podemos emparejar ese sitio web con una tipografía serif porque a veces son más difíciles de renderizar bien digitalmente, podemos usarlos en textos más grandes como títulos y encabezados. Las tipografías Serif suelen tener cualidades manuscritas con su alto contraste en trazos finos y gruesos. Su uso puede ayudarnos a comunicar el aspecto artesanal de nuestra marca. partir de ello, las tipografías a menudo parecen ser más delgadas en pantalla, también podemos usar una forma audaz para hacer que los titulares sean más fáciles de escanear. Después de eso, podemos optar por crear un tipo de logotipo usando una tipografía decorativa. Este tipo de tipografía generalmente se hace como una sola vez porque están especialmente elaborados y pueden crear resultados bastante dramáticos para destacar entre la multitud. Entonces, para informar a la gente que estamos lanzando nuestra empresa, podemos usar una tipografía con guión. Tener esta tipografía utilizada como invitación o banner en la parte superior del sitio web. Hace que se sienta más personal como si estuviera escrito a mano para un evento especial. Todo lo que necesitas es identificar el estado de ánimo que quieres transmitir e ir a partir de ahí. Ahora que hemos seleccionado la tipografía para nuestro sitio web, el siguiente paso es ponerlas juntas. Esto es malo. Tenemos que hacer que el texto sea legible y legible, lo contrario, nadie querría comprar nuestros muebles. Lo hacemos creando una buena jerarquía visual para que la gente sepa qué mirar primero. Una de las formas de lograr la jerarquía es utilizar una forma diferente para crear énfasis. Por ejemplo, un título de boulder. Sin embargo, es importante no falsificar los pernos delineando la tipografía original con un trazo negro y especialmente no delinear los textos con un trazo de color. Algo que sin duda parecerá sospechoso. En cambio, busca una tipografía que tenga una forma negra de darte algo más grueso. A continuación te presentamos algunos ejemplos. Tenemos versiones condensadas y extendidas ligeras también, por lo que no necesitamos de tipo squish o squash. También podemos emparejar tipos de letra. En nuestro proyecto, usaremos una Sarah para los titulares y dice era para los párrafos. Las otras dos formas de prototipar es o bien tener todos ellos de la misma familia se combinan a Sarah juntos o dos sensores juntos. Más que eso es un gran no-no, ya que crea confusión para el lector. Ya que tenemos algunos títulos y párrafos, podemos jugar con el tamaño haciendo que el título sea más grande y el párrafo más pequeño. Otras formas de lograr la jerarquía es un espaciamiento de regalo entre los titulares y los párrafos o ajustar su posición sangrándolos. También podemos cambiar la orientación del título para enfocar los párrafos en lugar de los títulos. Pero no intentes alinear verticalmente cada letra. Simplemente resultará verse realmente incómodo. Así que gira toda la línea de base en su lugar. Alternativamente, podemos llamar la atención sobre el texto cambiando su color o tonos de valor para darle contraste. Por lo que esos se leerán primero. Mirando los títulos y párrafos. Existen otros tratamientos de textos a los que prestar atención. Por ejemplo, si ponemos los títulos en mayúsculas, se perciben como un montón de bloques rectangulares y son mucho más difíciles de leer. En cambio, al mezclar los casos, dar más formas a las palabras y se vuelven mucho más fáciles de escanear. Para frases y párrafos. Trate de no tener largas longitudes de línea ya sus ojos necesitarán viajar mucho hacia adelante y hacia atrás. Generalmente, se guardan en cualquier lugar de 45 a 80 caracteres para ser leídos en Comfort. Otro tipo de higiene es no apilar dos de la misma palabra uno encima del otro en un párrafo. En situaciones como esta, podemos reformular el contenido o hacer ajustes al tipo para evitar la torpeza. Algunas notas finales. Mantenga el naufragio relativamente vertical y no señale palabras u oraciones cortas al final o al principio de un párrafo. Trabajar con el tipo puede ser un reto, pero estas pautas pueden ayudarnos a mantenernos en el buen camino. Entonces pruébalos. En tus próximos proyectos. Solo hemos arañado la superficie de la tipografía desde su historia, dos terminologías y casos de uso. Sal y explora cómo se usa el tipo a nuestro alrededor. 3. Capítulo 2 Elementos del diseño: Los grandes diseños no suceden por arte de magia. Los diseñadores deben considerar cuidadosamente cómo organizar el tipo y los elementos visuales de línea, forma, espacio, color y textura. En este capítulo, vamos a ver cómo cada uno de estos elementos puede tener un impacto en el diseño. Mientras esperamos el despegue del demandante, podemos agarrar el cargador en la bolsa delantera para buscar cualquier entretenimiento a bordo disponible. Pero, ¿cómo están diseñadas las revistas para ayudarnos a encontrar lo que queremos? Una forma es usar líneas. Entonces empecemos con eso. Al pasar las páginas de la revista, notaremos que hay muchas líneas reales utilizadas para decorar la página. Pero también hay muchas líneas abstractas, como las líneas de textos y líneas principales que se encuentran en las imágenes. Se pueden usar líneas reales para anclar contenido importante para ser leído primero, como títulos o párrafos que vemos en la revista. Tanto las líneas reales como las abstractas pueden proporcionar una ilusión de dirección y ritmo. Nos informan por dónde empezar a leer y qué tan rápido se mueven nuestros ojos por la página a los siguientes elementos. Dependiendo del estilo de las líneas que usen, pueden transmitir ciertos estados de ánimo, tal manera que los ángulos agudos pueden parecer agresivos y peligrosos mientras que las líneas fluidas se sienten más amigables y acogedoras. De igual manera, los trazos delgados son vistos como más delicados que los trazos gruesos. También vienen en formato guión, punteado o texturizado. Ya que las líneas tienen muchas características que se pueden utilizar como decoración o ayudarnos a navegar por una página. Por lo que úsalos con precaución para evitar cualquier desorientación visual. Vimos cómo las líneas pueden realzar e informarnos cómo leer una revista. Así que tomémonos el tiempo ahora para ver cómo las formas pueden dar efectos similares. En las páginas, a menudo encontraríamos las tres formas geométricas de triángulo, rectángulo y círculo. Y cada uno de estos sirve a un propósito. rectángulos se utilizan típicamente para enmarcar imágenes, mientras que los triángulos pueden proporcionar una sensación de movimiento, y los círculos se utilizan para crear contraste entre las formas con bordes duros modo que sea más agradable a los ojos. En ocasiones veremos formas básicas que han sido modificadas para hacer que la página se vea más dinámica. Por ejemplo, un diseñador puede redondear las esquinas para hacer una página más acogedora, sesgarlas para darle una sensación de velocidad o rotarlas completamente para alterar su forma original. También hay momentos en los que se usan formas orgánicas en una página. Definitivamente los veremos en las imágenes. Pero las formas orgánicas pueden ser elementos gráficos que hacen que la página se vea más fluida con estas formas irregulares. Las formas pueden tomar muchas formas diferentes en 2D y 3D. Así que pruébalos para expresar diferentes emociones en el diseño. A medida que seguimos dando vuelta a la página en la revista, tendemos a centrarnos en los elementos gráficos en lugar de los espacios en blanco alrededor de la página. Averigüemos por qué es eso y cómo espacio puede jugar un papel en el diseño. La razón por la que nos atraen los textos y elementos gráficos es porque crean un área de intereses a través del espacio positivo, mientras que el fondo blanco reside como espacio negativo. se le diera más espacio a un objeto sobre el resto, gravitaríamos hacia ese único objeto porque tiene un peso más pesado y no compite con el resto de los artículos. Si tuviéramos que distribuir uniformemente el espacio, la página puede verse más ordenada. Por otro lado, al dispersar el contenido, podemos crear una sensación de caos o de diversión. Si no hay espacios Dado, a menudo encontramos que el contenido se siente un poco calambre y puede ser difícil de leer. También podemos lograr un espacio tridimensional apilando contenido uno encima del otro, como agregar formas y texto encima de una imagen de fondo. El espacio juega un papel importante permitir que nuestros ojos se reproduzcan. Entonces realmente no hay necesidad de tratar atascar todo en una sola página. A medida que continuamos en las próximas páginas tenemos fotos e ilustraciones enfatizando en los materiales. Veamos cómo las texturas pueden afectar nuestros diseños. En primer lugar, podemos discernir texturas en una revista impresa por la identidad y orientación espacial que desprenden. Sabemos que el pasto es pasto por las líneas y formas que crea. También podemos sentir texturas en una foto a partir de cualidades táctiles como duras y suaves, rugosas y lisas, brillantes y mate, y muchas más. A través de la foto, podemos ver muchas cualidades reales de textura, como la arena suave en una playa. Pero la misma imagen en forma de ilustración nos dará cualidades implícitas de cómo percibimos la textura. Cuando se usan correctamente, las texturas no solo son visualmente atractivas, sino que pueden agregar profundidad a nuestros diseños. El último elemento visual que ves mientras navegas por una revista es el uso del color. Entraremos en detalle en una lección por separado, pero aquí hay algunas cosas que el color puede hacer. Los colores utilizados en una revista de viajes nos hacen querer ir a esos destinos. También se pueden agregar a elementos gráficos como formas y textos para dar atención a áreas específicas de contenido. La clave es usarlos con moderación, porque como todas las cosas, uso excesivo de colores puede crear desorden visual, lo que hace que sea muy difícil de leer. No siempre necesitamos agregar color en nuestro diseño, y pueden elevar o restar experiencia a un lector. Volveremos esto en una lección posterior. De acuerdo, pasamos por los cinco elementos del diseño y aprendemos que pueden ser utilizados tanto como guía como decoración. ver si puedes detectar alguno de estos elementos en juego. La próxima vez que veas algo que se ha diseñado, como edificios, empaques y actos. 4. Capítulo 3: Tomamos decisiones de color todos los días desde recoger la ropa para usar hasta decorar nuestra casa. Pero, ¿alguna vez te has parado a preguntarte de dónde vinieron los colores y cómo nos impactan? En este segmento, cubriremos los aspectos científicos del color, las terminologías, las teorías en psicología. Por lo que sabemos elegir y emparejarlos. A menudo no le damos mucha importancia a la hora elegir un color para aplicar en nuestro diseño. Pero en realidad hay algo de ciencia detrás de los colores disponibles para nosotros hoy en día. Averigüemos cómo se descubrieron los colores y cómo se organizan. Los colores solían existir meramente como teoría en el pasado. No fue hasta el siglo XVII cuando Sir Isaac Newton demostró que el color existe en la luz. En su experimento, levantó un prisma de vidrio a la luz del sol y pensó que la luz blanca se dividió en un arco iris. En otro experimento, pintó los colores que vio en un disco. Y cuando lo hizo girar, se dio cuenta de que todos los colores se difuminaban de nuevo en qué? Y así conseguimos colores y la famosa rueda de colores. Para crear la rueda de colores, hay dos formas de mezclar colores dependiendo del medio. En el mundo físico, utilizamos un modelo de color sustractivo para que cuantos más colores añadamos, más oscuro se vuelve. Sin embargo, en el mundo digital, utilizamos un modelo de color aditivo. Cuantos más colores sean claros agregamos, más claro se pone. Partimos de los colores primarios rojo, amarillo y azul, porque son los colores base que no se pueden producir mezclando otros colores en el mundo físico. En una pantalla digital, sin embargo, los colores primarios son rojo, verde y azul. Después de mezclar los colores primarios, obtenemos colores secundarios, que son naranja, verde y morado en físico y cian, magenta y amarillo en digital. Por último, cuando empezamos a mezclar colores primarios y secundarios, obtenemos el resto de colores en la rueda. Dicen que el descubrimiento de Newton, ahora tenemos la rueda de colores a la que hacer referencia a la hora de elegir colores para nuestras necesidades. Y conociendo los conceptos básicos del color, podemos entonces mirar en los efectos que crean. La mayoría de la gente sería capaz de señalar un color e identificarlo. Pero hay más de siete colores del arco iris y necesitamos formas de describirlos. Por qué no te presentamos algunos de los términos para que puedas entender cómo explicarlos. En primer lugar, describimos el color en función de su tonalidad. Podríamos llamarlo color azul, pero hay un costo específico asociado a cada azul y difieren en función del medio. Esto nos permite referirnos al exactamente cuándo se usa en impresión o en pantalla. Una vez que elegimos un aquí que queremos usar, podemos ajustar la saturación para que un color se vea más pálido o vívido. Otro cambio que podemos hacer a un matiz es modificar las cualidades de luz a través brillo, valor o ligereza. Hacerlo puede convertir un color negro o blanco. Y luego si añadimos más blanco al pigmento donde teñimos el color. Y cuando agregamos más negro, estamos sombreando el color. Conestos en mente. Ahora podemos usarlos para hablar y colores personalizados. Hay muchos colores para elegir, pero ¿cómo podemos usarlos de una manera que no sea visualmente discortante? Echemos un vistazo a cómo combinar colores para lograr armonía y diferentes estados de ánimo. Supongamos que queremos crear un sitio web para un producto para el cuidado de la piel. Antes de empezar a escoger colores y una paleta para nuestros diseños, vamos a querer identificar un tono en lugar de temperatura para transmitir mejor la marca. Si usamos colores cálidos, entonces sugerirá más energía porque son mucho más brillantes, mientras que los colores más fríos se sienten más tranquilos ya que son menos vívidos. Algunos colores neutros como el beige, el marrón y el gris también pueden ser una opción. Si no estamos tratando de hacer una declaración, ya que estos colores surgen como tener mucha menos energía. Volviendo al ejemplo de nuestro sitio web, queremos usar colores cálidos para darle una personalidad más vibrante. Con el estado de ánimo definido, veamos ahora diferentes formas de emparejar colores. Hay seis formas de emparejar colores. Triada complementaria monocromática, análoga a Chadwick y acromática. Si queremos que el sitio web se sienta tranquilo, podemos utilizar una paleta monocromática que utiliza diferentes tintes y tonalidades de un solo tono. Sin embargo, puede ser difícil trabajar con un solo color en el medio digital porque necesitamos más colores para comunicar diversos tipos de interacción. Podemos hacerlo aprovechando el esquema análogo y utilizando colores que se encuentran uno al lado del otro. Una advertencia es la necesidad de utilizar uno de los colores como dominante y el resto es secundario. Para crear un efecto más drástico, se puede usar un esquema de color complementario mediante el uso de colores directamente opuestos entre sí. Hacerlo llama nuestra atención por el alto contraste y crea un look vibrante. Definitivamente podemos agregar más colores para hacer un paladar más extenso. Tales como el uso de la paleta de colores triádica que utiliza tres colores, grasa, uniformemente espaciados en la rueda de colores. A menudo el resultado puede ser bastante vibrante, por lo que Reserve solo un color como el color dominante. Continuando, tenemos la paleta Titanic, que utiliza cuatro colores que se encuentran uniformemente espaciados en la rueda. Igual que antes, sólo tienen un color como el dominante. Para prevenir la sobrecarga cognitiva, tener demasiados colores puede llegar a distraer. Podemos hacer uso de neutrales como el negro, blanco y el gris con la paleta acromática para tonificarlo. Ahora podemos ver que hay mucho más contraste en la página web y crea un efecto más neutral. Hay muchas cualidades para colorear, y dependiendo de cómo las apliquemos, reflejan emociones diferentes. Empezar tus diseños en blanco y negro y poco a poco construyendo el paladar es el camino a seguir. Típicamente asociamos significados con el color. Cuando nos encontramos con un color como el blanco, puede significar algo positivo o negativo dependiendo de la cultura. Es por eso que elegir el color adecuado es importante porque tienen connotaciones diferentes. El rojo es un color que exige atención, generalmente corresponde a pasión, guerra, y cuerda. En algunas culturas, puede significar celebración y vitalidad. Usar el rojo y nuestro trabajo puede ser bastante llamativo. Véalos a menudo en etiquetas de advertencia y cosas ciencia para evitarnos el peligro. Por otro lado, los campos anaranjados más locos, pero aún pueden ser enérgicos y vibrantes. Muchos usan el color para invocar un sentido de aventura y rejuvenecimiento. Cuando se aplica a una pieza, lleva menos agresión que rojo y es mucho más acogedor. El amarillo es uno de los colores más brillantes. Por eso muchos lo usan para transmitir felicidad y alegría. Y a menudo vemos que se usa para simbolizar la esperanza y la competencia. Hay mucha energía y alegría cuando se usa el amarillo en un diseño. A lo mejor por eso nos gusta tanto comer McDonald's para hacernos felices. Cuando pensamos en verde, pensamos en cosas en la naturaleza como hierba y árboles. Por eso este color representa la vida, la renovación y el crecimiento. Vemos que se utiliza a menudo en productos de reciclaje u orgánicos que comemos. Tiene los efectos aditivos de crear una sensación calmante. El azul es otro color común, pero es mucho más frío. Da una sensación de seguridad y ayuda a promover la confianza y la lealtad. Podríamos encontrar este uso coloreado para bancos y compañías de seguros, y sin olvidar la fuerza policial que mantiene seguras nuestras calles. En cuanto al morado, es tranquilo y enérgico. Al mismo tiempo. Históricamente, ha sido utilizado por realeza para transmitir bien y nobleza. A veces se puede utilizar para representar la sabiduría también. Esta es una de las razones por las que podemos detectar el uso del morado en marcas premium como el chocolate de Cadbury. bloque puede tener connotaciones positivas o negativas ya que transmite tanto sofisticación como tristeza. Veremos este uso de pelusa en eventos formales y prestigiosos o en funerales. otro lado, si bien puede parecer bastante sencillo, transmite pureza o inocencia. No obstante, en la cultura occidental, vemos a las novias vestirse de blanco para una ocasión festiva. Pero en la cultura china, el blanco puede significar, sin embargo. Siempre que se usa blanco, da un efecto limpio y minimalista. Repasamos brevemente algunos de los colores principales y los significados detrás de ellos. Hay muchos más colores disponibles por ahí. Así que haga su investigación y entienda cómo ciertos colores juegan un papel en diferentes culturas. Los colores se pueden usar no solo para realzar nuestros diseños, sino que también afectan nuestras vidas. La próxima vez que salgas, echa un vistazo a cómo se usan y por qué se eligieron ciertos colores. 5. Capítulo 4 - Principios del diseño: En los últimos capítulos, nos fijamos en los diferentes bloques de construcción y diseño, como las letras y los colores. Ahora es el momento de juntarlos utilizando los principios del diseño para crear composiciones cohesivas. Al comenzar por primera vez en un diseño, no ponemos las cosas ciegamente en un Lienzo. Hay formas de diseñar los elementos visuales para que la gente pueda mirar a través de ellos fácilmente. Comencemos con entender cómo el principio de equilibrio puede ser útil en el diseño. Para ilustrar mejor los efectos del principio de equilibrio, es útil ver los elementos de un lienzo como si tuvieran algún tipo de masa y gravedad. Cuanto más grande es el artículo, más pesado es, y cuanto más pequeño es el artículo, más ligero es. Con eso en mente, es momento de diseñar un cartel para un evento social. Al igual que cualquier objeto grande que ejerce una gravedad cuando se agregan elementos gráficos grandes a un lado del lienzo, ve que el peso visual se desplaza hacia ese lado. Para equilibrarlo, necesitamos poner otro elemento grande que tenga la misma cantidad de peso en el otro lado. Hacerlo crea un equilibrio simétrico. Este método generalmente proporciona una estructura fuerte y estable a una composición debido a que el peso visual se percibe exactamente igual en ambos lados. Otra forma de crear equilibrio es el uso de equilibrio asimétrico, donde el peso no se distribuye uniformemente en una página. Por ejemplo, en nuestro cartel de eventos sociales, podemos agregar más detalles a la izquierda al tener algunos elementos más pequeños para equilibrar el gráfico único de la derecha. El uso del equilibrio asimétrico a veces puede hacer que se vea menos parejo, pero ayuda a crear intereses visuales al tener una variedad de elementos en el lienzo. Notarás que los elementos no existen por sí mismos dentro de un límite definido. Varían en peso visual y se ejercitan de manera diferente dependiendo de cómo se coloquen. Por lo que necesitaremos usar equilibrado para crear equilibrio en nuestras composiciones. Similar a la música, podemos crear ritmo visual para acompañar a nuestra audiencia a lo largo los elementos de diseño ahora echaremos un vistazo a los diferentes tipos de ritmos que podemos hacer. Una de las formas de lograr ritmo visual es a través de la repetición de elementos similares espaciados por igual en una página para darle un aspecto consistente. El tipo de ritmo más básico que podemos usar se llama ritmos regulares. Y a menudo se encuentran en novelas y libros de texto. Cuando leemos a través de un libro, los roles de los textos y el espacio entre las filas son similares en tamaño. Sabemos exactamente por dónde empezar a continuación cuando termine de leer una línea de textos. Alternativamente, podemos usar ritmos que fluyen para dar una sensación de movimiento con sus patrones de flujo libre. Este estilo de ritmo es más orgánico y se encuentra más en la naturaleza. Podemos usar esto ilustra algo así como plantas y agua. Por último, podemos usar el ritmo progresivo para dar una secuencia más interesante cambiando un poco el elemento cada vez que se repite. Por ejemplo, el desplazamiento gradual y tamaño de los elementos y la posición harán el truco. Podemos ver este tipo de patrón en los estantes de los caracoles son gráficos generados por computadora. Al controlar cómo se repiten los elementos, podemos evocar un sentido de emoción y movimiento en el diseño. Cuando estamos organizando elementos en una página, también necesitamos considerar qué elementos queremos que vea nuestra audiencia. En primer lugar, una forma es variar las proporciones de los elementos. En pocas palabras, lo que sea más grande llamará nuestra atención primero, mientras que los artículos más pequeños tienden a pasarse por alto y los recibos en segundo plano. Podemos ver que las montañas son más grandes que los árboles de la foto. Por lo que notamos primero las montañas por su tamaño. En ciertas ocasiones, también se pueden poner en foco artículos más pequeños. Si enmarcamos intencionalmente nuestra foto para mostrar un castillo en ella, puede convertirse en algo de interés, aunque sea mucho más pequeño que las montañas. consecuencia, cambiar la escala de un elemento en relación con otros o una de sus partes puede proporcionar diferente peso visual y muerte para la audiencia. Simplemente ajustar el tamaño de un elemento también puede dar una buena jerarquía a nuestro trabajo. Otro método para enfatizar el contenido a mirar primero es el uso del contraste. Averigüemos cómo se puede aplicar este principio. El contraste se logra cuando hay dos grados de énfasis completamente opuestos en una pieza de diseño. Lo que eso significa es crear una yuxtaposición al tener una gran diferencia de forma, color o tamaño en la misma composición. También puedes hacer lo mismo cambiando la posición, rotación o textura. Por ejemplo, podemos tener elementos de colores brillantes para destacar de un fondo oscuro o un elemento de borde duro entre los elementos de borde suave. Al hacer que los elementos sean pop, crea una relación interesante entre los elementos visuales que pueden o bien alejarlos unos de otros, conectarlos o complementarlos. No obstante, solo escoge una variable para cambiar de otra, se volverá abrumadora. Hemos estado hablando de la necesidad de crear enfoque y énfasis. Pero sin unir los elementos visuales, puede ser difícil verlos como una sola pieza. La armonía y el diseño nos obliga a atender a la unidad. La razón por la que algo es estéticamente agradable tiene menos que ver con el azar y más que ver con las técnicas que un diseñador empleados para asegurarse de que los elementos coexistan en una composición. La clave está en tratar a los elementos de manera similar. Diseñemos otro póster para ver cómo funciona Unity. En primer lugar, necesitamos establecer una paleta de colores que pertenezca a la misma familia. Para que nuestro cartel genere conciencia sobre la contaminación marina, seguiremos adelante y usaremos el esquema de color azul monocromático. A continuación, cuando agregamos elementos gráficos como formas de botellas de agua y peces, necesitamos mantener los estilos casi idénticos. Si tenemos bordes suaves, necesitamos mantener todas las formas con esquinas redondeadas. Los patrones creados pueden repetirse y tipos de contenido similares pueden alinearse y agruparse. Incluso dentro de una colección de artículos similares, podemos crear distinción visual. Por ejemplo, al tener uno con un resaltado que esté en un color diferente. Si se hace correctamente, podemos ver todos los elementos de diseño se unen y pertenecieron juntos. No sólo esas unidades mejoran la coherencia visual de las cosas, sino que también pueden ayudar a mejorar la usabilidad y los productos. Después de echar un vistazo a los cinco principios del diseño, podemos ver que hay muchas formas de organizar los elementos. Se pueden combinar o usar individualmente. La próxima vez que mires algo que ha sido diseñado, trata de descifrar cómo se presentan los elementos y cómo se ve afectado. 6. Capítulo 5 - Sistemas de rejilla: Recuerda cómo usamos papel cuadriculado y clase de masa para ayudarnos a dibujar gráficas. Podemos usar rejillas para diseñar elementos de diseño para, ya que este capítulo cubrirá qué rejillas son en formas de usarlas para estructurar nuestros diseños. Antes de entrar en los detalles, vamos a repasar un poco de historia básica en grid y la importancia del lugar más adelante en InDesign. Como vimos en el capítulo de topografía en los viejos tiempos, publicaciones se imprimieron manualmente haciendo que alguien escribiera letras a mano y dibujara gráficos. Los grupos no estaban necesariamente en el pasado porque las publicaciones que estamos viendo más como obras de arte sin la necesidad de distribuir libros para la educación. No fue hasta la Revolución Industrial del siglo XX cuando la tecnología avanzó lo suficientemente lejos como paraque la producción en tecnología avanzó lo suficientemente lejos como para masa de publicaciones llegara a más gente. Con el fin de crear publicaciones como periódicos sobre una base diaria, había una necesidad de crear reglas y estructuras para encajar fácilmente el contenido en las ranuras. ¿ Te imaginas la presión para que todos los días salgan nuevos contenidos y maquetación, gente se volverá loco. Con eso. Demanda. Las rejillas fueron desarrolladas para cumplir diseños más rápido sin la necesidad de crear nuevas capas cada vez. Como sistema reutilizable, puede proporcionar diseños rápidos y genéricos que son puntuales altamente personalizados. Grid actúa como una guía para permitirnos organizar textos, imágenes y otros elementos gráficos en una página, nos ahorra tiempo para averiguar dónde ponerlos. Normalmente no vemos estas pautas, ya que se eliminan una vez que un diseñador completa sus diseños. Pero si analizamos una pieza de diseño lo suficientemente profunda, veremos cómo los elementos se alinean con los desarrollos de las rejillas. Se convirtió en una poderosa herramienta para dar estructura a la hora de diseñar. Nuestra audiencia puede navegar fácilmente por el contenido. Ahora que sabemos cómo las rejillas se hicieron importantes es el momento de entrar en los detalles. Al igual que nosotros tenemos humanos y dejar que sus anatomías rejillas también las tengan. Ahora pasaremos por algunos de los componentes que construyen una grilla. Para crear una cuadrícula para un proyecto, comenzamos con lineamientos verticales para establecer columnas para nuestro contenido. Al crear las columnas, también necesitaremos definir el espaciado entre las columnas conocidas como canalones. Hacer cambios a esto afectará hasta dónde se separa el contenido. Tenerlos demasiado estrechos o demasiado espaciados, haremos las cosas difíciles de leer. La clave es mantener el equilibrio espaciando las cosas lo suficientemente lejos como para ser fácil en los ojos, pero no demasiado que rompa la continuidad de lectura. Las líneas de flujo se pueden utilizar para dividir secciones en módulos para que el contenido se pueda colocar en estas cajas. Sin embargo, el contenido no necesita estar confinado dentro de las cajas que creamos. Pueden extenderse a través de múltiples columnas y módulos. Cualquiera de las áreas de apertura se denominan zonas espaciales. En el ejemplo, podemos ver que si todo el contenido encaja dentro de un rectángulo, el diseño se ve realmente rígido. Al ampliar algunas de las imágenes, crea más intereses visuales. También podemos dar espacio adicional alrededor del contenido llamado padding o fuera de este cuadro delimitador llamado márgenes. No importa lo compleja que sea una grilla, todas contienen las mismas cartas mencionadas. Cada pieza está diseñada para un propósito específico que se puede combinar, se eliminan de la estructura general para establecer diseños intrigantes. Las rejillas vienen en muchas formas. Echemos un vistazo a los diferentes tipos y cómo se pueden poner en práctica. Comenzando con lo básico, la cuadrícula de una sola columna solo tiene una columna para ayudar a los lectores a enfocarse en el texto línea por línea. Vemos mucho el uso de este tipo de rejillas en la escuela. A menudo se usan en materiales de texto como los ensayos que escribimos y el novelista releído. Cuando se necesita un diseño más complejo, el uso de rejillas de varias columnas nos da más columnas con las que jugar. Este sistema nos ayuda a descomponer el contenido en trozos digeribles. A menudo se pueden encontrar en revistas y sitios web. ¿ Por qué necesitas crear cohesión entre un surtido de contenidos? Las rejillas también se pueden dividir en cajas iguales, donde un sistema de rejilla modular permite una mayor flexibilidad para colocar el contenido. Se anima a los lectores a comenzar a leer en cualquier lugar en el orden que prefieran. Como se ve comúnmente en los libros de texto, corresponde al lector elegir entre las imágenes, los textos corporales o el poste cercano para leer primero. Si configuramos el contenido para que comience en una línea completa en lugar de la esquina superior izquierda de un módulo, ancla el contenido en una línea de anclaje, convirtiéndolo en una cuadrícula de línea base. Este método crea un Ritmo de lectura consistente entre los elementos. Los sistemas de rejilla que hemos visto hasta ahora son tipos tradicionales que generalmente se encuentran en medios de impresión. Veamos cómo se tratan las rejillas en pantalla. Al diseñar para digital, comenzamos primero con cualquiera de los tipos de cuadrícula especificados anteriormente. Luego complementamos eso con el uso múltiplos fijos al colocar elementos como iconos y dropdowns. Por ejemplo, una aplicación para iPhone puede usar una cuadrícula de una sola columna y luego aprovechar las pautas de diseño de Apple de un sistema de cuadrícula de cuatro píxeles para construir los elementos. El elemento más pequeño puede comenzar en cuatro píxeles, y los elementos más grandes son múltiplos de eso. De igual manera, en Google, lo usan un sistema de cuadrícula de píxeles. Por lo que una aplicación para Android, tendremos elementos a partir de ocho pixeles. Dependiendo del dispositivo para el que estemos diseñando, necesitamos elegir las pautas correspondientes para que nuestro diseño se pueda escalar de acuerdo a sus resoluciones de dispositivo. Por último, podemos hacer rejillas personalizadas también si las otras tienen una estructura demasiado estricta para nuestro gusto. Las rejillas no siempre tienen que ser rectilíneas. Pueden ser diagonales, redondos o de flujo libre para comunicar otras ideas a través del uso de rejillas. También pueden ayudar a equilibrar una página si estamos luchando. Usando un ejemplo de comercio electrónico, una cuadrícula de dos columnas establece equilibrio asimétrico para enfatizar en los productos por cuadrícula de tres columnas establece un equilibrio asimétrico para hacer que nos centremos en los títulos y descripciones. Existen diversas estructuras de rejillas para usar. Pueden ser simples o complejos, específicos o genéricos, bien definidos, o interpretados vagamente para dar equilibrio, jerarquías articuladas y consistencia en las composiciones. Las rejillas no son elementos visuales que vemos al final, sino que son pautas para ayudarnos a organizar los elementos de diseño rápidamente, dar estructura y orientación a nuestros lectores. La próxima vez que vayas a un sitio web, piensa en cómo la grilla juega un papel en el diseño y establece el ritmo para que lo leamos. 7. Capítulo 6 - Diseños y composiciones: Las personas consumen toneladas de contenido todos los días. Pero, ¿alguna vez has pensado el funcionamiento interno de cómo diseñar estos contenidos? En esta lección, despegaremos las capas y analizaremos cómo ayudar a las personas a entender mejor el contenido. El diseño es intrínsecamente una industria de resolución de problemas. Entonces, ¿qué problema resuelven el diseño y la composición? En primer principio, están diseñados para resolver un problema de legibilidad. Una buena disposición y composición es la respuesta a la pregunta. ¿ Mi diseño lee? ¿ Puedo entender lo que está pasando? En la era digital actual? La cantidad de contenido es vasta y altamente accesible. Viene en forma de películas que te ayudan a desaparecer en el mundo del cine y la televisión. Contenido informativo y entretenido en YouTube, Twitch y TikTok. Objetivo memorable como las fotos que tomamos en nuestras últimas vacaciones con su familia y amigos, provocadoras y serviciales, como las noticias que leemos y las compras que hacemos en Internet. Pero cómo realmente consumimos estos contenidos es a través de las capas y la composición que nuestros ojos están viendo. Esto se hace mientras nuestros otros sentidos, como el tacto y el oído, nos ayudan a procesar la complejidad que ocurre frente a nosotros. Echemos un vistazo más de cerca. Comprender Laos y composición. Bueno, primero necesitamos saber cómo procesa nuestro cerebro las cosas que vemos. La mayor parte de lo que vemos en cualquier medio se hace a través un sistema de memoria a largo plazo que interpreta información de nuestros sentidos a alta velocidad. Mantener lo relevante y descartar lo que no lo es. Esta biblioteca de experiencias o biblioteca visual actúa automática e inconscientemente sin mucho estrés en nuestra capacidad intelectual, aunque no queramos, por ejemplo, tratar de no leer esto. Este es también el mismo sistema que nos ayuda a llenar los vacíos de algo que por lo demás es imperfecto y darle sentido. Un ejemplo es el logotipo del Fondo Mundial para la Vida Silvestre. Sabemos que se trata de un panda. Aunque las líneas no estén conectadas. Sin embargo, apenas necesitamos pensar en eso. Cualquiera que haya visto un lapicero arriba antes, no tendremos problema en reconocerlo. Entonces, ¿qué nos ayuda en realidad a construir diseños y composiciones fuertes? Podemos manipular con éxito estos principios de diseño. Podemos crear diseños y composiciones interesantes para ayudar a nuestros espectadores moverse a través de nuestros diseños. Echemos un vistazo a algunos ejemplos. Las fotos son una de las pocas formas de médiums que nos permite ver composiciones directamente. Entonces comencemos con esto antes pasar a medios más complejos. La primera imagen aquí título Earthrise de William Anders, quien trabajaba en la nasa, tomó esto en 1968. El motivo por el que esta imagen es tan fuerte es por unas pocas cosas que se habían trabajado en la composición. Contraste, énfasis, proporciones y armonía. Pero vamos a mirar sólo los contrastes y el énfasis para esta imagen. Al voltear la foto en blanco y negro revela el funcionamiento interno de cómo funciona el contraste en esta foto. Conoce esto de abajo hacia arriba. Va en un patrón de luz, oscuridad y luz. Esto ayuda a nuestros ojos a leer la imagen y los sujetos fácilmente. Segundo, el énfasis, poner a la Tierra en un vacío circundante del espacio mientras muestra que esta imagen es tomada de la Luna, nos ayuda a entender lo pequeño que es realmente nuestro planeta. Nos da contexto de dónde fue tomada la foto mientras nuestros ojos se mueven entre la superficie lunar anclándose en el fondo y la tierra colgando en medio del espacio oscuro y sereno. Esta segunda foto se llama almuerzo encima un rascacielos por Charles Clyde EBIT, tomada en 1932. Los dos elementos principales que trabajan en la composición aquí son el contraste, el ritmo. Si miramos de cerca, el fondo no sólo da contexto a donde en relación estas personas están con su entorno, también es un valor de luz medio comparación con el sujeto más oscuro en primer plano, lo que nos permite leer bien los temas. El ritmo establecido por el sujeto sentado en una fila ayuda a dibujar nuestros ojos a través de toda la foto sin luchar con un flujo natural, lo que nos permite ver las expresiones de estos trabajadores sin ningún otro elemento que compita por nuestra atención. Aquí la última foto de carbón de alce puntual para National Geographic. Entre todos los principios en juego, lo que destacó realmente fuerte o el equilibrio, las proporciones y la armonía. Para ver mejor el equilibrio, podemos dibujar dos líneas para dividir la imagen por la mitad, vertical y horizontalmente. Cuando hacemos eso, vemos cómo Andre ha empleado el equilibrio asimétrico. Cada mitad es similar, pero no exactamente una imagen especular de la otra. Esta es una forma muy simple y directa de utilizar el equilibrio asimétrico. Y podemos jugar con eso para lograr diferentes efectos. Siguientes proporciones hacia arriba. El buzo y la raya están ambos a la misma profundidad en la vida real. Pero al componer la foto de esta manera en Play se puede comunicar mejor el tamaño de un humano adulto en relación con la raya. Mucho cola larga que tiene. Así que wow. Y por último, tenemos armonía. Aquí están en juego dos formas de armonía. En primer lugar está la armonía entre el color de la arena y el sujeto. Porque fotografiar esta foto bajo el agua le da a la imagen y el tono azulado en general. Se mezcla el sujeto en el entorno sin chocar entre sí. Y esto se hace manteniendo el contraste suficiente para que podamos leer la imagen. En segundo lugar está entre el buzo y la raya. Los colores son lo suficientemente similares como para que se sientan diferentes, sin embargo, uno en el mismo. Si miramos de cerca, los patrones tanto en un traje de buceo la raya son similares. Ahora que nuestros ojos han sido entrenados para ver composiciones y fotos, echemos un vistazo a los mismos conceptos que se aplican a las apps y sitios web. El primero es DoorDash. Cuando tenemos hambre y navegando por un restaurante para ordenar de Will llega indeleblemente a esta página. Lo que funciona tan bien aquí es el uso de proporciones y énfasis. Proporciones ayuda a nuestros ojos a atraer automáticamente a la sección de restaurantes. Esto se debe a que el contenido más importante es el de mayor tamaño, mientras que las partes menos importantes ocupan menos espacio. El intrincado equilibrio de las proporciones también ayuda a nuestros ojos fluir de forma natural y escanear el contenido desde la parte superior izquierda hasta la parte inferior derecha de la página sin tener elementos Pfeiffer atención innecesaria entre sí. Lo interesante aquí es que los elementos de navegación en la parte superior y los elementos filtrantes de la izquierda desaparecen sólo hasta que queremos buscarlos. Ese es el trabajo de la armonía aquí. Al dejar que el color de fondo sangra a través los controles del filtro y agregar sombras al carrito, crea una profundidad visual. Esta profundidad es también lo que ayuda a nuestros ojos determinar qué contenido es más importante. El segundo ejemplo aquí es Netflix. Este es interesante porque parece que está pasando mucho. Pero lo que realmente es es un simple equilibrio en juego. Si dividimos la captura de pantalla y la mitad, podemos ver claramente cómo Netflix usa un equilibrio simétrico para ayudar a nuestros ojos con ese título. Este tratamiento ayuda a que el largometraje o película tome centro del escenario sin que la imagen luche con el título de la película, pero equilibrar el diseño de esta manera que experimentan no solo ser inmersivo en el modo de pantalla completa, pero sigue el flujo natural de cómo leemos. Nuestros ojos leen naturalmente el título, luego pasan a la imagen para ver si nos gusta ver todo el asunto. Si lo elegimos, podemos hacer clic en play y dejar de jugar. Si optamos por no hacerlo, aún podemos proceder a explorar las otras ofertas desplazándonos más abajo. Observe cómo esta forma de organizar diseño asimétrico también persiste en la parte inferior. Por último, tenemos Spotify. ¿ Puedes adivinar qué principios nos ayudan a leer mejor el diseño? Si adivina contraste, patrón, ritmo, y proporciones, ¿verdad? Pero una cosa que es interesante de todos ellos es el ritmo. La mayoría de la gente se pierde esto. Pero al igual que la música, los diseños visuales tienen ritmo visual para, ayuda a nuestro cerebro a entender lo que están viendo cuando se despliegan correctamente. Echa un vistazo a la lista de canciones en la interfaz de usuario. El ancho de columna, las alturas de fila, espaciado entre filas, el tamaño de fuente y los colores son todos consistentes. Esto crea un patrón y un ritmo. Sin tener un indicador visual como una línea a través de cada fila. Nuestros ojos y cerebros no tienen problemas para entender qué es una sola fila en que el álbum está relacionado con qué título de canción. En medios interactivos como este, ritmo se puede establecer tanto en el eje x como en el eje y para formar el ritmo horizontal y vertical. Dominar la habilidad puede ayudarnos a lidiar con diseños mucho más complejos. Imagínate que se nos pide diseñar la página del producto de Amazon. Y nuestro diseño tiene que soportar cualquier número de productos de uno a potencialmente infinito. Rhythm ayudará a nuestros clientes a leer mejor lo que hay en la página usando señales visuales sin saturarlo. Observamos un diseño de campo y ejemplos de composición desde fotos hasta medios interactivos. Pero en realidad sólo hay dos cosas que recordar. En primer lugar, construir su biblioteca visual para crear buenos diseños y composiciones requiere que aprovechemos la memoria a largo plazo de las personas. Por lo que cuantos más ejemplos tengas en la cabeza, te ayudará a diseñar mejor. Segundo, la práctica, la práctica. Practicar. El diseño es una habilidad basada en las manualidades. Por más que sea una habilidad de pensamiento, cuanto más repitas, mejor obtendrás. 8. Capítulo 7 - Iconos e imágenes: Hay un dicho, una imagen vale más que mil palabras. Y para agregar a eso, un cuadro también puede llevar mil significados. Una imagen puede ser un icono como metáfora simbólica para representar ideas, objetos y personas. También puede ser una foto o imagen como representación visual de las realidades de las personas. Es por eso que las imágenes son geniales para explicar ideas complejas mediante intrincados gráficos y contextos históricos. Dado que los iconos y las imágenes pueden proporcionar significados fuertes a una pieza, ahora echaremos un vistazo a cómo aplicarlos en nuestros diseños. Como vimos en la lección de topografía, las primeras formas de escritura y comunicación comenzaron como pictogramas. Veamos qué podemos aprender de la historia y entender cómo se convirtieron en una práctica común hoy en día. El ejemplo más conocido donde se encuentran pinturas rupestres en la Cueva de Lascaux en Francia. Lo que lo hizo especial donde se encontraba la intrincada documentación de animales que existía hace mucho tiempo. Otra encuadernación famosa fue la Cueva de Altamira en España. Aquí descubrimos cómo era la vida de las personas en el Paleolítico, desde su día a día hasta cómo lo cazan. Algo interesante es que los dibujos en realidad no se conectan y corresponden entre sí. Porque las formas iniciales de escritura son sólo representación simbólica de las ideas. Los humanos y la tecnología progresan. Y se necesitaba una forma más robusta de escritura y comunicación. Las pictografías se convierten en representaciones de sonidos y letras que tenemos hoy en día. Pero la idea de usar iconos, ilustraciones e imágenes aún permanece. El alquine de ellos acaba de evolucionar. Los encontramos como videos y fotos en Instagram para vectorizar iconos e ilustraciones en nuestros sitios web favoritos. Sólo hay algunas cosas que no se pueden describir con palabras. Al mirar al pasado, vimos que el icono, ilustraciones y las imágenes son todas buenas maneras de capturar un momento en el tiempo y contar una historia. Veamos cómo ha evolucionado este método de narración en los tiempos modernos. No faltan las imágenes utilizadas en los tiempos modernos. Las deliciosas imágenes y menús que sólo nos dan más hambre. Una foto impresionante que cuenta una nueva historia convincente. Dos fotos de una ubicación en Google Maps que nos informa de nuestra ubicación correcta. El uso de imágenes, combinado con otras formas de maquetación es sin duda una herramienta de comunicación efectiva. Para entender cómo hacer pleno uso de este efecto, necesitamos primero entender qué historia estamos contando. La historia en última instancia actúa como una guía para impulsar la experiencia de nuestra audiencia. Nuestra historia puede existir en forma de un artículo de noticias, sitio de comercio electrónico o una aplicación. El héroe de nuestra historia es siempre nuestro usuario. Tenemos que entender que es viaje y misiones. Ya sea que eso sea llegar al lugar correcto, comprar el artículo correcto o aprender una nueva habilidad. Es nuestro trabajo como diseñadores ayudar a los héroes a completar la solicitud. Una vez que tengamos un cuelgue de la historia, podemos ver cómo elegimos estructurar la historia, equilibrando lo que elegimos para usar imágenes y textos para comunicarnos. Tomemos un ejemplo de Google Maps. Los usuarios de Google Maps quieren explorar nuevos lugares o pagar si vale la pena visitar un restaurante. Texas, la mejor manera de decirnos la dirección y comentarios. Las imágenes son mejores para mostrar si nos gustó el ambiente y cómo se ve el pollo con mermelada de Chile. Otro ejemplo es el artículo sobre contaminación del New York Times India. uso de imágenes desde la perspectiva de mono y EMEA ayuda a transmitir la historia de una manera más personal. Esto es especialmente importante ya que el artículo está ambientado en India, mientras que una gran parte de la audiencia del New York Times está ambientada en nosotros. uso de imágenes poderosas como esta ayuda a la audiencia relacionarse mejor con la situación lejos de su hogar. Si echamos un vistazo más de cerca al artículo, también podríamos detectar un interesante uso del color. El New York Times optó por dejar que los colores fueran los mismos que las imágenes resultando en un diseño armonioso. Esta es una técnica para probar si estás en la situación en la que las imágenes chocan con los colores de tu IU. N, esas son algunas formas de usar imágenes en conjunto con nuestros diseños. Ampliando los conceptos de imágenes, ahora echaremos un vistazo a cómo aplicar iconos e ilustraciones a nuestros diseños. Echando un vistazo a otro ejemplo del New York Times, podemos ver planetas y satélites representados iconos e ilustraciones. Los satélites que orbitan alrededor del planeta ayudan a decirle a la audiencia dónde se encuentran los satélites en relación con el cuerpo astral y su trayectoria. Tener el mismo icono, tanto en la ilustración como en la leyenda ayuda a la audiencia a mapearlos juntos. Algo a tener en cuenta sobre el uso de iconos e ilustraciones, o detalle y legibilidad. El tamaño de un icono o ilustración es proporcional a la cantidad de detalles que necesitamos tener para que la audiencia lea mejor. El motivo de esto es que nuestro sistema de memoria, recuerdo del capítulo Laos y composición, espera una cierta cantidad de información en un tamaño dado para que entiendas lo que tus ojos están viendo. Si el objeto es más grande, digamos Júpiter, tener el color correcto no es suficiente. Es necesario tener el famoso círculo rojo y la tormenta en movimiento para ayudar a nuestra audiencia, la estrella y el planeta. Pero algo tan pequeño como el satélite, como la Voyager, es suficiente para tener sólo una representación de silueta para que nuestro público sepa qué es ese satélite. Tener más detalles en realidad hará que sea más difícil leer porque la forma icónica ya no será reconocible. Porque los iconos y las ilustraciones son abstracciones de cosas reales. Un tinte azul puede significar tierra o un mármol azul. Es importante dar alto contraste y legibilidad al crearlos. De lo contrario, nadie sabría de qué se trata. Es por eso que los iconos y las ilustraciones tienen la capacidad de contar historias poderosas que se pueden representar con una foto, como cómo se mueve el hielo en la Antártida aquí. Ten cuidado al usar símbolos que pueden significar cosas diferentes en diferentes culturas. El simbolismo es altamente dependiente del contexto. Algunos símbolos o imágenes están bien en un lugar, pero puede que no estén bien en otro. Cosas como los símbolos religiosos son figuras son muy sensibles y sentido cultural. Abstenerse de utilizar símbolos que estén relacionados con los valores culturales de las personas, sino más bien utilizar símbolos que sean universalmente reconocidos. Las imágenes, los iconos y las ilustraciones son medios poderosos para agregar a tus diseños. La próxima vez que corras a través de una aplicación, presta atención a cómo usan iconos e imágenes para llevarte a través de su flujo. 9. Capítulo 8: Ahora hemos llegado al final de la introducción de nivel 0 al diseño. Qué viaje por el que hemos pasado. Pero sólo hay una cosa más para todos ustedes. Aquí. Cubriremos un concepto que te ayudará a juntar todo lo que has aprendido. Entonces, ¿qué es exactamente la comunicación visual? La comunicación visual es un método de representación de la información para crear sentido de manera efectiva a través del diseño. Esto se puede hacer tanto en medios electrónicos como impresos. Existen diferentes formas de representar la información en un formato gráfico. Estos incluyen infografías que traducen datos en imágenes, contenido interactivo con el que los usuarios interactúan física o digitalmente, y gráficos en movimiento que transmiten una historia a través del movimiento. También se puede aplicar a activos tangibles y entregables como branding y paquetes de identidad, diapositivas de presentación o carteles y señalización es. Podemos empezar a ver cómo las lecciones pasadas, como la tipografía, los colores y los diseños se aplican en contexto. Ahora que sabemos qué es la comunicación visual, descubramos cómo podemos usarla para comunicar la importancia de las ideas y conceptos. El mundo está inundado de una corriente interminable de información, ideas y conceptos. Estos pueden ser transmitidos de muchas maneras diferentes a través escritura, conversaciones y visuales. Pero echemos un vistazo más de cerca a las ventajas de representar la información visualmente. Si quisiéramos enseñarle a alguien cómo dibujar ventana, nuestras instrucciones podrían verse algo así. Dibuja un cuadrado, dibuja una línea horizontal a través del centro del cuadrado, dibuja una línea vertical por el centro del cuadrado. Si bien estas instrucciones son bastante simples, podemos correr el riesgo de que se malinterpreten. La otra forma es acompañar las instrucciones con representaciones visuales así. Dibuja un cuadrado, dibuja una línea horizontal a través del centro del cuadrado, dr línea vertical a través del centro del cuadrado. ¿ Notaste las diferencias en cómo fueron las instrucciones transmiten exactamente lo mismo peor para su uso con sólo la adición de gráficos como suplementos. Para mayor claridad. Vamos a dar un paso más allá. Si elimináramos por completo las instrucciones escritas y solo usáramos gráficos instruccionales, esto todavía tendrá sentido. Y así la comunicación visual en vivo es tan importante. Da claridad a ideas complejas y deja poco espacio para malas interpretaciones. La comunicación visual no es simplemente inclinarse en gráficos con textos. Hay un propósito atado a él que nos ayuda a crear historias de diseño. Los dos factores clave, nuestra audiencia y contextos. En primer lugar, audiencia, nuestra audiencia o las personas a las que nuestro producto, servicio o medio está dirigido. Y entender quiénes son puede ayudarnos a dirigirnos mejor a nuestros contextos. Posteriormente. En la secuencia de título de apertura de la serie de James Bond, Quantum of Solace. ¿ A quién crees que va dirigida esa secuencia de título? ¿ Son para los fans de la franquicia James Bond o son para los nuevos espectadores? El título es familiar a la vez para los fans de la serie, pero hecho de una manera moderna para atraer a los nuevos espectadores sin saber para quién es. Esta secuencia de título se puede tomar en muchas direcciones que tal vez ya no se sientan como una película de James Bond. Eso nos lleva al siguiente factor. Contextos. Contextos define el entorno o situación en la que algo sucede. Esto se aplica al diseño de productos o ideas en general, utilizando como ejemplo la marca Starbucks, si queríamos mostrar cómo eran los visuales de la marca, necesitamos aplicarlos en el contexto que será visto por el usuario. Cuando se establece en contexto, lo que es en esencia, una marca abstracta se vuelve relacionable y comprensible. Al definir nuestra audiencia y contextos, podemos aplicar los fundamentos aprendidos en lecciones previas para guiar a nuestra audiencia a través de nuestro trabajo. Hagamos un poco de recapitulación. Aprendimos qué es la comunicación visual , por qué es importante, y cómo usarla para contar una historia es ahora el momento de aplicar todo tu conocimiento de diseño en tu trabajo.