Conceptos Básicos de Composición en Diseño Gráfico
Resumen
6 Conceptos básicos del diseño
Te ayudan tanto en composiciones de ilustraciones, webs, editoriales, etc.
-. Balance: La estructura y estabilidad de una composición en donde la posición de cada elemento está dada por su peso visual. puede ser un balance simétrico o asimétrico.
-. Contraste: lo usamos para señalar un concepto marcando la diferencia, ya sea por tamaño, color, etc. de dos elementos distintos.
-. Alineación: nos permite crear una ruta visual entre diferentes elementos que queremos señalar al usuario.
-. Proximidad: nos permite agrupar diferentes elementos. Puede ser por formas, colores, etc. o físicamente.
-. Repetición: se usa para generar un concepto de marca. Muchas marcas usan siempre los mismos colores, formas, tipos de letras, etc. Ayuda a reforzar un concepto.
-. Espacio: El espacio lo podemos aprovechar colocando elementos de muchas maneras. Podemos poner elementos para reforzar una idea, siempre evitando recargar la composición.
Balance: Posición de cada elemento está dada por su peso visual
a. Simétrico
b. Asimétrico
Contraste: Señalar un concepto marcado por la diferencia entre 2 elementos distintos (claro obscuro, grande pequeño)
Alineación: Crear rutas visuales
Proximidad: Agrupar elementos
Repetición: Concepto de marca
Espacio: Como hacerle uso
Buen aporte, muchas gracias
Gracias
Mi notas
Si te sirvio dale corazoncito 👆😀
¿En qué app haces tus notas?
Hola use Miro! ☀️
6 CONCEPTOS BÁSICOS DEL DISEÑO:
Te ayudan tanto en composiciones de ilustraciones, webs, editoriales, etc.
-. Balance: La estructura y estabilidad de una composición en donde la posición de cada elemento está dada por su peso visual. puede ser un balance simétrico o asimétrico.
-. Contraste: lo usamos para señalar un concepto marcando la diferencia, ya sea por tamaño, color, etc. de dos elementos distintos.
-. Alineación: nos permite crear una ruta visual entre diferentes elementos que queremos señalar al usuario.
-. Proximidad: nos permite agrupar diferentes elementos. Puede ser por formas, colores, etc. o físicamente.
-. Repetición: se usa para generar un concepto de marca. Muchas maras usan siempre los mismos colores, formas, tipos de letras, etc. Ayuda a reforzar un concepto.
-. Espacio: El especio lo podemos aprovechar colocando elementos de muchas maneras. Podemos poner elementos para reforzar una idea, siempre evitando recargar la composición.
Genial aporte!!!
Excelente aporte muchas gracias :D
Los 6 conceptos básicos básicos del diseño gráfico
1. Equilibrio o balance
.
Qué es: el equilibrio es la distribución del peso visual de los elementos gráficos en un diseño.
.
Por qué es importante: cada elemento gráfico tiene su propio peso visual, ya sea de tamaño, textura, color o contraste. Para lograr el equilibrio, piense en su diseño como una de esas escalas anticuadas. Cuando agrega un bloque de texto, forma o imagen a un lado de su diseño, asegúrese de equilibrarlo en el otro lado con elementos gráficos de una masa similar. De lo contrario, “inclinará la balanza” y su diseño se verá inestable.
.
.
2. Alineación
.
Qué es: Un básico fundamental del diseño gráfico, la alineación es la ubicación de los elementos gráficos en un diseño y cómo se alinean entre sí.
.
Por qué es importante: un diseño con una alineación deficiente es como un escritorio desordenado se ve desordenado y nadie quiere mirarlo. Una buena alineación, por otro lado, “ordena” un diseño al crear una conexión visual nítida entre todos sus elementos gráficos. Cuando los objetos de su composición están alineados entre sí, llevan la vista sin problemas de una parte del diseño a la siguiente.
.
Una buena alineación no debería llamar la atención sobre sí misma, pero una mala alineación es difícil de ignorar. Piense en una fila de imágenes en una pared y cuán obvio es cuando una de ellas está ligeramente torcida. Algo simplemente se siente “fuera de lugar” en un diseño cuando las líneas invisibles entre los elementos gráficos no se alinean del todo como sus ojos esperan.
.
.
El logotipo de 7-Eleven es un gran ejemplo de buena alineación. Notará que la palabra “Once” tiene la misma longitud que la barra superior del número “7”.
.
3. Proximidad
.
Qué es: La proximidad crea una relación entre los elementos gráficos de un diseño. No es necesario agrupar estos elementos para que estén próximos entre sí. Solo tienen que estar conectados visualmente de alguna manera, ya sea en color, forma, tamaño, fuente, etc.
Por qué es importante: La proximidad es una poderosa herramienta de diseño gráfico porque influye en nuestras percepciones. Cuando vemos elementos gráficos que están muy juntos, ya sea en la distancia o en la apariencia, los percibimos como relacionados entre sí. Cuanto más diferentes son, o cuanto más separados están, menos relación parecen tener.
Debido a esto, las áreas en blanco son tan importantes para diseñar como las áreas que se rellenan. Este “espacio para respirar” adicional se conoce como espacio negativo . El espacio negativo fortalece las agrupaciones con la misma eficacia que las diferencia entre sí, creando puntos focales y destacando las partes del diseño a las que desea llamar más la atención.
.
.
Un excelente ejemplo de proximidad se puede encontrar en el logotipo de Unilever. La “U” está compuesta por 25 símbolos distintos que representan los valores de la marca. El espacio negativo entre cada símbolo los distingue entre sí como entidades separadas. Al mismo tiempo, el espacio negativo alrededor de los bordes exteriores de la forma de U los une a todos como un grupo.
.
4. Repetición
Qué es: La repetición es el uso de un elemento gráfico más de una vez en un diseño. Ya sea fuente, forma, color, peso o textura.
Por qué es importante: la repetición es un elemento básico del diseño gráfico que a menudo se pasa por alto. En pocas palabras, la repetición “lo une todo”. Los elementos gráficos elegidos al azar pueden causar confusión.
Sin embargo, cuando ve elementos gráficos repetidos a lo largo de un diseño, crea una sensación de cohesión. Y, cuando continúa viendo estos mismos elementos en diferentes canales de marca , la identidad de marca se refuerza, lo que conduce al reconocimiento de marca.
.
.
Piense en el logotipo de Target. El uso inteligente de la repetición a través de círculos rojos y blancos se extiende también a la marca de los grandes almacenes. Cada anuncio es único, pero cualquiera que esté familiarizado con la marca lo reconocerá de inmediato, incluso sin la presencia de un logotipo. Bastante inteligente, ¿verdad?.
Nuestros cerebros están preparados para el reconocimiento de patrones, y la repetición se conecta directamente a eso.
.
.
5. Contraste
.
Qué es: el contraste es la yuxtaposición de dos o más elementos gráficos con cualidades opuestas. Si bien la mayoría de la gente piensa en el contraste como oscuro versus claro, también puede ser delgado versus grueso, brillante versus opaco, grande versus pequeño, geométrico versus orgánico, etc.
.
Por qué es importante: el contraste crea el dinamismo que hace que un diseño parezca “saltar” de la página. Crea una jerarquía visual que trae elementos clave a la vanguardia mientras simultáneamente hace retroceder las cosas menos importantes a un segundo plano. Piénselo: si todo el texto de un diseño fuera del mismo tamaño, tendría que hojearlo todo para descubrir el mensaje principal, y nadie tiene tiempo para eso.
.
El contraste se puede lograr mediante el peso. Al contrastar una fuente más grande y en negrita para el mensaje principal con una más pequeña y delgada para los detalles, se separa la información en fragmentos del tamaño de un bocado y fácilmente digeribles.
.
Asimismo, el contraste se puede lograr mediante combinaciones de colores . Una forma blanca sobre un fondo negro es mucho más difícil de ignorar que una forma gris en un campo ligeramente más gris.
.
.
El logotipo de Marvel Studios aprovecha brillantemente el contraste tanto en peso como en color para llamar la atención sobre el nombre de la marca primero. El contraste no solo capta su atención desde el principio, sino que también guía sus ojos directamente a lo que es importante.
.
6. Jerarquía
.
Qué es: la jerarquía dirige el orden en el que vemos los elementos del diseño, de principio a fin. La escala, el color o la disposición de los elementos gráficos determinan la jerarquía visual de un diseño.
.
Por ejemplo, probablemente notará una forma de color rojo brillante antes de notar una línea delgada como un lápiz. También notará un objeto más arriba en una composición antes de notar uno más abajo.
.
Por qué es importante: la jerarquía visual guía a su audiencia a través de todo su mensaje en un orden que tenga sentido. Un diseño sin una jerarquía clara bombardea a los espectadores con demasiados mensajes a la vez, sin darles una idea de la imagen completa. Cuando tiene muchos elementos en un diseño, quiere asegurarse de que el mensaje más significativo tenga el mayor peso visual y trabajar desde allí.
.
.
El Instituto Americano del Petróleo actualizó recientemente su logotipo utilizando la jerarquía como principio de diseño rector. Una línea central divide el logotipo por la mitad, mientras que los colores llamativos dirigen la mirada hacia el logotipo. Luego nos guiamos por una tipografía gris liviana para comprender el significado del acrónimo API. E
Hola! Dejo por aqui mis apuntes por si le sirven a alguien :)
Balance ⇒ Existe el balance simétrico o asimétrico, permite proporcionar un peso visual claro de los elementos
Contraste ⇒ Marca la diferencia entre dos elementos distintos. Similar a buscarle las diferencias a dos objetos
Alineación ⇒ Define una ruta visual para mejorar la comunicación del mensaje hacia el usuario. Coloca la información relevante en orden
Proximidad ⇒ Define la clasificación de información, permitiendo un consumo mas ameno
Repetición ⇒ Ocupado para crear concepto de marca, consiste en repetir estilos o patrones de diseño para vincular un producto con un patrón de diseño
Espacio ⇒ La forma en que se pueden acomodar de diferente manera los objetos. Permite aprovechar de manera eficiente el espacio proporcionado
Gracias por tus apuntes José. Muy útiles.
Gran aporte!
Está genial.
Lo agregué a mis notas.
Muchas gracias
Gran aporte. Gracias
Balance (simétrico o asimétrico)
Contraste (claro-oscuro, moderno-antiguo, grande-pequeño)
Alineación (vertical-horizontal, centro-extremos)
Proximidad (agrupar elementos para indicar las distintas categorías)
Repetición (da el concepto de Marca Persona, mismos colores, mismos logos, etc)
Espacio (aprovechar el espacio que sobra, siempre teniendo en cuenta el peso de los elementos)
gracias por el resumen
Gracias
Hola
Soy ingeniero y programador, pero nunca he entendido bien a que se refieren los diseñadores con el concepto del diseño. qie es realmente? gracias
Hola, Luis
Todo es diseño, todo.
Tu teléfono, tu reloj, tu casa, tus zapatos. El buen diseño es ese que considera todo. El mal diseño es eso que usas y que incomoda.
En cuanto a la web y a la tecnología, todo aquello que es: fácil, simple, que resuelve, es diseño y es buen diseño.
Pues yo me refiero mas a cuando ellos dicen, que el concepto de este trabajo es tal cosa osea mas a lo que significa para ellos concepto
Note Board - Tablón de Notas
les recomiendo esta extensión de google para poder realizar sus apuntes.
prefiero manito lapiz y cuaderno, a la antigua
x2
Balance: estructura donde la posición de cada elemento se da por su peso visual.
Constraste: Diference marcada entre dos elementos
Alineación: ruta visual entre elementos
Proximidad: agruapación de diferentes elementos.
Repetición: usos de mismos elementos
Espacio: lugar donde se aplican los conceptos básicos de diseño
super gracias por el aporte
Desbloqueando conceptos de los cuales no caía en cuenta
En esta aprte me hubiera gustado que explicara bien el por qué ese balance va de arriba hacia abajo y de izquierda a derecha. Al menos yo no lo entendí. ¿Alguien me lo podría explicar?
Esto es más una opinion personal:
La parte de arriba es más ancha que la de abajo, eso concentra la atención en la parte superior y nos hace empezar por ahi.
Y en el margen derecho parece que la imagen se pierde hacia el fondo. Como sí más adelante hubiera más contenido. Entonces, suponemos que el inicio esta en la izquierda.
Hola, Beicker.
Seguramente ya encontraste más información.
Por las dudas, o para estudiantes nuevos, dejo enlace al curso dónde se profundizan estos conceptos
confirmo deberian agregar alguna lectura o algun note de notas privadas en platzi :o nose seria una buena idea no?
para anotar tus datos y información valiosa por sectores o clases
nose ustedes que opinan?
Hola, Alejo.
Lo estamos haciendo. :)
Como diseñador, les puedo decir que conocer los fundamentos de diseño les hará ver el mundo de otra forma. Será como tener un súper poder, podrán entender cosas que están en frente de sus naricen y no habían notado.
Tambien compartirles que el Curso de Fundamentos de Diseño es oro puro y si les interesa aprender de diseño para programar, deben si o sí complementar este curso de diseño para programadores con el de fundamentos de diseño.
buen curso y claro
Como sugerencia para el curso, luego de esta clase agregaría una lectura que permitiera profundizar aún más los conceptos de diseño para dejarlos claros, y un poco más de ejemplos, ya que con 4 minutos no alcanza a repertirse el concepto.
Hola, Juan.
Seguramente ya encontraste más información.
Por las dudas, o para estudiantes nuevos, dejo enlace al curso dónde se profundizan estos conceptos
