Branding
El objetivo del Branding es conquistar no solo la mente del consumidor, sino también su corazón.
Branding
Todas las aplicaciones deben expresar su identidad de marca comercial de forma que sean reconocibles al instante, y a su vez que los usuarios se sientan empatizados con la plataforma y ofreciendo una experiencia coherente y consistente.
¿Qué es un imagotipo?
Un imagotipo es una de las forma de representación gráfica de una marca. En este, el ícono y el nombre de la marca forman una unidad visual, es decir, ambas conforman un conjunto visual.
En el imagotipo, se combinan el ícono y el texto en una única composición. En esta composición, ambos elementos constituyen un todo debidamente armonizado e interdependiente, sin estar fusionados.
Los imagotipos, junto con los logotipos, isotipos o isologos, son algunas de las estrategias de diseño gráfico para la colocación de una marca en el mercado por medio de recursos visuales.
Características de un imagotipo
Entre las características de un imagotipo se pueden mencionar las siguientes:
- Imagen y palabra están armónicamente relacionadas y equilibradas entre sí.
- Imagen y palabra no están integradas o fusionadas en una, sino que se distinguen la una de la otra.
- Eventualmente, cuando la marca se ha extendido y se ha vuelto hegemónica, un imagotipo puede dar paso a un isotipo suprimiendo la palabra para que prevalezca el ícono, tal como en la actualidad ha ocurrido con la marca Nike o Apple.
Diferencia entre imagotipo, logotipo, isotipo e isologo
A diferencia del imagotipo, el logotipo se distingue porque usa como imagen el propio nombre de la marca. Tales son los casos de marcas como Coca-Cola, Google o Fedex.
Por su parte, el isotipo es la representación de la marca únicamente a través de un icono sin texto. Por ejemplo, el isotipo de Apple, Twitter o Shell.
Por útlimo el isologo difiere del imagotipo en que combina ícono y texto en una unidad debidamente fusionada. Es el caso, por ejemplo, de Burger King. En este caso, la separación es imposible.
El imagotipo es quizá el elemento que mejor representa la marca, así que hay que dedicarle especial atención para que cumpla su función correctamente. Desde Harmonía se pueden descargar todas las versiones aprobadas del imagotipo, tanto la ‘canónica’ (la forma en la que debe aparecer siempre por defecto) como las alternativas (por ejemplo la versión monocromática), especificando claramente los casos en los que se debe usar cada una de ellas. Encontrarás en las descargas todas las resoluciones y formatos (.jpeg, .png y .svg) posibles. De este modo evitaremos que nadie tenga la necesidad de generar su propio imagotipo libre, con el riesgo de alterar alguna de sus características.
El sistema de diseño dará solución a todas las situaciones que se pueden presentar al utilizar el imagotipo para evitar improvisaciones e interpretaciones personales que harán que este pierda, poco a poco, consistencia.
En este apartado se indican todos los tamaños a los que puede representarse el imagotipo (teniendo siempre en cuenta la unidad de referencia) y consejos tanto sobre su colocación como sobre los márgenes que debe guardar con otros contenidos. El imagotipo debe funcionar bien y ser reconocible independientemente del tamaño al que se represente, así que es habitual incluir una versión reajustada para tamaños muy reducidos.
También se tiene el objetivo de establecer los lineamientos gráficos de identidad para la correcta aplicación del imagotipo de Elektra.
La correcta aplicación de la identidad comercial de Elektra, con base en estos lineamientos, permitirá consolidar una imagen clara, homogénea y coherente en todas las manifestaciones de comunicación digital.
El imagotipo principal del Grupo Elektra está dominado por el símbolo del “Sol”. Se parece mucho al emblema anterior, el cual tenía tipografía sans-serif y aplicaciones de color amarillo y rojo (el “sol” estaba representado con un remolino con picos rojos y amarillo), pero actualmente es plano (sin las manchas más oscuras en algunos trazos).
Debajo del emblema puede verse la leyenda “Grupo Elekra”. Presenta el mismo tipo de letra que la versión anterior, pero el tono de rojo es un poco más brillante.
El imagotipo actual esta conformado por dos elementos: símbolo y tipografía.
Símbolo: Es el primer elemento del imagotipo, Este puede ser usado por separado de la tipografía, si la ocasión lo amerita. Su distribución en cuanto a formas y colores es inalterable.
Tipografía: Es el segundo elemento del imagotipo, este puede ser usado por separado del símbolo, si la ocasión lo amerita. Su alineación, distribución y color es inalterable.
Aplicaciones visuales
El imagotipo se puede aplicar de las siguientes formas: vertical, horizontal, símbolo y tipografía independientes.
Formato Vertical
Esta versión se adapta a formatos verticales y es útil para espacios reducidos. Su uso es ideal cuando se acompaña de varios logotipos a la vez. Se utiliza cuando se pone el “grupo” completo de Elektra
Formato Horizontal
Esta versión será utilizada la mayoría de las ocasiones, ya que es la forma original del imagotipo de Elektra.mx.
Símbolo y tipografía independientes
Es posible utilizar el símbolo de forma independiente, al igual que la tipografía como identificadores, siempre y cuando, en alguna otra parte de la comunicación, aparezca el imagotipo completo.
Si deseas acceder a más lineamientos del brandbook de Elektra puedes consultarlos aquí.
Proporciones gráficas
Las diversas aplicaciones deben respetar las respectivas proporciones del imagotipo, en ningún caso o motivo se deben alterar estas proporciones de los elementos que lo conforman, así como tampoco está permitido integrar otro elemento gráfico en el interior del área corporativa definida.
Dichas proporciones se basan en una medida “x” establecida con respecto a la letra “E” en el imagotipo, como se muestra a continuación.
Áreas de protección
Para prevenir que el imagotipo sea invadido por otros elementos, se determinan las siguientes áreas de protección alrededor del mismo.
Esta medida es la misma determinada para las proporciones gráficas (medida “x”)
Tamaño mínimo de reducción
Para asegurar una lectura clara y correcta del imagotipo, se estableció un tamaño mínimo de reducción, en ningún caso se reproducirá el imagotipo en una medida inferior a la que se indica.
FAVICON WEB TAB: Esta reproducción es la única más pequeña que las demás establecidas y es de 24 x 24 píxeles.
Mínima reducción 32 px de alto
Máxima ampliación 80 px de alto
Tamaños para logotipos en aplicaciones
Android Launcher: 270 x 80 px
Android Play Store: 512 x 512 px
Android App screen: 512 x 512 px
iPhone Launcher: 280 x 80 px
Apple App Store: 1024 x 1024 px
Apple App Screen: 1024 x 1024 px
Fuente
El tipo de letra tiene un aspecto único sin renunciar a su minimalismo y perfecta legibilidad. Algunos de los glifos más notables, además de las “e” y la “a”, son la “p”, con su inusual curva, y la “l”. La tipografía del imagotipo no es la misma que se determinó para el uso del producto digital que aunque es completamente legible se requiere de otra fuente sin “arreglos” en sus terminaciones para cubrir con las necesidades de accesibilidad en el portal y aplicaciones. Si quieres consultar más sobre la tipografía en Elektra.mx puedes hacerlo aquí.
Colores
El imagotipo del Grupo Elektra siempre ha tenido el rojo como color principal o incluso único. Esto ha dado al diseño un aspecto enérgico y atractivo, que no hace sino reforzar las emociones evocadas por el emblema del “Sol”. Este es una parte esencial para la marca, ya que ayuda a su pronta identificación y refuerza la imagen corporativa. En la sección de color en Harmonía encontrarás las diferentes variaciones de color, así como aplicaciones para diferentes componentes, aquí solo mostramos los que se ocupan en el imagotipo. El imagotipo también tiene su variante en modo oscuro (Dark Mode) y el uso correcto de colores en el mismo.
Imagotipo Original
Usos incorrectos
No usar degradados ni en el imagotipo ni en los fondos
No cambiar los colores.
No modificar proporciones
No usar contornos ni sombras
No deformar
No cambiar la tipografía
No agregar decoraciones o elementos
Los valores
La marca es mucho más que un logo o imago. Es un conjunto de valores que definen la identidad de una empresa y que impulsan cada una de las decisiones que se toman, desde el lanzamiento de un nuevo producto hasta la realización de una campaña publicitaria pasando por su política laboral o medioambiental.
Incluir un manifiesto dentro de Elektra es importante porque cada vez más usuarios valoran que las marcas compartan su misma visión de la vida. Así que se deben poner cuáles son los principios de la marca, qué es lo que hace, por qué lo hace y qué es lo que pretende conseguir con ello (lo que tradicionalmente se conoce como ‘misión’ y ‘visión’ empresarial).
El ‘buyer persona’
Conocer a tus clientes es un paso básico para toda empresa, pero ponerlos en el centro de todas las decisiones es esencial para lograr el éxito. Por eso, en Harmonía es el lugar perfecto para publicar un buyer persona, ya que es un documento que todos los diseñadores tienen que tener muy en cuenta y siempre accesible a la hora de proponer soluciones de navegación adecuadas.
Puedes consultar a las “buyer personas” aquí.
El Contenido
Por mucho que tu diseño mantenga una consistencia visual, la experiencia de uso de tus visitantes no será perfecta si el contenido no lo es también, tanto el escrito como el visual. Por eso en Harmonía se establecen unas pautas de redacción que ayuden a generar un tono de voz uniforme, reconocible, apropiado para la audiencia, alineada con el diseño y que defina bien la personalidad de marca.
También resulta interesante en este punto recoger un glosario con los eslogan y frases estándar que se deben utilizar, así como normas orto tipográficas que unifiquen el uso de mayúsculas, cursivas, negritas o signos de puntuación. Todos esto resultará de gran ayuda para que los copywriters puedan hacer bien su trabajo.
Pero como decimos, en web el lenguaje no solo es escrito, también tiene un gran peso el lenguaje visual. Fotos, vídeos, ilustraciones y patrones contribuyen a transmitir mensajes tanto como lo hacen las palabras, y todos los lineamientos para el uso de imagotipo de Elektra los encuentras en el brandbook. Incluir en Harmonía los requisitos que debe cumplir todo el material gráfico que se suba al producto -tanto de estilo como técnicos (por ejemplo recomendando el uso de los formatos WebP o especificando los filtros que se deben aplicar a las imágenes antes de su publicación)- así como un enlace a un repositorio de imágenes donde los diseñadores podrán acceder a una selección previamente aprobada puede resultar muy útil. Para más información ve la sección de Imágenes e Ilustraciones.
Que se debe y que no se debe hacer
Ejemplos en dispositivos
Diferentes usos del imagotipo Elektra
En headers y landings.
Spiners, QRs, App Store Icons.
Launcher app screens, Product card.
El imagotipo se aplica en las diferentes redes sociales (Facebook, Twitter, Instagram, LinkedIn), así como en las tiendas de aplicaciones.
Diferentes dispositivos
También puedes consultar
Image Formats
About
A través de nuestro sistema de diseño establecemos prácticas que nos permitan el diseño de una interfaz más aceptable y que ayuden a mejorar la experiencia de nuestro usuario para el e-commerce de Elektra.mx
Aquí puedes encontrar el portal digital y las apps disponibles:
