Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Every place identidade visual primeira versão

289 views

Published on

Projeto de identidade visual da EveryPlace padrões web.

Published in: Design
  • Be the first to comment

  • Be the first to like this

Every place identidade visual primeira versão

  1. 1. <EveryPlace/>Manual de Indentidade Visual
  2. 2. Enquanto os meios de comunicação se tornam maiscomplexos, o comportamento das empresas, o nome social,os sinais visuais e produtos seguem o caminho de umasimplificação natural. A necessidade de rápida percepção naleitura, respondendo ao acelerado ritmo da sociedade atual,leva designers, profissionais empresariais e de comunicaçãoa reconhecer que simplicidade é um valor e que às vezes omenos é mais. Observa-se que as expressões verbais evisuais repletas de informações conflitantes interferem nanecessária rapidez de percepção de seu principal significado.Se não identificadas com a acelerada evolução técnica, essasexpressões perdem, gradualmente, seu poder de referência.Wollner, Alexandre - Alexandre Wollner: Design Visual 50Anos
  3. 3. ApresentaçãoA Identidade Visual de uma empresa é um de seusprincipais patrimônios. É por meio dela que umainstituição transmite visualmente seus valores, suafilosofia, torna-se visível e reconhecida pelo público.Este manual pretende estabelecer um conjunto denormas, para que a aplicação e uso dos elementos deIdentidade Visual da Conab sejam estabelecidos demaneira uniforme e coerente.Resultado de um intenso trabalho de pesquisa edesenvolvimento, o presente documento tem comofinalidade informar e servir de base para a constituiçãoe consolidação da marca da Conab. O uso coerente esistemático das normas contidas neste manual ajudaráa reforçar a imagem da instituição.
  4. 4. HistóricoA EveryPlace é uma empresa, não de tecnologia, não depropaganda, mas sim uma empresa digital, focada naconectividade e como a web pode facilitar a vida daspessoas, a EveryPlace é especializada nas tecnologias quefazem da internet o que ela é hoje, seo, sem, produção dewebsites mobile, design digital e muito mais.A EveryPlace é uma agencia digital de pessoas, feita parapessoas, valorizamos a nossa equipe e seu potencial,incentivamos o autodesenvolvimento e a evoluçãoprofissional, gostamos de aprender, de ensinar e queremosfazer da web um lugar melhor, mais dinâmica, acessível,limpa e com conteúdo de qualidade.A EveryPlace foi idealizada para ser uma referenciade mercado, não apenas uma fornecedora de serviços, umlocal onde as pessoas possam encontrar conteúdo dequalidade sobre tecnologia, internet e novidades,interagindo com a web e mídias sociais, mantendo umarelação mais próxima de seus clientes e fornecedores.
  5. 5. Introdução conceito da marca Uma marca é uma representação simbólica de uma série de informações sobre um produto, um serviço, um grupo de produtos/serviços, ou uma Instituição. A representação simbólica de uma marca é constituída tipicamente por um nome (marca nominativa) e por imagens ou conceitos que distinguem o produto, serviço ou a própria empresa (marca figurativa). Quando se fala em marca, é comum estar se referindo, na maioria das vezes, a uma representação gráfica no âmbito e competência da comunicação visual, onde a marca pode ser representada graficamente por uma composição de um símbolo ou logotipo, tanto individualmente quanto combinados. Logo, o conceito de marca é bem mais abrangente que a sua representação gráfica. Identidade visual Uma Identidade Visual consiste em um conjunto de elementos gráficos que representam visualmente e de forma sistematizada, um nome, idéia, produto, empresa, instituição ou serviço. Esse conjunto de elementos baseia-se em um símbolo ou logotipo e todas as possibilidades de sua aplicação dentro da comunicação visual da instituição. Pode-se considerar que um Projeto de Identidade Visual é um método de sistematização das representações gráficas de uma marca.Manual de identidade visual A normatização de um Projeto de Identidade Visual se dá através do Manual de Identidade Visual, onde estão dispostos todos os estudos de construção e aplicações da marca. O objetivo do manual é fornecer recursos para que os elementos estruturais do Projeto de Identidade Visual sejam aplicados corretamente em todos os níveis de informação nas quais a instituição o utiliza. É importante que todas as normas estabelecidas no manual sejam seguidas corretamente para que os elementos visuais da identidade sejam aplicados de maneira consistente. As recomendações, especificações e normas geralmente tratam de:  Explicar a lógica construtiva da marca e dos elementos que a compõem.  Estabelecer variações formais da marca (assinaturas vertical/horizontal).  Explicar a organização dos elementos que compõem a marca em cada variação formal (símbolo, logotipo e designações).  Estabelecer as dimensões mínimas de reprodução para preservar a legibilidade em função de cada um dos diversos meios de reprodução gráfica, assim como nas diversas mídias disponíveis no mercado.  Indicar as especificações técnicas das cores utilizadas na marca, para garantir a fidelidade da cor em cada um dos diversos meios de reprodução. Demonstrar algumas situações de aplicação da marca a serem evitadas.
  6. 6. Elemento Estruturaisproporções Absolutamente indispensável ao projeto, o sistema de proporções modulares constitui a base geométrica para a construção do símbolo, tipograma, diagramas, assinaturas e todas as possibilidades de combinações e desdobramentos desses elementos. Com o objetivo de uniformizar e garantir o modo de funcionamento dos elementos primordiais da identidade, o sistema de módulos torna flexível e dinâmica a montagem das normas de uso do projeto, adaptáveis aos mais diversos sistemas de medição (metro, polegada, ponto tipográfico).símbolo O símbolo da Revery Place é a peça chave do sistema de identidade da companhia. Este manual contém uma série de normas de uso desse elemento, assim como as configurações corretas do comportamento símbolo-tipograma e suas aplicações.tipografia do grego: typos, cunho + gráphein, escrever A função da tipografia é dar ordem estrutural e formal à comunicação textual. Em um projeto de identidade, a especificação de uma família de tipos e suas aplicações constituem a forma de como a linguagem escrita deve ser representada visualmente num grande sistema. Desde a construção do tipograma até a composição de textos em publicações e documentos, a tipografia é o meio de representação do conteúdo textual presente em qualquer projeto de identidade. É através de um sistema tipográfico bem construído que consegue-se uma uniformidade em todas as representações textuais da identidade.tipografia Considera-se tipograma a expressão verbal e visual composta com base em signos tipográficos existentes e agrupados de forma particular. Por seu comportamento, uniformidade, destaque e constância de uso, serve como referência visual de uma empresa, instituição, corporação e produtos. Wollner, Alexandre - Alexandre Wollner: Design Visual 50 Anos O tipograma consiste na forma visual de representação da Every Place, através da especificação de signos alfabéticos de um tipo existente.assinaturas O termo assinatura é utilizado para as variações de combinação do símbolo com o tipograma. O sistema estabelece duas versões da assinatura principal e duas versões auxiliares.cor A padronização de cores através de um código cromático é de suma importância para a consolidação da marca. O código cromático estabelece uma paleta de cores fundamentais para a construção do projeto de identidade, assim como a utilização de cores auxiliares, aplicações em preto e branco e negativo. Especifica também padrões cromáticos para cada tipo de reprodução, tais como site, impressos, monitores de vídeo, pintura automotiva e placas de sinalização.
  7. 7. sistema modular Estabelecer o módulo padrão é o passo inicial para a definição das corretas relações entre os componentes do símbolo e, a partir desta definição, estruturar todo o comportamento das expressões visuais da marca. Wollner, Alexandre - Alexandre Wollner: Design Visual 50 AnosA base do sistema modular é oquadrado. Através dele podemosestabelecer um módulo padrão eassim criar uma estrutura para aconstrução de todos osdiagramas da identidade.O quadrado pode ser dividido em4 x 4 módulos iguais, onde cadamódulo pode ser dividido em 3submódulos e assimsucessivamente.
  8. 8. construindo o símbolo A relação de proporção entre a largura e a altura do símbolo é de 4 quadrados de altura para 4 quadrados de largura. Como trata-se de um elemento gráfico feito com base tipografica, no caso a fonte Verdana, se justifica por possuir a idéia que queremos passar através do símbolo gráfico que é uma “tag” ( </> ), que é muito utilizada no conceito desenvolvido originalmente por Tim Berners-Lee o HTML (Hypertext Markup Language – Linguagem de Marcação de Texto. O Html é uma linguagem para publicação de conteúdo (texto, imagem, vídeo, áudio e etc) na Web. Então a “tag” reforça a idéia de continuidade porque o HTML são conjuntos de elementos – ou nós – ligados por coneções formando uma grande rede de informação. E as “tag” faz essa ligação em cada marcação dando a rede algo não linear, imprevisto que permite distribuir uma informação de maneira global. Optomos pela simples indicação das proporções do símbolo, que devem ser rigidamente obedecidas.Proporção do quadrado 4:4 = 2:2Os circculos determina o espaçonecessário, quando utilizado o símbolográfico vazado através da formageomentrica, que no nosso caso é umquadrado, então deizamo um modulopara dar um espaço antes da borda,possuindo assim um respiro.
  9. 9. tipografiaO projeto se baseia em uma grandes família tipográfica: Verdana. É umafamília tipográfica sem-serifa concebida pelo designer Matthew Carter para aMicrosoft Corporation, com colaboração no hinting manual (hand-hinting) deTom Rickner da Agfa Monotype.A Verdana foi publicada em 1996 pela Microsoft e passou a ser distribuída emcada edição do sistema operativo Windows, no Microsoft Office e com oInternet Explorer (desta forma a fonte está difundida tanto em Windowsquanto em Mac OS).Além disso, uma versão reduzida da Verdana (com menos glifos que a versãooriginal), denominada e inserida no pacote Core fonts for the Web, estevedisponível para download gratuito no sítio oficial da Microsoft durantebastante tempo, de forma a que pudesse ser utilizada em qualquer sistemaque suportasse fontes TrueType.Consequentemente, hoje em dia, a Verdana está instalada na maioria doscomputadores, mesmo em Unix e Linux.A versão Core fonts for the Web da Verdana ainda está disponível paradownload em sites externosA fonte foi inspirada em tipografias famosas, como a Frutiger. Entretanto,existem algumas diferenças intencionais, pois a Verdana foi desenhada com ointuito principal de ser lida em ecrãs de baixa resolução (especialmente emtamanhos pequenos, de forma a adaptar-se bem aos textos corridos).Uma das diferenças mais marcantes são as pseudo-serifas em letras como o"J" e o "I". Em 1999 foi publicada a fonte Tahoma, similar à Verdana, mas maiscompacta quanto ao desenho. tipografos.net/tipos/verdana.htmlA fonte verdana por ser um tipo sem serifa posuindo uma visibilidade esimplicidade que agrega a idéia que a EveryPlace quer transmitir.
  10. 10. VerdanaRegularAaBbCcDdEeFfGgHhIiJjLlMmNnOoPpQqRrSsTtUuVvWwYyXxZz,<>;:?/!@#$%¨&*()_-+={}[]ºª”’.BoldAaBbCcDdEeFfGgHhIiJjLlMmNnOoPpQqRrSsTtUuVvWwYyXxZz,<>;:?/!@#$%¨&*()_-+={}[]ºª”’.ItalicAaBbCcDdEeFfGgHhIiJjLlMmNnOoPpQqRrSsTtUuVvWwYyXxZz,<>;:?/!@#$%¨&*()_-+={}[]ºª”’.Bold ItalicAaBbCcDdEeFfGgHhIiJjLlMmNnOoPpQqRrSsTtUuVvWwYyXxZz,<>;:?/!@#$%¨&*()_-+={}[]ºª”’.Numerais0123456789
  11. 11. tipografia O logotipo consiste na forma de representação gráfica da da EveryPlace, através da especificação de signos alfabéticos de um tipo existente. O logotipo EveryPlace deve ser composto com o tipo Verdana Bold. Usamos o espacejamento entre caracteres e a altura pelo módulo-padrão da família do tipo. assinaturas O termo assinatura é utilizado para as combinações do símbolo com o tipograma. O sistema estabelece duas versões da assinatura principal com a logotipo sem o símbolo gráfico e o logotipo com o simbolo e uma versão do símbolo gráfico auxiliares.assinatura simples
  12. 12. assinatura completaversões auxiliares do símbolo gráfico código cromático O bom funcionamento do sistema de identidade está sujeito à especificação de um código cromático. É importante que seja mantida uma unidade cromática em todo o sistema, tendo em vista que as cores sofrem alterações conforme o processo de impressão, superfície utilizada (papel, tecido, chapa metálica etc), fonte de luz e ambiente. Foi usado a azul, laranja e preto para concretizar a ideia que queremos passar pela assinatura.
  13. 13. Significadoslaranja Aspectos favoráveis: assim como o vermelho, a cor laranja é expansiva e afirmativa; contudo é mais construtiva. O laranja reflete entusiasmo com vivacidade impulsiva e natural.azul assinala a entrada nos domínios mais profundos do espírito e uma das suas qualidades mais sutis é a aspiração. Essa cor faz parte do espectro frio e, por sua quietude e confiança, promove a devoção e a fé. O azul é uma cor popular associada ao dever, à beleza e à habilidade. A serenidade dessa coe traz consigo paz, confiança e sentimentos curativos agradavelmente relaxantes. Sua fluidez e força serena são traços atraentes, que provocam admiração por parte das outras pessoas.preto na maioria das sociedades ocidentais, o preto quase sempre é a cor da morte, do luto e da penitência. Em geral, essa cor é usada por pessoas que rejeitam a sociedade ou se rebelam contra as normas sociais. O preto é uma cor que nega a luz e as pessoas que a usam nas roupas rejeitam a luz em si próprias, empurrando-a para longe e não permitindo que ela seja absorvida. Essa é a cor usada pelos homens de negócio, policiais e padres para refletir poder e autoridade. O preto é percebido como escuro e misterioso e também pode significar sexo. Contudo, essa cor também é usada pelas pessoas que preferem parecer tradicionais e responsáveis.

×