Manual de Marca Aliv.io by Miguel Contreras

Manual de identidad Octubre de 2016

Servicio mĂŠdico

aliv.io es una comunidad construida por una

al instante.

y profesionales del sector salud que busca

alianza entre mĂŠdicos, pacientes, especialistas facilitar el acceso e intercambio de servicios profesionales de salud.

Bienvenido

Contenido Logotipo

Nos da gusto que seas parte de la comunidad aliv.io, este ma-

nual te ayudará a entender algunos rasgos de la filosofía y perso-

Área de protección

Positivo/negativo

nalidad de nuestra marca y a aplicarlos en los diferentes puntos de contacto. Para aliv.io es muy importante el trato con la comunidad que

Símbolo

como podrás ver es muy diversa. Por esta razón nuestros con-

tenidos deben seguir los lineamientos establecidos para cada au-

Área de protección

Positivo/negativo

diencia ya que es la única manera de mantener la unidad de la marca y que los contenidos cumplan el objetivo de cada área de la empresa o punto de contacto.

Color

Tú eres parte de esta empresa, por lo tanto eres representante de

la misma, es importante que conozcas su filosofía, compartas sus

Colores secundarios

Degradados

objetivos y apliques los valores que nos caracterizan. Muchas gracias por ser parte de la comunidad aliv.io.

Fotografía

Ilustración

Tipografía

Logtipo símbolo

Nuestra marca esta compuesta por

El corazón de una identidad visual es la nomenclatura y el sis-

logotipo e isotipo, para algunos fines

tema de identificación, que se plasman en un logotipo.

prácticos se llamará logotipo al conjunto de estos elementos, sin embargo es im-

A menudo se convierte en el punto focal con el que poste-

portante conocer los terminos correctos

riormente se juzga toda la identidad. Nuestro logotipo es uno

para que en páginas futuras sea más

de nuestros activos mas valiosos y debemos tratarlo bien.

claro entender esta diferencia y usar la identidad de forma correcta dependiendo los casos específicos.

Es la forma principal de comunicar que existimos, es nuestro

logotipo

indicador mas claro en el universo tecnológico. Utilizar en todas las aplicaciones y puntos de contacto siempre que sea posible como principal factor de reconocimiento de la marca. Utilizar siempre en presentaciones y materiales de co-

firma

municación corporativa. Los elementos del logotipo (imagotipo) son fijos y no deben ser modificados sin respetar las proporciones.

Área de protección construcción

01. La dimensión de la altura de “x” es nuestra guía. Seguir estas proporciones garantiza una estrecha relación entre la forma y contraforma que nos ayuda a generar el balance adecuado. 02. Es muy importante notar como la al-

altura de x

rtura de x indica también la proporción correcta del isotipo. 03. Colocamos una medida de x en los extremos de nuestras guías para lograr el área de protección. 04. Esta es nuestra área de protección y aislamiento. Respetar esta zona garantiza la correcta visibilidad y legibilidad de 02

nuestra marca.

Positivo/negativo 01

monotono

Nuestra firma puede ser utilizada en monotono respetando los siguientes lineamientos: 0 1 p o s i t i v o El logotipo es colo negro al 100% y el sĂmbolo negro al 80% 0 2 n e g a t i v o El logotipo es colo blanco al 100% y el sĂmbolo negro al 20%

Símbolo

Área de protección 01

construcción

01. El isotipo se construye en una retícula de 20×20 unidades (pueden ser cm, px, etc.). 02. Para lograr la envolvente que nos servirá como icono en aplicaciones trazaremos un cuadrado con esquinas redondeadas (1 unidad para lograr la

El símbolo de aliv.io es usado en nuestras apps móviles, mate-

significado

curva), considerando tres unidades al

riales publicitarios y puntos de contacto donde se utilicen ico-

rededor del cuadro como área de pro-

nos de apps y social media.

tección.

Nuestro isotipo puede ser usado de forma aislada y sin nin-

03. El isotipo considera tres unidades

gún tipo de envolvente solo en contextos en los que el reco-

de espacio para garantizar un espacio

nocimiento de la marca estén garantizados. Por ejemplo en un

balanceado en la composición.

punto de contacto donde se muestre el logotipo completo en algún lugar dentro de la misma composición.

04. Esta es nuestra área de protección para escenarios en los que el isotipo acute aislado del resto de la identidad.

icono redes sociales y app

Positivo/negativo

símbolo monotono

Nuestro símbolo debe usarse en monotono cuando comparta espacio con otras marcas comerciales, en caso de que sea necesario homologar la apariencia de estas. icono app En uso con área de protección.

Color escala de grises

Utilizaremos el color gris para lograr

Con el 99% de las decisiones de los consumidores basadas en

Todos los tonos de gris en in-

los colores y la apariencia visual, el color juega un rol impor-

tervalos de 10% del Black 90%

tante en el programa de identidad corporativa. Nuestros colores

al Black 10%

fondos más versátiles y para gerarquizar en compoziciones tipográficas.

son los que definen nuestra personalidad.

c o lo r e s p r i n c i pa l e s

degradado institucional

Los degradados son un ele-

Degradado principal, se utiliza para

RGB

00 25 63

mento que complementa

comunicación institucional. (Reportes

CMYK

100 60 00 75

nuestra identidad, recurrir-

HEX

00193F

mos a ellos para lograr tran-

PANTONE

2766 C

cisiones suaves y llamativas

Estos colores son los tonos más importantes de nuestra marca. Sirven como diferenciador y estimularan las asociaciones de marca. Son los colores de nuestro logotipo por lo que es muy importante apegarse a los

anuales, tarjetas de presentación, presentaciones internas)

en nuestras aplicaciones. Son

valores establecidos y no alterarlos bajo

el principal diferenciador de

ninguna circunstancia.

nuestros tres tipos de usuario. degradado de interacción

Este degradado se utiliza para toda la

RGB

3 162 228

CMYK

99 29 00 11

HEX

03A2E4

PANTONE

2171 C

comunicación directa entre pacientes y médicos.

Colores secundarios RGB

00 25 63

RGB

00 25 63

CMYK

100 60 00 75

CMYK

100 60 00 75

Esta familia de colores nos ayuda a cu-

HEX

00193F

HEX

00193F

Usamos degradados de color para lograr

brir un rango más amplio de necesida-

PANTONE

2766 C

PANTONE

2766 C

transiciones suaves y lograr homologar

colores secundarios

des de comunicación, nos permite acercarnos de forma puntual y especifica a

degradados

los mensajes dependiendo el usuario específico con el que nos comunicamos.

cada tipo de usiario.

RGB

3 162 228

RGB

3 162 228

CMYK

99 29 00 11

CMYK

99 29 00 11

HEX

03A2E4

HEX

03A2E4

PANTONE

2171 C

PANTONE

2171 C

RGB

3 162 228

RGB

3 162 228

CMYK

99 29 00 11

CMYK

99 29 00 11

HEX

03A2E4

HEX

03A2E4

Consultar el tipo de degradado indicado

PANTONE

2171 C

PANTONE

2171 C

para cada situación en las siguientes

RGB

3 162 228

RGB

3 162 228

CMYK

99 29 00 11

CMYK

99 29 00 11

HEX

03A2E4

HEX

03A2E4

PANTONE

2171 C

PANTONE

2171 C

m u y i m p o r ta n t e

páginas.

Degradados según tipo de usuario A

Reporte anual, presentaciones inter-

Recetas médicas, ventanas de navega-

Puntos de contacto dirigidos a usua-

Presentación con ejecutivos de farma-

nas, papeleria, etc

ción en sitio, etc.

rios de la comunidad como pacientes.

céuticas, institucioens gubernamenta-

Institucional

Médico–Paciente

aliv.io—Paciente

aliv.io—Empresa

les, aseguradoras etc.

Institucional Reporte anual, presentaciones internas, papeleria, etc

degradado

Usamos un degradado tipo A en nuestras aplicaciones institucionales, en esta caso es una muestra del home de nuestro sitio, es el primer punto de contacto con cualquier tipo de cliente; por lo tanto usamos nuestros colores institucionales.

Médico–Paciente Recetas médicas, ventanas de navegación en sitio, etc.

degradado

Usamos un degradado tipo B ya que esta aplicación es una interacción médico-paciente.

aliv.io—Paciente Puntos de contacto dirigidos a pacientes

degradado

Como observamos en el ejemplo usamos un degradado tipo C ya que esta aplicación está dirigida a un usuario paciente. El degradado puede ser usado en detalles pequeños como los números que indican los pasos para ser parte de la comudidad de aliv.io. También usamos el degradado como marco al rededor de la foto. En impresos el uso de los degradados debe ser muy moderado debido a que no podemos garantizar la calidad en todos los medios de impresión disponibles en el mercado.

Fotografía Las fotografías son un elemento importante en nuestra comunicación, nos ayudan a reforzar la idea de cercanía e inmediatez. Además de dar certeza al usuario de que recibe el trato de expertos y profesionales de la salud. Es importante mantener el estilo y los lineamientos de las tomas fotográficas para lograr unidad en el desarrollo de la marca.

fotografías

Utilizamos fotografías con gran profundidad de campo y enfoque selectivo en las personas. Las personas deben tener características, personalidad y rasgos culturales similares al mercado en el que se presentaran. Es importante mostrar un estilo de vida, saludable, amigable y con inclinación a la cultura preventiva.

fotografías médico

f oto g r a f í a s m e d i c o - pac i e n t e

Utilizamos fotografías con amplia profun-

Utilizamos fotografías con amplia pro-

didad de campo y enfoque selectivo en

fundidad de campo y enfoque selectivo

las personas.

en las personas.

01 Es importante que en las fotos de inte-

01 Es importante que en las fotos de

racción médico-paciente exista contacto

médicos la mirada sea amable y directa

visual entre nuestros personajes.

al espectador.

02 Procurar que se muestren utencilos,

02 Usar elementos de la profesión y tra-

objetos o herramientas alusivos a la pro-

tar en lo posible de que exista presencia

fesión.

de dispositivos móviles (computadoras,

tablets, teléfonos, etc.)

Ilustración construcción

Las ilustraciónes deben tener la apariencia mostrada en las siguientes imágenes. Están construidas con figuras geométricas básicas usadas en nuestro ícono, círculos y cuadrados. Las utilizamos en nuestros puntos de contacto sólo como refuerzo en indicaciones, instrucciones o guías.

Tipografía

abcdefghijklmnñopqrstuvwxyz ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

ff clan pro thin

0123456789 características

FF Clan es una extensa familia tipográfica del diseñador polaco Lukasz Dziedzic. Una tipografía sans contemporánea con las

• Sin riesgos

curvas modestamente cuadradas, FF Clan comprende siete pe-

• Legible

sos a través de seis anchuras. Las tipografías de Dziedzic son

• Precisa

abcdefghijklmnñopqrstuvwxyz ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

ff clan pro t h i n i ta l i c

0123456789

fuertes, legibles y cuentan con una gran altura de la x, descen-

• Geométrica

dentes cortas y versalitas para todos los pesos. La variante

• Moderna

“light” es delicada pero impactante. En el otro extremo del es-

abcdefghijklmnñopqrstuvwxyz

pectro, los pesos “bold” y “ultra” hacen declaraciones poderosas

ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

y de gran alcance.

ff clan news Usar la versión book en impresos como versión regular de texto. Este manual está impreso con

ff clan pro book Usar la versión news en pantallas

0123456789

como versión regular de texto

abcdefghijklmnñopqrstuvwxyz

ff clan pro

ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

0123456789

abcdefghijklmnñopqrstuvwxyz

ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

0123456789

b o o k i ta l i c

esta variante. ff clan pro n e w s i ta l i c

abcdefghijklmnñopqrstuvwxyz ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

ff clan pro bold

ff clan pro b o l d i ta l i c

0123456789 34

Tipografía Componga siempre con una escala matemática lógica para garantizar un buen ritmo tipográfico. Por ejemplo este manual utiliza la versión News para texto en puntaje 8 con interlínea de 13, los títulos utilizan la versión light en puntaje 32 con interlínea 39.

FF CLAN PRO LIGHT

Título

32 /39

F F C L A N P R O L I G H T I TA L I C

Subtítulo o destacados

16 /26

FF CLAN PRO NEWS

Texto simulado lorem ipsum is a pseudo-Latin text used in web

08 /13

design, typography, layout, and printing in place of English to emphasise design elements over content. It’s also called placeholder (or filler) text. Bold para destacar el texto It’s a convenient tool for mock-ups. It helps to outline the visual elements of a document or presentation, eg typography, font, or layout. Italic para acelerar el ritmo is mostly a part of a Latin text by the classical author and philosopher Cicero. Its words and letters have been changed by addition or removal.