TCC Thiago

UNIVERSIDADE TUIUTI DO PARANÁ Thiago Berardi Rocha Almeida

BRANDING PARA SISTEMA DE VÍDEO MAIL

CURITIBA 2008

BRANDING PARA SISTEMA DE Vﾃ好EO 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 áudiovisuais 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 videomensagem (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ídeochamadas. 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 email. 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ﾃ年ICA

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