TCC Thiago
109
UNIVERSIDADE TUIUTI DO PARANÁ Thiago Berardi Rocha Almeida BRANDING PARA SISTEMA DE VÍDEO MAIL CURITIBA 2008
-
Upload
thiago-berardi -
Category
Documents
-
view
256 -
download
0
description
Trabalho de Conclusãod e Curso - DOC
Transcript of TCC Thiago
UNIVERSIDADE TUIUTI DO PARANÁ Thiago Berardi Rocha Almeida
BRANDING PARA SISTEMA DE VÍDEO MAIL
CURITIBA
2008
BRANDING PARA SISTEMA DE VÍDEO MAIL
CURITIBA
2008
Thiago Berardi Rocha Almeida
BRANDING PARA SISTEMA DE VÍDEO MAIL
Trabalho de conclusão de curso, apresentado ao
curso de Design, habilitação em Gráfico, da
Faculdade de Ciências Exatas e de Tecnologia, da
Universidade Tuiuti do Paraná, como requisito parcial
para a obtenção do título de Bacharel em Design.
Orientador: Hélcio Fabri, Esp.
CURITIBA
2008
Dedico este trabalho ao meus avós Neylor Berardi in memorian e Regina Berardi
que deram suporte, apoio muito amor em todos os momentos da vida. Sem eles, a
realização deste objetivo não seria uma verdade. Á minha amada Karin Juhasz, que demonstrou
confiança, amizade e dedicação sem medidas e à toda prova. A minha madrinha Deborah, que foi a mola propulsora para meu ingresso neste
curso e instituição e, a todos aqueles que de alguma forma estiveram presentes em minha vida
e contribuíram para meu crescimento intelectual.
Agradeço a minha mãe Rejane Berardi pela atenção e esforço e aos meus amigos Deco,
Boby e Mary. Agradeço principalmente àquele que comanda minha vida. DEUS
muito obrigado por tantas bênçãos recebidas durante a vida acadêmica.
RESUMO
Com o avanço tecnológico percebe-se que a tendência da comunicação mundial volta seus esforços para o desenvolvimento de ferramentas e sistemas para a internet pois a rede proporciona muita facilidade, agilidade e principalmente economia na transmissão de dados entre pessoas e corporações. Com base no surgimento de novas ferramentas e interfaces on-line que permitem o tráfego de informações na rede, desenvolver-se-á um projeto que busca agilizar e customizar as mensagens através da captura e envio de dados áudios-visuais para um ou múltiplos usuários de e-mail. O projeto pretende atender profissionais que trabalham com comunicação, como publicitários e jornalistas. O objetivo deste projeto consiste em desenvolver identidade visual, interface gráfica web e peças gráficas para divulgação. Palavras-chave: comunicação, Internet, vídeo e-mail.
ABSTRACT
With the technological advance we might notice that all efforts upon software development are turned to build tools and systems based on web platform. That`s why the internet provides all means for a safe, easy and flexible way to communicate and data exchange among corporations and individuals all over the world. Based on a new concept of on line tools and interfaces that aim to data exchange and personal communication we’ll design a software that will provide a way for smart and custom messages. We’ll do this by capturing and transmitting video and audio through the web for only one or thousands of internet mail users. This project targets communication and advertisement professionals as much as journalists. The objective of this project is to develop a visual identity, web graphical interface and printed material for publication. Keywords: communication, internet, video, mail
LISTA DE FIGURAS
FIGURA 1 – INTERFACE DELL VIDEO CHAT............................................................ 10
FIGURA 2 – MODELOS MENTAIS E IMAGEM DO SISTEMA................................... 26
FIGURA 3 – INTERFACE FLICKR.............................................................................. 40
FIGURA 4 – INTERFACE LAST FM............................................................................ 41
FIGURA 5 – INTERFACE DO MESSENGER............................................................. 42
FIGURA 6 – INTERFACE DO PLAYHEAD.................................................................. 43
FIGURA 7 – INTERFACE DO VIDDYOU.................................................................... 44
FIGURA 8 – INTERFACE DO WALLOP .................................................................. 45
FUGURA 9 – INTERFACE DO BEBO......................................................................... 46
FIGURA 10 – INTERFACE DO DELL VIDEO CHAT................................................... 47
FIGURA 11 – INTERFACE DO SKYMOL................................................................... 48
FIGURA 12 – INTERFACE DO SKYPE .................................................................. 49
FIGURA 13 – INTERFACE DO VISMAIL.................................................................... 50
FIGURA 14 – INTERFACE DO YVIDEOO PRÓ......................................................... 51
FIGURA 15 – TABELA DE ANÁLISE PARAMÉTRICA SIMILARES 1......................... 52
FIGURA 16 – TABELA DE ANÁLISE PARAMÉTRICA SIMILARES 2......................... 53
FIGURA 17 – TABELA DE ANÁLISE PARAMÉTRICA SIMILARES 3......................... 54
FIGURA 18 - TABELA DE ANÁLISE PARAMÉTRICA CONCORRENTES 1............... 55
FIGURA 19 - TABELA DE ANÁLISE PARAMÉTRICA CONCORRENTES 2.............. 56
FIGURA 20 - TABELA DE ANÁLISE PARAMÉTRICA CONCORRENTES 3.............. 57
FIGURA 21 - PAINEL SEMÂNTICA SOBRE O TEMA ............................................ 62
FIGURA 22 – PAINEL DE ANÁLISE DIACRÔNICA.................................................... 63
FIGURA 23 - PAINEL DE ANÁLISE SINCRÔNICA..................................................... 64
FIGURA 24 - ESBOÇO PARA ESCOLHA DA MARCA............................................... 70
FIGURA 25 - ESBOÇO PARA ESCOLHA DO MANUAL DE ID. VISUAL.................... 71
FIGURA 26 - ESBOÇO PARA ESCOLHA DA INTERFACE DO SISTEMA................. 72
FIGURA 27 – ESBOÇO DE PRESSKIT PARA PÚBLICO ALVO................................. 73
FIGURA 28 – GERAÇÃO DE ALTERNATIVAS MARCA............................................. 74
FIGURA 29 – GERAÇÃO DE ALTERNATIVA INTERFACE........................................ 75
FIGURA 30 – FAMÍLIAS TIPOGRÁFICAS SELECIONADAS..................................... 75
FIGURA 31 – ESQUEMA MAPA DE NAVEGAÇÃO.................................................... 76
FIGURA 32 – GRID CONSTRUÇÃO INTERFACES................................................... 77
FIGURA 33 – ALTERNATIVAS PARA MARCA............................................................ 78
FIGURA 34 – ALTERNATIVA PARA INTERFACE....................................................... 79
FIGURA 35 – MARCA E APLICAÇÕES...................................................................... 80
FIGURA 36 – MODELO MANUAL IDENTIDADE VISUAL.......................................... 81
FIGURA 37 – PEÇAS PAPELARIA ADMINISTRATIVA............................................... 82
FIGURA 38 – TELAS DA INTERFACE ELETRÔNICA............................................... 86
FIGURA 39 – BANNER DIVULGAÇÃO...................................................................... 92
FIGURA 40 – WOBLLER PARA MONITORES............................................................ 93
FIGURA 41 – ADESIVOS PARA PROTEGER LAPTOP............................................. 94
FIGURA 42 – FUNDO DE TELA PARA MONITOR..................................................... 95
FIGURA 43 – BRINDES COM A MARCA................................................................... 96
FIGURA 43 – KIT PARA PROSPECÇÃO................................................................... 97
SUMÁRIO
1. INTRODUÇÃO AO PROJETO......................................................................... 08
2. FUNDAMENTAÇÃO TEÓRICA........................................................................ 11
2.1 DESIGN GRÁFICO......................................................................................... 11
2.2 BRANDING...................................................................................................... 12
2.2.1 Marcas .......................................................................................................... 13
2.2.2 Nomes .......................................................................................................... 14
2.2.3 Nomes de serviços....................................................................................... 14
2.2.4 Identidade visual........................................................................................... 15
2.2.4 Internet Branding.......................................................................................... 16
2.3 CORES............................................................................................................ 17
2.3.1 Teoria da cor................................................................................................. 18
2.3.2 Sistema das cores........................................................................................ 18
2.3.3 Dimensão da cor.......................................................................................... 19
2.3.4 Tom............................................................................................................... 20
2.3.5 Fator de luminância..................................................................................... 20
2.3.6 Saturação ou fator de pureza...................................................................... 20
2.3.7 Tonalidade..................................................................................................... 20
2.3.8 Qualidade da cor.......................................................................................... 20
2.3.9 Qualidade da cor.......................................................................................... 21
2.4 TIPOGRAFIA................................................................................................... 21
2.4.1 História.......................................................................................................... 21
2.4.2 Tipografia aplicada a projetos web ............................................................... 22
2.5 DESIGN GRÁFICO NA WEB........................................................................... 23
2.5.1 Peso dos arquivos publicados...................................................................... 24
2.5.2 Resolução dos monitores............................................................................. 24
2.6 IMAGEM E SEMIÓTICA.................................................................................. 25
2.7 ERGONOMIA VISUAL PARA INTERFACES WEB .......................................... 25
2.7.1 Engenharia cognitiva.................................................................................... 25
2.7.2 Hierarquia da informação para projetos on-line............................................ 26
2.8 A HISTÓRIA DA INTERNET............................................................................ 27
2.8.1 Definições e nomenclaturas web.................................................................. 28
2.8.2 A comunicação na Internet............................................................................ 30
2.9 TRANSMISSÃO DE DADOS ÁUDIO-VISUAIS ATRAVÉS DA WEB............... 32
2.9.1 Mídias on-line. Divulgação dirigida e customizada....................................... 32
3 MATERIAIS E MÉTODOS.................................................................................. 35
3.1 METODOLOGIA.............................................................................................. 35
3.2 POR DENTRO DA PRÁTICA METODOLÓGICA............................................. 35
3.2.1 Estudos preliminares e definição do problema............................................. 35
3.2.2 Reconhecendo a existência de um problema ou de uma oportunidade....... 36
3.2.3 Objetivo da solução do problema................................................................. 36
3.2.4 Quem, onde e quando utilizará?................................................................... 37
3.2.5 Por quanto tempo será utilizado?................................................................. 38
3.2.6 Finalidade, função ou aplicação................................................................... 38
3.2.7 A necessidade do design e a aplicação do branding.................................... 38
3.3 DESCONSTRUÇÃO DO PROBLEMA............................................................. 39
3.3.1 Quais as partes do problema?...................................................................... 39
3.3.2 Quais os tipos de informações gráficas serão utilizadas?............................ 40
3.4 SIMILARES E CONCORRENTES................................................................... 40
3.4.1 Localizar similares e concorrentes ............................................................... 40
3.4.2 Análise paramétrica....................................................................................... 52
3.5 COLETA DE DADOS....................................................................................... 58
3.5.1 Benchmarking............................................................................................... 58
3.5.2 Pesquisa de público...................................................................................... 58
3.6 RECONSTRUÇÃO DO PROBLEMA E DIVISÃO DE TAREFAS ..................... 61
3.6.1 Organizar o problema................................................................................... 61
3.7 A PESQUISA CRIATIVA................................................................................... 62
3.7.1 Painéis semânticos e de análise................................................................... 62
3.7.2 Esboço para alternativa de nomes ............................................................... 65
3.7.3 As interfaces a serem desenvolvidas............................................................ 66
3.7.4 A formalização dos conceitos........................................................................ 67
3.8 MATERIAIS E PROCESSOS........................................................................... 68
3.8.1 Recursos disponíveis.................................................................................... 68
3.8.2 Tipos de linguagens de programação aferidas............................................. 68
3.8.3 Acabamento visual........................................................................................ 69
3.8.4 Principais fornecedores ou parceiros............................................................ 69
3.8.5 A geração de alternativas.............................................................................. 70
3.9 DESENVOLVIMENTO DO PROJETO............................................................. 74
3.10 VERIFICAÇÃO DO DESENVOLVIMENTO.................................................... 72
3.11 PROTÓTIPO E MODELO – PRODUÇÃO.....................................................79
3.11.1 Imprimir a parte do projeto que envolve produção gráfica.......................... 79
3.11.2 Publicar e divulgar o sistema...................................................................... 80
3.12 AVALIAÇÃO DO PROTÓTIPO...................................................................... 80
3.13 PLANILHA COM PREVISÃO DE VUSTOS.....................................................80
4 RESULTADOS.................................................................................................... 81
5 DISCUSSÕES.................................................................................................... 99
6 CONCLUSÃO..................................................................................................... 99
7 CONSIDERAÇÒES FINAIS................................................................................ 99
REFERÊNCIAS BIBLIOGRÁFICAS..................................................................... 100
8
1. INTRODUÇÃO
Com o avanço tecnológico percebe-se que a tendência da comunicação
mundial está voltada para a internet pois está, proporciona muita facilidade, agilidade
e economia na transmissão de dados entre pessoas e corporações. Com este
pensamento surgem, diariamente, novas ferramentas e interfaces on-line que
permitem o tráfego de informações na rede e, sobre esta nova forma de ler,
interpretar e transmitir informações desenvolver-se-á o projeto em questão que visa
imprimir Branding a um sistema web que permite a captura e envio de
vídeo-mail para um ou múltiplos usuários.
Portanto, este Trabalho de Conclusão de Curso de Design Gráfico consiste na
criação de todo o Branding e peças de divulgação para um sistema desenvolvido na
plataforma web permitindo o envio de vídeo-mail.
Os serviços de vídeo-mail concorrentes ou similares oferecidos na internet em
sua maioria contemplam a instalação de softwares no computador do usuário para
que seja feito a captura e transmissão dos dados. Isso torna o envio moroso e não
permite o envio de vídeo mensagens de outras estações de trabalho que não
possuam o software específico instalado. .
A idéia central do projeto é permitir o envio de vídeo-mails sem a necessidade
de instalação de softwares no computador podendo o usuário enviar e receber vídeo
mensagens ou áudio mensagens em qualquer lugar e a qualquer momento. Para
isso, basta estar conectado a internet banda larga e possuir webcam e microfone
acoplados ao computador. .
A interface gráfica do projeto será concebida a partir de estudos de semiótica
e ergonomia visual facilitando assim o reconhecimento das funções e permitindo o
rápido acesso as informações. O design gráfico será utilizado para despertar o
9
desejo de uso do sistema tornando-o atrativo e funcional para seus usuários. Será
traçada uma estratégia de Branding para o lançamento deste novo serviço on-line na
rede mundial de computadores. ..
Impasses na compreensão, redação e leitura de textos longos poderiam ser
extintos com a rápida produção de videos-mail. A releitura e a impressão pessoal e
áudio-visual de fatos ou acontecimentos gera maior audiência e atenção de seus
espectadores por isso, pretende-se ampliar as possibilidades de comunicação
on-line através de um sistema web que visa fortalecer o veículo internet, já validado
como poderoso, persuasivo e decisor de compras, tendências e pesquisas. Outro
fator fundamental e problemático é o desenvolvimento de interfaces cognitivas e de
fácil compreensão onde o usuário não precisa ser técnico para gravar, visualizar e
enviar seus videos para um ou múltiplos usuários. .
Hoje, os serviços oferecidos são, em sua maioria, tecnicistas e de difícil
intergração com o usuário que acaba abolindo seu uso logo após as primeiras
experiências.
Objetiva-se facilitar a forma de transmitir informação on-line através de
mensagens áudio-visuais gravadas diretamente por seus remetentes sem que haja
necessidade de instalar softwares na estação de trabalho. .
Promover agilidade, facilidade e mobilidade aos usuários do sistema
permitindo acesso, gravação e envio de vídeos-mail através de um computador
conectado a internet que possua webcam e microfone.
Oferecer as agências de notícias e comunicação uma poderosa e ferramenta
on-line para o envio de suas informações, destaques e campanhas para seus
expectadores podendo segmentar cada assunto de acordo com o perfil do(s)
destinatário(s).
10
Aplicar o conceito de branding sobre este novo negócio tornando-o referência
na transmissão de dados áudio-visuais na internet.
FIGURA 1 – INTERFACE DELL VIDEO CHAT
Fonte: http://www.infosyncworld.com
11
2. FUNDAMENTAÇÃO TEÓRICA
2.1 DESIGN GRÁFICO
Processo técnico e criativo que comunica através de sinais, símbolos, cores,
formas e imagens estabelecendo conexão entre a mensagem e o receptor de
maneira atraente, funcional e conceitual. O Design Gráfico é hoje umas das
atividades projetuais mais difundidas no mundo e é utilizado para identificar,
informar, entreter, sinalizar, estimular, organizar, destacar, valorizar produtos,
marcas, empresas, vestimentas, etc., gerando melhoria na qualidade de vida das
pessoas.
Definir Design não é uma tarefa fácil e muitos autores fogem desta temerosa
pergunta através da contrapartida: “E o que não é design?”. .
Numa visão global, o design está presente em tudo. Ele é sensorial partindo
do princípio que um aroma ou uma textura é desenhado a partir de conceitos
específicos ou necessidades coletivas. Sua função é atrair os sentidos do receptor
de alguma forma. .
Segundo Flávio Anthero do Santos (2000), autor do livro Design com
Diferencial Competitivo, o processo de design é de suma importância para as
empresas e o designer, profissional que desenpenha a função, garante qualidade no
serviço e no produto apresentado por possuir uma visão abrangente de todo o
projeto e os processos que o envolvem podendo detectar falhas ou detalhes que por
ventura possam torná-lo mais fácil ou difícil de ser realizado. .
O design gráfico é uma poderosa ferramenta estratégica na comunicação
corporativa e é fundamental para o posicionamento e ativação de marcas. Com a
convergência dos canais de comunicação, que buscam filtrar as informações para
cada público alvo, o meio digital tem sido muito explorado por profissionais desta
12
área que através de sinais, símbolos, cores e formas conseguem transmitir
informações inteligentes, atrativas e de fácil compreensão.
Um dos objetivos do Design Gráfico é despertar os sentidos do receptor da
mensagem.
O design gera curiosidade, surpresa e com ela, a atenção do receptor é
ativada. Quando bem aplicado, induz o receptor da mensagem a passar mais tempo
junto as marcas que o adotam. .
Na comunicação corporativa, o design auxilia as empresas na identificação de
sua marca ou produtos promovendo identidade única e apropriada. Esta identidade
segue padrões definidos de cores, formas e tipografia imprimindo assim
características únicas e exclusivas ao projeto. .
2.2 BRANDING .
Mas afinal, o que é BRANDING? .
Segundo José Roberto Martins (2000), autor do livro “Branding. O manual
para você criar gerenciar e avaliar marcas”, é o conjunto de ações ligadas à
administração das marcas que tomadas com conhecimento e competência, levam as
marcas além da sua natureza econômica, passando a fazer parte da cultura, e
influenciar a vida das pessoas. .
Branding portanto, pode ser entendido como a gestão de todos os processos
que envolvem uma marca desde a sua concepção, ativação, aplicação até sua
manutenção e gerenciamento. Uma postura que se volta para o gerenciamento de
todos os aspectos intangíveis que cercam uma marca de modo que as expectativas
criadas em torno dela sejam cumpridas. .
O branding precisa de recursos e esforço intensos de marketing e
13
comunicação para ser adequadamente implementado, não apenas em uma
determinada ocasião da vida das marcas, mas durante toda a sua existência.
Segundo o escritor Frederich F. Reichfeld (1997), autor do livro A Estratégia
da Lealdade, as empresas perdem, em média, e sob condições normais, 10% dos
seus consumidores a cada ano, o que é pouco, se comparado – na avaliação do
próprio Reichfeld – ao custo de se conseguir um novo consumidor, estimado em
cinco vezes mais que o custo para mantê-lo e isso se deve ao fato das empresas
não se preocuparem com a manutenção de sua imagem e valores intangíveis junto
ao seus consumidores. .
Desde 1999 a internet tem formatado padrões criativos e diferenciados para
consumidores experimentarem as marcas. A rede já é reconhecida como a
tendenciosa e lançadora das marcas mais valiosas do mundo.
Portanto, a internet tornou-se uma fonte de estudo dos gestores de marcas e
principalmente de relacionamento com estas marcas.
2.2.1 Marcas
As marcas são os sistemas visuais e intangíveis mais complexos e de maior
visibilidade organizacional. É através da marca que o consumidor tem sua primeira
impressão sobre a empresa. .
São formas, símbolos, cores, sonoridade, tipografias, significação e conceitos
que a tornam mais ou menos valiosa e devem ser criadas e gerenciadas por
profissionais competentes que possuem visão holística do mercado que ela atua e
dos clientes que procura atingir e dos valores que precisa transmitir.
A marca deve ser compreendida como ponto de partida para o relacionamento
com o consumidor seja ela de um produto, um serviço ou simplismente um conceito.
14
E, retomando o conceito de relacionamento e gerenciamento, a marca é o coração
do processo de branding.
2.2.2 Nomes .
Não é possível construir uma reputação sobre aquilo que ainda vai se fazer e
para tanto é preciso dar nome aos projetos. Para criar uma boa reputação é
necessário criatividade e muita dedicação. .
Após ter definido o compromisso, os valores e o conceito do negócio, produto
ou serviço é necessário iniciar a busca pelo nome. .
A escolha do nome tem influência direta no posicionamento da marca
portanto, para que uma empresa, produto ou serviço seja identificado ele precisa de
um nome e uma identidade gráfica. A escolha e definição destes, precisa seguir esta
ordem para que se tenha maior sucesso e consequente posicionamento.
A ciência que estuda os nomes chama-se onomástica e ela aborda a
etimologia das palavras ou seja, a origem da palavra. É importante reconhecer a
origem das palavras e seus fonemas para aferir um nome acertativo de modo
significante a sua origem e relações históricas. .
Para o reconhecimento de um grande nome pode-se pensar naqueles que
não atrapalham o pensamento. Aqueles, que a composição é legivel e a sonoridade
agrada aos ouvidos. A combinação das sílabas, letras e números possibilita uma
fácil associação com a empresa, produto ou serviço. .
2.2.3 Nomes de Serviços .
O trabalho de naming para a prestação de serviços deve possuir: distinção,
relevância, memorização e flexibilidade pois os serviços são intangíveis e não
15
podem ser trocados. .
Os nomes de serviços podem ser classificados da seguinte forma:
Descritivos: o nome descreve o benfício central associado a ele. Como exemplo
temos o Banco 24 Horas. Possuem objetividade na informação mas possuem a
desvantagem de serem restritivos quanto ao reposicionamento ou evolução da
categoria. Além disso, sua titularidade legal é muito frágil. .
Pessoais: muito utilizado por profissionais liberais que divulgam seu próprio nome
como forma de fortalecer sua imagem e vender seus serviços. É um sistema que
não vai de encontro as especificidades do naming pois normalmente são nomes
longos e sua vida está assossiada e restrita a vida de seu fundador.
Exemplo: Construtora Camargo Correia. .
Associativos: são nomes formados pela montagem de palavras. A vantagem é a
distinção e a desvantagem é a necessidade de explicar o sentido do nome que
normalmente vem acompanhado de um complemento. .
Exemplo: Kodak. Revelação de Filmes. .
Geográficos: criados com o objetivo específico de explorar a associação com
alguma localidade. O propósito destes nomes é informar que a empresa nasceu
daquele lugar e que tem características em comum com a localidade.
Alfanuméricos: promovem combinações de letras, números e sinais para
transformar-se em marcas. Exemplos: Windows 2000, Guess?, Contem 1g.
A vantagem é que facilita o registro apesar de gerarem pouca empatia.
2.2.4 Indentidade Visual
Quase tudo possui uma identidade visual, ou seja, componentes que
identificam algo visualmente. São sinais gráficos que garantem um sentimento de
16
propriedade e relevância. Em muitas vezes substituem o próprio nome.
A identidade visual é o que torna único visualmente um dado objeto. É o que o
diferencia por seus elementos visuais. .
O sistema de identidade visual é como se configura uma identidade.
Formam o sistema todos as aplicações que veiculem os elementos básicos da
identidade visual: a tipografia, o símbolo, a marca, as cores, as formas além de
outros eventuais elementos acessórios, que são aplicados em itens específicos.
A identidade visual não se restringe ao nome ou aos símbolos de uma marca
mas tudo em uma empresa precisa estar integrado para a formatação de uma
indentidade corporativa: ética, responsabilidade social e ecológica, formas de
atendimento, uniformização da equipe, linguagem corporal e materiais gráficos e de
comunicação fazem parte do sistema de identificação. .
2.2.5 Internet Branding .
Estima-se que no Brasil já foram criados mais de 1 milhão de websites para
uma amostragem de aproximadamente 15 milhões de internautas localizados
principalmente nos grandes centros do país. .
Embora o mercado esteja em constante reinvenção e evolução a cultura ainda
é que os websites são veículos de mídia, úteis apenas para divulgar a imagem das
empresas.
Philip Kotler, considerado o “Papa” do marketing moderno, em entrevista a
M&M web, declarou que a Internet não é apenas mais um canal que se acrescenta
aos canais existentes, pois é a verdadeira oportunidade de reinventar as empresas,
dada a sua base de criação de relacionamento com os consumidores. Visto que os
anunciantes são interessados em utilizar-se do marketing de relacionamento, ou
17
marketing customizado, Kotler acredita que a Internet irá trazer implicações cada vez
mais extraordinárias. .
Para se criar uma plataforma de internet branding é importante que, mesmo
estando em um ambiente virtual, os visitantes, percebam que estão se relacionando
com pessoas. .
Precisa-se definir muito bem o posicionamento da empresa para estender o
atendimento a rede mundial. .
Com o posicionamento definido, inicia-se a construção do rascunho geral do
projeto on-line que deverá facilitar a compreensão geral do visitante, oferecendo
ergonomia visual, hierarquia das informações e aplicações adequadas ao perfil do
consumidor e não apenas da empresa. .
A Identidade visual deve ser aplicada no projeto gráfico do website imprimindo
assim diferenciação perante os concorrentes ou similares e relação de cores, formas
e imagens com a empresa em questão. Algumas funcionalidades como imagens,
animações em flash e vídeos devem ser devidamente adequadas para o rápido
carregamento das páginas. .
A internet banda larga propricia cada vez mais a elaboração de efeitos áudio-
visuais e estes efeitos têm como objetivo, transmitir mensagens sem ruídos e sem a
necessidade de uma interpretação textual das informações. .
Quanto maior é o relacionamento com as marcas na internet, mais fidelização
e confiança o internauta deposita nela e as estratégias de Branding on-line voltam-se
para estas possibilidades de relacionamento e posicionamento.
2.3 CORES
Nos projetos gráficos este é um ponto determinante e fundamental para a
18
significação e o sentimento gerado no receptor da mensagem através da leitura e
compreensão psicológica das cores. . .
A cor tem o poder de despertar sentidos neurofisiológicos em seu expectador
e a correta utilização destes sentidos na produção do design ou webdesign faz-se
necessária gerando o estudo ontológico das cores que nada mais é que o estudo
das significações cromáticas e dos sentidos que elas transmitem quando aplicadas
aos projetos de design gráfico e de identidade visual.
2.3.1 Teoria da Cor
A palavra "cor" é empregada para referir-se à sensação consciente de um
observador cuja retina se acha estimulada por uma energia radiante. .
Ao estudo ontológico das cores e suas características dá-se o nome de Teoria
das Cores. .
2.3.2 Sistemas das Cores .
Três sistemas são muito utilizados: o catálogo de cores Pantone®; a
referência em cores CMYK (quadricromia), para reprodução de sistemas gráficos
impressos e o sistema de cores RGB para referência em projetos eletrônicos
(televisão, internet, projeção). .
Um quarto sistema de cores têm sido cada vez mais adotado é a
representação em código Hexadecimal a ser utilizado em programação de páginas
HTML.
CMYK (cores primárias subtrativas): Este é um sistema de impressão em
quadricromia ou seja, quatro cores primárias que combinadas formam cores
ilimitadas. É utilizado em projetos gráficos que envolvem luz indireta. O padrão
19
CMYK é mais usado para produção gráfica onde o suporte normalmente é o papel.
Desmembrando o padrão CMYK temos:
- C (Cian – azul),
- M (Magent – magenta),
- Y (Yellow – amarelo),
- K ( blacK – preto).
RGB (cores primárias aditivas): corresponde às iniciais das 3 cores Red
(vermelho), Green (verde) e Blue (azul). Sistema utilizado no computador onde têm
sido criado quase todos os projetos gráficos que envolvem luz direta. Este padão é
utilizado para exibição em monitores de computador e televisores em geral.
Pantone (cor aplicada): utilizadas para indicar cores aplicadas, ou seja, a coloração
é específica de uma pigmentação, são indicados códigos fornecidos pelo próprio
fornecedor. Ex. Pantone 032 C.
Hexadecimal (cores para internet): utilizadas na codificação HTML, as cores para
internet são representadas em código Hexadecimal, formada por 3 pares de
caracteres, cada par representando uma região de cor primárias. Esses caracteres
pode ser os seguintes números os letras: (0,1,2,3,4,5,6,7,8,9,A,B.C.D.E.F).
Combinados dois a dois, esses 16 caracteres produzem 256 possibilidades, assim
como ocorre no sistema RGB.
2.3.3 Dimensões da Cor
As cores são clasificadas em três dimensões: tom, valor e saturação. A
pirâmide de Lambert ou o duplo cone de Ostwald e a ordenação criada por Munsell
representam esta classificação. Os sistemas baseiam-se no mesmo princípio. O
20
eixo vertical representa as escalas de valores acromáticos, que vão desde o branco
na parte superior até o negro na inferior. O círculo correspondente ao equador
contém a escala dos tons que possuem, nesta altura, um valor de claridade médio.
Cada uma das seções horizontais do sólido apresenta os valores cromáticos num
dado nível de claridade. Quanto mais afastado do eixo central, mais saturada será a
cor. Quanto mais próximo, mais misturada com um cinza de mesmo valor.
2.3.4 Tom
É a qualidade que distingue uma cor de outra. Por exemplo, um amarelo de
um vermelho. Corresponde ao comprimento de onda dominante.
2.3.5 Fator de Luminância
Cada cor pode ter diferentes valores, de acordo com o seu grau de claridade
ou obscuridade refletida. Por exemplo, um vermelho claro tem valor mais alto do que
um vermelho escuro. Desta maneira, "valor" significa a quantidade de luz que uma
superfície tem a capacidade de refletir.
2.3.6 Saturação ou Fator de Pureza
A saturação corresponde ao grau de intensidade ou croma, e relaciona-se
com a pureza ou a opacidade da cor.
2.3.7 Tonalidade
Esta característica é resultante da proporção das cores componentes ou das
agregadas. Por exemplo, o verde amarelado e o verde azulado são diferentes
tonalidades do verde.
21
2.3.8 Qualidades da Cor
As cores possuem diversas qualidades e "temperaturas", e também diversos
efeitos excitantes sobre o sistema nervoso do observador. .
O psicólogo alemão Wundt estabeleceu a divisão fundamental das cores em
quente e frias. .
As cores quentes são psicologicamente dinâmicas e estimulantes como a luz
do sol e o fogo. Sugerem vitalidade, alegria, excitação e movimento. As cores
quentes parecem que avançam e que se aproximam. .
As cores frias são calmantes, tranqüilizantes, suaves e estáticas, como o gelo
e a distância. As cores frias parecem que se retraem e que se afastam.
2.3.9 Cores em um computador
O olho humano pode distinguir aproximadamente entre 7 e 10 milhões de
cores, o que faz com que a vista seja para nós o principal sentido que nos une com o
exterior, podendo-se afirmar que ao redor de 80% da informação que recebemos do
mundo exterior seja visual.
Nas telas de TV e computadores o sistema de cores utilizado é o RGB, que
identifica três cores básicas, a partir das quais constrói todas as demais mediante
um processo de mescla por unidades de tela (pixels).
2.4 TIPOGRAFIA
2.4.1 História
Tipografia, segundo Farias (2004), é um conjunto de prática e processos
envolvidos na criação e utilização de símbolos visíveis relacionados aos caracteres
22
ortográficos (letras) e paraortográficos (números e sinais de pontuação, etc.) para
fins de reprodução gráfica.
Para o termo Tipologia, comumente utilizado referindo-se ao estudo das
letras, Niemaier (2000) lucida como sendo o processo de classificação ou o estudo
de um conjunto para determinação das categorias em que se distribuem, segundo
critérios definidos. Logo, o termo "tipologia" é inadequado e deve ser evitado.
Tipografia também é um termo usado para a gráfica que usa uma prensa de
tipos móveis. Na grande maioria dos casos, uma composição tipográfica deve ser
especialmente legível e visualmente envolvente, sem desconsiderar o contexto em
que é lido e os objetivos da sua publicação. .
Por muito tempo o trabalho com a tipografia, como atividade projetual e
industrial gráfica, era limitado aos tipógrafos (técnicos ou designers especializados),
mas com o advento da computação gráfica a tipografia ficou disponível para
designers gráficos em geral e leigos. .
Hoje qualquer um pode escolher uma fonte (tipo de letra) e compor um texto
simples em um processador de texto. O processo de concepção de tipos hoje, pode
ser físico ou digital. .
Assim como no design gráfico em geral, o objetivo principal da tipografia é dar
ordem estrutural e forma à comunicação impressa. .
2.4.2 Tipografia Aplicada à Projetos Web
Denomina-se tipografia o estudo, desenho e classificação dos tipos (letras) e
as fontes (famílias de letras com características comuns), assim como o desenho de
caracteres unificados por propriedades visuais uniformes, enquanto que as técnicas
destinadas ao tratamento tipográfico e para medir os diferentes textos são
23
conhecidas com o nome de tipometria. .
A aplicação da informática à impressão, ao design gráfico e, posteriormente,
ao webdesign, revolucionou o mundo da tipografia. A infinidade de aplicações
relacionadas com o design gráfico e editorial tornou possível a criação de novas
fontes de forma cômoda e fácil. .
A respeito das fontes disponíveis em um computador, os sistemas
operacionais (Windows, Linux, OS X) instalam por padrão um número variável delas.
Portanto, quando se trabalha um projeto tipográfico voltado para web tende-se a
gerenciar a escolha das fontes de acordo com os padrões pré-instalados nas
plataformas operacionais. Quando pretende-se utilizar uma família de fontes
específicas em projetos de website normalmente converte-se a fonte para imagem
tornando seu carregamento mais moroso mas, garantindo a diferenciação das
demais fontes padrão dos sistemas. .
As principais famílias tipográficas incluídas nos sistemas operacionais
Windows são: Abadi MT Condensed Light, Arial, Arial Black, Book Antiqua, Calisto
MT, Century Gothic, Comic Sans MS, Copperplate Gothic Bold, Courier New, Impact,
Lucida Console, Lucida Handwriting Italic, Lucida Sans, Marlett, News Gothic MT.
OCR A Extended, Symbol, Tahoma, Times New Roman, Verdana, Webdings,
Westminster e Wingdings.
2.5 DESIGN GRÁFICO NA WEB .
O design gráfico de uma página web é somente uma parte do design da
mesma, já que é preciso considerar um conjunto extenso de condicionantes que
vão limitar a livre criatividade. Existem alguns pontos que serão exaltados a título de
referência para o projeto em questão.
24
2.5.1 Peso dos arquivos publicados
Ciente de que as páginas web devem ser baixadas de um servidor web
remoto através da Internet pelo qual a largura da banda das conexões dos usuários
vem a ser um fator chave na velocidade de visualização é necessário trabalhar com
a otimização de imagens garantindo-lhe leveza e qualidade. Normalmente imagens
trabalhadas para internet possuem 72dpi. .
Com o crescimento e a popularização da banda larga, internet de alta
velocidade, é possível desenvolver projetos mais ousados que envolvam animações,
áudios e vídeos.
2.5.2 Resolução dos monitores .
Em sua maioria, os usuários ainda utilizam a resolução 800x600 pixels
portanto, na hora de desenvolver uma interface web é necessário pensar que
existem limitações de espaço. .
Normalmente se estabelece o padrão de 768 pixels para o tamanho horizontal
do projeto devido as barras dos brownsers ocuparem os outros 32 pixels do monitor.
Isso não quer dizer que o projeto não pode ser desenvolvido com uma
horizontalizade superior a esta, apenas tornará a leitura e compreensão da interface
menos atrativa já que havera a necessidade da aplicação de barra horizontal para
revelar a parte da interface que superou este limite.
Atualmente já existem scripts que redimensionam automaticamente a
interface para o padrão de tela do usuário que varia de 800x600 a 1024x768 pixels.
Como o público alvo em questão é caracterizado como usuário avançado,
seus equipamentos costumeiramente são bastante atualizados portanto o projeto
25
pode será desenvolvido para o dimensionamento 1024x768 tendo em vista que a
maioria das estações de trabalho em agências ou redações são de 17 polegadas ou
maiores e a configuração padrão para estes tipos de monitores é a 1024x768 pixels.
2.6 IMAGEM E SEMIÓTICA .
Qualquer imagem é representação, isso não implica que ela utilize
necessariamente regras para sua construção. .
Se essas representações são compreendidas por outras pessoas além das
que as fabricam, é porque existe entre elas um mínimo de convenção sociocultural,
em outras palavras, elas devem boa parcela de sua significação a seu aspecto de
símbolo, segundo a definição de Peirce. .
A teoria semiótica permite-nos captar não apenas a complexidade, mas
também a força da comunicação pela imagem, apontando-nos essa circulação da
imagem entre semelhança, traço e convenção, isto é, entre ícone, índice e símbolo.
2.7 ERGONOMIA VISUAL PARA INTERFACES WEB .
2.7.1 Engenharia Cognitiva .
O termo “Engenharia Cognitiva” foi utilizado por Donald Norman em 1986 e
reflete em parte seus estudos em Psicologia Cognitiva, Ciencia Cognitiva e Fatores
Humanos.
Segundo Norman (1986), a Engenharia Cognitiva é um tipo de aplicação da
Ciência Cognitiva, que tenta aplicar o que sabemos a partir da ciência no design e
na construção de máquinas. O Objetivo desta Engenharia Cognitiva é entender
estas questões, para mostrar como fazer as melhores escolhas na aplicação deste
conhecimento científico na perspectiva denomidada Design de Sistemas Centrado
26
no Usuário (DSCU) [Norman, D.A, in [ND86]], cujo foco está na relação do usuário
com o sistema.
No DSCU os designers procuram identificar precisamente o que os usuários
querem, utilizando informações sobre as características dos usuários do sistema
promovendo assim uma ergonomia visual adequada aos padrões de tela e as
informações a serem transmitidas tornando-as confortáveis e de fácil assimilação.
FIGURA 02: MODELOS MENTAIS E IMAGEM DO SISTEMA
Fonte: Donald Norman
2.7.2 Hierarquia da Informação para projetos on-line .
Para o desenvolvimento de projeto on-line, onde os usuários deverão interagir
com algum tipo de sistema, se faz necessário oferecer rápida navegação e minimizar
o tempo de carregamento da página. Para tanto, toda estrutura organizacional e de
conteúdo do projeto deve estar alinhada à funcionalidade do sistema por de trás da
internface (design). .
Como o sistema a ser desenvolvido trabalhará com a possibilidade de captura
e envio de vídeos-mail é necessário que as informações fundamentais estejam
27
disponivéis na home, primeira página web aberta de um website, ou no máximo 1
níveis abaixo da página principal. .
O número de links dentro de uma página ou sistema determina sua amplitude
e consequente complexidade. O ideal é a realização de um estudo de maximização
de informações e minimização de hiperlinks. Esta atitude facilita a compreensão dos
assuntos e organiza cada assunto dentro das determinadas categorias.
2.8 A HISTÓRIA DA INTERNET
A internet surgiu em meados dos anos 60 como uma ferramenta de
comunicação militar. Em 1969 surgiu a ARPAnet (Advanced Research Projects
Agency Network) inicialmente ligando 4 computadores da Universidade da Califórnia
a um centro de pesquisa em Stanford nos Eua. No início dos anos 80 mais
computadores uniram-se a esta rede e surgiu o protocolo para troca de informações
TCP/IP (Transmission Control Protocol/ Internet Protocol) aumentando bastante a
abrangência da rede. Em 1995, devido ao grande aumento de usuários, a internet foi
transferida para a administração de instituições não-governamentais que se
encarregam, entre outras coisas, de estabelecer padrões de infra-estrutura, registrar
domínios, etc. .
Atualmente milhões de usuários estão conectados a rede e a utilizam como
fonte de informação, envio de mensagens e publicação de imagens e/ou conteúdos
entre outras. .
A internet dá suporte para criação de inúmeros softwares e comunidades que
promovem o envio global de mensagens. Ela é responsável pelo encurtamento das
distâncias mundiais. Tornou-se simples falar ou enviar um arquivo para pessoas de
outros países e assistir em tempo real programas, jornais e acontecimentos globais.
28
A tecnologia na transmissão de dados chegou a 3ª geração e converge para a
criação de Gadgets, dispositivos eletrônicos portáteis como celulares, PDAs, etc que
comunicam-se com a internet atraves de conexões sem fio. .
Vive-se na era dos celulares ultra-tecnológicos que passam por uma
revolução a cada mês. Muito mais que um simples telefone estes novos aparelhos
são desejados pelo seu design, acessibilidade e funções. Uma das funções dos
aparelhos é ser telefone mas no pacote já vem embutido câmera digital, players de
áudio e vídeo, filmadora e muitos outros aplicativos que possibilitam o acesso via
wire-less à internet. .
Atentando a essas tendências e as mais novas ferramentas de comunicação
via internet viu-se a possibilidade da criação de um sistema on-line que possibilite a
transmissão de vídeo mensagens entre usuários e comunidades que possuem
celulares e Gadgets com conectividade a rede.
Sabe-se que a mensagem áudio-visual é poderosa, persuasiva e
personificada, através dela, empresas e profissionais liberais podem promover
palestras, reuniões, discussões e demonstrar projetos com minimização de ruídos.
2.8.1 Definições e Nomenclaturas Web .
Brownsers: ou navegadores, são sistemas que permitem a navegação na internet.
Web: abreviatura de World Wide Web (www). É a rede mundial dos computadores.
Website, Site ou Sítios: é um conjunto de páginas web, isto é, de hipertextos
acessíveis geralmente pelo protocolo HTTP na Internet. .
URL: Localizador de Recursos Universal é o endereço de um recurso disponível em
uma rede; seja a Internet, ou uma rede corporativa, uma intranet.
Portal: é um site na internet que funciona como centro aglomerador e distribuidor de
29
conteúdo para uma série de outros sites ou subsites dentro, e também fora, do
domínio ou subdomínio da empresa gestora do portal. .
Blogs: é uma página da Web, cuja estrutura permite a atualização rápida a partir de
acréscimos de tamanho variável, chamados artigos, ou recados. Normalmente são
organizados cronologicamente.
Gadgets: São comumente chamado de gadgets dispositivos eletrônicos portáteis
como PDAs, celulares, smartphones, tocadores mp3, entre outros. Em outras
palavras, é uma "geringonça" eletrônica. Chama-se também de gadget algum
pequeno software, pequeno módulo, ferramenta ou serviço que pode ser agregado a
um ambiente maior. .
Widgets: são pequenos aplicativos que flutuam pela área de trabalho e fornecem
funcionalidade específicas ao utilizador. .
Wikisite: é um site ou uma coleção de mini-sites que podem ser administrados pelo
usuário e o conteúdo é gerenciado por colaboradores da internet.
HTML: HyperText Markup Language, que significa Linguagem de Marcação de
Hipertexto. é uma linguagem de marcação utilizada para produzir páginas na Web.
Documentos HTML podem ser interpretados por navegadores.
CSS: Cascading Style Sheets, é uma linguagem de estilo utilizada para definir a
apresentação de documentos escritos em uma linguagem de marcação, como o
HTML.
ACTION SCRIPT: é uma linguagem de programação orientada à objetos
primariamente utilizada para construção de aplicações Internet rica. Evoluiu dos
recursos do Flash Player.
FLASH: software utilizado para animações e aplicações na internet.
Pixels (px): é o menor ponto que forma uma imagem digital, sendo que o conjunto
30
de milhares de pixels formam a imagem inteira. .
Spam: é uma mensagem eletrônica não-solicitada enviada em massa
2.8.2 A comunicação na Internet .
O fator de confiança é de suma importância para a relevância das
propagandas on-line. A estratégia de divulgação de um site deve estar embasada
num processo de branding que tem início off-line, ou seja, no relacionamento fora do
ambiente virtual. .
Posiciornar-se somente em um ambiente virtual é possível desde que uma
comunidade ou muitos internautas validem o sistema aferindo assim confiança ao
mesmo. Caso contrário, a propagação de uma má impressão é facilmente divulgada
através da rede. .
Na estratégia de branding on-line as marcas devem posicionar-se como
solucionadoras de impasses e facilitadoras oferecendo maior relacionamento e
informação aos consumidores. .
Para que as marcas se tornem lucrativas elas devem desenvolver uma
reputação positiva e para que esta afirmação óbvia se torne verdade, a relação com
o consumidor on-line deve ser transparente e o compromisso entre as partes deve
ser cumprido cabendo as empresas a função de gerenciar estes processos de
relacionamento com o consumidor. Quando isso não ocorre, o website acaba se
tornando um canal de reclamações fator que prejudica a imagem da empresa junto
aos consumidores. .
Alguns dos fatores fundamentais para posicionar-se na internet são:
• Fator Custo: as despesas de criação e manutenção de websites são muito
baixas se comparadas ao posicionamento físico. Estar 24 horas disponível para o
31
mundo inteiro tambem faz toda a diferença na estratégia de comunicação e
relacionamento com os consumidores.
• Fator E-mail: através de um endereço de e-mail é possível estabelecer
comunicação com qualquer empresa ou pessoa em qualquer parte do mundo sem
se submeter a custos elevados de telefonia internacional. É possível tambem enviar
arquivos, documentos, imagens e vídeo. .
• Fator Consumidores: é um canal aberto para que os consumidores possam
falar diretamente com a empresa de modo a especificar suas necessidades intrísicas
ou coletivas. É o caminho mais curto para evitar problemas de comunicação.
• Fator 24 horas: a exposição ocorre 24 horas por dia 7 dias por semana
portanto, a qualquer hora e de qualquer lugar é possível dar ou deixar algum recado.
• Fator Global: um website é uma multinacional digital pois milhões de
pessoas podem conhecer o serviço oferecido e os benefícios desde que se tenha
algo novo a mostrar ou fazer.
• Fatores Multiculturais: pode-se aplicar o conteúdo em outros idiomas e
modificar a linguagem de acordo com cada perfil demográfico.
• Fator Padrões: o tempo todo é possível testar novos padrões de consumo já
que é a internet é uma nova mídia com altíssimo poder de penetração junto ao
público consumidor. .
• Fator Tempo: a divulgação física tornou-se morosa e custosa se comparada
com a virtual. A alteração de valores, imagens e informações tornou-se ágil, fácil e
viável através dos websites.
• Fator Lançamentos: a internet é a maneira mais fácil, barata e segura de
atingir milhões de usuários e torná-los possíveis consumidores de uma nova idéia.
O marketing para promover as páginas de Internet é diferenciado. Enquanto o
32
“marketing analógico” promove e divulga produtos tangíveis, tudo o que o “marketing
digital” tem para vender são promessas intangíveis de serviços, ou a promoção
virtual de produtos digitais, sendo dirigido para atrair e reter visitantes, prováveis
consumidores.
Atrair tráfego e visitas é o primeiro e mais importante passo para o sucesso do
seu website na Internet. O segundo, certamente, é manter os visitantes. O melhor
caminho para isso é tornar os visitantes satisfeitos, oferecendo serviços e benefícios
que se alteram conforme as necessidades do público. .
Em suma, a internet é um formato digital de branding e posicionamento de
marcas.
Objetiva-se então, desenvolver um projeto modelo que divulgue produtos e
mensagens através de captura e envio de vídeos produzidos pelos próprios usuários
do sistema oferecendo uma nova experiência na maneira de comunicar via web.
2.9 TRANSMISSÃO DE DADOS ÁUDIO-VISUAIS ATRAVÉS DA WEB .
2.9.1 Mídias on-line. Divulgação Dirigida e Customizada .
Ciente de todos os conceitos web e das possibilidades que a rede oferece,
analizou-se então o impacto que a divulgação de marcas, serviços e produtos tem
gerado no resultado das empresas. .
Foi comprovado que o poder de penetração e de customização do meio
virtual é poderoso pois atende as necessidades específicas de cada consumidor a
um valor muito abaixo se comparado ao investido no atendimento físico (pessoal).
Na internet, a divulgação é segmentada e os anunciantes escolhem quais
canais (sites, blogs, buscadores, etc) e estilos (perfis de usuários que frequentam
determinadas seções ou sites) pretendem divulgar suas marcas. .
33
Ela também é persuasiva e direta pois permite a utilização de sons e imagens
para atrair a atenção do internauta de modo a forçá-lo a interagir com determinadas
informações.
As lojas de eletro-eletrônico que mais faturam atualmente não são as lojas
físicas mas sim as que estão na intenet. Este é um mercado que fatura milhões de
dólares a cada ano e tende a crescer ainda mais com a popularização dos
computadores e com a banda larga. .
Segundo pesquisas, somente 3% de todos os sites da internet estão
indexados pelos buscadores isso quer dizer que 97% de todo conteúdo web ainda
não está formatado para que todo o mundo o possa encontrar.
Estar bem posicionado na internet é a aspiração de todo empreendedor ou
gestor de marcas mas para que o seu projeto tenha sucesso e, acima de tudo, seja
acessado por seu público alvo se faz necessário divulgá-lo de maneira objetiva e
persuasiva.
A revolução YOUTUBE, site que permite a publicação e divulgação de vídeos
na web, trouxe à tona a possibilidade de transmissão de vídeos na rede
possibilitando maior impacto nas informações e a captura, por parte do receptor, de
mensagens antes sucumbidas devido as limitações web. .
O vídeo é sem dúvida a expressão mais fidedigna à comunicação completa
pois estimula os princípais sentidos das pessoas e o que antes não era possível
devido a falta de tecnologia ou a velocidade de banda de internet, hoje tornou-se
uma realidade. .
A TV digital, as TVs on-line, os celulares com câmeras e conexões
multifuncionais e toda tecnologia em volta da comunicação portátil possibilita e valida
a criação de um projeto que atenda as agências de comunicação e as de notícias
34
que buscam uma ferramenta on-line inteligente, criativa, cognitiva e universal para a
captura e envio de vídeos para um ou múltiplos usuários, segmentados de acordo
com o perfil de cada solicitação. .
35
3 MATERIAIS E MÉTODOS
3.1 METODOLOGIA
Após definido o tema do foi dado início as pesquisas bibliográficas e históricas
cujo resultado se encontra na primeira parte deste documento. .
Para a parte de pesquisa mercadológica e base para criação, a principal
metodogia de projeto utilizada foi a de Gui Bonsiepe (1997), autor do livro Do
material ao digital, a partir de suas ferramentas comparativas de análise paramétrica,
público alvo e listas de verificação. Também para auxílio no plano metodológico
foram consultados livros “Das Coisas Nascem Coisas”, de Bruno Munari e
“Metodologia do Trabalho Científico”, de Antonio Joaquim Severino.
Conjugando então as metodologias projetuais de Bruno Munari, Gui Bonsiepe
e Denis Schulmann, autor do livro O Desenho Industrial; Kim Heldman, autor de
Gerência de Projetos (PMP) e de referências do livro O Valor do Design, Guia
indicado pela ADG (Associação dos Designers Gráficos) para prática da profissão
pode-se estabelecer um plano metodológico próprio que resultou na estrutura a
seguir.
:
3.2 POR DENTRO DA PRÁTICA METODOLÓGICA .
3.2.1 Estudos preliminares e definição do problema:
Os serviços similares ou concorrentes, de gravação e envio de video-
mensagem (VM) em sua maioria, contemplam a instalação de softwares no
computador do usuário para que seja feito a captura e transmissão dos dados. Isso
torna o envio moroso e não permite o envio de VM de outras estações de trabalho
que não tenham o software instalado. .
Outros fatores relevantes para o desenvolvimento do projeto em questão é
36
que os serviços similares ou concorrentes não conseguem atender as necessidades
específicas do público alvo escolhido no que se refere as funcionalidades,
hierarquia das informações e principalmente no projeto de interface visual e marca.
.
3.2.2 Reconhecer a existência de um problema ou de uma oportunidade;
Segundo analistas do setor de telecomunicação os gastos com ligações
telefônicas nas empresas são o segundo item que mais consome recursos
financeiros do orçamento de TI, cerca de 10% (Alves, 2007). Ainda assim, apesar
dos avanços nas comunicações, pode-se dizer que os meios de comunicação ainda
são deficientes sob um determinado ponto-de-vista.
A comunicação com recursos de áudio e vídeo sobre a internet ainda não é
uma realidade no dia-a-dia das corporações, dos governos ou mesmo de usuários
domésticos.
A eficiência de meios de comunicação que utilizam estes recursos
audiovisuais já é largamente comprovada. Com isso, o que propõem-se é um modo
econômico, eficiente e, principalmente, atraente e marcante através do qual, seja
possível enviar mensagens audiovisuais através da internet. Para isso, basta estar
conectado a internet banda larga e possuir webcam e microfone acoplados ao
computador.
.
3.2.3 Objetivo da solução para o problema:
Desenvolver o Branding, uma interface esteticamente agradável, intuitiva e
criativa e materiais de apoio a divulgação do sistema para fornecer aos seus
usuários rápida assimilação do seu uso permeando a identificação com seu perfil.
Aplicar no sistema funcionalidades profissionais de aferição de resultado dos
37
envios de tal forma que estes dados retornem aos usuários para que estes possam
re-alinhar suas estratégias ou re-enviar uma informação ou campanha que teve
êxito.
3.2.4 Quem, onde e quando utilizará? ;
Grandes agências de comunicação (publicidade) buscam inovações e
maneiras de surpreender seus clientes e o público-alvo de suas campanhas
publicitárias. O envio de videos por e-mail é uma estratégia poderosa de divulgação
de novos produtos ou serviços. Contudo, isso só é possível através da utilização de
um sistema que garanta uma compactação adequada e a qualidade do material
promocional , bem como, personalização do conteúdo de acordo com a campanha
publicitária.
A ferramenta a ser desenvolvida atende todos estes requisitos e fornece
dados estáticos na forma de relatórios, isso significa um rico e completo conjunto de
informações que auxiliam a análise do sucesso da campanha.
Segundo Tulio Nicastro, responsável pela mídia on-line, da agência Y&R
(Young & Rubicam), pertencente ao grupo Newcomm presidido por Roberto Justus,
essa necessidade é recorrente e uma ferramenta com essas características
atenderia plenamente as necessidades atuais da agência no que diz respeito a
campanhas de grandes clientes como Schincariol e TAM na web.
Diariamente, as redações de grandes agências de notícias são obrigadas a
enviar centenas, ou até mesmo milhares, de “press-releases” com as principais
manchetes a todos os seus afiliados. O envio de mensagens audio-visuais, ou
mesmo somente de áudio, ao invés de e-mails escritos facilitaria muito a
comunicação e promoveria o aumento de produtividade segundo a opinião de
38
Marina Shimamoto, gerente de produtos on-line do Jornal Gazeta Mercantil.
3.2.5 Por quanto tempo será utilizado? ;
Os usuários do sistema poderão contratar este modelo de mídia de acordo
com suas demandas portanto, a cada campanha ou envio de notícias deverão
mensurar sua abrangência e volume de tráfego para que após o acerto entre as
partes (usuários e empresa) o serviço seja disponibilizado. .
A partir de sua publicação, a versão beta do sistema irá aferir a aceitação e a
usabilidade do sistema junto aos usuários. Após um período de 6 meses será refeito
estudos com o objetivo de implemantar melhorias visuais e de funcionalidades
objetivando atender outros perfis de público. .
3.2.6 Finalidade, função ou aplicação. ;
O processo de criação da interface visa despertar curiosidade e motivar o
conhecimento por parte do público alvo em utilizar uma nova e poderosa ferramenta
de divulgação de mensagens áudio-visuais através da internet. .
A função do sistema é capturar e enviar vídeos ou áudios para listas de e-mail
segmentadas e autorizadas. Desta maneira, as políticas de privacidade dos e-mails
serão respeitada evitando assim filtros anti-spam. .
3.2.7 A necessidade do design e a aplicação do Branding ;
O Branding destina-se neste projeto a criação de uma postura de exposição
visual marcante, onde todos os sentidos serão despertados. Obviamente não é
possível, ainda, transmitir cheiros, gostos ou texturas através da internet mas as
formas, cores e todo material físico de apoio a divulgação será pensado de maneira
39
criativa para cativar e estabelecer uma relação de identidade com o público que se
pretende atender. .
O design será utilizado como ferramenta estratégica para criação de uma
identidade única e atrativa nos quesitos marca, interface e peças de divulgação.
3.3 DESCONTRUÇÃO DO PROBLEMA .
3.3.1 Quais as partes do problema?
O Branding do projeto é composto por:
- Naming;
- Marca;
- Papelaria administrativa (cartão, pasta, timbrado, envelope);
- Manual de Identidade Visual (projeto gráfico e virtual);
- Interface gráfica para website institucional;
- Interface gráfica para sistema web;
- Envio de interfaces para montagem e programação;
- Criação de assinatura digital (e-mail);
- Criação e edição de assinatura digital da marca (vinheta);
- Criação e edição de vídeo de apresentação do projeto 15 seg.;
- Criação de video-marketing teaser utilizando o próprio sistema;
- Criação de press-kit para as agências (embalagem e impresso);
- Criação de banners virtuais para publicação em portais de comunicação;
- Criação de anúncio para revistas especializadas no perfil das agências;
40
3.3.2 Quais os tipos de informações gráficas serão utilizadas.
- Textos e suas famílias tipográficas; ;
- Ícones para representação e abreviação cognitiva de alguma função;
- A Marca e suas variações e aplicações; ;
- Paleta de cores do projeto imprimindo assim maior identidade as peças;
- Grafismos, imagens e ilustrações. .
3.4 SIMILARES E CONCORRENTES .
3.4.1 Localizar Similares e Concorrentes; ;
O Similares são: :
- FLICKR: é um site da web de hospedagem e partilha de imagens
fotográficas (e eventualmente de outros tipos de documentos gráficos, como
desenhos e ilustrações), caracterizado também como rede social.
O site do Flickr foi desenvolvido pela Ludicorp em Vancouver, Canadá, onde a
empresa foi fundada em 2002. A empresa lançou o Flickr em fevereiro de 2004. Em
16 de maio de 2006, o Flickr alterou a classificação de seu site de Beta para
Gamma: tal mudança reflete um vocabulário comum para designar atualizações de
versões de software, refletindo um novo desenho e estrutura para o site.
FIGURA 3 – INTERFACE DO FLICKR
Fonte: http://www.flickr.com.br
41
- LAST FM: desenvolvido na Inglaterra, o LAST FM se tornou uma das
maiores comunidades de compartilhamento de músicas da internet. Através do site
usuários cadastrados de todo mundo podem compartilhar e ouvir arquivos de áudio
e video-clips. Para fazer parte da comunicade é necessário efetuar cadastro. Existe
a necessidade de instalação de um software no computador do usuário para
organização e comunicação dos arquivos de áudio.
FIGURA 4 – INTERFACE DO LASTFM
Fonte: http://www.lastfm.com.br
42
- MSN MESSENGER: desenvolvido pela Microsoft o MSN Messenger é um
software mensageiro que por intermédio de sua interface permite a comunicação
entre usuários através de textos, áudios e vídeos. O software precisa ser instalado
no computador de seus usuários para que haja conectividade entre as contas MSN.
FIGURA 5: INTERFACE MSN MESSENGER (VERSÃO LIVE)
Fonte: Do autor
43
- PLAYHEAD: iniciado em 1998 e reformulado em 2002 na Suíça com o
conceito de comunidade colaborativa, possui hoje mais de meio milhão de usuários.
Cada membro tem a liberade de criar seu próprio perfil e incluir e divulgar fotos,
vídeos e áudios para os outros membros. .
FIGURA 6: INTERFACE PLAYHEAD
Fonte: http://www.playhead.com
44
- VIDDYOU: permite que qualquer pessoa, de maneira rápida e fácil possa
arquivar sua vida em forma de vídeos curtos. Apresenta uma intuitiva interface
organizacional e ferramentas de simples gestão. O Viddyou permite gravar
rapidamente, organizar e partilhar os vídeos com a comunidades cadastrada no
sistema. Possibilita a gravação e envio de vídeos por celular e sua interface é de
fácil compreensão. .
FIGURA 7: INTERFACE VIDDYOU
Fonte: http://www.viddyou.com
45
- WALLOP : O Wallop é considerado a mais inovadora rede social da internet.
Possui uma interface totalmente dinâmica em Flash. Permite personalizar, de forma
incrível, a página do usuário e organizar seus amigos de forma mais criativa.
O usuário pode fazer upload de músicas e fotos. Também possui um Blog anexado
ao sistema e possui alguns Mods. Mods são pequenos aplicativos em Flash que o
usuário do Wallop pode ter em sua página ou em seu Blog. Os Mods podem ser um
fundo animado, personagens, ferramentas, frases, etc. Tudo para deixar a página do
usuário mais bonita. Os Mods são feitos por designer independentes. Portanto, a
grande maioria pode ser comprado por dinheiro real ou por Wollars. Wollars é um
dinheiro virtual na qual o usuário recebe ao se cadastrar no site.
FIGURA 8: INTERFACE WALLOP
Fonte: http://www.wallop.com
46
Os Concorrentes são: :
- BEBO: é uma comunidade que permite o compartilhamento de imagens,
vídeos as características de seus usuários. O network gerado pelo BEBO permite
aos seus usuários relacionar-se com pessoas de todo o mundo. O BEBO possui
tambem uma versão de “instant messenger” que permite aos usuários cadastrados e
“logados” conversar instantaneamente com outros usuários com o mesmo status.
FIGURA 9: INTERFACE DO BEBO
Fonte: http://www.bebo.com
47
- DELL VIDEO CHAT: criado e desenvolvido pela SightSpeed o sistema
DELLVIDEO CHAT (DVC) possui 3 versões disponibilizadas gratuitamente aos
usuários são elas: VIDEO CHAMADA: ao cadastrar-se e após baixar o software o
usuário do DVC poderá comunicar-se com outros usuários através de vídeo-
chamadas. Estas, permitem a inclusão de até 4 usuário simultaneamente
transformado o sistema em uma plataforma de video-conferência on-line.
VOZ: permite a transmissão de voz entre 2 computadores gratuitamente e permite
também chamadas do computador para aparelhos telefônicos com tarifas reduzidas
se comparadas as tarifas normais. TEXTO: permite conversar de texto “instant
messenger” entre os usuários do software.
.FIGURA 10: INTERFACE DO DELL VIDEO CHAT
Fonte: http://www.sightspeed.com/dellvideochat
48
- SKYMOL: baseado na tecnologia VoIP (voz por IP) o sistema SKYMOL possibilita
e facilita a comunicação entre seus usuários. O Sistema integra ambos na
plataforma web e não necessita de instalação de softwares no computdor de seus
usuários. Para se tornar usuário SKYMOL se faz necessário pagar de U$24,00 a U$
74,00 de acordo com a versão. O SKYMOL tem seu foco no público corporativo que
visa transmitir informações e dados (texto, arquivos, vídeos) com maior sigilo e
administração do fluxo de arquivos.
FIGURA 11: INTERFACE SKYMOL
Fonte: http://www.skymolcorp.com
49
- SKYPE: sob o slogan “converser é tudo” o software se propõem a
estabelecer contato via VoIP entre seus usuários. Sua tecnologia permite que os
usuários conversem através de mensagens de texto, voz ou vídeo chamadas com
outros usuários gratuitamente. Para utilizar o SKYPE é necessário criar um conta
junto ao sistema e instalar seu software padrão. A linguagem gráfica do SKYPE é
bastante agradável e intuitiva e traduz bastante jovialidade e tecnologia. Uma das
estratégias de comunicação e identificação com seu público alvo foi a criação de
ícones personalizados e temáticos. .
FIGURA 12: INTERFACE DO SITE SKYPE
Fonte: http://www.skype.com/intl/pt/
50
- VISMAIL: Vismail é uma nova alternativa de mídia, que possui o poder de
estimular pessoas com os vídeos e motivá-los a acessarem website através dos
links inclusos na mensagem. É o caminho mais rápido para converter a campanha
publicitária em vendas. É simplesmente a união da mídia mais atrativa com a mais
interativa. De um lado o usuário possui o poder do vídeo, que vinculado a uma boa
criação, impacta instantaneamente o espectador sem que esse tenha que mover
ação alguma. Do outro lado, a interatividade do e-mail, que possibilita uma reação
rápida e uma relação mais próxima e exclusiva da marca com o consumidor,
movendo o funil de vendas. O projeto VISMAIL é um dos que mais se assemelha ao
projeto a ser desenvolvido neste Trabalho de Conclusão de Curso devido ao
conceito de entrega de vídeo mensagens. .
FIGURA 13: INTERFACE VISMAIL
Fonte: http://www.vismailbrasil.com.br
51
- YVIDEOO PRO: é uma ferramenta de apoio as campanhas de marketing na
internet. Com ele, o usuário poderá enviar múltiplos vídeos mensagem em
campanhas de e-mail marketing, vendendo seu produto, divulgando sua empresa ou
o seu negócio. A grande vantagem desse sistema, é que o usuário poderá
encaminhar a vídeo mensagem diretamente no e-mail de seus clientes, parceiros ou
amigos. Estes precisam apenas clicar no link indicado para assistir o vídeo, sem
qualquer necessidade de cadastro ou algo assim. O YvideoO Pro é o sistema que
mais se assemelha a idéia central do projeto a ser desenvolvido no entanto, novas
funcionalidades e uma interface mais atraente farão do projeto. .
FIGURA 14: INTERFACE YVIDEOO PRO
Fonte: http://www.yvideoopro.com.br
52
3.4.2 Análise paramétrica;
FIGURA 15: TABELA DE ANÁLISE PARAMÉTRICA DE SIMILARES – 1
Fonte: Do autor
53
FIGURA 16: TABELA DE ANÁLISE PARAMÉTRICA DE SIMILARES – 2
Fonte: Do autor
54
FIGURA 17: TABELA DE ANÁLISE PARAMÉTRICA DE SIMILARES – 3
Fonte: Do autor
55
FIGURA 18: TABELA DE ANÁLISE PARAMÉTRICA DE CONCORRENTES – 1
Fonte: Do autor
56
FIGURA 19: TABELA DE ANÁLISE PARAMÉTRICA DE CONCORRENTES – 2
Fonte: Do autor
57
FIGURA 20: TABELA DE ANÁLISE PARAMÉTRICA DE CONCORRENTES – 3
Fonte: Do autor
58
3.5 COLETA DE DADOS
3.5.1 Benchmarking .
O Benchmarking consite na análise de similares e concorrentes com o
objetivo de imprimir melhorias significativas a partir do estudo de projetos já
existentes.
Através da análise paramétrica pode-se verificar pontos marcantes para o
desenvolvimento do projeto em questão que foram: :
- A interface do sistema deve ser humanizada identificando assim o público alvo;
- O tamanho da interface deve ser concebido a partir de 1024x768 px.;
- A maioria das marcas possuem ícones ou símbolos representativos;
- Apenas 2 dos projetos analisado possuem fundo escuro;
- Àqueles sistema que possibilitaram a formatação de comunidades possuem maior
número de usuários;
- Em sua maioria os sistema não possuem grande poder de atratividade portanto,
seu projeto gráfico deixa a desejar;
- A otimização de links na página inicial é algo que deve ser levado em
consideração. A média é de 6 links;
- O tempo médio, perdido pelo usuário, no uso do sistema é de 10 minutos;
- O Brasil possue apenas 2 sistemas que foram desenvolvidos localmente. A maioria
dos serviços disponíveis são estrangeiros;
3.5.2 Pesquisa de público ;
Após ter definido a estratégia e o conceito do sistema a linearização e
definição do público alvo ficou bastante clara. .
Atender agências de publicidade e seus clientes com uma ferramenta on-line
59
de suporte para campanhas de video e-mail marketing e tambem, agências de
notícias possibilitando agilidade e segmentação das notícias geradas, valida o
desenvolvimento do sistema.
Para verificar a necessidade real do projeto foi efetuado pesquisa de campo e
entrevistas pessoais com agentes de notícia e os profissionais de mídia on-line das
agências de comunicação com o objetivo de saber sua impressão sobre a criação de
um sistema que faz entrega de video mensagens com segmentação e aferição de
resultados.
Profissionais entrevistados:
Cassiano Pires - Agência Lausac - Curitiba
Tulio Nicastro - Y&R – São Paulo
Vinicius - Agência 11 - Curitiba
Katia Michele - Jornal Folha de Londrina - O Bonde - Curitiba
Alexandre Nogueira - Fox Promo - Curitiba
Fabio Heizen - Ergus Estúdio - Curitiba
Flávia Ferreira - Ieme Comunicação - Curitiba
Rogério Florenzano - Jornais GPP - Curitiba
Manuel de Medeiros - Radio Transaméria FM - Curitiba
Marcelo Castellano - Vouk Comunicação - Joinville
60
A percepção foi a seguinte:
1) Na sua opinião, existe a necessidade real do desenvolvimento de um
sistema que permita envio de video-mensagens com possibilidade de
gerenciamento de listas e aferição de resultados?
100% responderam: SIM
2) Você conhece ou já utilizou algum sistema similar? Qual?
- Cassiano Pires
“Desconheço sistemas que enviam vídeo. Utilizo apenas o SKYPE e o
MESSENGER para me comunicar através de vídeo-chat.”
- Tulio Nicastro
“Nós fizemos algumas tentativas com o INCREDIMAIL mas ele apresento problemas
na hora de abrir as mensagens. “
- Katia Michele
“Só usamos o SKYPE e o MESSENGER mesmo. Nunca disparamos vídeos por e-
mail. Somente os links do YOUTUBE.”
- Alexandre Nogueira
“Não conheço mas quando precisamos enviar algum vídeo enviamos o link do
YOUTUBE através do ActiveMail.
- Fabio Heizen
“Eu publico o vídeo do YOUTUBE e envio o link para lista.”
- Flávia Ferreira
“Não conheço nenhum.”
61
- Marcelo Castellano
“Eu uso o ActiveMail que oferece aferição de resultados mas quando trata-se de
vídeo envio apenas o link do vídeo que normalmente esta publicado no YOUTUBE.”
3) Qual é o padrão de dimensionamento visual de seu monitor?
70% respondeu: 1024x768 pixels
10% respondeu: 1280 x 1024 pixels
20% respondeu: 800x 600 pixels
3.6 RECONSTRUÇÃO DO PROBLEMA E DIVISÃO DAS TAREFAS:
3.6.1 Organizar o problema;
- Brainstoming para escolha do Naming;
- Rafs e alternativas para concepção da Marca;
- Definição de papelaria administrativa (cartão, pasta, timbrado, envelope);
- Criação de Interface gráfica para website institucional;
- Criação de Interface gráfica para sistema web;
- Projeto gráfico do Manual de Identidade visual (projeto gráfico e virtual);
- Envio de interfaces para montagem e programação;
- Criação de assinatura digital (e-mail);
- Criação e edição de assinatura digital da marca (vinheta);
- Criação e edição de vídeo de apresentação do projeto 15 seg.;
- Criação de video-marketing teaser utilizando o próprio sistema;
- Criação de press-kit para as agências (embalagem e impresso);
- Criação de banners virtuais para publicação em portais de comunicação;
- Criação de anúncio para revistas especializadas no perfil das agências;
62
3.7 A PESQUISA CRIATIVA
3.7.1 Painéis semânticos e de análise
FIGURA 21: PAINEL DE SEMÂNTICA SOBRE O TEMA
Fonte: Do autor
63
FIGURA 22: PAINEL DE ANÁLISE DIACRÔNICA
Fonte: Do autor
64
FIGURA 23: PAINEL DE ANÁLISE SINCRÔNICA
Fonte: Do autor
65
3.7.2 Esboços para alternativas de nomes
- MAOBEE: sua fonética é agradável e remete a algo criativo e tribal;
- MKTVIDEO: nome indutivo ao tipo de serviço prestado;
- VMNET: abreviação de Vídeo Mail;
- MOVMAIL: faz alusão ao movimento do vídeo aplicado no envio de e-mail;
- MIDIA 3.0: avanço da web de 2.0 para 3.0;
- APERTEOPLAY: nome que induz a uma ação. Vídeo é Ação;
- GET STARTED: induz ao início de algo;
- NOW PLAY: conceito de mudança. Agora jogue, brinque, apareça!;
- VIDEO MKT (Dominio ja registrados );
- MKT VIDEO (Dominio ja registrado);
- MEVIDEO: indica criação de vídeos pelo próprio usuário;
- EVERSCREEN: nome sonoro, indutivo e alusivo ao sistema;
- LE CLAQUETON: criativo mas pouco atrativo;
- WEB FACTORY: induz a criação de websites e não ao envio de vídeos;
- VIDEO FACTORY: induz a criação de vídeos no caso uma produtora;
- E-VIDEO CO.: define bem o tipo de serviço ao mesmo passo que o internacionaliza
- INDUSTRY_V: define bem o tipo de serviço
- ZOOMNA NET: sonoro e indutivo;
- ENTO-DAWEB - Seu video na web. Em toda web!;
- CAM.E: alusivo a câmera eletrônica;
- BIZZ.E: A nomenclatura BIZZ faz referência a business e E a espécie eletrônica;
- BZzzz: Alusão a onomatopéia feita pela abelha (BEE em inglês) reforça a idéia de
algo que voa para todos os lados mas com tarefas bem definidas.
- CASTLE (Castelo) / CASTEL (Pronuncia melhorada)
66
- CAST.E (BROADCAST + E ) Eletronic)
- CASTL - Pronúncia CAST . EL – pronuncia arrojada e diferenciada.
(surgiu de broadcasting, webcasting, webcastle, castle)
Nome selecionado: CASTL | the network without limits
A partir dessas opções pesquisou-se qual naming seria de compreensão
universal mesmo estando internacionalizado (idioma inglês). O objetivo do nome
além de ser pequeno (facilitar o acesso nos brownsers) é traduzir robustez,
tecnologia e muita criatividade.
Adicionando estas características com objetivo do sistema, que é permitir aos
usuários uma comunicação eficaz, diferente e criativa utilizando-se de recursos
áudios-visuais, adotou-se o nome CASTL que traduz a construção da imagem, do
som, enfim do composto áudio-visual. O slogan “the network without limits” poderá
acompanhar o nome.
3.7.3 As interfaces a serem desenvolvidas ;
O Manual de Identidade Visual será dividido nos seguintes tópicos:
- Introdução
- Proposta (Objetivo do Manual)
- Design da marca (explanação do projeto e do conceito)
- Marca vetorizada
- Grid de Construção
- Tipografia (tipografia de apoio)
- Cores
- Assinaturas (Aplicações, Tamanho Mínimo Recomendado)
- Papelaria administrativa
67
- Peças digitais (Assinatura e Cabeçalho de E-mail e Papel de Parede)
O projeto do website será dividido nos seguintes tópicos:
- Menu primário: Formulário para Login, Vantagens e Funcionalidades,
Cadastre-se, Contrate
- Menu secundário: Sobre, Contato, Termos, Política, Ajuda
Será desenvolvido as seguintes peças para divulgação do sistema:
- Criação de assinatura digital (e-mail);
- Criação e edição de assinatura digital da marca (vinheta);
- Criação e edição de vídeo de apresentação do projeto 15 seg.;
- Criação de video-marketing teaser utilizando o próprio sistema;
- Criação de press-kit para as agências (embalagem e impresso);
- Criação de banners virtuais para publicação em portais de comunicação;
- Criação de anúncio para revistas especializadas no perfil das agências;
3.7.4 A formalização dos conceitos. .
Para formatação do conceito gráfico a ser seguido desenvolveu-se uma
pesquisa de estilos e tendências junto aos profissionais de comunicação e foi aferido
que estes possuem maior identificação com sistemas que valorizam os seguintes
tópicos:
- clareza
- criatividade / originalidade
- agilidade / velocidade de visualização do conteúdo
- beleza estética ou conceitual
68
- tecnologia
- humanização
Atento a todos estes fatores hierarquizados na pesquisa de tendências,
pretende-se desenvolver um projeto que una uma linguagem tecnológica a visão
criativa e conceitual dos comunicadores. O projeto deverá ser desenvolvido com a
possibilidade de ser atualizado diariamente podendo-se incluir as marcas dos novos
clientes bem como imagens e depoimentos dos usuários do sistema.
3.8 MATERIAIS E PROCESSOS:
3.8.1 Recursos disponíveis ;
O projeto será concebido por 2 estudantes em fase de graduação. O primeiro,
Djecson Oliveira esta cursando Análise de Sistemas na PUC-PR e o segundo, autor
deste referido projeto, Thiago Berardi, graduando em Design Gráfico na UTP-PR.
. Internet, livros, revistas e pesquisas junto ao público alvo foram utilizados
para formatação da idéia.
Para que o projeto seja viabilizado utilizar-se-á microcomputadores para
editoração e programação de todo projeto. Faz-se necessário também o
investimento na hospedagem do site e do sistema e para isso, será utilizado os
serviços da LOCAWEB.
3.8.2 Tipos de linguagens de programação aferidas;
Plataforma: Java (J2EE)
Banco de Dados: Oracle
Servidor de Aplicação: JBOss
Linguagens de Scripts: Javascript, Actionscript 3.0
69
Servidor de Mídia: Flash Media Server 3.0 XHTML
Framework: Spring, JQuery
3.8.3 Acabamento visual;
Para transcrição de uma imagem tecnológica fez-se necessário a utilização
de suportes alternativos para exposição e divulgação do conceito do projeto. A
marca quando aplicada em interfaces eletrônicas recebe efeitos de iluminação
ganhando volumetria. Sua aplicação se dá sobre uma malha ton sur ton preto e
cinza que remete tecnologia e transmissão de dados. As peças impressas ganham
destaque com a aplicação de vernizes e brilhos em contraste com o papel fosco.
Facas especiais foram utilizadas para imprimir maior identidade a cada material.
3.8.4 Principais Fornecedores ou Parceiros;
- Analista de sistema e programador para montagem do sistema;
- Inventarium papéis especiais;
- Total Midia Digital (plotagens e impressões grande formato);
- Tecnicópias Impressão a laser;
- LOCAWEB – serviços de hospedagem profissional;
70
3.8.5 A Geração de alternativas;
Marca
FIGURA 24: ESBOÇO PARA ESCOLHA DA MARCA
Fonte: Do autor
71
Manual de Identidade Visual
FIGURA 25: ESBOÇO PARA ESCOLHA DO MANUAL DE ID. VISUAL
Fonte: Do autor
72
Interface do Sistema
FIGURA 26: ESBOÇO PARA ESCOLHA DA INTERFACE DO SISTEMA
Fonte: Do autor
73
Press Kit
FIGURA 27: ESBOÇO DE PRESSKIT PARA PÚBLICO ALVO
Fonte: Do autor
74
3.9 DESENVOLVIMENTO DO PROJETO:
Geração de alternativas para marca:
FIGURA 28: GERAÇÃO DE ALTERNATIVAS MARCA
Fonte: Do autor
75
Geração de alternativas para interface:
FIGURA 29: GERAÇÃO DE ALTERNATIVA INTERFACE
Fonte: Do autor
Escolha da tipografia para composição dos textos:
FIGURA 30: FAMILIAS TIPOGRÁFICAS SELECIONADAS
Fonte: Do autor
76
Wireframe sistema (mapa de navegação):
FIGURA 31: ESQUEMA MAPA DE NAVEGAÇÃO
Fonte: Do autor
77
Grade de composição da interface:
FIGURA 32: GRID CONSTRUÇÃO INTERFACES
Fonte: Do autor
78
3.10 VERIFICAÇÃO DO DESENVOLVIMENTO:
FIGURA 33: ALTERNATIVAS PARA MARCA
Fonte: Do autor
79
FIGURA 34: ALTERNATIVA PARA INTERFACE
Fonte: Do autor
3.11 PROTÓTIPO E MODELO – PRODUÇÃO:
3.11.1 Imprimir a parte do projeto que envolve produção gráfica;
- Produção e impressão de manual de identidade visual;
- Produção e impressão de papelaria;
- Produção e impressão de wobler;
- Edição de vídeos e vinhetas para divulgação;
- Produção e impressão de 02 banners físicos;
- Produção e impressão de anúncio em revista;
- Publicação do sistema no hosting LOCAWEB;
80
3.11.2 Publicar e divulgar o sistema.
O sistema encontra-se publicado no endereço http://www.castl.com.br
3.12 AVALIAÇÕES DO PROTÓTIPO:
Algumas das interfaces desenvolvidas não atendem as expectativas do
projeto nos quesitos tecnologia portanto, novos estudos de interface foram
desenvolvidos e para que o resultado seja satisfatório.
3.14 PLANILHA DE PREVISÃO DE CUSTOS
Deslocamentos, visitações, etc. R$ 450,00
Impressões, Banners, Pranchas, Cartazes, etc. R$ 750,00
Programação do Sistema (Valor pago ao programador web) R$ 3.500,00
Hospedagem em servidor (mensalidade) R$ 150,00 (mensais)
Tradução (inglês, espanhol) R$ 350,00
81
4. RESULTADOS
Marca
FIGURA 35: MARCA E APLICAÇÕES
Fonte: Do autor
82
Manual de identidade
FIGURA 36: MODELO MANUAL IDENTIDADE VISUAL
Fonte: Do autor
83
Papelaria
FIGURA 37: PEÇAS DA PAPELARIA ADMINISTRATIVA
84
85
86
Fonte: Do autor
87
Interface web
FIGURA 38: TELAS DA INTERFACE ELETRÔNICA
88
89
90
91
92
Fonte: Do autor
93
Banner divulgação
FIGURA 39: BANNER DIVULGAÇÃO
Fonte: Do autor
94
Wobler (display para computadores)
FIGURA 40: WOBLER PARA MONITORES
Fonte: Do autor
95
Skin notebook (adesivo para laptop)
FIGURA 41: ADESIVO PARA DECORAR E PROTEGER LAPTOP
Fonte: Do autor
96
Wallpapper (protetor de tela para estação de trabalho)
FIGURA 42: FUNDO DE TELA PARA MONITOR
Fonte: Do autor
97
Brindes (almofada de pulso e costas, pen-drive, caneta)
FIGURA 43: BRINDES COM A MARCA
Fonte: Do autor
98
Kit divulgação
FIGURA 44: KIT PARA PROSPECÇÃO
Fonte: Do autor
Anúncio em Revista
FIGURA 45: ANÚNCIO EM REVISTA
Fonte: Do autor
99
5 DISCUSSÕES .
Preferiu-se adotar uma interface escura com o objetivo de valorizar mais a
mensagem gravada. Percebeu-se que a incidência de luz em interfaces de
gravação com quadros claros prejudica a limitação do vídeos assim como não
oferece contraste de cores. .
6 CONCLUSÃO .
Após a realização deste trabalho de branding conclui-se que a marca possui
valores intangíveis e agregados e que o seu design é responsável pela transmissão
destes valores. Também ficou bastante claro o avanço e o uso da tecnologia para
transmissão de dados o que acarretou o encurtamento das distâncias globais
fazendo com que pessoas de todo mundo conectem-se e comuniquem-se de
maneira mais eficiente. .
A transmissão de dados áudios-visuais pela Internet já é uma realidade e
este o CASTL pretende melhorar ainda mais as possibilidades da mensagem falada
pois seu poder de persuasão e penetração é infinitamente maior. Quando existe um
locutor ou um personagem que atrai o espectador a absorção da informação é
exponencial ao tempo de exposição. .
7 CONSIDERAÇÕES FINAIS .
O projeto CASTL será submetido a análises e testes e estará sendo avaliado
por consultores do SEBRAE para que em breve possa ser comercializado junto a
Internet.
100
REFERÊNCIAS BIBLIOGRÁFICAS
LIVROS
ADG Brasil. O valor do design, São Paulo: SENAC, 2004.
BONSIEPPE, Gui. Design, Do Material ao Digital. Florianópolis: FIESC/IEL, 1997.
BROWN, Dan. Communicating Design: Developing Web Site Documentation for
Design and Planning. Washington: News Riders, 2006.
DONALD A. NORMAN AND STEPHEN W. DRAPER. User Centered System
Design - New Perspectives on Human-Computer Interaction. Lawrence
Erlabaum Associates, 1986.
DONDIS, Donis A. Sintaxe da linguagem visual. 2. ed. São Paulo: Martins Fontes,
1997.
DORMER, Peter. Os significados do design moderno. Lisboa: C.P.D. 1ª. Ed, 1995.
FORD, Rob; WIEDEMANN, Julius. Guidelines for Online Success. New York: Ed.
Taschen, 2008.
HELLER, Steven; WOMACK, David. Becoming a Digital Designer: A Guide to Careers
in Web, Video, Broadcast, Game and Animation Design. New York: Ed. Wiley, 2007.
HESKETT, John. Industrial Design. Londres, Thames and Hudson, 1980.
JAKOB,nielsen. Usability Engineering. Academic Press, 1993.
KAUSHIK, Avinash. Web Analytics. Utah: Sybex. Pap/Cdr edition .2007.
KRAUSE, Jim. Color Index 2: Over 1500 New Color Combinations. For Print and
Web Media. CMYK and RGB Formulas.Ohio: Ed. How Books, 2007.
MALDONADO, Tomás. El diseño Industrial Reconsiderado. México. Ediciones G.
Gili, 1993.
MARTINS, José Roberto. Branding. O Manual para você criar, gerenciar e avaliar
101
marcas. Ed. Global Brands, 3 edição revisada e ampliada, 2006
MUNARI, Bruno., Das coisas nascem coisas, São Paulo: Martins Fontes, 2002.
NEUMEIER, Marty. The Brand Gap. 2 edition. San Francisco: Peachpit Press. 2005.
NIEMEYER, Carla. O marketing no design gráfico. 3 edição. São Paulo:, Ed. 2AB,
1999.
O. L. Oliveira. Design na Interação em Ambientes Virtuais: uma abordagem
semiótica. PhD thesis, UNICAMP, Campinas, SP, 2000.
PLUMMER, Joe; RAPPAPORT, Steve; HALL,Taddy; BAROCCI, Robert.
The Online Advertising Playbook: Proven Strategies and Tested
Tactics from the Advertising Research Foundation. New Jersey: Ed. Hoboken, 2007.
SÂMARA, Timothy. Typography Workbook. New Ed edition. Philadelphia: Rockport
Publishers, 2006.
SANTOS, Flavio Anthero dos. O design como diferencial competitivo. Itajaí: Editora
da Universidade do Vale do Itajaí, 2000.
SEVERINO, Antonio Joaquim, Metodologia do Trabalho Científico. São Paulo:
Cortez, 1996.
SHULMANN, Denis. O Desenho Industrial. São Paulo: Ed. Papirus,1994.
SHARMA, Chetan. Mobile Advertising: Supercharge Your Brand in the Exploding
Wireless Market. Seattle: Ed.Wiley, 2008
WURMAN, Richard Saul; JACOBSON, Robert. Information Design, 1st edition.
Massachusetts ,The MIT Press, 2000.
UEBELE, Andreas. Signage Systems and Information Graphics. Stuttgart: Ed.
Thames & Hudson, 2007.
102
ARTIGOS E/OU MATÉRIAS DE REVISTAS
FERREIRA, Jaqueline. Qualidade no desenvolvimento de software, LOCAWEB A
internet em revista, São Paulo, v. 1, p. 23, jul. 2007.
FITTIPALDI, Mauro. A vez dos blogs corporativos. LOCAWEB A internet em revista,
São Paulo, v. 1, p. 8-11, jul. 2007.
MELGAR, Robinson. E-mail marketing vendedor. LOCAWEB A internet em revista,
São Paulo, v. 4, p. 32-35, fev. 2008.
MELGAR, Robinson. A internet de bolso já é realidade. LOCAWEB A internet em
revista, São Paulo, v. 5, p. 22-31, abr. 2008.
MELGAR, Robinson. Divulgue sua voz na internet. LOCAWEB A internet em revista,
São Paulo, v. 5, p. 36-40, abr. 2008.
MELGAR, Robinson. Vamos dar uma espiadinha. LOCAWEB A internet em revista,
São Paulo, v. 5, p. 44-47, abr. 2008.
MELGAR, Robinson; VINICIUS, Sérgio. Seu site na boca do povo. LOCAWEB A
internet em revista, São Paulo, v. 6, p. 22-34, jun. 2008.
MELGAR, Robinson. Os novos rumos do design. LOCAWEB A internet em revista,
São Paulo, v. 6, p. 48-51, jun. 2008.
SPIR, Nelson. Conheça os clones digitais do YouTube. LOCAWEB A internet em
revista, São Paulo, v. 4, p. 48-50, fev. 2008.
VINÍCIUS, Sérgio. Search Engine Optimization, LOCAWEB A internet em revista, São
Paulo, v. 1, p. 30-37, jul. 2007.
T. CLARK. In services., what’s in a name? Harvard Business Review, Vol. 66
103
FONTES ELETRÔNICAS ON-LINE
ALVES, Marcelo. Cenário de tarifação complicado transforma o controle e a redução
dos gastos com telefonia em desafio para as empresas.
Gazeta Mercantil, jun. 2007. Disponível em:
http://www.informatecsp.com/pages.php?recid=110. Acesso em: 01 mai. 2008.
Monteiro, Luís. A internet como meio de comunicação: Possibilidades e limitações.
Puc-Rio, set. 2001. Disponível em:
http://www.portal-rp.com.br/bibliotecavirtual/comunicacaovirtual/0158.pdf. Acesso
em: 24 mai. 2008.
Referência sobre cores e webdeisgn
http://www.criarweb.com/webdesign/ Acesso em: 05 de jun. 2008
Associação Brasileira dos Webdesigners e Webmasters
http://www.abraweb.com.br Acesso em: 20 de jun. 2008
A Guerra dos Brownsers
http://video.discoverybrasil.com/services/player/bcpid1753218477?bctid=175320078
5 Acesso em: 1 de set. 2008
