manual de identidade visual vila mada versão de final

MANUAL DE IDENTIDADE VISUAL

Manual de Identidade VIsual - Vila Mada.indd 1 06/05/2014 11:27:09

Manual de Identidade Visual

ÍNDICEMarca

Apresentação da Marca 5

Aplicações de símbolo e logotipo 6

Aplicação Prioritária 7

Reduções máximas 8

Grid

Malha (Grid) de Construção 10 á 12

Campos de Proteção 13 á 14

Cores

Cores Institucionais 16

Cores Complementares 17

Aplicação em Fundos claros e escuros 18 á 19

Aplicação em Monocromia 20

Padrão tipográfico

Aplicação de tipográfias 22

Uso incorreto

Aplicações incorretas 24


Papelaria

Cartão de Visitas e Envelope A4

Assinatura de E-mail

Envelope Ofício e Papel Timbrado

Crachá de Funcionário

Aplicativo

Aplicativo “VILA MADA”

Funcionabilidade

26

27

28

29

33

34 e 35

Sinalização

Apresentação da Placa

Trajetória - IDA

Placas - IDA

Trajetória - VOLTA

Placas - VOLTA

Rotas - IDA e VOLTA

Totens

37

38

39 á 47

48

49 á 57

58 á 59

60

Mídia Digital

Cartaz Publicitário com QR Code31



ÍNDICEMarca

Apresentação da Marca 5

Aplicações de símbolo e logotipo 6

Aplicação Prioritária 7

Reduções máximas 8

Grid

Malha (Grid) de Construção 10 á 12

Campos de Proteção 13 á 14

Cores

Cores Institucionais 16

Cores Complementares 17

Aplicação em Fundos claros e escuros 18 á 19

Aplicação em Monocromia 20

Padrão tipográfico

Aplicação de tipográfias 22

Uso incorreto

Aplicações incorretas 24


Papelaria

Cartão de Visitas e Envelope A4

Assinatura de E-mail

Envelope Ofício e Papel Timbrado


Aplicativo

Aplicativo “VILA MADA”

Funcionabilidade

26

27

28

29

33

34 e 35

Sinalização

Apresentação da Placa

Trajetória - IDA

Placas - IDA

Trajetória - VOLTA

Placas - VOLTA

Rotas - IDA e VOLTA

Totens

37

38

39 á 47

48

49 á 57

58 á 59

60

Mídia Digital

Cartaz Publicitário com QR Code31


MARCA



5Manual de Identidade Visual

MarcaApresentação da Marca

Essa é a nova marca da Vila Madalena, no seu traço, imageticamente com suas inúmeras possibilidades podemos remeter a uma paleta de cores de um artista, ou uma escala de cores pantone de um designer. Sua variedade de cores também foi concebida para ser associada às características do bairro: os tons escuros de verde enfatiza as varias opções noturnas de bares e shows ao vivo, já os tons médios de verde representa as ruas arborizadas e praças e por fim os tons claros aqui evidencia a jovialidade de seus frequentadores.

MARCA



6

• Versão vertical.*

• Versão horizontal.*

• Versão apenas com o símbolo.*

• Para as aplicações do símbolo e logotipo e apenas o símbolo as seguintes formas devem ser seguidas :


MarcaAplicações de símbolo e logotipo


7

*

• Como aplicação deve-se sempre se priorizar a versão com o símbolo, logotipo na vertical.

• A versão horizontal com o símbolo e o logotipo, deve ser utilizada onde não houver espaço para a aplicação da versão prioritária, sempre usando as regras de reduções máximas contidas no capítulo 2.4 deste projeto.


MarcaAplicação Prioritária


8

• A versão vertical do símbolo com o logotipo “Vila Madalena” pode ser reduzida ao tamanho minímo de até 2,7 cm de altura e 1,9 cm de largura e a versão horizontal ao tamanho máximo de até 1 cm de altura e 1,6 cm de largura.

• A versão apenas do símbolo sem o logotipo “Vila Madalena” pode ser reduzido ao tamanho máximo de 0,6 cm por 0,6 cm de altura.

1,9 cm

2,7 cm

1,6 cm

1 cm

0,6 cm

0,6 cm


MarcaReduções Máximas

GRID



GRID



10

• Para a versão vertical da marca utiliza-se como referência altura do logotipo “Vila Madalena” dividido por 3 = x.Sendo as medidas do símbolo e logotipo: altura 22x e largura 11x, com espaçamento entre símbolo e logotipo 1x.

/3=x

/3=x

22x

11x

7x

1x


GridMalha (Grid) de Construção


11

• Para a versão secundária horizontal composta pelo símbolo e o logotipo deve-se utilizar como referência altura do logotipo “Vila Madalena” dividido por 4 = x, o valor de X se diferencia da versão vertical pois o logotipo se adapta de forma diferente a malha (grid).Sendo as medidas do símbolo e logotipo: altura 14x e largura 16x com espaçamento entre símbolo e logotipo metade de 1x e o espaçamento da palavra Vila e Madalena 1x.

/4=x

/4=x

16x

14x

1/2=x




12

• Para a versão apenas do símbolo deve-se utilizar como referência altura do próprio símbolo dividido por 14 = x.Sendo as medidas do símbolo: altura 14x e largura 11x.

11x

14x




13

• Para o campo de proteção deve ser utilizado 3x de altura e largura para separar o símbolo e logotipo de outros elementos gráficos. Como demostrado a seguir:


GridCampos de Proteção

3X

3X 3X

3X3X

3X 3X

3X


14

3X 3X

3X3X


GridCampos de Proteção

CORES



CORES



16

PANTONE 440 C

HEXA #352a2d

CMYK

64 69 61 63

RGB

53 42 45

pantone® 137 CPANTONE 7465 C

HEXA #1db9a5

CMYK

73 0 45 0

RGB

29 185 165


HEXA #504c1f

CMYK

58 52 100 44

RGB

80 76 31

PANTONE 360 C

HEXA #68bc45

CMYK

63 0 100 0

RGB

104 188 69


HEXA #03655f

CMYK

89 40 60 24

RGB

3 101 95


HEXA #05ce7b

CMYK

70 0 73 0

RGB

69 185 118

• A versão em tons verde claro e escuro, com marron se constitui das cores principais.

• O logo Vila Madalena e suas demais variações devem ser usados nas seguintes cores e devidas utilizações:


CoresCores Institucionais


17

PANTONE 5005 C

HEXA #ba8283

CMYK

27 54 40 2

RGB

183 130 131


HEXA #426737

CMYK

74 38 93 28

RGB

63 103 55

PANTONE 7532 C

HEXA #7a614b

CMYK

45 54 69 25

RGB

122 97 75


HEXA #ecc34f

CMYK

7 22 81 0

RGB

236 195 79

• As cores complementares podem possuir variação tonal, tendendo para o claro e para o escuro, ou dentro de seu espectro de cor. Podendo variar de acordo com as ilustrações e projetos visuais. Alguns exemplos de cores complementares são:


CoresCores Complementares


18

• O logo Vila Madalena pode ser utilizado em suas diversas cores, seguindo os devidos temas. Para fundos escuros e poluídos visualmente deve-se colocar um box branco com a medida mínima sendo os campos de proteção, como demonstrado a seguir á partir de 50%:

10% 20% 30%

40% 50% 60%


CoresAplicação em Fundos claros e escuros


19

70% 80% 90%

100%


CoresAplicação em Fundos claros e escuros


20

• A versão monocromática deve ser utilizada para a aplicação em conteúdo impresso onde não é possível se utilizar de cores.

PANTONE Black 6 C

HEXA #000000

CMYK

0 0 0 100

RGB

0 0 0

HEXA #��

CMYK

0 0 0 0

RGB

255 255 255


CoresAplicação em Monocromia

PADRÃO TIPOGRÁFICO



PADRÃO TIPOGRÁFICO



22

TIPOGRAFIA DA MARCA

• Para qualquer outro tipo de texto associado a publicidade e divulgação da marca pode-se optar pelas fontes: Corbel e Museo Sans - 100 para massas de texto e Bebas Neue para títulos e é usada no decorrer do manual para as placas de SINALIZAÇÃO e Museo Slab - 500 para títulos.

MUSEO SANS - 100

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz1234567890!@#$%^&*()-_=+]}[{‘“\|/?.><,|\

Corbel


Bebas neue


MUSEO SLAB - 500



Padrão tipográficoAplicação de Tipográfias

USO INCORRETO



USO INCORRETO



24

• Ao comunicar a marca Vila Madalena, é fundamental ser consistente para preservar a sua integridade e credibilidade e garantir a sua perfeita leitura. Assim, nunca faça uma aplicação que não esteja de acordo com os padrões determinados aqui.Os exemplos abaixo ilustram usos inaceitáveis da marca Vila Madalena:

Não utilize no logo ou logotipo outrascores que não sejam as determinadasneste manual.

É proibido usar elementos queprejudique a leitura e aidentificação da marca.

Nunca utilize na Marca texturasou formas de contorno.

Nunca utilize o logotipo emoutras formas e não use outra tipografia que não tenhamsido determinadas neste manual.

VIL

A M

AD

AL

EN

A

sido determinadas neste manual.sido determinadas neste manual.sido determinadas neste manual.sido determinadas neste manual.sido determinadas neste manual.sido determinadas neste manual.

Nunca utilize na Marca texturas

Não se deve alterar a cor da palavraVila Madalena e nem ultrapassar aárea de segurança.

Não distorça ou altere aproporção do logotipo.


Uso incorretoAplicações incorretas

PAPELARIA



PAPELARIA




PapelariaCartão de Visitas eEnvelope A4

Cartão de Visita - Frente

Cartão de Visita - Verso

Material: Couchê 250g, 300g,supremo.Medida: 9 cm x 5 cmAcabamento: Recorte, invernização(total ou localizada), impressãometalizada localizada.

Material: Sulfite 120g,Medida: 26x36 cmAcabamento: Recorte e colagem.

Envelope A4Assinatura de E-mail


PapelariaAssinatura de E-mail

26



PapelariaCartão de Visitas eEnvelope A4

Cartão de Visita - Frente

Cartão de Visita - Verso

Material: Couchê 250g, 300g,supremo.Medida: 9 cm x 5 cmAcabamento: Recorte, invernização(total ou localizada), impressãometalizada localizada.

Material: Sulfite 120g,Medida: 26x36 cmAcabamento: Recorte e colagem.

Envelope A4Assinatura de E-mail


PapelariaAssinatura de E-mail

27



PapelariaEnvelope Ofício ePapel Timbrado

Envelope Ofício

Material: Sulfite 90g Sulfite 120gMedida: 24 x 34cmAcabamento: Recorte colagem.

Papel Timbrado


E-mail: [email protected] Tel.: (11) 3230-1189Rua Madalena, 436 - Vila Madalena - São Paulo

PROJETOVILAMADALENA.TUMBLR.COM


Material: PVC adesivado ou impresso(impressão UV de rigidos), laminado.Medida: 8.00x 5.00 cm (padrão)Acabamento: Recorte e laminação


PapelariaCrachá de Funcionário

28



PapelariaEnvelope Ofício ePapel Timbrado

Envelope Ofício


Papel Timbrado


E-mail: [email protected] Tel.: (11) 3230-1189Rua Madalena, 436 - Vila Madalena - São Paulo

PROJETOVILAMADALENA.TUMBLR.COM


Material: PVC adesivado ou impresso(impressão UV de rigidos), laminado.Medida: 8.00x 5.00 cm (padrão)Acabamento: Recorte e laminação


PapelariaCrachá de Funcionário

29


MÍDIA DIGITAL



31

MÍDIA DIGITAL



Mídia DigitalCartaz Publicitário com QR Code


APLICATIVO



33

• O objetivo do aplicativo, para smartphones,tabletes e celulares, “VILA MADA” é localizar e indicar às pessoas que não são da Vila Madalena, e mostrar tanto a estas como os moradores da Vila Madalena o conteúdo histórico e cultural de lugares importantes dentro do bairro.

• O aplicativo “VILA MADA” se constitui de um mapa onde o usuário através de rastreamento por satélite possa se localizar, e também localizar destinos específicos separados por temas dentro do bairro Vila Madalena. Dentro destes destinos podem-se escolher entre bares, museus, galerias de arte, escolas, restaurantes ( japonês, italiano, chinês, mexicano e português ), etc.

• Sua diferenciação de aplicativos já existentes, é que uma vez clicado o local indicado, este irá abrir uma janela com suas informações principais como horários de funcionamento, local da rua, como chegar e uma breve história do lugar, mostrando assim ao usuário o valorhistórico e a tradicionalidade do bairro onde vive/está.


AplicativoAplicativo “VILA MADA”

APLICATIVO




AplicativoFuncionabilidade


SINALIZAÇÃO




SinalizaçãoApresentação da Placa

• A sinalização para o bairro Vila Madalena na contextualização de transportes de veículos, se constitui de placas personalizadas de trânsito. Nestas estão contidas as direções para os destinos.Os destinos nestas placas de trânsito devem se constituir de pontos importantes da Vila Madalena em sentido histórico cultural. Como por exemplo: ruas históricas, arquitetura, museus, bares, restaurantes, etc.

MUSEU DA PESSOA

PÉROLA NEGRA

CENTRO CULTURAL

Avenida sumaré

Tamanho: 120mm X 77mm

Espessura: 3mm

Material: Aço galvanizado

Pintura: Automotiva, substrato vinilicode alta performance.

Fixação: Abraçadeira de alumínio, parafusosextavado. (Padrão CONTRAN)

SINALIZAÇÃO



38

Início Av. Sumaré até Rua: Fradique Coutinho - IDA

1

23

4

Centro Cultural

Escola de Samba

Galeria Xiclete

Museo da Pessoa

5

67

8

910

11

12

13

14

15

16

17


SinalizaçãoTrajetória - IDA



SinalizaçãoPlacas 1 e 2 - IDA



SinalizaçãoPlaca 17 - IDA


48

1

23

4

Centro Cultural

Escola de Samba

Galeria Xiclete

Museo da Pessoa

Início Rua: Fradique Coutinho até Av. Sumaré - VOLTA

5

6

7

8

910

11

12

1314

15

16


SinalizaçãoTrajetória - VOLTA



SinalizaçãoPlaca 1 e 2 - VOLTA



SinalizaçãoPlaca 3 - VOLTA


SinalizaçãoPlacas 4 e 5 - VOLTA



SinalizaçãoRotas - IDA

Início Av.Sumaré até Fradique Coutinho, 1855.

Placa 1: Em frente Centro Cultural, Perola Negra, Museu e Xiclet.Placa 2: Direita Centro Cultural, Perola Negra, Museu e Xiclet.Placa 3: Retorno Centro Cultural, Perola Negra, Museu e Xiclet.Placa 4: Direita Centro Cultural, Perola Negra, Museu e Xiclet.Placa 5: Esquerda Centro Cultural, Direita Perola Negra e Xiclet.Placa 6: Direita Centro Cultural.Placa 7: Direita centro Cultural.Placa 8: Aqui Centro Cultural em Frente Perola Negra, Museu e Xiclet.Placa 9: Esquerda Perola Negra, Museu e Xiclet.Placa 10: Aqui Perola Negra em Frente Museu e Xiclet.Placa 11: Esquerda Museu,e Xiclet.Placa 12: Em Frente Museu, Direita Xiclet.Placa 13: Esquerda MuseuPlaca: 14: Aqui Museu.Placa 15: Direita Xiclet e Esquerda Museu.Placa 16: Direita Xiclet.Placa 17: Aqui Xiclete.



SinalizaçãoRotas - VOLTA

início Fradique Coutinho até Av.Sumaré

Placa 1: Em frente Centro Cultural, Perola Negra, Museu e Avenida Sumaré.Placa 2: Direita Museu, Centro Cultural, Perola Negra e Avenida Sumaré.Placa 3: Em Frente Museu, Direita Xiclet.Placa 4: Esquerda MuseuPlaca 5: Aqui Museu.Placa 6: Direita Avenida Sumaré, Perola Negra e Centro Cultural.Placa 7: Aqui Perola Negra, Esquerda Av. Sumaré e Direita Centro Cultural.Placa 8: Esquerda Centro CulturalPlaca 9: Direita Centro Cultural.Placa 10: Direita centro Cultural.Placa 11: Aqui centro Cultural em frente Avenida Sumaré.Placa 12: Esquerda Avenida Sumaré.Placa 13: Direita Avenida Sumaré.Placa: 14: Direita Avenida Sumaré.Placa 15: Esquerda Avenida SumaréPlaca 16: Aqui Avenida Sumaré.


60

• A sinalização física ( a pé ) para o bairro Vila Madalena na contextualização do pedestre se constitui de Totens.

2

40

mm

300mm

300mm

615

mm

175m

m

315m

m

200mm

525mm

700mm

MUSEU DA PESSOA

CASA DA XICLET

PÉROLA NEGRA

CENTRO CULTURAL

Fixação: Sapata fixada com 4 parafusoscom 3 cm de diamentro, coberta combandeja dobrada aço galvanizado.

Pintura: Automotiva, substrato vinilico de alta performance impresso.

Material: Aço galvanizado, acrilico leitosomoldado (3mm) retroiluminado, lâmpadafluorescente


SinalizaçãoTotens


manual de identidade visual vila mada versão de final

Documents