libro de estilo - liquid design · 4 // 30 libro de estilo libro de estilo 5 // 30 bienvenido a el...
TRANSCRIPT
LIBRODE ESTILO
FECHA DE CREACIÓN :
MARZO 2017
ASUNTO
MANUAL DE ESTILO DE MARCA
EH SPORTS
REALIZADO POR
PALO SECO
HECHO CON AMOR POR:
OSCAR BLASCO
Guia visual para EHsports
Libro de estilo 3 // 30Libro de estilo2 // 30
SEC. 00 | INTRODUCIÓN 04
SEC. 01 | LOGOTIPO 06
SEC. 02 | TYPOGRAFÍA 12
SEC. 03 | COLOR COORPORATIVO 16
SEC. 04 | PAPELERÍA 18
SEC. 05 | SOCIAL MEDIA 20
SEC. 06 | WEBSITE 22
SEC. 07 | ELEMENTOS DE DISEÑO 28
LIBRO DE ESTILO EHSPORTS
Índice
Libro de estilo 5 // 30Libro de estilo4 // 30
Bienvenido a el libro de estilo de EHsports, el documento que va a ayudarte a tener una dirección de todo lo que puedas necesitar en cualquier aspecto del desarrollo de marca. La información sobre el diseño de marca y todas sus aplicaciones están incluidas en este documento para que sirva de referencia para tener claras las directrices sobre la imagen de la marca.
El nacimiento de una marca es un momento muy importante, porque es el primera impresión hacia nuestro público, y sabemos que las primeras impresiones cuentan mucho. Para hacer esto, necesitamos mostrar en cada aspecto de la marca coherencia y unidad. Con su ayuda, estamos seguros que conseguiremos transmitir el mensaje que queremos al público, para que puedan conectar con EHsports.
La guía de estilo está para ayudarte, para organizar la marca y saber que estás en la dirección correcta cuando trabajas con la imagen de la marca. Piensa en este documento como una competición, el entrenador estudia al rival, nuestras posibilidades y una táctica para vencer. Por muy bueno que sea el jugador, si no sigue las pautas establecidas por el entrenador, los resultados no serán los óptimos.
Todos los archivos que necesitas para que EHsports sea la marca que todos hemos pensado, están adjuntos en el archivo Branding guideline.zip
DATOS DE CONTACTO
Si tenéis alguna duda sobre la información que aparece en este documento, por favor usar los datos de contacto que aparecen a continuación.
Oscar BlascoEmail:[email protected]:(+34) 619 10 18 32
INTRODUCCIÓN
Piensa en este documento como una competición, el entrenador estudia al rival, nuestras posibilidades y una táctica para vencer.Por muy bueno que sea el jugador, si no sigue las pautas establecidas por el entrenador, los resultados no serán los óptimos.
BIENVENIDO AL LIBRO DE ESTILO DE EHSPORTS
-
Libro de estilo 7 // 30Libro de estilo6 // 30
LOGOTIPO CORPORATIVO
Logo Logotype
ehsports logotipo completo
THE LOGO SYMBOL
Consiste en la parte con más fuerza del logotipo, ya que por si sola también funciona.
Esta primera parte del logotipo y funciona en el color principal de la marca.
THE LOGO TITLE
La segunda parte del logo es la formada por la palabra sports. Esta segunda parte se puede substituir por otras palabras, como son los distintos deportes que se emiten en Ehsports .
Logotipo completo
Logotipo simple
Versiones logotipo LOGO DARK VERSION
Lo usaremos cuando el fondo sea blanco o claro.
LOGO LIGHT VERSION
Lo usaremos cuando el fondo sea negro u oscuro.
El logotipo es el elemento clave para definir una identidad de marca. En nuestro caso EHsports es un logotipo compuesto por dos partes, una parte que funciona como elemento fijo y una segunda parte que va variando.
El logotipo de Ehsports está formado por dos partes. La primera parte formada por EH es una parte fija, que funciona junto a varias variaciones e incluso sola. La segunda parte formada por sports es la parte cambiante, que variará dependiendo de las necesidades.
Eh simboliza el esfuerzo, es una onomatopeya que refleja la intensidad del deporte. Por eso, va acompañado de un punto que junto a la línea de la H forma una exclamación.
La tipografía creada para EH sports es un variación de la tipografía futura extremadamente cursiva para darle velocidad y movimiento a la imagen de la marca. Se combina con una futura en minisúcula y black que consigue que crea un balance perfecto en el logo y consigue que fijemos nuestra atención en la EH o primera parte del logotipo.La selección de los colores en la marca, proporcionan a esta, una imagen moderna, fuerte y dinámica.
Libro de estilo 9 // 30Libro de estilo8 // 30
kate urf
now
xx
xx
x
x
x
x
xx
Construcción
Variación de Logo
Como hacerlo
1. No cambiar la tipografía
2. No alterar los colores
3. No usar palabras más largas de 6 letras
4. No alterar la relación de tamaños
5. No alterar el tracking entre letras
PORFAVOR LEER CON ATENCIÓN LAS SIGUIENTES NORMAS
-
Clearspace
CONSTRUCCIÓN DEL LOGOTIPO Y ESPACIADOS
Es importante mantener un espacio limpio rodeando nuestro logotipo.Este espaciado indica cuan cerca puede estar cualquier otro elemento gráfico o mensaje en relación a la marca.
DEFINICIÓN
Siempre que se use el logo debe ir rodeado por un espacio limpio imaginario. Así nos aseguramos
que el logotipo sea legible y consiga el máximo impacto.
CÁLCULO
-
Para saber el tamaño adecuado de espaciado a dejar. Dividir el alto del logotipo en dos. (Clearspace = Altura/ 2).
Libro de estilo 11 // 30Libro de estilo10 // 30
Fuente corporativa 01Futura
Fuente principal :
Futura
-
Diseñador :
Paul Renner
-
Bold
Regular
Figures
Characters
TIPOGRAFÍA CORPORATIVA
Fuentes y tipografíacorporativa
La tipografía juega un rol muy importante en la comunicación. Hay que ser muy cuidadoso con la tipografía ya que si no usamos la correcta perderemos la personalidad y la esencia que tiene la marca.
Usaremos la fuente Futura y Montserrat. La combinación de las dos crea una fusión perfecta, que define el carácter de EHsports tanto en print (futura) como en digital (Montserrat).
01 A B C D E F G H I J K L MN O P Q R S T U V W X Y Za b c d e f g h i j k l mn o p q r s t u v w x y z
A B C D E F G H I J K L M
N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m
n o p q r s t u v w x y z
0 1 2 3 4 5 6 7 8 9 0
! “ § $ % & / ( ) = ? ` ; :
¡ “ ¶ ¢ [ ] | { } ≠ ¿ ‘
« ∑ € ® † Ω ¨ ⁄ ø π • ± ‘
Libro de estilo 13 // 30Libro de estilo12 // 30
Texto
Bold
Regular
Figures
Characters
Copy Texto
Headlines
ehsports- Montserrat Regular 6 pt Type / 9 pt Leading
ehsports- Montserrat Regular 8 pt Type / 11 pt Leading
ehsports
- Montserrat Regular - Capital Letters 10pt Type / 10pt Leading
Sublines
ehsports- Futura Bold - Capital Letters 34pt Type / 30 pt Leading
ehsports- Futura Bold - Capital Letters 46pt Type / 46 pt Leading
ehsports- Futura Bold - Capital Letters 16pt Type / 16pt Leading
Grandes Headlines y titulos
Grandes titulares
Tipografía y jerarquía
A B C D E F G H I J K L MN O P Q R S T U V W X Y Za b c d e f g h i j k l mn o p q r s t u v w x y z
A B C D E F G H I J K L M
N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m
n o p q r s t u v w x y z
0 1 2 3 4 5 6 7 8 9 0
! “ § $ % & / ( ) = ? ` ; :
¡ “ ¶ ¢ [ ] | { } ≠ ¿ ‘
« ∑ € ® † Ω ¨ ⁄ ø π • ± ‘
TIPOGRAFÍACORPORATIVA
Fuente corporativa 02 Montserrat
Fuente secundaría :
Montserrat
-
Diseñador :
Julieta Ulanovsky
-
Libro de estilo 15 // 30Libro de estilo14 // 30
El color es algo fundamental para una identidad de marca. Pero en el caso de EHsports es aún más importante porque forma parte del logotipo y es un rasgo muy distintivo. El color principal de Eh sports no es un color plano si no un degradado entre
los dos colores secundarios. Este degradado se identificará con la marca y todas sus piezas. Dotando a esta de un aspecto innovador, moderno y dinámico.
COLORES CORPORATIVOS
COLOR PRIMARIO
-
PRIMARY COLOR
GOLD
COLOR PRIMARIO
DEGRADADO
-
CÓDIGOS DE COLORES
CMYK : C079 M088 Y019 K006Pantone : 7679C RGB : R87 G56 B120Web : #583879
Colores secundarios-Explicación: Los colores secundarios son complementarios al color oficial, pero no son identificadores para EHSports. Los colores secundarios deben usarse con moderación, es decir, en menos del 10% de la paleta en una sola pieza.
Color CodesCMYK : C079 M088 Y019 K006Pantone : 7679C RGB : R87 G56 B120Web : #583879
Color CodesCMYK : C000 M085 Y065 K000Pantone : Red 032 C RGB : R255 G61 B68 Web : #ff3c44
Color CodesCMYK : C061 M000 Y034 K000Pantone : 442C RGB : R099 G191 B183Web : # 62bfb7
CMYK : C000 M085 Y065 K000Pantone : Red 032 C RGB : R255 G61 B68 Web : #ff3c44
Libro de estilo 17 // 30Libro de estilo16 // 30
Tarjetas de visita
La papelería de EHsports
Dimensiones 85 x 55 mm
Peso 600g/m Papel blanco satin
Print CMYK
Aquí podremos ver el diseño de algo tan fundamental para
una marca como sus tarjetas de visita..
Vista contra Vista frontal
Parámetros
Dimensiones 210 x 297 mm
Peso 90g/m Papel blanco mate
Print CMYK
Parámetros
Aquí podemos
ver los elementos
fundamentales
del stationary
de EHsports.
Como podemos
ver el uso del
color y de las
líneas diagonales
tomarán un papel
fundamental en
nuestra imagen.
USO
-
El Dina-4 diseñado será usado para cualquier documento oficial de EHsports, así como facturas, cartas o cualquier otro documento.
USO
-
Las tarjetas de visita son algo fundamental en una marca. En la parte de atrás podremos personalizarlas con los detalles necesarios para cada persona.
Libro de estilo 19 // 30Libro de estilo18 // 30
Facebook Page
SOCIAL MEDIA GUIDES
FACEBOOK MEDIA GUÍA DE ESTILO
- Explicación: Aquí encontrarás las guías de estilo para nuestras redes sociales.
Este apartado te servirá de ayuda al preparar los post en la dirección correcta para que toda la marca tenga cohesión y el mensaje a transmitir sea el correcto.
Imagen de perfil:
• Las imágenes deben medir al menos 180 x 180 pixels
• Las imágens aparecen en la página en 160 x 160 pixels
• El thumbail de la imagen mide 32 x 32 pixels
Imagen de portada:
• El tamaño en el que aparece es de 851 x 315 px
• Cualquier tamaño menor se verá pixelado
• El tamaño mínimo es de 399 x 150 px
• La mejor opción es un RGB JPG no superior a 100MB.
• Si la imagen tiene logotipo o texto la mejor opción es un PNG.
01
Facebook Media Guidelines
Link : 1200 x 627 px
• El tamaño en el que aparece es 1200 x 627 px
• Foto rectangular: Min. 470 x 246 px
• Foto rectangular: Min. 484 x 252 px on page
Post: 1200 x 900 px
• El tamaño en el que aparece es de 1200 x 900 px
• Cualquier tamaño menor se verá pixelado
• El tamaño mínimo es de 399 x 150 px
• La mejor opción es un RGB JPG no superior a 100MB.
• Si la imagen tiene logotipo o texto la mejor opción es un PNG.
Libro de estilo 21 // 30Libro de estilo20 // 30
EJEMPLO DISEÑO HOMEPAGE
- Explicación: Se trata de una web app con un uso muy intuitivo. 4 opciones principales en nuestro menú principal para redirigir fácilmente a los usuarios y el resto de contenido a modo de scroll.
DiseñoHomepageWEB DESIGN &
DEVELOPMENT
Libro de estilo 23 // 30Libro de estilo22 // 30
HOMEPAGE EN TABLET
- Explicación: En el diseño de tablet el menú sigue siendo desplegable pero en este caso si que podemos ver 4 imágenes por línea ya que el tamaño del dispositivo nos los permite.
HOME EN MOVIL
- Explicación: Variamos un poco el diseño de la web. Desaparece el menú principal para hacerlo despegable y más fácil de clicar. Y pasamos de 4 imágenes por línea a 2, para conseguir una buena visualización de las mismas.
Homepageen tabletHOMEPAGE EN
MOVIL
Libro de estilo 25 // 30Libro de estilo24 // 30
MENÚ FULLWITH
- Explicación:Se trata de un menú de scroll donde las secciones serán los diferentes deportes, al hacer scroll sobre ellas irá cambiando la imagen del fondo.
MENÚ DESPLEGABLEMENÚSELECIÓN
Libro de estilo 27 // 30Libro de estilo26 // 30
Imágenes oscurasEHSPORTS IMÁGENES CORPORATIVAS: DESCRIPCCIÓN
-
Las imágenes definen la identi-dad de una marca y dicen mucho de su estilo. Para el estilo de imágenes de EHsports nos centraremos en im-ágenes que reflejen el esfuerzo, el entrenamiento y la adversidad ante un reto. Un estilo urbano y desenfadado sin pretensiones como los de-portes que ofrecemos.
01
02
¿COMO SELECIONAR NUESTRO TIPO DE IMÁGENES?IMÁGENES
CORPORATIVAS
IMÁGENES CLARAS EHSPORTS:
-
Especificaciones técnicas - Colores desaturados- Altos contrastes- Tonos marrones- Movimiento o serenidad- Urbano
Imágenes claras
IMÁGENES OSCURAS EHSPORTS:
- Especificaciones técnicas: - Colores desaturados- Tonos azules- Urbano- Movimiento o serenidad
Libro de estilo 29 // 30Libro de estilo28 // 30
Como hacemos los modos de fusión
MODOS DE FUSIÓN
EL ESTILO DE MODO DE FUSIÓN DE EHSPORTS
-
Los efectos en las imágenes son tan importantes como las imágenes en sí. Para EHsports el modo de fusión es algo fundamental porque es la manera de mezclar nuestros colores corporativos en nuestras imágenes.
-
1) Usamos la imagen en blanco y negro
2) Creamos una capa con nuestro degradado
3) la ajustamos en el modo de fusión color y jugamos con la opacidad.
Como hacerlo
CARTELASINFORMATIVAS
ELEMENTOS DE DISEÑO
CARTELAS
-
Las cartelas informativas son algo fundamental para un canal de televisión.
Siempre jugaremos con cartelas que entren de forma lateral en un barrido, acompañadas por el logotipo EH toda la información que haya dentro formará parte de la marca.
Libro de estilo30 // 30
FECHA DE CREACIÓN :
MARZO 2017
ASUNTO
MANUAL DE ESTILO DE MARCA
EH SPORTS
REALIZADO POR
PALO SECO
HECHO CON AMOR POR:
OSCAR BLASCO
Gracias por dejarnos ser parte de tu marca.