50 banners de ilustración web: cómo diseñar banners web
(1) La suavidad de la forma orgánica.
La forma orgánica está compuesta por un cierto número de curvas y es una forma formada por las fuerzas externas e internas de los objetos naturales. La forma orgánica está llena de tensión interior, dando a las personas una sensación sencilla, cálida y enérgica. Por ejemplo, en la Figura 5.56, las curvas contrastan con la ilustración personalizada. (2) El encanto único del peinado accidental.
Las formas accidentales son figuras formadas al azar bajo la acción de una fuerza, que tienen una fuerte aleatoriedad y efectos naturales e interesantes. El método de refinar la belleza a través de factores accidentales hace que el diseño del banner sea más distintivo. Los efectos de claridad, forma, dispersión, textura y filtro de los pinceles en Photoshop son muy aleatorios y se pueden aplicar a diseños de pancartas.
(3) Reserve una gran área de espacio para el banner para la creación.
En diseño web, puedes reservar espacio para el diseño de banners. Si el diseño del Banner ocupa mucho espacio y ocupa un área importante y valiosa, puede ser difícil de manejar durante el proceso de diseño, pero si se maneja bien, obtendrá el doble de resultado con la mitad de esfuerzo y la información La transferencia será muy efectiva. (4) Redacción eficaz y botones orientados a la acción.
En el diseño de banners, a través de la visualización de productos reales, junto con eslóganes inspiradores y textos llamativos, se puede inducir directamente a los usuarios a hacer clic en botones orientados al comportamiento, lo que permite que la página web obtenga más clics de los usuarios y Atención. Puede tener un muy buen efecto de diseño. (5) Efectos combinados de exhibición de productos enriquecidos.
Utilizando el método de superposición para diseñar efectos especiales de banner para mostrar diferentes ejemplos de obras y adjuntar lemas introductorios, la página web se vuelve más convincente, rica en contenido y toda la página tiene un sentido de jerarquía, lo que Puede recibir un mejor efecto.
Estadísticas sobre elementos/tipos/estilos/pasos de diseño de banners. Definitivamente, banner no es una palabra desconocida para un diseñador. En la actualidad, la demanda de pancartas involucra básicamente varios campos industriales. Ya sea en la web o en el móvil, podemos ver banners en todas partes, por lo que dominar el diseño de banners es una habilidad esencial para todo diseñador.
Los banners (y la publicidad mediante banners) son la primera forma de publicidad online y la forma más común en la actualidad. Los anuncios de banner, también conocidos como anuncios de banner, son tableros de anuncios rectangulares que se extienden a lo largo de una página web. Cuando los usuarios hacen clic en estos banners, a menudo se vinculan a la página web del anunciante. Es una imagen que muestra el contenido publicitario del comerciante y se coloca en la página del anunciante. ¡Es la forma más básica de publicidad en Internet!
Ahora explicaremos los banners desde estos aspectos:
Uno: Los componentes de los banners
Dos: Tipos de banners
Tres: Selección de estilo de banner
Cuatro: pasos del diseño del banner
Uno: componentes del banner
Los componentes principales del banner se resumen brevemente aquí. Los siguientes puntos:
Los elementos principales del banner son: texto + elementos + fondo.
Los elementos se pueden subdividir en: elementos = producto + modelo + logotipo + adorno (los elementos aquí deben seleccionarse según la situación real del banner, opcional).
Como se muestra en la imagen:
(de pétalos)
2: Tipos de banners
Los tipos de banner que resumo aquí son dividido principalmente en Para:
01: banner de promoción de productos (productos nuevos, productos más vendidos)
02: banner de eventos (promoción navideña, promoción de productos)
Los banners son simples aquí y se dividen en dos tipos. Debido a que los efectos y propósitos de los diferentes banners son diferentes, necesitamos diseñar banners de diferentes estilos.
Para los banners de promoción de productos, lo más importante es resaltar las características del producto, por lo que los elementos más importantes que necesitamos para el diseño del banner deben ser el producto y una breve introducción del copywriting. En cuanto a los elementos de adorno, también podemos elegir los elementos adecuados según las características del producto real, o no embellecerlo. ¡El fondo es definitivamente indispensable!
01: Banner de promoción de producto:
Producto + texto + fondo
Por ejemplo:
(de pétalos)
Los casos anteriores tienen que ver con el estilo de diseño de los carteles de promoción de productos. Todos tienen una característica común que es ampliar el producto y luego ampliarlo para mostrar las características del producto. La introducción concisa de la redacción publicitaria y la gran cantidad de espacios en blanco resaltan las características del producto, haciendo que los ojos de los usuarios se sientan atraídos involuntariamente por el producto en sí.
Banner de promoción de producto:
Producto + texto + elemento + fondo
Por ejemplo:
(de pétalos)
La característica de este tipo de banner es que, además del producto en sí, se agregan otros elementos como adornos al banner para hacer que la imagen sea más saturada o dinámica.
Entonces la pregunta es
¿Cuándo es mejor añadir elementos al diseño del banner de un producto? ¿En qué circunstancias es mejor no añadir elementos?
En primer lugar, cuando es extremadamente necesario mostrar las características del producto, será mejor optar por no añadir elementos que interfieran con el producto.
Segundo: Para productos simples, es mejor no agregar elementos decorativos. Una gran cantidad de espacio en blanco es más adecuado para el estilo de productos simples.
02: Banner del evento
Producto + texto + elemento + fondo
Por ejemplo:
(de pétalos)
Para el diseño de banners para eventos, la mayoría de nosotros elegiremos colores brillantes, imágenes saturadas e impacto, creando una atmósfera animada. Esto también es esencial para agregar elementos, porque para el diseño de banners para eventos, cuanto más animada sea la imagen, mayor será la imagen. intensidad de la actividad, lo que atraerá a más usuarios y resaltará el título de la actividad tanto como sea posible.
Dos: selección del estilo del banner
Los banners vienen en varios estilos, pero los estilos elegidos para diferentes banners son definitivamente diferentes. Los diferentes estilos de pancartas brindan a las personas efectos visuales completamente diferentes. Una combinación adecuada puede permitir que las pancartas expresen mejor sus propias características y propósitos.
Por ejemplo:
01: Los banners promocionales para productos simples son más adecuados para estilos simples y limpios.
(de pétalos)
02: pancarta, productos de alta tecnología, elija estilos con sentido de la tecnología.
(Reflejado a través de gráficos y colores de la tecnología)
(De pétalos)
03: El banner de ropa de moda es adecuado para elegir el estilo de las imágenes de moda.
(Reflejado en forma y estilo únicos, gráficos y colores, etc.)
(de pétalos)
04: pancarta, marca de lujo de alta gama, Adecuado para combinar con estilos elegantes y de alta gama.
(Reflejado a través de colores de alta gama como negro, rojo y oro negro.)
(De los pétalos)
05: Lindos carteles de estilo para niñas \ Los niños son adecuados para elegir elementos de estilo lindo.
(A través de elementos lindos: ilustraciones, líneas, globos, amor, fuentes redondas, colores vibrantes, etc.)
(a partir de pétalos)
06: Nacional Los carteles de estilo/cultura/festival son más adecuados para elegir elementos con temperamento cultural.
(A través de pinceladas chinas, elementos chinos antiguos: focas, pinturas de paisajes chinos, tinta, abanicos, recortes de papel, cristales de ventanas de jardines, patrones antiguos, nubes auspiciosas, ópera de Pekín, pergaminos, etc.)
(de pétalos)
Dos: Pasos del diseño del banner
01: Comprender y determinar los requisitos de diseño del banner
02: Definir el propósito del diseño del banner
03: Determinar el estilo de diseño del banner en función de los requisitos de diseño del banner obtenidos.
04: Elija la estructura de diseño de banner adecuada
05: Elija elementos coincidentes para decorar el efecto general del banner (agregue según las necesidades reales)
06: Selección de color
01: Comprender y determinar los requisitos de diseño del banner
Esta comprensión de los requisitos de diseño, sin importar cuál sea la premisa del diseño, es un paso esencial y el paso más crítico. Si ni siquiera conoce los requisitos de diseño, los resultados del diseño definitivamente no satisfarán las necesidades reales.
Entonces, ¿qué necesitamos exactamente para aclarar los requisitos de diseño de los banners?
El primer punto: determinar el texto del diseño del banner.
El copywriting también es muy importante para los diseñadores. Los diseñadores pueden encontrar inspiración para el diseño en la información de redacción y conocer el estilo de diseño general.
El primer punto: determinar el tamaño del diseño del banner y la plataforma de entrega.
Una vez determinada la copia, también debemos comprender la plataforma, la ubicación, el tamaño y si es necesario adaptarla a la visualización de cada plataforma.
02: Definir el propósito del diseño del banner
Para diseñar un banner, debes querer lograr un cierto propósito antes de diseñarlo, por lo que debes tener claro qué diseño debe tener el banner. es el propósito, como si desea promocionar un producto o promocionar un producto. Los dos son de naturaleza completamente diferente.
03: Determine el estilo de diseño del banner en función de los requisitos de diseño del banner obtenidos.
Podemos encontrar palabras clave para el estilo de diseño de Banner a partir de los requisitos de redacción del banner para su posicionamiento, como el soporte para automóvil A5 con operación inteligente por voz completa.
Las palabras clave que podemos extraer de este texto temático son: lenguaje completo, inteligencia completa.
Al comprender estas palabras clave, definitivamente pensaremos en imágenes en la era de la tecnología inteligente, ¡así que elijamos el estilo aquí!
04: Elija la estructura de diseño de banner adecuada
La estructura de diseño de Banner se puede dividir aproximadamente en:
Estructura central, estructura alineada a la izquierda, estructura alineada a la derecha
¡La estructura del banner requerida por diferentes necesidades debe seleccionarse de acuerdo con la situación real!
05: Elija elementos que combinen para decorar el efecto general del banner (agregue según las necesidades reales)
También debemos elegir elementos decorativos apropiados para el banner según la situación real. y las características del banner del producto. Por ejemplo, las pancartas con productos simples no necesitan elementos decorativos, mientras que las pancartas con actividades lindas o para niñas y niños deben elegir elementos decorativos. La selección de elementos decorativos para pancartas de diferentes formas también es diferente (se presentó brevemente antes). así que no entraré en detalles aquí).
06: Selección de color
La elección del color también es muy importante. Diferentes pancartas eligen diferentes colores. Una combinación de colores adecuada hará que el producto sea más prominente o la imagen más llamativa, dando a las personas una sensación diferente.
Por ejemplo:
*La combinación de negro y dorado y negro y rojo dará a las personas una sensación de lujo.
*Los colores fríos como el azul, el negro y el morado dan a la imagen una sensación de dureza, espacio, velocidad y potencia, y son más adecuados para la tecnología.
*El rojo, el naranja, el amarillo y el morado crearán un ambiente cálido y son más adecuados para moda y eventos.
*La combinación de negro, blanco y gris dará a las personas una sensación de tener demasiado frío para acercarse, lo que es más adecuado para las elecciones de estilo de las grandes marcas.
*La combinación de blanco y gris dará a las personas una sensación de tranquilidad, literatura, temperamento y elegancia, y es más adecuada para elegir productos sencillos.
Caso real:
Requisitos de redacción publicitaria:
Soporte para automóvil con operación inteligente de voz completa A5
Soporte de voz obediente para agitar
Utilizando la solución de interacción hombre-computadora AIUI de iFlytek, se puede lograr una conducción inteligente en poco tiempo.
Tamaño del diseño: 1920x650px
Propósito del diseño: Según la demanda, el propósito del diseño del banner es promocionar el nuevo producto A5.
Paso uno: Colocamos en el lienzo la información del copy y los productos ofrecidos.
Paso 2: Aclare nuestro título principal "Soporte para automóvil con operación inteligente de voz completa A5"
Así que ampliamos el título principal y resaltamos el título principal.
Paso 3: Elige el estilo del banner Porque aquí lo que necesitamos es la inteligencia del producto, nuestro estilo se puede definir como tecnológico.
Paso 4: Selecciona la estructura del diseño. ¡Elijamos aquí una estructura simple de izquierda a derecha!
Paso 5: Selecciona los elementos decorativos. Los elementos decorativos también deben seleccionarse en función de los efectos tecnológicos que se pueden extraer del texto publicitario. Por ejemplo, aquí podemos extraer: líneas y gráficos tecnológicos, gráficos de voz, etc.
Paso 6: Ajusta la posición general y la combinación de colores. También tratamos los títulos de texto como jerarquías diferentes para que se destaquen más. La redacción de los subtítulos también se procesa ligeramente de acuerdo con el estilo general de la imagen, lo que hace que la redacción y la imagen sean más armoniosas y unificadas, incluidos los productos circundantes que deben procesarse debido a la influencia de la luz.
¡Finalmente obtendrás el efecto de banner de arriba! ¡Diseñé un banner tecnológico sencillo!
¡Está bien! ¡Hoy tengo mucho conocimiento y es bastante completo! ¡Espero que te guste!
Buenos artículos recomendados en números anteriores
—
Diseño de diseño: 7 métodos simples de diseño de imágenes
Diseño de 10 carteles gráficos de líneas creativas
¡Enséñale habilidades para mezclar colores y deshazte del dilema de la mezcla de colores!
Conceptos innovadores de diseño de carteles
Los métodos para diseñar banners web son los siguientes:
1. Centrarse en el texto
Aunque ahora vamos. el sitio web La mayoría de las imágenes abogan por ilustraciones, que pueden mejorar la experiencia del usuario. Sin embargo, ahora vemos que muchos sitios web son principalmente imágenes, lo que hace que sea fácil caer en un malentendido: las imágenes de banner solo se utilizan para mostrar los principales productos o empresas. del sitio web en forma de imágenes. De hecho, es difícil que un banner de este tipo atraiga usuarios. Porque algunos usuarios todavía necesitan una cierta cantidad de texto para comprender el contenido del anuncio. Si se trata principalmente de texto, debe ser conciso. Estas ilustraciones y texto pueden ayudar a aumentar las tasas de clics.
2. No mostrar información de precios.
El consumidor medio es muy sensible al precio. A menos que el precio de su producto sea mucho más bajo que el de los productos de la misma industria y tenga una ventaja de precio, no se recomienda mostrar información de precios en el banner. Porque una vez que el precio no es aceptable para el usuario, el usuario ignorará este banner.
3. Añade palabras como gratis o gran descuento.
Según la psicología de consumo de muchos consumidores, les gustan mucho los productos de alta calidad y bajo precio. Lo mismo ocurre con la promoción de sitios web corporativos y el diseño de banners. Agregar palabras como gratis o grandes descuentos en el banner también puede atraer usuarios de manera efectiva.
4. El diseño tiene un atractivo conductual.
Normalmente vemos un botón tipo clic o un enlace en algunos banners de Internet, y subconscientemente tenemos la idea de hacer clic en él, pudiendo hacer clic involuntariamente. Este enfoque también puede mejorar las tasas de clics.