¿Cómo aumentar las capas de diseño?
Combina todos los elementos de la imagen de forma razonable, clara y rítmica para que toda la imagen luzca más cómoda, agradable y armoniosa. ¿No se siente muy profundo? Bueno, en otras palabras: ni demasiado, ni demasiado, cómodo a la vista, ¡perfecto!
Este artículo está dividido en tres capítulos, cada capítulo tiene varios puntos de conocimiento subdivididos. ¡Lea atentamente!
Para una comprensión preliminar, echemos un vistazo al esquema del artículo:
Primero, el nivel de la imagen
Utilice puntos, líneas y superficies para dividir la imagen.
Mensaje
Buscando capas en fotografía
Segundo, el nivel de color
Contraste de colores
La popularidad de los colores degradados
Control de coincidencia de varios colores
En tercer lugar, el nivel del texto
Contraste de fuente
Contraste de palabras
p>
Haga clic para ingresar una descripción de la imagen.
Primero, la jerarquía de la imagen
1. Utilice puntos, líneas y superficies para dividir la imagen.
Los puntos, líneas y superficies son los elementos de diseño más básicos en diseño. Los estudiantes que han estudiado composición de planos deben saber que los puntos se conectan para formar una línea, los puntos se conectan para formar una superficie y una superficie reducida hasta cierto punto se convierte en un punto. El límite de una superficie curva es una línea. Cuando el ancho de la línea aumenta y los puntos se extienden a un área determinada, se convierte en una superficie curva.
Las palabras anteriores pueden parecer complicadas, pero si lo piensas detenidamente, este es el principio de todo en el mundo, incluso el universo y las estrellas. He aquí un ejemplo.
Haga clic para ingresar una descripción de la imagen.
La imagen de arriba puede resumir básicamente todos los cambios en puntos, líneas y superficies. Analicémoslo a continuación.
Haga clic para ingresar una descripción de la imagen.
El elemento de cruz en el círculo rojo se puede considerar como un "punto" y aparece como un elemento decorativo en la imagen general. Cabe señalar que el llamado "punto" no es sólo un círculo. Cualquier elemento con el tamaño y área más pequeño de la figura puede considerarse un "punto". Los puntos del gráfico pueden considerarse "puntos" o "superficies". Entonces, incluso si es punto a punto, es correcto.
Haga clic para ingresar una descripción de la imagen.
¿Qué crees que es la línea en el círculo amarillo? Creo que no es una línea sino un punto. ¿Por qué? Porque tanto su proporción en el cuadro como su papel son atributos de un punto. ¿Dónde están los límites? En el cruce de los bloques verde y rojo. y límites de bloques de color. Y esto sólo ilustra un uso importante de la "línea": la segmentación. Las "líneas" de la imagen dividen la imagen completa en cuatro áreas de diferentes tamaños, lo que hace que la imagen sea más interesante y en capas.
Haga clic para ingresar una descripción de la imagen.
Las cuatro áreas divididas por las líneas son también las "caras" de los elementos.
Esta ilustración no solo ilustra varias características importantes de puntos, líneas y superficies, sino que también demuestra que los puntos, líneas y superficies no son fijos debido a sus formas, sino que cambian constantemente.
Finalmente, resuma algunas características de los puntos, líneas y superficies:
Punto: es el elemento más decorativo, por lo que en la mayoría de los casos juega un papel decorativo en el cuadro.
Línea: Además de decorar, también cumple la función de dividir la pantalla, insertar elementos y guiar la visión.
Cara: suele desempeñar un papel en la estabilización de la imagen y en la transmisión de información importante.
Otra cosa a tener en cuenta es que los puntos, líneas y superficies se utilizan en combinación. Piensa en cómo expresar las características de puntos y líneas sin una superficie plana.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
A través de estos casos de diseño, podemos analizar y concluir que el uso eficaz de la combinación de puntos, líneas y superficies puede diseñar obras con ricas capas. ¿Cómo hacemos esto? -Reemplazar copia. Aprenda de los puntos, líneas y elementos superficiales de buenos trabajos de diseño y luego aplíquelos e innove.
Haga clic para ingresar una descripción de la imagen.
Dejar en blanco
El blanco es una técnica muy común en diseño. Borrar no sólo hace que la imagen sea clara, limpia y respirable, sino que también hace que la comprensión y aplicación del "rostro" sea más profunda. El diseño minimalista que se usa ampliamente ahora es un mejor tipo de diseño en términos de espacio en blanco.
Aquí primero hablaremos sobre el impacto de los espacios en blanco en la jerarquía y veremos algunos casos de diseño.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
La característica común de los trabajos de diseño anteriores es que hay muchos espacios en blanco en el diseño y se procesa el nivel de la imagen, como la comparación de tamaños entre el espacio en blanco y la imagen principal. , la comparación directa entre el título y el texto complementario, etc.
Haga clic para ingresar una descripción de la imagen.
Procesé la imagen de arriba y la dividí en capa de fondo, capa en blanco, capa de modelo principal, capa de copia de título y capa de copia de función. Aquí puedes ver cómo está diseñado el nivel de este diseño. Es posible que también desees deconstruir tus diseños favoritos de esta manera para estudiar el nivel de diseño.
3. Buscando capas en la fotografía
Hoy en día se utilizan cada vez más imágenes fotográficas, especialmente trabajos fotográficos de alta calidad que muchas veces pueden garantizar al máximo la calidad del diseño. . ¿Pero por qué? ¿Alguna vez has pensado en ello? Una razón es que la fotografía tiene capas.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Todo el mundo conoce este auricular con montura B, que está hecho de fotografía y tiene tres niveles: plano cercano, plano medio y plano lejano. No sólo tiene un aspecto muy refinado y rico, sino que también tiene una textura estupenda.
¿Pero qué pasa si hay menos capas de imágenes? Es muy sencillo, podemos utilizar texto como elementos gráficos para aumentar el nivel de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
En segundo lugar, el nivel de color
1. Contraste de color
Usar colores contrastantes y colores contrastantes para el diseño también es un método común para aumentar la sensación de nivel. , debido a que hay un contraste de color muy fuerte, el impacto de la imagen será muy fuerte y la impresión visual será más emocionante.
El color contrastante del negro y el amarillo es una combinación de colores muy clásica. Aunque solo hay dos colores, quedará muy rico gracias a la combinación de redacción publicitaria e imágenes. En esta combinación de colores minimalista, es aún más necesario hacer un uso razonable de puntos, líneas y superficies, de lo contrario resultará un poco monótono.
Haga clic para ingresar una descripción de la imagen.
A juzgar por el diseño anterior, cuando el diseñador usó negro y amarillo para combinar los colores, usó el color contrastante amarillo-azul. Esto no solo puede enriquecer el color de la imagen, sino también realzarlo. Los colores de la imagen se vuelven más vivos. Los elementos importantes resaltan y sirven como énfasis.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Los colores amarillo y azul y el rojo y verde también son colores clásicos de uso habitual. Como se puede ver en los dos casos anteriores, la combinación de colores amarillo y azul tiene una alta saturación y parece joven, moderna y tecnológica, mientras que el otro diseño tiene una combinación de colores rojo, verde y azul de baja saturación, que parece más retro e integrada. profundidad.
2. La popularidad de los colores degradados
Gradient ha sido popular durante varios años. Este año, la aplicación móvil de Taobao también diseñó gradientes, lo que demuestra que el alcance del uso de gradientes también está creciendo. El degradado en sí tiene las características de capas ricas, por lo que el uso de degradados y la combinación razonable de elementos de puntos, líneas y superficies producirán impacto y enriquecerán las capas de la imagen al máximo.
En nuestro diseño diario, todavía necesitamos elegir el valor del color de los colores con más cuidado. En términos generales, elegiremos el mismo degradado de color, un degradado de color adyacente y un degradado de color contrastante. El número de colores degradados no debe exceder de dos. Más de dos colores degradados requieren capacidades de control de color muy sólidas para controlarlos. Me refiero a más de dos colores en un mismo degradado.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
El uso de colores degradados aparece principalmente en el diseño de la interfaz de usuario y, con el desarrollo del diseño de la interfaz de usuario, existen muchos métodos de diseño y métodos de combinación de colores para el diseño web, ya sean páginas web o comercio electrónico.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Los colores degradados se pueden usar juntos. Por ejemplo, la imagen de arriba pertenece al mismo degradado de color. Sin embargo, existe una regla para este uso, es decir, la saturación de varios colores degradados que coincidan entre sí. Debe ser básicamente el mismo; de lo contrario, aparecerá la pregunta "Flor".
3. Control de la combinación de varios colores
Para el diseño multicolor, lo que debemos hacer es controlar la saturación y el brillo, e intentar mantener la saturación y el brillo de Cada color es consistente. Ya sea un estilo chino ligero o un estilo fuerte europeo y americano, la imagen será rica y en capas, sin ser "caótica" o "florida".
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Podemos ver que hay muchos colores en la leyenda de arriba, pero ¿por qué sentimos que son muy ricos y en capas? Así es, la saturación y el brillo están bien controlados.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
En tercer lugar, el nivel del texto
1. Comparación de fuentes
Las fuentes son una parte difícil que debemos utilizar en nuestro diseño, pero la forma es la que preocupa. todos harán que la imagen sea extremadamente rica en niveles. Incluso cuando solo hay texto y no hay patrón, siempre que el diseño sea razonable, puedes obtener resultados sorprendentes.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Las diferentes fuentes expresan diferentes concepciones y significados artísticos, especialmente las fuentes chinas se han transmitido durante miles de años y cada carácter tiene un significado específico. El texto occidental está decorado principalmente con fuentes serif y no serif. A veces áspero, a veces delicado.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
2. Comparación de palabras
La comparación aquí incluye fuente, tamaño, grosor, color, etc. ¿Por qué elegimos comparar? Debido a que el contraste es la mejor manera de abrir y reflejar capas, hablemos de ellas una por una.
Haga clic para ingresar una descripción de la imagen.
Estoy aquí para analizar y deconstruir este trabajo.
El 30% es el área más grande de texto y la mayor proporción de elementos de imagen. La descripción del cupón de descuento muestra que es información de descuento, y esta descripción también es la segunda proporción más grande en la figura. Luego, la siguiente información, como hora, dirección, número de teléfono, etc., utilice la cantidad mínima de palabras. Con estos tres tamaños de texto, activa las capas y obtén tres niveles a la vez. Junto al fondo del patrón anterior, un lazo dorado sobre fondo blanco, hay un total de 6 niveles. Además, para unificar la imagen, las fuentes del texto son todas serifas.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Los dos carteles anteriores son iguales, puedes interpretarlos.
En cuanto al color de la fuente, los dos carteles de aranya de arriba son una serie. Los colores del texto del tema aranya se cambiaron a verde y azul respectivamente. Por un lado, puede aumentar las capas. del copywriting, y por otro lado, se puede combinar con el tema visual. Los colores están unificados. A continuación se muestran algunos ejemplos de diseño que puede intentar analizar.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Haga clic para ingresar una descripción de la imagen.
Finalmente, hablemos de alineación. La alineación hace que la imagen esté más ordenada y parezca más razonable y cómoda. Usemos el cartel de arriba para analizarlo.
Haga clic para ingresar una descripción de la imagen.
Mira estas líneas azules, que son la alineación de este cartel.
Resumen
De hecho, el sentido de jerarquía se forma mediante el uso integral de la división de puntos, líneas y superficies, la combinación de colores y la disposición del texto. términos de tamaño, proporción, selección de color, alineación, etc. Esfuércese por alcanzar la perfección en los detalles y el sentido de jerarquía surgirá naturalmente.