Ventana
Construcción
La ventana es un elemento fundamental para la identidad. Nos ayuda a establecer jerarquías, dar relevancia a la información y una personalidad propia y distintiva a la marca.
Dentro de ella se ubica el texto correspondiente a los materiales de comunicación.
La ventana se construye a partir de un rectángulo con 3 esquinas en punta y una curva. La esquina curva de la ventana siempre debe estar localizada en el lado inferior derecho de la misma.
Para definir el tamaño de la curva en un material de comunicación, se ha generado una fórmula que establece su proporción en la mayoría de los formatos. El tamaño de la curva se definirá a partir de un círculo cuyo diámetro sea una séptima parte (1/7) del lado más corto del formato, en este caso “x”.
Descarga las versiones oficiales de la ventana
Excepciones del ancho de la curva
Hay casos específicos en los cuales el formato del material de comunicación requiere un ajuste en la manera de calcular el ancho de la curva, esto con la finalidad de mantener coherencia en su construcción y que no se vea desproporcionada en este tipo de formatos.
Formatos muy angostos
Para determinar la curva en formatos verticales muy angostos, el tamaño del diámetro del círculo que se utiliza para construir esta curva debe ser equivalente a 1/5 del lado más corto del formato.
Formatos horizontales alargados
El tamaño de la curva en formatos horizontales alargados se determina calculando 1/3 del lado más corto del formato. Esta dimensión es el diámetro del círculo que se utiliza para construir la curva.
Crecimiento de la ventana
El tamaño de la ventana se aumenta a partir de los extremos superior o izquierdo de la misma. Se toman los dos puntos del lado que se quiere crecer y se arrastran; de esta manera, la curva de la ventana no se distorsiona.
Movimiento de la ventana en el formato
Las ventanas pueden desplegarse a través del formato del material de comunicación. La posición de la ventana jamás debe interferir con la lectura del material de comunicación, ni obstruir a los demás elementos informativos que estén fuera de la ventana tales como: logotipo, descriptor de negocio, legales o canales de contacto. La ventana sólo puede ir sangrada del lado izquierdo, nunca deberá sangrarse a más de un lado.
A continuación, se muestran ejemplos de cómo se puede desplazar la ventana en el formato y algunos de los usos incorrectos.
Área de la ventana
Con la finalidad de que la ventana no sea de tamaño excesivo o muy pequeña, se estableció un máximo y un mínimo del total del área que ésta puede ocupar dentro del formato.
El área máxima que ocupa una ventana no debe rebasar el 45% del formato y el área mínima no debe ser menor al 15% del área total del formato.
Ancho de la ventana
Se establecieron dimensiones máximas y mínimas para el ancho de la ventana con el propósito de que ésta no se vea muy alargada o corta dentro del formato.
El ancho máximo que ocupa una ventana no debe rebasar el 90% del tamaño del lado más corto del formato y para el caso del ancho mínimo, éste no debe ser menor al 55% del tamaño del lado más corto del formato.
Ancho máximo en formatos verticales
Ancho mínimo en formatos verticales
Excepciones
Solamente para casos específicos, los valores máximo y mínimo del ancho de la ventana pueden cambiar, siempre en forma proporcional. Estas excepciones se aplican en formatos especiales con el fin de que la ventana conserve su proporcionalidad.
Máximo en formatos horizontales alargados
Mínimo en formatos horizontales alargados
Máximo en formatos horizontales muy apaisados
Mínimo en formatos horizontales muy apaisados
Máximo en formatos muy angostos
Mínimo en formatos muy angostos
Tipos de ventana
Para tener una mayor versatilidad en la composición de los materiales de comunicación, se desarrollaron varios tipos de ventanas que pueden utilizarse dependiendo de las necesidades del material.
A continuación, se muestran ejemplos de los diferentes tipos de ventanas que se pueden utilizar.
- Ventana sangrada (sólo se puede emplear sangrada al lado izquierdo).
- Ventana libre sobre el formato.
- Ventana dividida – sangrada (sólo se puede emplear sangrada al lado izquierdo).
- Ventana dividida libre sobre el formato.
- Doble ventana.
- Doble ventana con división.
Usos incorrectos de la ventana
Solamente se pueden usar las ventanas especificadas anteriormente. Aquí se muestran ejemplos de las maneras en las que nunca deben emplearse las ventanas.
- Ventana con más de una curva.
- Ventana con la división en la parte inferior.
- No dividir una ventana en más de dos segmentos.
- Cuando es ventana doble, la parte inferior no lleva curva.
- Ventana doble: elemento superior cuadrado y elemento inferior con curva.
- Cuando la ventana es dividida, las partes no deben estar separadas.
Uso de la ventana dividida
A continuación se muestra el uso correcto de la ventana dividida.
- Cuando se quiere diferenciar el nombre del producto del resto del texto.
- Cuando una parte de la ventana está sobre la imagen con el fin de resaltar el texto que queda sobre la misma. El texto a diferenciar puede ser el nombre del producto o el título del mensaje.
Uso de la ventana doble
La ventana doble se puede utilizar en los siguientes casos:
- Para dar relevancia al titular, colocándolo en la ventana superior.
- Con la ventana superior dividida para resaltar el nombre del producto.
La ventana inferior siempre tiene que ser de color blanco y llevar sombra por detrás.
Cómo hacer la sombra en la ventana doble
Para aplicar la sombra que va detrás de la ventana se deben seguir los siguientes pasos:
- Duplicar la ventana blanca.
- Aplicarle color negro al 30%.
- Aplicar el efecto “Gaussian Blur” como se muestra en la imagen.
- Poner la transparencia en “Multiply”.
- Enviarla detrás de la ventana blanca y moverla ligeramente hacia la esquina inferior derecha.
Ventana e imagen
Con el fin de que las ventanas y las imágenes convivan armónicamente, se establecieron los siguientes parámetros para el funcionamiento de estos dos elementos.
- La ventana puede ir sobre la imagen para diferenciar el nombre del producto.
- La ventana puede ir sobre la imagen para diferenciar el titular.
- La ventana puede estar totalmente sobre la imagen.
- La ventana doble sólo se puede usar estando en su totalidad sobre la imagen.
Ventana sin imagen
Para aquellos casos en los que no se cuenta con una imagen para el aviso, se pueden utilizar gráficos como tablas y elementos estadísticos sobre fondo blanco. En ellos, la ventana debe convivir bajo los mismos lineamientos descritos anteriormente para su ubicación y manejo. A continuación se muestran algunos ejemplos esquemáticos.
Ventana en contorno
La ventana en contorno es un recurso que se utiliza únicamente en avisos tipográficos o en avisos donde los íconos tengan gran presencia. No se podrá utilizar este tipo de ventana en avisos con imagen o en ningún otro caso que no esté indicado en este apartado.
El color del fondo donde se encuentre la ventana debe ser el color según la unidad de negocio, la línea debe ser color blanco..
Texto dentro de la ventana
En esta sección se analizarán los elementos tipográficos que están dentro de la ventana. En este esquema se muestra cuáles pueden ser los elementos, la tipografía y los pesos que deben utilizarse en cada caso.
Tamaños mínimos
Para garantizar una fácil lectura de la información y tener la proporción adecuada entre los elementos tipográficos, se han establecido tamaños mínimos para cada elemento.
Las medidas están basadas en un formato tamaño carta, por lo que para determinar los tamaños en otros formatos se debe utilizar una escala proporcional a esta referencia.
Tamaños máximos
Para garantizar una fácil lectura de la información y tener la proporción adecuada entre los elementos tipográficos, se han establecido tamaños máximos para cada elemento.
Las medidas están basadas en un formato tamaño carta, por lo que para determinar los tamaños en otros formatos se debe utilizar una escala proporcional a esta referencia.
Márgenes
Con el fin de que los textos dentro de la ventana sean de fácil lectura, se determinó la distancia que debe existir entre ellos, así como la distancia entre los textos y el límite de la ventana.
La medida rectora que se usa para determinar estas distancias es “M” que, como anteriormente se explicó, corresponde al 3% del lado más corto del formato. Los esquemas muestran cuántas medidas “M” debe haber entre cada elemento en los distintos tipos de ventana.
Color en tipografía
El color principal de las ventanas es el azul PANTONE 286 C. Se puede emplear el degradado de azules, el color blanco o amarillo PANTONE® 809C en menor proporción, con un máximo de uso del 30% del color total aplicado. Los siguientes esquemas muestran ejemplos del uso del color en las ventanas.
Seguros
Se puede aplicar el color blanco o amarillo PANTONE® 809C para diferenciar el nombre del producto o titular
Estos mismos casos se pueden usar con la ventana doble
Degradado y transparencia
Para darle dinamismo al sistema, hay ocasiones en que las ventanas pueden presentar degradados y transparencias. Únicamente se usan cuando la ventana está dividida y se deben implementar sobre el recuadro superior, nunca sobre el inferior ya que son elementos gráficos secundarios y no deben ser protagónicos.
Usos incorrectos
No se debe:
- Usar el color aqua en ninguno de los espacios o en la tipografía.
- Usar el color azul PANTONE® 286C en menor proporción que los demás.
- Dejar sin texto el espacio superior donde va el nombre del producto.
Otros negocios
El color principal de las ventanas es el de cada negocio. Se puede emplear el color blanco en menor proporción, con un máximo de uso del 30% del color total aplicado.
Los siguientes esquemas muestran ejemplos del uso del color en las ventanas.
Usos incorrectos
No se debe:
- Usar el color azul PANTONE® 286C o amarillo PANTONE® 809C en ninguno de los espacios.
- Usar el degradado de azules.
- Dejar sin texto el espacio superior donde va el nombre del producto.
- Dejar en menor proporción el color del negocio.
- Usar el color aqua en los textos.
'