O livro Design/Web/Design:2 foi escrito em 1999 e publicado em 2000, portanto j est um bocado velho. Alguns aspectos tcnicos e profissionais ainda se mantm. Outros, felizmente, mudaram bastante. Ele foi disponibilizado neste site na forma de pginas abertas a comentrios porque gostaria de ouvir de vocs sua opinio com relao s mudanas. No tenho dvidas que em alguns pontos ele foi superficial demais; ou mesmo em que em outras ele est completamente ultrapassado. Na minha opinio, livros tm a mesma funo das obras de arte: estimular a discusso e a reflexo. No devem ser considerados fontes de saber ou beleza, mas elementos vivos que promovam dentro das cabeas das pessoas verdadeiras revolues na forma de se pensar e encarar o mundo - essa, sim, uma belssima e indiscutvel habilidade humana. Na poca de sua publicao, eu disse a seu respeito que: Todos tm direito a seus 15 Megabytes de fama e qualquer um capaz de fazer um website. Qualquer um? Bom, no exatamente. Este livro pretende estimular sua curiosidade e fazer com que voc no aceite o que v na Internet como definitivo, muito pelo contrrio. Ele trata de Design,da World Wide Web e de Comunicao Digital em geral. No um livro de tcnicas, um manual de questionamentos. Antes da introduo, com o ttulo Verso 2.0 (no tenho culpa que o termo web2 seria inventado quatro anos depois e tornaria qualquer 2.0 um chavo), ele era apresentado assim: Esta a verso 2.0 do meu livro Design/web/Design. Se voc leu a original (preta com um labirinto na capa) vai ver que esta aqui tem vrias coisas em comum com ela, algumas at exatamente iguais (t bom, t bom, vrios erros de digitao foram corrigidos, pois tive mais tempo agora). Mas isso no significa que ela seja uma ensima edio, revista e atualizada pois muito mais do que isso. O que voc tem em mos praticamente outro livro. Como eu no sei escrever sobre outra coisa e gostei muito do nome anterior, resolvi mant-lo Se voc der uma sapeada no ndice, ver que a seo de design no mudou quase nada (at porque os pilares de design, como legibilidade e equilbrio, no mudaram) mas o resto bem, o resto sofreu uma reforma geral, alguns conceitos foram ampliados e - o que considero mais importante - coloquei a opinio de um monte de gente que tive a sorte de conhecer e com quem tive conversas pra l de elucidatrias. Tambm tomei a liberdade de colocar aqui uns quatro artigos de que gostei muito e que acho importantes para ilustrar alguns conceitos; e um case do qual me orgulho. O resultado de tudo isso um livro bem bacana, pelo menos na minha imodesta opinio. Se voc j leu o outro, considere comprar este tambm. Se este seu primeiro contato com um livro meu, espero que se divirta. Como voc pode bem ver, eu no mudei muito desde aquela poca. Mas minha voz e meus cabelos, quaaaanta diferena Boa leitura.
ndice
DWD:2 1 Introduo 2 1: Design: a cara do mundo civilizado 4 1-1: Qualquer imbecil faz design: design, designers e Frankensteins 5 1-2: Talento vs. Preguia 7 1-3: Carta da Califrnia 8 1-4: Pensando visualmente 10 1-5: Tintim por tintim: o impacto dos mnimos detalhes 12 1-6: Identidade corporativa: misso e viso empresarial 13 1-7: Cada coisa com seu porqu 14 1-8: Percepo: um processo ativo 15 1-9: Relao palavra / imagem 17 2: Preparando o terreno 19 3: Princpios de design 21 3-1: Grids: cada coisa em seu lugar 25 3-2: Fazendo um grid 27 3-3: Caligrafia, tipografia e legibilidade 28 4: A Internet a resposta. Qual era mesmo a pergunta? 31 4-1: Design grfico vs. design digital: berimbau no gaita 32 4-2: O que voc precisa saber 34 4-3: O que voc no precisa saber 45 4-4: Possibilidades e limitaes 46 4-5: Tecnologia 48 4-6: Pginas pessoais 50 5: Interface 51 5-1: Caractersticas de uma interface 52 5-2: Elementos de uma interface 54 5-3: Por uma esttica digital 56 5-4: Interatividade 57 6: Arquitetura de informao 58 6-1: Design estrutural 61 6-2: Grupos de dados 62 6-3: Hipertexto 63 6-4: Roteiros 65 6-5: Paisagens informativas 68 7: Quem precisa de um website? 70 7-1: Tipos de websites 72 7-2: Publicidade de massa e internet 73 7-3: Porque banners no prestam 76 7-4: Qualidade da experincia: foi bom pra voc, meu bem? 77 7-5: Do que as pessoas mais gostam (e o que elas odeiam) nos sites 80 8: O processo de produo e suas etapas 82 8-1: Algumas dicas de marketing 86 8-2: Especificaes, planejamento e cronograma 87 8-3: Organizao dos grupos de informao 90 8-4: Direo de criao, projeto grfico e linha de design 91 8-5: Prottipos e aprovao 94 8-6: Mos obra 95 8-7: Controlando as entranhas do cdigo 96 8-8: Registro em mecanismos de busca 97 8-9: Auditoria e medio do trfego 98 8-10: Manuteno e acompanhamento do usurio 99 9: Equipe 101 9-1: O webdesigner, esse pobre centauro 102 9-2: Incubao e novos produtos 104 10: Vamos falar de voc 105 10-1: Seu estdio 107 10-2: Seu portflio e promoo: como tornar as suas peas conhecidas? 109 11: Modernidades 111 12: Comunicao no-linear, se que ela existe 117 12-1: Hiperespao e ciberespao 120 12-2: Comunidades digitais: as novas igrejas, partidos, padarias 121 12-3: Ansiedade de informao 122 12-4: O ciclo da descoberta 123 Crditos 125
Introduo
Curiosidade, inovao e descoberta: o desafio do design digital Quando eu era pequeno, sonhava ter um tipo de caneta diferente, uma caneta que me permitisse desenhar objetos tridimensionais em pleno ar. Queria desenhar uma pirmide? Fcil: comearia desenhando um quadrado no papel e depois puxaria a caneta para cima e a pirmide iria se materializando no ar. Primeiro sua estrutura, como se fosse feita de arame, depois todo o seu contedo. Sua tinta seria a luz, como as espadas de Star Wars. Os objetos criados por essa caneta seriam objetos de luz, imateriais e, ao mesmo tempo, fantsticos. O que iria acontecer com essas esculturas de luz? Como elas seriam guardadas? Poderia desenhar com elas no escuro? Essa caneta seria vivel comercialmente? Sei l. Nunca pensei nesses assuntos. Talvez porque no fossem relevantes. Talvez porque estivesse mais preocupado em imaginar o que aconteceria se as formigas que viviam na casa da minha av consumissem aquele vidro fedorento de Emulso Scott e realmente crescessem e ficassem mais fortes. A infncia era realmente uma poca interessante. Confesso que fiquei assustado quando descobri que, debaixo do asfalto das ruas existia terra, e que nessa terra existiam minhocas. Foi uma surpresa quando percebi que, ao usar o apontador de lpis no dedo do meu irmo saiu sangue e no ficou pontudo. Lembro-me bem de ter ficado de castigo quando ganhei uma caixa de carimbos e ilustrei algumas paredes de casa. Ou quando descobri que o olho esquerdo e o olho direito formavam imagens diferentes e esqueci de comer para ficar piscando. Muito tempo mais tarde lembro-me de ficar maravilhado quando vi pela primeira vez um microcomputador e o que podia fazer aquela maquininha fascinante e entorpecente (alis, no sugestivo que se chame de usurio tanto as pessoas que consomem drogas quanto as que operam computadores?) Todas essas coisas me fascinavam e ainda me fascinam. Mas o que mais me impressiona at hoje o quanto isso passa despercebido pelos outros. Outro dia ouvi um sujeito dizer que fcil reconhecer um diretor de arte: eles usam roupas inacreditveis, anis nos dedos mais incmodos, ouvem sons esquisitos e fazem pratos maravilhosos em restaurantes do tipo por quilo. No sei, no, acho meio preconceituoso. Quando estava no segundo grau muitos carinhas da minha classe segregavam um sujeito que usava brinco. Hoje ele casado, anda de mountain bike e foi campeo de um enduro de resistncia no meio do mato. Amigos da minha idade acham nojento gente que usa piercing ou tatuagem. Tsk, tsk, tsk Um dos maiores publicitrios que conheo se veste e anda como se fosse um professor de matemtica: tnis, calas jeans surradas, camisa de algodo branco, culos fundo de garrafa e canetas no bolso. difcil definir pessoas e desenhar um website custa muito mais caro e d muito mais trabalho que uma simples ida ao shopping. Tive um assistente que, se ficar sem dinheiro, pode ir trabalhar em um restaurante de nouvelle cuisine e outro que no sabe desenhar um tringulo. Ambos usavam jeans e camiseta. Tudo isso, no fundo, uma enorme besteira. Para se fazer design no necessrio ter nada de especial, nenhuma habilidade especfica. S preciso ver, perguntar e questionar, como qualquer criana saudvel o faria, tentando compreender as riquezas e particularidades do mundo. isso, e no um ou outro comportamento fashion, que faz do design uma atitude. Vivemos uma poca de muitas mudanas. Algumas so to radicais que parecem ter sido projetadas pela mente delirante de um psicopata. Outras nos transportam para ambientes to esquisitos que parecem ter sado de um desenho animado psicodlico. Essa mudana de parmetros que os pedantes insistem em chamar de paradigmas deixa todo mundo meio perdido, com aquela sensao desconfortvel de se estar no meio de um nevoeiro, sem um nico ponto de referncia confivel. Afinal, tudo o que se cria j velho, tudo o que se aprende no presta pra mais nada e tudo o que slido, literalmente, desmancha no ar. A World Wide Web abriu fronteiras inacreditveis: pela primeira vez os profissionais de layout e
artes grficas tm acesso a um pblico enorme, que pode ver seus trabalhos a qualquer instante. Alguns dizem que o conjunto das tais pginas pessoais a maior exposio pblica de arte da histria. Sob alguns aspectos, esse pblico at maior que o dos publicitrios, pois no tem restries de tempo. Pela primeira vez esses profissionais vem surgir uma necessidade de comunicao gigantesca, pois se uma embalagem ou um cartaz poderiam ser aes espordicas e restritas, um website no o . No d para reutiliz-lo ou mant-lo igual por 50 anos. Com isso, os desenhistas industriais ganharam prestgio, ferramentas e pblico para questes como legibilidade e unidade visual como ningum de bom senso imaginaria. E at mudaram de nome: viraram designers. No vou falar aqui do muro de Berlim ou da Guerra Fria, mas quase: me formei profissionalmente na que pode ser considerada a pr-histria da comunicao moderna. As cmaras de vdeo tinham tubos e no podiam ser apontadas para a luz, os programas de TV eram editados usando fitas magnticas de duas polegadas, os estdios de design eram lugares quentes, midos e fediam a benzina, a ponto de deixar muito assistente de arte completamente doido. Lembro de ter crescido ao som da mquina de escrever do meu pai e me assusto ao ver alunos que nunca conheceram uma boa duma Remington mecnica, das que engripam a fita e sujam os dedos da gente. Tive que aprender a desenhar um alfabeto inteiro em Times New Roman, decalcar Letraset, fazer bromuro, pestapar fotocomposio, analisar quadricromia. Tudo isso faz um tempo, foi l pelos idos de 1985-7, veja voc. Depois disso veio a democratizao da produo grfica e de repente todo mundo podia fazer anncios, folhetos e cartazes. Da o vdeo se popularizou, a web, as tecnologias wireless e broadband j viraram carne de vaca, todo mundo usa computador de mo e a TV interativa (quase) uma realidade. Uau! Todos tm direito a seus 15 Megabytes de fama e qualquer um capaz de fazer um site. Qualquer um? Bom, no exatamente. Como diria George Orwell: todos so iguais, mas alguns so mais iguais que os outros. Embora seja fundamental, o talento um animal bravo e indisciplinado, e nem sempre est disponvel na hora em que precisamos dele. E talento, sem disciplina, s a metade do esforo. A idia deste livro mostrar a voc algumas regras para ajud-lo a criar layouts estruturados, fundamentados e consistentes, atravs dos quais seu talento poder florescer e brilhar. So regras que no tm nada a ver com computadores e nem tm a inteno de limitar sua criao, muito pelo contrrio. Seu objetivo ajud-lo a entender por que uma interface considerada boa e ajud-lo a desenvolver suas idias. So regras que devem ser reconhecidas e analisadas, para depois serem descartadas, invertidas, adaptadas. Quero ajudar a estimular sua curiosidade e questionamento, fazendo com que voc no aceite as solues mostradas na WWW como definitivas. Este livro no um manual de tcnicas, um manual de questionamentos. Ele se prope a instigar, explicar e perguntar, e, nesse processo, ajuda voc a criar produtos inventivos, criativos e inovadores. Ele pretende agir como a estaca que a gente coloca do lado de uma plantinha nova para que ela cresa forte e saudvel. Quando o objetivo for alcanado, a estaca pode ser jogada fora e ningum mais se lembrar dela. Enfim, seja bem-vindo. A casa humilde, porm honesta.
colegas de profisso no mundo inteiro resolvem problemas similares. No, ele no est procurando uma fonte legal para copiar. Ele est se alimentando de referncias, da mesma forma que um arquiteto pesquisa plantas e um cientista l frmulas matemticas. aquela velha histria de ser o que se come.
de novo, comer todas essas influncias que eles mandam para a gente via FEDEX e devolver os caroos. Toda vez que leio as notcias da internet brasileira vejo que algum est lanando um servio desavergonhadamente copiado de um americano. U, ns no somos o povo mais criativo do mundo? Por que a gente nunca xeroca o jeito como os caras sempre olham pro futuro e no para o lado para ver o que o outro est fazendo? E a preocupao com educao? Poderamos xerocar, por o toner no mximo e ampliar 200% que ainda seria pouco. Demora um tempo para ter uma viso crtica, mas do ponto de vista daqui de cima, o Brasil criativamente t indo pro lado errado, que atrs dos americanos. S para dar um exemplo de por que no fazer isso: um dos principais diretores do Art Center, que considerada uma das melhores escolas do mundo, me disse textualmente que os brasileiros esto sempre entre os mais criativos da escola. O interessante seria saber o que eles sabem e fazer do nosso jeito. Como est agora, ns fazemos do nosso jeito, mas nem de longe sabemos o que eles sabem. E algumas empresas brasileiras de internet ainda fazem pior, pois s fazem do jeito deles. Precisa aprender design puro, de interfaces, tipografia, histria da arte etc. Entender porque eles fizeram e o que aconteceu no comeo para ver o que hoje. Para mim, a faca e o queijo esto na nossa mo. S que a faca velha e cega. E o queijo com certeza tem que ser Minas Frescal e no esse horrvel e plastificado Cheddar que eles adoram por aqui. s vezes me sinto um ignorante no meio dos iluminados nessa terra. Um trapalho no Partenon. Imagino o barulho que alguns dos meus grandes e talentosos amigos fariam se estivessem aqui. Um grande abrao, Luiz Evandro.
reforados pela viso, pois so pouqussimas as coisas que fazemos com os olhos fechados. Quando vemos, sintetizamos uma srie de outros sentidos. Saber reconhec-los, diferenci-los e representlos a base de uma boa idia de design.
separam do fundo, destacando-os. Essa separao muito comum. Imagine um livro que voc esteja lendo em cima de uma mesa: o livro a figura, a mesa o fundo. O que est nela de menor importncia. O mesmo vale para o resto do computador quando estamos vendo um website. Essa relao dinmica: o que figura pode ser fundo e outro elemento pode ser promovido a qualquer instante. A aparncia de uma imagem depende e muito do fundo. Atributos como tamanho, brilho, forma e cor percebida variam completamente conforme o ambiente em que est uma imagem. Qualquer objeto do campo de percepo influencia todos os outros. 3. Agrupamento de imagens As figuras podem ser agrupadas ou relacionadas de acordo com sua proximidade, continuidade ou semelhana, formando outras imagens ou estabelecendo relaes entre elas. O agrupamento depender da continuao elementos que parecem estar em uma linha visual contnua tendem a ser agrupados juntos. As pessoas tendem a continuar as linhas que vem, emend-las. assim que os antigos imaginavam desenhos das constelaes. Essa regra fundamental para um detalhe muito importante dos layouts que no pode ser descuidado: o alinhamento. Elementos alinhados em uma pgina do a impresso de maior estabilidade e segurana. 4. Figuras fortes so estveis Apesar de todos os elementos de um campo visual se influenciarem, existem figuras que so mais resistentes e estveis. So formas neutras, que se isolam da confuso geral. Essas formas so normalmente simples, regulares, simtricas e fechadas, com um contorno regular e visvel. A mais estvel e forte delas o crculo. No tem cantos, simtrico com relao a seu centro e muito simples. Esse tipo de figura to forte que no se desintegra nem se mistura com os outros elementos do layout e, em competio com estruturas mais fracas, vence sempre. Alm dos crculos, elipses, quadrados, retngulos, tringulos e outras formas geomtricas, algumas letras e nmeros, tambm podem ser elementos simtricos bastante fortes, desde que sejam destacados do texto e mostrados bem grandes. Vrias dessas formas e figuras fortes so utilizadas para se organizar os elementos em um layout.
2: Preparando o terreno
Voc certamente j viu crianas brincando de fotografia ou cinema. Lembre-se como elas fazem pequenas molduras com as mos para enquadrar as cenas. Na realidade elas no esto reunindo nada, s isolando o ambiente volta do espao que pretendem analisar. Se h algum princpio de design, deve ser esse: realar caractersticas individuais de objetos e destac-los do ambiente com bom senso. Com essa idia na cabea muito mais fcil. Mas como bom senso e observao so conceitos vagos demais, vamos a dados mais objetivos. Antes de comear a trabalhar, necessrio que o designer conhea bem seu produto. Para isso ele deve levar em considerao: Objetivos qual o tipo de produto e o que se pretende com a comunicao; Pblico para quem a comunicao; Contedo o produto em si; Formato suas dimenses e proporo; e Resposta o que se pretende com ele. A comunicao s ter valido se o pblico ficar com vontade de fazer alguma coisa depois de ver a interface: clicar botes, mandar e-mail, participar, interagir. Objetivos: para que serve o material? Toda ao de comunicao deve visar a alguma coisa: expor o produto, destacar suas caractersticas, preo, condies etc. Por isso sua inteno precisa estar bem clara para no deixar dvidas. Um material de venda deve falar de preos e condies, um institucional falar da empresa e sua atuao, um informativo ser imparcial etc. Para que uma tarefa fique bem realizada necessrio definir um objetivo. No existe nada mais irritante que um comercial indeciso. Eles so como pessoas que no sabem o que querem: uma enorme perda de tempo. Outro erro so os materiais disfarados, que tm um objetivo e fingem ter outro. O consumidor pode at se distrair a princpio, mas logo acaba desmascarando a inteno e da fica chato. A melhor estratgia de comunicao a verdade: mostre o melhor que o produto tem e diga o que quer diretamente, como fazem pessoas produzidas para uma festa. Se o consumidor no estiver interessado, no perder tempo nem se irritar com voc. Caso contrrio, grandes sero as chances de uma enorme aporrinhao. Voc sabe com quem est falando? Cada mensagem a seu pblico: crianas, no acostumadas a grandes volumes de texto, precisam de letras legveis e grandes. Adolescentes preferem recursos multimdia e fotografias coloridas. Na maioria dos casos, eles j tm ou no se importam em baixar um plug-in, mas so muito bem informados das novas tendncias visuais e no suportam (nem respeitam) uma cpia. Se a publicao for tcnica, os fluxogramas e frmulas devem tomar lugar de destaque, e assim por diante. No existe nada mais ridculo que velhos se fazendo passar por adolescentes. Cada grupo social ou de interesse especfico tem sua linguagem prpria, com cdigos especiais. Quem nunca participou de uma sala de chat pode achar estranho algo como oi, pessoALL, algum quer tc comigo? ;-) M@rina. Todos os anncios de sabo em p parecem ter a mesma cara, todos os anncios de surfwear tambm. E nem o designer mais desmiolado pode imaginar um com a cara do outro. A velha filosofia de guerra japonesa afirma que se voc conhece a si prprio e a seu inimigo, vencer todas as batalhas. Se conhece a si prprio, mas no conhece a seu inimigo, para cada vitria
sofrer uma derrota. Se no conhece nem a si prprio nem ao inimigo, perder todas. Por isso, antes de se mostrar ao usurio, questione-se: A quem sua interface se dirige? Qual a cara hbitos, influncias e referncias do seu pblico? Se voc no sabe, descubra para no passar ridculo. Consulte referncias do que eles acham legal e do que acham vagabundo. Quanto maior for a identificao, mais adequado ser o design. O pblico poder at rejeit-lo, mas certamente ir ouvir a mensagem. Vale lembrar que o design deve ser transparente, ou seja, fazer com que o produto aparea por suas caractersticas prprias, e no ter uma idia grfica e tentar encaixar o produto dentro dela, por mais artstico que isso possa parecer. Ou seja: antes de criar necessrio ouvir o pblico, tentar identificar seus costumes, valores e referncias. Do que mesmo voc estava falando? O que est escrito no texto? O design deve refletir seu contedo, para que o leitor j saiba do que se trata antes mesmo de ler a primeira palavra. Isso funciona como a expresso das pessoas quando as encontramos: desanimadas, eufricas, cansadas, desiludidas, tristes, apaixonadas, nervosas imagine a frase no me falta mais nada para cada uma dessas expresses. Um layout eficiente pode funcionar como uma expresso facial: para cada tipo de mensagem, uma cara diferente. Um material diagramado para falar de sabo e limpeza de pele no pode ter a mesma soluo de design de um falando de guerra civil. Formato: dimenses e adimensionalidade Qual o tamanho e as dimenses do seu layout? Revistas, cartazes, folhetos, outdoors e comerciais de TV tm caras completamente diferentes. Mesmo na internet, as pginas web podem ser quadradas, compridas ou largas. Ou uma combinao de todas essas formas. Que um cartaz deve ter menos texto que uma pgina de jornal razoavelmente evidente, mas como devem ser dispostos os elementos de forma que o layout no fique pobre ou poludo? A frmula mais segura criar um projeto para cada pea a ser produzida e no adaptar uma mesma soluo para diferentes formatos. Os formatos comuns variam das propores 1:1 at 1:2 e so os de consulta mais fcil. Dimenses estranhas podem causar mais impacto, mas so mais difceis de se operar. A toda ao corresponde uma reao O que voc quer dizer com seu layout? Que tipo de emoo quer estimular? Seu consumidor pode amar ou odiar o seu trabalho, mas no deve ficar indiferente a ele, caso contrrio a comunicao no valeu. Se o importante so as emoes, que emoes valem a pena? Empatia, compreenso, simpatia, admirao? tarefa do designer descobrir o que cada produto tem de exclusivo, especial, e evidenciar isso na comunicao. No existe um assunto absolutamente lugar-comum por todos os pontos de vista, necessrio descobrir seu valor. Descoberta a mensagem, como trat-la? A tnica (ou jeito) da comunicao deve ser evidente primeira vista, pelo menos na maioria dos casos. Um material irnico no deve ser apresentado como srio, tragdias no devem ser diagramadas como se fossem grandes brincadeiras. Faa o falso ser evidente, seno pode parecer um defeito. Um tomate marrom considerado um defeito. Um tomate prpura um efeito. Por isso, ao elaborar um layout, o designer deve ter em mente qual a reao que quer provocar no leitor e manipular esse sentimento, estimulando-o ou o atenuando medida que a percepo avana. na eficincia deste controle que est a habilidade de comunicao. O estmulo de resposta o que diferencia belas obras hermticas de trabalhos verdadeiramente estimulantes.
3: Princpios de design
A execuo de um design consistente envolve mesmo que seja instintivamente conceitos estticos consagrados como funo e estrutura, alm dos princpios bsicos da Gestalt. Todos esses fatores so meras variaes do mesmo tema de sempre, o bom senso. Eles podem ser resumidos nesses sete tpicos: I. Proximidade e alinhamento - elementos que pertenam a um mesmo grupo devem estar prximos. II. Equilbrio, proporo e simetria - todos os componentes devem ser complementares. III. Contraste, cores e brancos - layouts dinmicos chamam a ateno e causam impacto. IV. Ordem, consistncia e repetio - voc tem toda a liberdade para criar as regras, mas deve segui-las. V. Simplificao simplicidade sinnimo de elegncia, objetividade e, acima de tudo, clareza. VI. Legibilidade - textos existem para serem lidos. VII.Integrao o design no pode desafinar. 1. Proximidade e alinhamento Em um supermercado os sacos de arroz ficam juntos. Em um armrio as meias ficam juntas. Em uma estante os livros ficam juntos. Em uma geladeira os ovos ficam juntos. Em uma academia de ginstica os aparelhos ficam juntos. Em uma fazenda os cavalos ficam juntos. Em um bar as cervejas ficam juntas. Em uma festa, um casal fica junto. Claro? Essa a primeira regra: elementos que tm algo em comum devem estar juntos no layout, ou seja, alinhados e agrupados, para que o leitor os reconhea como um grupo. Quando as coisas que pertencem a um mesmo grupo esto espalhadas, a impresso de uma baguna. Aplique isso aos exemplos acima e tire suas prprias concluses. Juntos um termo muito genrico, e pode significar um monte de coisas. Em um nibus lotado muitas pessoas esto juntas e isso no necessariamente um sinnimo de organizao. A idia dessa regra aplicar um dos princpios da Gestalt: ns reconhecemos e agrupamos elementos que estiverem prximos uns dos outros. Isso no significa uma camisa de fora tradicional, mas um mnimo de coerncia, pois ao agruparmos os elementos os relacionamos e damos sentido a eles. Uma das caractersticas do design de quem est comeando na rea a grande quantidade de elementos que parecem estar soltos, jogados em algum lugar na pgina ou tela sem nenhuma relao com as margens ou mesmo com os outros elementos de texto. Isso costuma dar um enorme trabalho e desconforto ao leitor, que fica tentando procurar os elementos em comum. Esse esforo todo faz com que ele no goste ou desista do layout, mesmo que no saiba explicar o porqu. J um layout que tenha seus elementos alinhados permite que se possa ver os espaos em branco e agruplos, isol-los ou continu-los. E o leitor passa a ter para identificar na tela dois ou trs grupos, e no mais uma poro de pequenos elementos isolados. O agrupamento tambm estabelece uma relao entre os elementos nos grupos e entre os grupos, mostrando sua hierarquia e sugerindo uma ordem de leitura. Isso facilita o acesso informao e faz com que seu leitor se sinta mais confortvel, transmitindo melhor a mensagem. um processo instintivo e no significa colocar cada elemento num canto da tela, muito pelo contrrio. Alm de agrupados, os elementos devem estar alinhados, e esse alinhamento deve ser consistente: bom repeti-lo em todas as pginas, sempre que o assunto ou a hierarquia de elementos (texto, boto, foto, barra de conexo) forem os mesmos. Para romper com um alinhamento preciso conscincia (para calcular o impacto) e coragem: o novo alinhamento deve ser evidente e chamar a ateno. Se
for s um pouquinho d a impresso de descuido. Sem alinhamento, o que temos uma sensao desconfortvel de quarto bagunado. 2. Equilbrio, proporo e simetria O que equilbrio? Dois pesos iguais em uma balana esto equilibrados, mas dois garotos com pesos diferentes tambm podem estar equilibrados em uma gangorra, desde que o mais leve esteja mais perto do centro. Em uma aquarela japonesa, uma imagem enorme e quase transparente est equilibrada com o carimbo / assinatura de seu pintor, normalmente uma forma quadrada, vermelha e densa. Simetria mais fcil de entender: uma forma geomtrica que apresenta dois lados iguais de um mesmo eixo, como borboletas. A maioria das culturas ocidentais influenciada pelos moldes de simetria e perfeio romanos, em que se buscavam as formas ideais, absolutamente simtricas. Essas formas podem ser bonitas, mas so estticas e artificiais. fcil criar e produzir um layout simtrico, com todos os elementos centralizados ou duplicados do outro lado. Mas esse tipo de layout no chama a ateno, normalmente montono e desinteressante, fazendo com que o leitor logo se aborrea ou nem se interesse por ele. muito usado nos layouts tradicionais (convites de casamento, alguns cartazes de msica erudita, demonstrativos financeiros) e em estruturas em que no preciso chamar a ateno. Conseguir o equilbrio dinmico entre os elementos de um layout, com pontos de interesse e elementos que chamam a ateno muito mais difcil. Para isso, preciso usar elementos de pesos e tamanhos diferentes que se oponham e se complementem, criando movimento e interesse, para que o usurio sinta vontade de examinar toda a tela, sem ficar com a impresso de que tem algo faltando ou sobrando. Uma boa forma de se conseguir um layout equilibrado com elementos diferentes usar contrastes e trabalhar com reas vazias: se dois elementos tm tamanhos, cores, formas ou direes diferentes, eles naturalmente ficam com pesos diferentes, e podem ser mais facilmente equilibrados. Depois de pronto o layout, tente remover ou realar algum de seus elementos. Se a sensao resultante for a de estar sobrando ou faltando alguma coisa, que o layout est equilibrado. 3. Contrastes, cores e brancos Para entender contraste, vamos imaginar uma coisa muito mais prosaica: trs casais de namorados. No primeiro, ele um capacho, faz tudo o que ela quer e concorda com tudo o que ela diz. Temos a uma relao concordante. No segundo, eles tm suas diferenas e vivem cutucando um ao outro. A relao conflitante. O terceiro casal daqueles improvveis (e, paradoxalmente, mais comuns): eles so completamente diferentes entre si: ele msico e sedentrio, ela gerente financeira e esportista. A relao contrastante. Qual das trs tem mais chances de ser mais interessante, verdadeira e intensa? Responda com paixo, no com pragmatismo. A designer americana Robin Williams divide a relao entre os elementos de um layout nessas trs categorias: concordante, conflitante e contrastante. A primeira acontece quando no h contraste algum entre dois elementos em uma pgina, e seu resultado normalmente insosso: margens do mesmo tamanho, ttulo e texto feitos na mesma letra e quase o mesmo corpo, dando a impresso de apostilo. Uma relao conflitante ainda pior: quando o designer resolve inovar, mas no ousa muito. Surgem dela pequenas diferenas de tipo, corpo e estilo de texto, imagens com pequenas variaes no estilo, tamanho, moldura, posio etc. As similaridades dificultam a leitura, porque as atraes visuais no so as mesmas (concordantes) nem so diferentes (contrastantes). Por isso elas entram em conflito, causando um resultado desequilibrado e estranho, desagradvel de se ler. Um layout contrastante, por sua vez, atrai a viso na hora, e cria uma real curiosidade e interesse. Ele pode variar o tamanho, peso, estilo, forma e cor. Quanto maior a quantidade ou intensidade dos contrastes, mais interessante poder ser. S importante ter coragem: no se pode ser tmido e
avanar meio sinal. Meio contraste tem nome, e seu nome conflito. O designer deve orquestrar o espao em branco. Muitas pessoas consideram os espaos em branco de um layout como reas perdidas, e por isso tentam preench-las com texto e imagens. Os espaos vazios so elementos importantes para o desenho de um layout: entrelinhas, colunas e margens so alguns lugares onde d para us-lo. Ele funciona para equilibrar espaos, reforar a unidade de grupos, harmonizar reas e aumentar o contraste. So exatamente o que d forma ao design, como aquela velha histria do escultor que, para transformar uma pedra grande na esttua de um cavalo, tirou todos os pedaos que no se pareciam com o animal. 4. Crie as regras que quiser, mas depois respeite-as Sempre que jogamos cartas com parceiros com quem no estamos acostumados, surge um papo inicial para definir o que permitido: quanto vale cada ficha, se possvel bater sem ter canastra, como so contados os pontos, o que vale cada carta e assim por diante. Uma vez definidas as regras, elas no podem ser mudadas at o final da rodada. Isso consistncia. No design de um conjunto de documentos (telas de uma multimdia ou website, programao visual de uma empresa, projeto grfico de uma revista) vale o mesmo princpio: tudo permitido, menos mudar as regras no meio do processo. Veja uma revista: seus anncios no tm nenhuma relao entre si. So layouts independentes, cada qual com sua famlia de letras, contraste e alinhamento e disposio de fotos. J pginas editoriais levam elementos estruturais (barras, tipografia, nmero de pgina, colunas, fotos) que tm uma ordem implcita bastante rgida. Existem pessoas que querem fazer em cada pgina de revista ou documento de um website um layout diferente, com tipografia, cores, espaos e fundos prprios. Isso normalmente no funciona, pois no d unidade e desorienta o usurio, a tal ponto que ele pode se perguntar se ainda est dentro do mesmo site. 5. Simplificao Voc j ouviu falar em chic simple? uma categoria de objetos bsicos, ao mesmo tempo que tremendamente elegantes, fundamentais no dia-a-dia. So clssicos como um isqueiro Zippo, ou uma camisa branca de algodo, ou uma cala Levis 501. Apesar do nome, a simplicidade e elegncia so difceis de se conseguir, pois tm um enorme poder de sntese: simplicidade requer objetividade, firmeza, clareza de mensagem e elegncia de design. No uma pgina branca com uma foto e um texto. uma pgina em que o branco ocupa um lugar preciso e estudado. A primeira dificuldade que temos em simplificar est no cliente: muitos confundem simplicidade com pobreza, e querem mais elementos, mais cores, mais brilhos, mais animao, mais luz. Eles no tm culpa: so como pessoas que no esto habituados a beber vinho em restaurantes e enchem seus copos at transbordarem. Ou como novos-ricos, que misturam todas as cores e perfumes possveis em combinaes inacreditveis. Precisamos salv-los de si prprios e de sua insegurana destrutiva. tarefa do designer orient-los e apoi-los para que se chegue a resultados elegantes. O argumento inicial, na maioria das vezes, olha como esto fazendo l. A gente poderia seguir na mesma linha, o que d segurana ao cliente e o deixa mais receptivo a comentrios. No adianta nada brigar com o cliente nem tentar impor uma viso, j que gosto no se discute e o dinheiro dele. A outra grande dificuldade est no prprio designer, que muitas vezes quer fazer de um novo site o showcase de novas tecnologias, para mostrar que capaz. O resultado costuma ser como os portflios de grficas: coisas medonhas usando prata, coisas feinhas usando verniz, coisas pavorosas usando papel importado, coisas de arrepiar usando impresso em seis cores. Um cartaz pode ser lindo, ou, conforme seu ambiente, ser mais um elemento para contribuir com a poluio visual. A base da simplicidade uma regra de outra escola alem, a Bauhaus: less is more, ou seja, na
simplicidade de uma comunicao est sua grande sofisticao. Existem bons exemplos de cartazes compostos com mais de 30 famlias diferentes de letras, mas so casos raros de designers muito habilidosos. Quando mais de trs famlias so misturadas em uma pgina, o resultado normalmente ruim. Essa mesma regra vale para cores, efeitos especiais, caixas, sombras, sublinhados, setas, textos em negrito ou itlico e outros elementos. Na dvida, prudente simplificar: um layout simples, na pior das hipteses, pode passar despercebido. Um layout poludo tem tantos elementos disputando a ateno do leitor que a comunicao se perde, como uma conversa em uma feira. Ao tentar construir mundinhos em seus websites, muitos designers esquecem do mundo real, de suas linguagens e smbolos. No necessrio reinventar a roda: verde quer dizer ir, vermelho, parar. Textos grandes ou em negrito so mais importantes que textos pequenos. A leitura da esquerda para a direita e fotos costumam ilustrar o que lemos. Soa familiar? O que no significa que um website tenha que mimetizar a realidade, muito pelo contrrio. Os primeiros sites de bancos tinham imagens em 3D simbolizando uma agncia virtual, com um resultado evidentemente falso e ridculo. Pegou to mal que hoje em dia difcil ver websites assim. Isso acontece porque a metfora deve simbolizar o que um elemento significa na vida real, no sua verdadeira forma. A est a verdadeira simplificao. 6. Legibilidade Voc consegue ler os textos do seu site? Facilmente? Ento est bom. No? Ento no presta. To simples assim. Radical demais? Bom, isso s a minha humilde opinio. Mas vamos prtica: seu pblico consegue ler seu texto? Mesmo? Est disposto a fazer esse esforo/sacrifcio? Ento beleza, no est mais aqui quem falou, seu texto est bom. 7. Integrao: no deixe seu design desafinar. Depois de testar todos os conceitos individualmente, hora de harmoniz-los, agrup-los, alinhlos, simplific-los, orden-los ou, sintetizando, integr-los. No adianta nada um layout seguir alguns princpios em umas pginas para quebr-los em outras. Como maestro de uma sinfonia, no deixe sua pea desafinar. Esses so apenas alguns conceitos. A experincia e o bom senso (e uma certa dose de talento) so fundamentais para se fazer design. bom se reciclar constantemente e buscar sempre novas formas de ao.
As linhas cinzas so a pauta. Todo o texto se apia nelas, mesmo que contorne alguma imagem. As linhas horizontais mais escuras dividem a rea total para que imagens possam ser apoiadas. O texto corre em duas colunas, blocado. Imagens podem ocupar uma coluna inteira ou meia, por isso essas linhas verticais de apoio que ficam bem no meio das colunas de texto.
Elementos de texto ttulos, subttulos, legendas etc. Imagens, ilustraes e fotografias; e Elementos decorativos tabelas, fios e linhas.
2. Organize os elementos em grupos temticos veja quais falam com os outros e constituem grupos dentro do documento, e que, por isso, precisaro ser colocados juntos. Alguns exemplos:
3. Mea a rea total e til. Fazendo um site, considere a rea mnima necessria (que no deve prejudicar seus usurios) e o espao para barras de rolamento. Em design grfico, considere o manuseio e transporte. 4. Divida o espao em colunas e linhas elas ajudam a estabelecer proporo, regularidade, estrutura e ritmo ao seu layout. No precisam ter um tamanho fixo, mas bom que sejam proporcionais entre si e com relao rea til total. 5. Avalie os elementos de cada grupo temtico e determine seu espao mnimo e mximo necessrio. 6. Padronize as dimenses do grid e finalize o tamanho de linhas e colunas. Considere as excees e desvios e analise como estes so acomodados na estrutura, sem quebr-la. Se no for possvel, refaa o grid. 7. Varie. Crie opes de arrumao de todos os elementos na estrutura do layout. 8. Faa os ajustes finais regule tamanhos, posies e ajuste os elementos dentro dos grids. Desde que bem definidos, os grids auxiliam o designer na confeco de diversos layouts. Eles no precisam ser necessariamente caretas ou cheios de caixas ou mesmo terem cara de jornal.
o uso de letras com serifa para textos longos (como jornais, revistas e livros). J para a criao digital devemos restringir o uso deste tipo de letra a ttulos ou aplicaes em tamanhos grandes, pois na baixa definio dos monitores as serifas so elementos a mais para dificultar o reconhecimento de cada letra e conseqente legibilidade. Um texto fala Uma coisa bvia em que poucos pensam: um texto escrito a transcrio de uma fala, por mais tcnica que seja. Ao escrever um texto imagine-se (ou imagine a personagem que voc est criando) falando-o. Qualquer mudana na sua estrutura reflete uma alterao do ritmo ou volume em que as palavras so lidas. Assim, um texto em negrito chama a ateno para uma palavra em uma frase, como se ela fosse falada mais alto. Bold, seu equivalente em ingls, quer dizer algo como gordo, impertinente, proeminente (dois amigos, bem gordos, fundaram em uma poca o EXTRABOLD DESIGN). O Negrito retarda a leitura e faz com que as palavras se destaquem, por isso deve ser usado com cuidado. Ele funciona como uma espcie de afirmao e sua aplicao ideal em palavras isoladas em uma frase, como em: todos os bancrios disseram que iriam entrar em greve se no fossem atendidos. Uma frase inteira em negrito acaba soando como uma ordem, um pargrafo ou texto inteiro em negrito perde seu valor retrico. Nosso crebro no est acostumado a ler as letras individualmente, mas em blocos de palavras. Por isso to comum, quando estamos distrados, lermos palavras que no esto no texto e no tm nada a ver com seu contedo: na realidade confundimos seu desenho com outra de desenho parecido, como pato, gado, pote, gota etc. As letras minsculas, com seu desenho particular e hastes ajudam a nossa compreenso, enquanto as maisculas, com sua estrutura quadradona, fazem com que tenhamos que identificar as palavras letra a letra, reduzindo drasticamente a velocidade de leitura. Um texto COM TODAS AS LETRAS EM MAISCULAS lido muito lentamente e s deve ser usado em situaes de muita nfase. Na web, o equivalente de um grito. Famlias de letras do tipo cursivo (que imitem a caligrafia) no devem ser dispostas em maisculas, pois no foram feitas para isso. Itlico foi criado originalmente na Itlia, para reproduzir a escrita do Papa e economizar espao no papel. Seus inventores so os tipgrafos Aldus Manutius e Francesco Griffo, por isso seu av ainda chama o texto em itlico de grifo. A inclinao do eixo das letras faz com que se mude a velocidade de leitura, como um automvel que sai do asfalto para entrar em uma estrada de terra e depois voltar ao asfalto. Isso significa uma mudana de velocidade e tom de voz e usado com frequncia em citaes de palavras estrangeiras pouco conhecidas. Marketing no leva itlico, entrepeneurship leva. Itlico tambm usado quando citamos o que algum disse ou quando se quer um tom irnico, como em Ele foi com a Cris ao cinema. Experimente trocar o itlico para cada palavra dessa frase e veja como a ironia muda (foi ele quem foi, ele foi mesmo, foi com a Cris, foi ao Cinema). L E T R A S S E P A R A D A S so uma soluo radical para a mudana de ritmo e reconhecimento de palavras. So o equivalente de uma palavra soletrada. Evite usar esse recurso com minsculas, pois seu desenho original no prev tamanha separao. A cor outro recurso muito importante em um texto. Conforme a posio e o contraste com o resto do layout, uma pequena palavra colorida pode chamar mais a ateno que o negrito ou at do que o texto inteiro. Na web, cores devem ser usadas com cuidado e de forma bastante explcita, j que tambm so sinais de links de hipertexto. Por falar em hipertexto, a posio de um link em uma frase costuma indicar para que tipo de contedo a ligao levar. Por exemplo, a frase:
Veja os resultados do XXIII Festival de Cannes No muito precisa, pois pode levar a qualquer tipo de informao (uma tabela com os nomes dos vencedores, as peas premiadas, o evento de premiao etc). Se a posio do link for melhor colocada, poderemos ter: Veja os resultados do XXIII Festival de Cannes Veja os resultados do XXIII Festival de Cannes Veja os resultados do XXIII Festival de Cannes Veja os resultados do XXIII Festival de Cannes Ou mesmo: Veja os resultados do XXIII Festival de Cannes Veja os resultados do XXIII Festival de Cannes O que j d uma idia bem mais clara do que espera o visitante (imagens dos resultados, lista dos resultados, histrico, descrio do evento, caractersticas do festival, a cidade) evitando que se carregue uma pgina toa. Alinhamentos Um texto pode estar alinhado esquerda, que a forma mais fcil de se ler (a no ser, bvio, que voc esteja escrevendo em chins, japons, hebraico ou rabe): nossos olhos marcam uma margem, lem a linha inteira de texto e pulam at a linha de baixo. Textos centralizados costumam ser estticos. Podem ser usados como ttulos de produtos clssicos ou tradicionais. No se deve us-los para textos corridos porque os olhos do leitor no sabero onde comea a linha, pois no tm a margem para se apoiar. Alinhar um texto direita uma soluo de contraste bastante radical e costuma chamar muito a ateno. Em longos textos to difcil quanto o layout centralizado, pois no h referncia de onde comea a linha. Quando cometemos um erro e escrevemos explicando o porqu, estamos fazendo uma justificativa. Isso um texto justificado. Aqueles textos alinhadinhos nas duas margens so chamados blocados (justificado traduo ruim do ingls justified, ajustado) e muito usados em layouts clssicos. No devem ser utilizados em colunas estreitas, pois podem criar rios de espaos em branco entre as palavras, dificultando a leitura.
pode ser lido rapidamente, como um resumo gil e sinttico. Ela seria uma revista viva, que funcionaria como um bate-papo com um especialista no assunto: se voc quiser saber muito, pode passar horas conversando e aprender um monto de termos tcnicos. Se s quiser uma noo geral, em cinco minutos ter toda a informao que precisa. Revistas assim s so viveis na web, como revistas que s tenham pginas triplas dobrveis, com furos que permitam ler duas matrias ao mesmo tempo ou cujo texto vivo e se mexe, e cujas imagens so vdeos. A riqueza da mdia bem maior do que foi quando comeamos a ver cor no material impresso. O meio digital tem vrias particularidades que nunca existiram antes e completamente diferente de todas as outras mdias, mas leva pedaos de todas elas. A web gil como o rdio, abrangente como o jornal, rica como o videogame, envolvente como a TV, em alguns casos mvel como o celular. Tambm pode ser cativante como a correspondncia, profunda como uma consulta a um especialista, imprevisvel como um papo de boteco. A web a web. Suas limitaes tecnolgicas e as possibilidades do hipertexto fazem dela uma mdia de texto, por enquanto. Um revisto imprevisvel, com nmero e ordem das pginas variveis. Ou a web pode ser como um depsito de livros usados, um sebo. Tem informaes em todos os formatos e material organizado de um jeito que no valoriza seu contedo: empilha os volumes lado a lado, imaginando que quem vai consult-los sabe exatamente o que quer e onde encontrar. Assim, existem volumes que nunca sero lidos, mesmo que sejam maravilhosos. Ao contrrio de uma biblioteca, eles no tm uma ordem explcita. A sensao que passa a de uma estante bagunada: h de tudo, mas preciso procurar, procurar, procurar O contedo desta coleo organizado em sites. Dentro deles h um nmero varivel de documentos de hipertexto, que todo mundo chama de pginas, apesar de serem muito mais ricos que isso. Essas pginas web so ativas, podem mudar de tamanho e proporo a cada instante e dependem totalmente das condies do computador em que o material est sendo visto: capacidade de processamento, recursos multimdia, tamanhos dos monitores e janelas dedicadas para a internet, famlias de letras, browsers, plug-ins, tecnologia, velocidade de acesso, tudo isso faz uma enorme diferena, a tal ponto de no ser comum dois computadores verem a mesma tela. Considerando que cada leitor consultar as telas na ordem que quiser, podemos dizer que, quanto mais rico for o contedo de um site, maiores sero as chances de que a experincia de cada visitante seja nica. Ou seja, internet no linear. Ou melhor, internet no seqencial nem tem ndice. Parece bvio? No . A partir de agora vamos examinar os princpios do design e como eles se aplicam na comunicao digital. Por enquanto, voc s precisa ter uma regra em mente: WWW no TV, no rdio, no mdia impressa. Claro? De novo: WWW no TV, no rdio, no mdia impressa. Claro? Mesmo? Ento vamos l.
que costuma ter nomes como index.htm ou welcome.html. Domnios e seu registro Um computador que armazene sites e esteja conectado internet chamado servidor. Para podermos identific-los em qualquer ponto do mundo, atribui-se a cada servidor um endereo, chamado de Unique Resource Locator, ou URL. Como um cdigo postal ou telefone, esse endereo um conjunto de 4 algarismos separados por pontos que vo de 0.0.0.0 a 255.255.255.255. Para facilitar a memorizao desses nmeros (no brincadeira guardar coisas como 17.128.134.6 ou similares) inventou-se o sistema de domnios ou nomes nicos que so associados a uma URL. So os nomes de sites que voc conhece, que, logo depois do www, tm o formato: nome do domnio.categoria.pas. Voc pode registrar qualquer nome de domnio se: - ele no foi registrado por outra pessoa ou entidade; - ele obedece aos padres de nomenclatura: no pode ter espaos, acentos, cedilha, pontuao e a maioria dos caracteres especiais (&, #, @, * etc). Nomes em maisculas e minsculas so tratados como idnticos. A entidade que controla os registros de domnios no Brasil a FAPESP (Fundao de Amparo Pesquisa do Estado de SP). Seu Comit Gestor estabelece mais algumas restries: domnios registrados nas categorias .EDU.BR, .GOV.BR e .MIL.BR, .AM.BR, .FM.BR, .NET.BR e .TV.BR, por exemplo, obedecem a regras especficas para seu registro. Para pessoas fsicas o domnio .NOM.BR. Outros nomes de domnio possveis no Brasil so, segundo a FAPESP: Para entidades e pessoas jurdicas: AGR.BR Empresas agrcolas, fazendas AM.BR Empresas de radiodifuso sonora ART.BR Artes: msica, pintura, folclore EDU.BR Entidades de ensino superior COM.BR Comrcio em geral ESP.BR Esporte em geral FAR.BR Farmcias e drogarias FM.BR Empresas de radiodifuso sonora G12.BR Entidades de ensino de 1 e 2 grau GOV.BR Entidades do governo federal IMB.BR Imobilirias IND.BR Indstrias INF.BR Meios de informao (jornais, bibliotecas etc.) MIL.BR Foras Armadas Brasileiras NET.BR Empresas de Redes da Anatel ORG.BR ONGs sem fins lucrativos PSI.BR Provedores de servio Internet REC.BR Atividades de entretenimento, diverso e jogos SRV.BR Empresas prestadoras de servios TMP.BR Eventos temporrios, como feiras e exposies TUR.BR Entidades da rea de turismo TV.BR Empresas de radiodifuso de sons e imagens ETC.BR Outras entidades Para profissionais liberais: ADM.BR Administradores ADV.BR Advogados
ARQ.BR Arquitetos ATO.BR Atores BIO.BR Bilogos BMD.BR Biomdicos CIM.BR Corretores CNG.BR Cengrafos CNT.BR Contadores ECN.BR Economistas ENG.BR Engenheiros ETI.BR Especialista em Tecnologia da Informao FND.BR Fonoaudilogos FOT.BR Fotgrafos FST.BR Fisioterapeutas GGF.BR Gegrafos JOR.BR Jornalistas LEL.BR Leiloeiros MAT.BR Matemticos e Estatsticos MED.BR Mdicos MUS.BR Msicos NOT.BR Notrios NTR.BR Nutricionistas ODO.BR Dentistas PPG.BR Publicitrios e profissionais de prop/mkt PRO.BR Professores PSC.BR Psiclogos QSL.BR Radioamadores SLG.BR Socilogos TRD.BR Tradutores VET.BR Veterinrios ZLG.BR Zologos O cdigo de pas dos Estados Unidos .US, mas muito pouco usado. A maioria dos sites registrados por l no leva a terminao de pas (so os famosos pontocom). Dos outros pases vale guardar .AR (Argentina), .CA (Canad), .DE (Alemanha), .ES (Espanha), .FR (Frana), .IT (Itlia), .JP (Japo), .KR (Coria) e .PT (Portugal). E os domnios em .CN (China) devem emplacar em pouco tempo. Por cultura intil, saiba que o Afeganisto .AF, a Bsnia .BA, o Nepal .NP e o continente Antrtico .AQ, se que h algo por l. .BH no mineiro, .ET, infelizmente, neste planeta, .MR fica bem longe de .MS, .PF muito mais chique que um prato feito, eu infelizmente no estou em .TO, mas felizmente no fui pra .KH. E acredito que, enquanto Fidel Castro estiver vivo, o mundo no ver muitos sites que residem em .CU. Para maiores informaes voc pode acessar a FAPESP atravs do endereo www.registro.br (, sem o .com). Ou, fora do Brasil, a ICANN (Internet Corporation for Assigned Names and Numbers) em www.icann.org. Se voc quer saber se determinado domnio foi registrado nos Estados Unidos pode usar a ferramenta WHOIS da Network Solutions em www.networksolutions.com. Browsers De todos os tipos de programas que existem para acessar servios da internet, os mais populares so os browsers, ou programas leitores de hipertexto. Esses programas ativam a conexo, procuram um site e transferem documentos, da a sigla que precede a maioria dos endereos na web ser http://www, querendo dizer ativar cdigo de transferncia de hipertexto (hyper text transfer protocol) para transferir um documento que est na world wide web.
Os dois browsers mais utilizados so o Netscape e o Microsoft Internet Explorer. Sua funo original era somente mostrar os documentos de hipertexto de uma forma graficamente agradvel e fcil de utilizar. Com sua popularizao, verses mais novas incluem interpretadores JavaScript e adendos para suportar vrias tecnologias. Ao contrrio da padronizao que acontece na desktop publishing, em que o contedo no muda conforme o programa ou computador uma arte em EPS sempre a mesma em um Adobe Illustrator, em um Macromedia Freehand e em um CorelDraw; um layout o mesmo usando o Adobe PageMaker ou o QuarkXPress; uma imagem Photoshop a mesma em um Mac e em um PC o material criado para a WWW tem um srio problema de padronizao: seu contedo pode ser diferente conforme o programa, monitor ou computador utilizado. Isso acontece porque os documentos HTML so dinmicos e dependentes da mquina que os mostra, ao contrrio dos materiais de editorao eletrnica. Se o computador do usurio no tiver a famlia de letras em que o material foi composto, a substituir pela que estiver disponvel; se a tela for pequena demais, pode ser que elementos fiquem amontoados; se forem poucas as cores disponveis talvez as imagens no saiam bonitas; se o browser for antigo alguns recursos podem no funcionar. Para piorar, certas cores so diferentes de Mac para PC. A web se desenvolve muito rapidamente e s vezes nos tornamos dinossauros sem o saber. Por isso reserve um tempinho para visitar o site dos fabricantes de browsers e ver o que est rolando de novo. O caminho mais curto para isso clicar no logotipo animado do Browser, que fica normalmente no canto superior direito. HTML HTML (Hyper Text Markup Language) a principal linguagem utilizada para se fazer documentos de hipertexto. Ela no usa, como o C++ ou o Java, funes e cdigos matemticos. Como o nome diz, uma linguagem de marcao: define a cor de fundo, cor do texto, dos links de hipertexto, posio e tamanho das imagens e assim por diante. Seu cdigo muito simples, parecido com as primeiras verses de editores de textos. Pginas geradas em HTML so dinmicas: como textos, se adaptam janela aberta e vo montando o layout de acordo com os recursos disponveis, de tal forma que o resultado pode ter diversas formas e tamanhos diferentes, conforme o computador, tipo de browser, tamanho da janela ou quantidade de plug-ins instalados. Desesperador? Que nada, fascinante. Os documentos em hipertexto presentes na web so parecidos com pginas escritas em editores de textos: a largura das linhas e comprimento do documento varia de acordo com o tamanho das janelas disponveis. Assim, demanda muito cuidado preparar um material que seja consistente e coerente para todas as mquinas, ou em que as perdas sejam as menores possveis. Em seus primrdios, o HTML no apresentava muitos recursos alm dos links de hipertexto, algumas opes de layout, como negrito e itlico e a capacidade de colocar imagens. Com a evoluo dos browsers, foram surgindo comandos mais sofisticados e programas editores especializados em criar cdigos, a tal ponto que, hoje em dia, poucos designers escrevem HTML diretamente, da mesma forma que quase nenhum designer grfico escreve cdigo PostScript, a linguagem da impresso a laser. Hoje existem vrias verses do HTML e cada browser tem seus cdigos prprios. O que funciona em um pode ter um efeito completamente diferente em outro. Por isso to importante testar o site antes de mand-lo para o ar. DHTML Como toda linguagem de programao, HTML evolui e cria novas funcionalidades, algumas perceptveis por qualquer usurio, outras que so s pequenas correes de cdigo. Comandos so criados, aglutinados ou eliminados e, nesse processo, ela se torna mais estvel e compatvel com um nmero maior de browsers e plataformas (j houve tempo em que era necessrio escrever
praticamente o dobro de linhas de cdigo para garantir que usurios de Netscape e Explorer vissem a mesma tela). Para alvio do programador, elas tambm se tornam mais fceis de se operar. O preo que se paga por isso que verses mais antigas de browsers no conseguem l-los. Vive-se ento um dilema: seu site pode ser mais interessante, mas estar acessvel por um nmero mais restrito de usurios. Esse fator limitante pode ser contornado ao gerarmos verses de sites para garantir compatibilidade, ao mesmo tempo que estimula a atualizao de seus usurios. A verso 4.0 da linguagem HTML hoje em dia a mais popular. Compatvel com as verses 4.0 ou superior do Netscape e do Internet Explorer, uma de suas principais vantagens o trabalho com CSS, ou Cascading Style Sheets (estilos de layout que podem ser transportados para vrias pginas, em alguns casos levando junto famlias de letras que no estejam no computador do usurio). Outra vantagem do HTML4 a possibilidade da montagem de pginas em camadas, ou layers. Como transparncias, qualquer contedo que estiver nessas camadas flutuar sobre o documento que estiver carregado no browser. DHTML quer dizer Dynamic HTML e uma evoluo do HTML4, tambm compatvel com a mesma famlia de browsers. Ele usa scripts para a animao dessas camadas, permitindo que pginas sejam dinmicas e interativas sem que se tenha que carregar nenhum plug-in. Para muitos programadores, os scripts DHTML so uma evoluo do JavaScript, outros acham que a linguagem instvel. De qualquer forma, a questo est fora do mrito deste livro. Para voc o que importante saber que, enquanto uma pgina DHTML pode ter elementos crescendo e voando na tela, esses elementos so imagens, precisam ser carregadas e isso toma tempo. Minha sugesto de uso: se a animao for indispensvel, o documento for simples e envolver pouco acesso a bancos de dados, use Flash. Se for atualizado automaticamente, tiver muito contedo ou acessar sistemas sofisticados (e-commerce, por exemplo) use HTML ou DHTML. Voc sempre poder colocar uma animao em vdeo ou Flash dentro desses documentos sem que para isso tenha que comprometer sua operao. Editores HTML Para facilitar o trabalho do designer que no tem um programador disposio, existem diversos programas editores de cdigo HTML, basicamente de trs tipos: 1. HTML (texto) - editores de cdigo puro. Parecem editores de texto simples, com botes para a criao de funes especiais. So rpidos, diretos e eficientes, mas, como sua interface no amigvel, eles s devem ser usados por pessoas com experincia em HTML. Esse tipo de programa muito usado por programadores, pois d a eles vrias ferramentas de produtividade para gerar um cdigo limpo em pouco tempo. 2. WYSIWYG (grficos) - editores grficos lembram programas de layout de pginas, como o Adobe PageMaker ou o QuarkXPress, ou mesmo o conhecido Microsoft Word. Esse tipo de programa mais usado por designers por causa de sua interface mais amigvel e visual, poupando-o de mexer nas entranhas do cdigo. Abreviatura de What You See Is What You Get (algo como o que se v o que se obtm) esse tipo de programa normalmente evitado por programadores, pois d a eles menos controle sobre o cdigo, gera documentos com linhas desnecessrias de programao, pesados demais ou incompatveis com certas verses de browsers. Mesmo assim, para quem no entende de cdigo, so uma mo na roda. 3. Online (automticos) - existe ainda um tipo de editor feito para quem quer colocar um site no ar e no faz a menor idia por onde comear. Muito usado por sites de hospedagem de pginas gratuitas, esse servio online mostra uma srie de modelos (templates), d ao usurio a opo de escolher a tela que quiser montar e enviar seus dados preenchendo um formulrio. Automaticamente a pgina construda e colocada no ar. uma soluo rpida e fcil, mas limita o servio aos servidores que o disponibilizam e no d quase
nenhuma opo de layout alm do bsico. Flash Por trabalhar com internet h quase dez anos e ser f das possibilidades dos sistemas de hipertexto, eu sempre desconfiei de applets java, plug-ins ou quaisquer anabolizantes que se colocavam nos sites, simplesmente por consider-los desnecessrios: por que arriscar o contedo de um site s para deix-lo mais bonitinho? Se o hipertexto, por si s, j uma ferramenta fascinante e pouco explorada, por que ficar com invencionices? No preciso dizer que eu no gostava nem um pouco de Flash. Na minha opinio, um site teria que valer muito a pena para justificar download, instalao, reinicializao e o risco de travar a mquina. Mas com o tempo o plug-in ficou mais estvel, as mquinas mais potentes, muitos sites passaram a usar a tecnologia e novas verses de browsers o traziam instalado, o que acabou mudando minha opinio. Percebi que a busca pela megacompatibilidade acaba atuando nos websites como a chuva em uma corrida de frmula 1: nivela por baixo e restringe o que poderia ser um grande espetculo a uma monotonia sem fim. Continuo contra o uso de Flash em aplicaes que poderiam ser feitas em HTML, como bancos de dados, formulrios, pginas de texto simples ou dinmico, at por no acreditar que a web se resuma a isso. Porm, se o importante for a animao dinmica e cenrios que se alteram com o tempo ou movimentos do mouse, poderemos jogar o visitante em superfcies imprevisveis, no melhor estilo videogame. Fazendo assim, estamos devolvendo web sua caracterstica exploratria, to comum no incio, e que estimulava as pessoas a surfarem para que descobrissem coisas novas. No se pode esquecer que design ruim se faz em qualquer coisa Flash inclusive mas, se o uso de Flash limita seus usurios por obrig-los a instalar um programa, pelo menos no obriga os designers a fazerem malabarismos de programao, alm de estimul-los a fazer animaes de grande porte. Alm disso, se bem planejado, um site em Flash no faz restries a tamanhos de monitor ou de janela, o que pode ser mais limitante para o usurio. O que mais me fascina no Flash no a sua capacidade de trabalhar com imagens vetoriais ou com toda e qualquer famlia de letra PostScript que se tenha em uma mquina: meu fascnio da mesma forma que meu fascnio pelo hipertexto est na revoluo e democratizao que uma coisinha dessas faz na linguagem da internet, deixando-a ainda mais prxima da vida real. Como a televiso e ao contrrio do HTML, o Flash traz para a internet a dimenso de tempo, fazendo com que os sites deixem de uma vez de estar atrelados estrutura de pginas, reflexo do mundo editorial, e passem a ter estrutura de cenas e ambientes, como um cinema ou TV cujo diretor seria o usurio. Plug-ins Alm do leitor de Flash existem vrios programas auxiliares que podem ser instalados em seu browser, aumentando sua capacidade (e conforme o computador, a probabilidade de dar pau). Esses programinhas so chamados de plug-ins. A maior parte deles distribuda gratuitamente na rede, direto dos endereos de seus fabricantes ou das telas iniciais dos browsers. Os mais importantes so: Macromedia Shockwave - o browser permite que se coloque animaes, pequenos programas multimdia, jogos e aes interativas dentro das pginas de um site. Disponvel em www.macromedia.com/br/downloads/. Real Player - permite que sons e vdeos gravados em formato Real sejam tocados medida que so transmitidos. Em http://huxley.real.com/real/player/player.html. Pegue a verso basic, que gratuita. Adobe Acrobat Reader - para visualizar documentos no formato PDF (Portable Document Format), muito usado por e-books. Ideal para documentos que no podem perder seu layout original, anncios e cartazes. Disponvel em http://www.adobe.com.br/products/acrobat/readstep.html
QuickTime Player - vdeos gravados neste formato podem ser sejam tocados medida que so transmitidos. Disponvel em http://www.apple.com/quicktime/download/ iPix - utilizado para visualizar fotografias 360. Disponvel em http://www.ipix.com/download.html. Para instalar um plug-in em um browser necessrio: 1. baix-lo (fazer seu download) - se conectar ao fabricante e transferir o programa para sua mquina; 2. desligar o browser; 3. instalar o plug-in em um diretrio especfico; e 4. em alguns casos, reinicializar o computador. Considerando o tempo levado para copiar e instalar o plug-in e que esse tipo de programa fora o computador a usar mais memria, podendo travar o sistema, o usurio no o far, a no ser que todo o esforo valha bastante a pena. justificvel, por exemplo, a instalao de Shockwave para um fabricante de videogames mostrar demonstraes de seus jogos. O mesmo vale para uma loja de CDs ou vdeos que queira usar o plug-in Real para mostrar trechos de clipes. Mesmo nesses casos, deve-se levar em conta os usurios que no quiserem (ou no conseguirem) instalar esse tipo de programa em sua mquina e dar a eles opes de acesso ao contedo do endereo digital. O uso de plug-ins controverso. Se, para alguns designers eles podem ser uma ferramenta de libertao, para o visitante em busca de informao ele pode ser um calvrio, a no ser que seu uso seja fundamental para a transmisso do contedo. Infelizmente nem todos pensam assim. Muitos endereos internet fazem uso de plug-ins para mostrar que esto acompanhando as novas tecnologias e tornam a conexo mais lenta. No h dvidas que uma pgina turbinada com plug-ins tem mais recursos e, portanto, pode ser mais bonita, mas ser que mais eficiente? Afinal, no um nmero de coisas animadas que piscam e pulam na tela que fazem de um website um Yahoo! Existe plug-in para quase tudo: compresso e expanso de documentos, visualizao de imagens, vdeo e multimdia nos mais diversos formatos (de MPEG a Microsoft Powerpoint), impresso de selos de correio, telefonia via browser, visualizao de mapas, msica, assinatura digital, videoconferncia, livros eletrnicos, VRML, chat, edio HTML, videofone, visualizao e operao de ambientes 3D multiusurio, visualizao dinmica tridimensional de molculas, visualizao de panoramas virtuais, sintetizao e reconhecimento de voz, navegao por voz, otimizao de memria, sintetizao de sons de equipamentos antigos (como o Commodore 64) etc etc etc. a velha histria: enquanto existir algum disposto a consumir, sempre haver algum para produzir. Java, JavaScript, CGI etc. Apesar de sua abrangncia, o HTML no suficiente para algumas tarefas especficas da WWW, como acesso a bancos de dados, gerao de pginas automticas e processos de segurana. Para isso, so necessrias linguagens de programao mais ricas, como a to falada Java. As mais comuns so: CGI (Common Gateway Interface) uma linguagem para que o usurio consiga trocar informaes com o servidor, como em um formulrio de compras. O usurio envia seus dados, o CGI verifica sua validade e encaminha o pedido a um banco de dados. Por muito tempo esse sistema foi o estilo de comunicao mais utilizado, apesar de sobrecarregar o servidor quando os dados solicitados so em grande quantidade. Pode ser um programa desenvolvido em vrias linguagens, como C++, Perl ou SQL (Structured Query Language), feita especialmente para mexer com bancos de dados. Javascript e outros scripts surgiram para aliviar o servidor de tarefas simples, executando-as
diretamente no computador do usurio. Script ou rotina um nome pomposo para um pedao de cdigo que vai embutido junto com o HTML, entre comandos <SCRIPT> e </SCRIPT>. Alm do popular e compatvel Javascript existe o VB Script, tecnicamente semelhante, porm superior em concepo de programao. Ela apresenta mais recursos, mas tem a desvantagem de funcionar apenas em produtos Microsoft. Java um conjunto de tecnologias que so executadas no servidor e no cliente em forma de applets (programelhos). Ele inclui uma nova linguagem e seus recursos de suporte: um interpretador (Virtual Machine), drivers de banco de dados (JDBC), sistema operacional (JavaOS, JavaPC), e assim por diante. Bons usos da Java esto para comunicao de rede, em aplicativos multiplataforma para gerenciar bancos de dados, servios remotos etc. Muita gente tem usado a linguagem Java da forma errada, para fazer ttulos animados, botes animados etc, utilizando os tais applets. No vale a pena, melhor utilizar imagens do tipo GIF animado ou plug-ins como o Shockwave ou Flash, j que a Java tem um tempo de carregamento maior que outras tecnologias e seu desempenho menor. Isso tudo pode desestabilizar o sistema e fazer travar o computador do visitante, o que no exatamente simptico. Voc no precisa aprender nenhuma dessas linguagens para fazer um site, muito pelo contrrio. Elas so como remdios: devem ser colocadas na hora e locais certos, por profissionais especializados. Tentar colocar uma rotina que achou na rede em seu site pode gerar resultados catastrficos. Imagens e cores Ao contrrio das outras mdias, os documentos da web no aparecem prontos na tela, so construdos pedao a pedao: primeiro a pgina e sua cor de fundo, depois textos e imagens etc. As telas so divididas em pixels (picture elements) e eles so a unidade mtrica das pginas e de suas imagens. Ou seja: no h centmetro na web, pois uma mesma imagem pode variar de tamanho conforme o tipo de monitor. O formato mais comum de tela tem 800600 pixels. O que define o tamanho de uma imagem a quantidade de espao necessrio para armazen-la: suas dimenses e a informao de cor de cada pixel. Assim, uma imagem de 3030 pixels e 256 cores ocupar mais espao que uma com o mesmo tamanho e um nmero menor de cores. Esses nmeros esquisitos para definir a quantidade de cores (64, 256, 16 milhes) so assim porque um sistema digital armazena a informao em caixinhas que s admitem dois estados possveis (ligado / desligado). Essas caixinhas so chamadas de dgitos binrios (Binary Digits, ou Bits). Assim, de acordo com seu nmero temos o nmero de cores. Assim, uma imagem com 128 cores pesa oito vezes mais que uma do mesmo tamanho com 16 cores. O mesmo vale para imagens com quantidades de cores intermedirias: trs cores ocupam 2 bits por pixel, 50 cores ocupam o mesmo espao que 64. E no preciso dizer que uma imagem com 33 cores ocupa duas vezes mais espao que o equivalente com 32 cores. Pra piorar, Macs e PCs no compartilham as mesmas 256 cores. 40 delas so completamente diferentes, por isso sempre bom checar a imagem nesses dois sistemas ou usar um padro websafe com o mximo de 216 cores. Mas no se preocupe: a maioria dos programas de manipulao de imagens permite controlar o nmero de cores e selecionar um padro compatvel com todas as plataformas. Nossos olhos no tm capacidade de diferenciar mais de duzentos tons diferentes de uma mesma cor. Por isso, uma imagem monocromtica de 8 bits por pixel (256 cores) nos parece uma fotografia em tom contnuo. Ao se combinar essa gama de tons das trs cores bsicas da luz, teremos: 256 vermelhos x 256 verdes x 256 azuis = 16.777.256 cores. Por isso quando uma imagem tem 16,7 milhes de cores disponveis para cada pixel, ela tem qualidade fotogrfica. Por que imprime to mal?
Qualquer um que j capturou uma imagem na internet e a tentou imprimir sabe que o resultado muito aqum do desejvel, ainda mais se essa impresso for profissional. Todos os jornais e revistas que falam de sites o fazem em fotos pequenas ou de baixssima qualidade. Isso ocorre porque os processos de formao de uma imagem na tela (usando pixels) e em uma impressora (usando pontos) so completamente diferentes. Pixels so pontos de luz e, por isso, combinam as cores Vermelho, Verde e Azul em uma unidade de cor prpria, cujo sistema cromrico o RGB (de Red, Green, Blue). J os pontos de impresso so tinta e no podem ser misturados para no borrar. Por isso cria-se uma retcula em que as cores bsicas de impresso (Cyan, Magenta, Amarelo e Preto) fiquem umas do lado das outras sem se tocar. A esse sistema chamamos de CMYK (Y de Yellow, K de black, j que o B de Blue). Para reproduzir um pixel em uma impressora so necessrios vrios pontos. A relao no linear, mas para se fazer uma idia, a definio de 72 pixels por polegada do monitor equivale aos 600 dots (pontos de impresso) por polegada da impressora. Para se fazer uma impresso de qualidade so necessrios, no mnimo, 2540 dots, o que equivale a uns 250 pixels por polegada. Como nenhuma imagem na web tem essa definio, a soluo reduzir seu tamanho (aumenta o nmero de pixels/inch) ou deix-la com uma qualidade sofrvel, no se podem inventar novos pixels. Neste livro muitas vezes opto pela segunda alternativa. Formatos Se voc trabalha com editorao eletrnica, esquea o TIFF e o EPS eles no so lidos pela maioria dos browsers, trazem informaes desnecessrias para quem ler uma imagem na tela e so grandes demais. Os formatos mais usados so GIF e JPEG. GIF: Graphics Interchange Format. Padro criado pela CompuServe que suporta no mximo 256 cores, ou 8 bits de informao para cada pixel da imagem. possvel controlar seu peso alterando o nmero de cores. Suas principais caractersticas so: Podem ser animadas o formato permite seqncias de imagens com tempo, criando animaes; Podem ter reas transparentes - uma ou mais de suas cores podem ser definidas como transparentes, permitindo que se veja a cor ou imagem de fundo; Podem ser entrelaadas podem ser carregadas progressivamente na tela, o que faz que uma verso rstica da imagem seja visvel rapidamente. JPEG: Joint Photographic Experts Group. Padro criado por esse grupo da International Standards Organization, a ISO. Normalmente usado para fotografias, esse padro comprime imagens, descartando reas repetitivas ou com baixo nvel de detalhe. Essa compresso varia de 0 a 100% e pode gerar arquivos bem pequenos, mas com qualidade sofrvel. Imagens com bom contraste, alto nvel de detalhamento e muitas cores no suportam muita compresso. Cada caso demanda uma compresso diferente dos outros. No existem imagens de alta qualidade que sejam pequenas, mas a melhor relao pode ser conseguida ao se digitalizar o original em alta resoluo e eliminar todas as impurezas da imagem, pois o que para ns sujeira (como um fundo branco acinzentado, por exemplo) para o computador considera como informao. Esse trabalho costuma compensar. Existe uma verso progressiva do JPEG que permite o entrelaamento da imagem. Na maioria dos casos, a imagem que carrega gera um resultado feio demais, mas sempre vale a pena tentar. Usos de imagens em sites Existem quatro tipos de funo que uma imagem pode realizar em um website:
agir como um mapa (imagemap) com reas clicveis; e atuar como uma imagem de fundo. Essa imagem ser combinada em uma espcie de mosaico, por isso muito importante tomar cuidado com suas emendas.
Muitos gostam de usar imagens enormes como fundo. No h nenhum problema nisso, contanto que a pgina no demore muito para carregar. Deve-se, acima de tudo, tomar um cuidado especial para que as imagens de fundo no sejam confusas demais ou tenham muitos elementos, caso contrrio podero comprometer a legibilidade. Frames e framesets A www permite que uma pessoa esteja em dois ou mais lugares no espao ao mesmo tempo, atravs de sua estrutura de quadros, ou frames: divide-se a tela em pedaos, e cada pedao pode mostrar um documento diferente. Assim, possvel, em uma mesma tela, estar consultando um site no Brasil, um na Alemanha e um no Japo. A maioria dos sites hoje em dia se utiliza dessa estrutura, certamente voc j viu vrios deles. Pena que to poucos percebam a riqueza desse recurso. O processo razoavelmente simples: um documento inicial com a estrutura dos quadros carregado o frameset e ele avisa o browser quais pginas viro, em que ordem e posio. Essas pginas podem estar em qualquer lugar da internet e uma ao em uma pode alterar o contedo de outra. O frameset composto por frames, que so documentos web normais, compridos ou largos, pequenos ou grandes, no importa. A estrutura do frameset que ir determinar sua ordem e posio. Um frame pode ter quatro tipos de formatos: Fixo sua largura / altura definida em pixels. Um frame pode ter 100 pixels de largura, outro 150, outro 30. Se a soma dos frames for maior ou menor que a largura total do monitor, o ltimo ser esticado ou comprimido. Percentual suas dimenses variam conforme o tamanho do monitor. Um frame pode ocupar 10% do total, pouco importa o tamanho da janela. Proporcional suas dimenses variam conforme o espao ocupado pelos outros frames. Misto Todos os formatos podem se misturar, o que d um controle maior para o frameset. Framesets podem estar dentro de outros framesets, e essa estrutura pode se prorrogar indefinidamente. Uso muito a estrutura de frames em meus sites para ampliar a quantidade de informaes disponveis e maleabilidade. Apesar de todos os recursos disponveis, a maioria das pessoas usa frames para duas funes bsicas: Centralizar as pginas como no h controle do tamanho do monitor do visitante, muitos designers querem garantir seu layout com estruturas do tipo <FRAMESET ROWS=*,400,*> ou do tipo <FRAMESET COLS=*,600,*>, limitando a largura e a altura do monitor do visitante a 600400 pixels. Esse recurso controverso, pois prejudica os usurios que tm equipamento melhor, nivelando por baixo como a chuva em corrida de Frmula 1. ndice divide-se a tela em duas partes: uma fixa, que fica normalmente esquerda ou na parte de cima, com uma lista de todos os links disponveis. E outra, varivel, com as pginas propriamente ditas. Esse processo sacrifica, em mdia, uns 20% a 25% da rea til com uma informao dispensvel. Ou voc acha fundamental mostrar o ndice em todas as pginas de uma revista ou jornal? Se para seu projeto a barra de navegao fundamental, pelo menos tente minimizar seu espao, evitando grafismos, colocando-a na horizontal ou na forma de um menu drop-down.
Tabelas Os documentos HTML se adaptam ao tamanho da janela em que esto dispostos. Esse processo dinmico facilita a leitura mas costuma destruir muitos layouts. Um recurso importante para garantir um mnimo de ordem o uso de tabelas, dividindo a rea em um mosaico cujas clulas podem ser agrupadas, alinhadas ou ajustadas. Como framesets, elas podem ter o tamanho determinado em pixels ou percentuais. Elementos nas clulas de uma tabela tm dimenses e alinhamento fixos e no se acomodam ao tamanho da pgina web. Se isso pode prejudicar a leitura (o visitante pode precisar usar as barras de rolagem para ter acesso a todo o contedo) em compensao garante a posio dos textos e imagens em um layout e pode gerar pginas imensas, doideiras do tipo 60006000 pixels. rea til e Scroll Bars Ao contrrio do papel, que tem um tamanho fixo e identificvel de pgina, a comunicao digital no se restringe s limitaes fsicas do monitor. As scroll bars, aquelas barras de deslocamento que ficam nos cantos da tela, permitem que nos livremos das dimenses fixas, transformando o monitor em um buraco de fechadura. Atravs desse visor podemos monitorar os documentos digitais, seja qual for o tamanho deles. Ele pode se aproximar da pgina (zoom in), afastar-se dela (zoom out) ou deslocar-se por ela atravs das barras de rolamento. Assim podemos trabalhar com documentos de vrios tamanhos e formatos, manipulando e descobrindo a informao. Fica fcil na WWW fazer uma revista em que uma pgina tem formato diferente do seu prprio verso ou um quarto que maior do que a casa inteira. Maluco, no? Uploads, Downloads Para transferir documentos HTML, imagens, aplicativos ou mesmo sites inteiros entre seu computador e um servidor a que se tenha, usam-se programas de FTP (file transfer protocol). Eles mostram em uma janela o contedo do diretrio especificado no servidor e permitem que voc troque arquivos como se estivesse copiando pastas de um disquete para seu computador. A velocidade de transferncia depende da qualidade da sua conexo. Quando se transferem documentos do computador pessoal para o servidor, o processo chamado de upload. O processo contrrio chama-se download. O download (sua traduo algo como transferncia da carga para baixo) tambm pode ser feito diretamente no browser. Depois de feito o upload de um site recomendvel test-lo no ar, porque vrios probleminhas (como processos no compreendidos pelo servidor, documentos no transferidos, links errados ou erros de conexo) podem acontecer. Tudo isso para fazer um website? Sim, e muito mais. Isso s o comeo. Mas fique tranqilo. Essas coisas so fceis de se pegar no dia a dia dos trabalhos. S necessrio ter conscincia de seu real valor e significado.
animados e texto) esses meios permitem uma comunicao mais abrangente e especfica, como um jornal com som, uma TV com texto imprimvel ou um rdio com imagem. Multimdia em uma estrutura de hipertexto chamada de hipermdia; Participao - o receptor participa no processo de comunicao de forma ativa, determinando que mensagens quer escutar, definindo quando quer ser emissor; Partilha - um mesmo documento pode ser manipulado simultaneamente por diversas pessoas; e Personalizao - um documento pode ter um formato e/ou abrangncia especficos para cada usurio.
4-5: Tecnologia
Imagine a seguinte histria: um canal de TV a cabo resolve fazer um programa high-tech e convence seus clientes e anunciantes a topar alguns programas que s podem ser visualizados por quem tenha um Home Theater com tela de 63 polegadas em cristal lquido. O argumento seria o bvio: pblico selecionado, recursos melhores, direo de arte inovadora, alm da associao da imagem do canal alta tecnologia, mesmo que poucos ou quase ningum pudesse visualizar seu contedo. E esse contedo no seria muito diferente de um Fausto com efeitos especiais. Para o resto dos mortais no haveria opo: veriam uma vinheta com um aviso que seu aparelho de TV era fraco demais para dar conta do recado. O caso que voc acabou de ler seria inimaginvel do ponto de vista de qualquer pessoa com um mnimo de bom senso. Infelizmente eles so muito comuns na internet. A cada dia mais fcil ver sites desenhados para monitores grandes, incompatveis com equipamentos mais velhos, dependentes de sistemas potentes de transmisso e de programinhas plug-ins sofisticados. A situao piora se levarmos em considerao que as novidades tecnolgicas que esses sites trazem no agregam valor a seu contedo. So comuns casos de designers delirantes que propem ao cliente sites com telas iniciais de 400K ou mais, mas poucos pensam em usurios das classes C-D ou terceira idade. Enquanto os produtores de sites brasileiros no descobrirem que no esto nos Estados Unidos e comearem a preparar material compatvel com o pblico, suas necessidades, anseios, equipamentos e infraestrutura telefnica, a internet no ser levada a srio como veculo de comunicao. O resultado pode at ser bonitinho, mas quem se importa? sempre bom lembrar que os programas de TV ainda so compatveis com receptores em preto-e-branco. Seu site pode usar todas as tecnologias avanadas do mundo, contanto que isso agregue valor a seu contedo. Mas lembre-se sempre que ele um veculo de comunicao e deixe sempre uma verso para quem no tem uma mquina poderosa. Afinal de contas, audincia no se joga fora. Toda TV um aparelho multimdia Existe um lugar sensacional para se passar vdeos: chama-se televiso. um aparelho multimdia bacana, pois tem at controle remoto e permite que o usurio se refestele em um sof enquanto janta e assiste. Comparada com ela, a internet pobre, feinha, limitada e bastante sem graa. Por que se preocupar, ento? Porque a web no um canal de TV a cabo, nem uma alternativa para a videolocadora. Pelo menos no por enquanto. Por mais bvias que sejam as diferenas entre essas duas mdias, poucos que preparam contedo para a internet parecem ter conscincia ou dar importncia a essas particularidades, tentando concorrer com a televiso no que ela faz de melhor: filmes, novelas e desenhos animados, sons, entretenimento passivo e comerciais. Ao fazer isso, acabam produzindo um material pobre e se esquecendo das caractersticas principais da comunicao personalizada via internet: informao sob medida e em diversos nveis de abrangncia, comunicao interativa e personalizada, participao em comunidades de informao, uso de bancos de dados, escolha pessoal de contedo e entretenimento ativo e autodirecionado. Por isso, antes mesmo de pensar em estabelecer qualquer restrio ao seu visitante (plug-ins, tamanho de monitor, verso de browser, caixa de som) imagine a seguinte histria: voc passa um tempo cantando aquela sua colega de escritrio que uma maravilha. Voc est meio barrigudo, mas de tanto insistir, ela topa tomar um vinhozinho e ouvir uns CDs na sua casa, que fica do outro lado da cidade. Na hora combinada ela chega de txi. Voc a mede de cima a baixo e manda-a dar um pulo em uma das lojas da redondeza para comprar um batonzinho, sem o qual ela no entra. Afinal, um batom no algo to caro ou difcil de se encontrar. Algo parecido com a cena do Jack Nicholson no restaurante de Melhor Impossvel, em que ele reclama que teve que descolar um
palet para entrar no salo enquanto ela pode usar um vestidinho caseiro. O resultado previsvel. Dia chegar em que as pessoas finalmente entendero que internet no TV, da mesma forma que TV no rdio com imagens, da mesma forma que cinema no teatro filmado, da mesma forma que videoclip no aquela dublagem feita pelo cantor Pablo no quadro Qual a Msica? do Slvio Santos. A estaremos redimidos. CD-ROM, no CD-RUM. Nem CD-ROOM. DVD idem. CD-ROM abreviatura de Compact Disc Read-Only Memory, um documento (armazenado na memria) que s pode ser lido (read-only) e que foi gravado em um CD. Esse meio de armazenagem de dados tem a vantagem de no ser magntico, por isso mais difcil de ser apagado que um disquete comum. tambm maior: nele cabem 670 MB de informao, aproximadamente 480 disquetes comuns. Sua maior desvantagem est em seu prprio nome: uma vez gravado, no pode ser alterado. Se algum dado estiver errado, a nica soluo regravar todo o CD. Em um primeiro exame, o CD-ROM parece bacana, pois armazena todas as informaes no disquinho, no depende de tipos de browsers, tamanhos de telas nem das famlias de letras instaladas no computador do usurio. S que enfrenta todos os problemas dos meios fsicos, como livros ou revistas: prensagem, distribuio, desatualizao etc. Para piorar, ele precisa de um aparelho especial para sua leitura, o drive. Em uma anlise mais fria, essa tecnologia o pior de dois mundos. Por enquanto, ainda melhor que a internet, pois no depende das linhas telefnicas nem das limitaes dos browsers, mas esse panorama est mudando cada vez mais rpido. CD-ROM e DVD-ROM possuem o mesmo aspecto, tamanho e espessura, mas a capacidade de armazenagem muito diferente. O DVD-ROM pode armazenar at 7 vezes mais dados (4,7 Gbytes). Alm disso o DVD permite gravao em dupla-camada em um nico lado, o que aumenta a capacidade para 8,5 GB e a gravao em dois lados, aumentando a capacidade de armazenao para 17 GB. Por armazenar mais dados, o DVD-ROM suporta contedo com melhor cor, nitidez e clareza, com excepcional apresentao de detalhes finos da imagem. Um filme gravado em um DVD-ROM usando a compresso MPEG2 pode ter a durao de at duas horas e 13 minutos com uma qualidade espetacular, 6 canais de udio (dolby digital), canais de som digital em trs lnguas e adio de legendas em quatro lnguas adicionais. As possibilidades de trabalhos em multimdia so enormes, mas, segundo AleMcHaddo, diretor da 44 Bico Largo Multimdia, podemos enquadr-los em quatro tipos: Institucionais, apresentando uma empresa, produto ou pessoa; Catlogos ou Portflios Digitais, mostrando vrios produtos e/ou trabalhos, descrevendo cada um deles; Jogos (videogames) e Filmes Interativos, filmes que podem ser vistos escolhendo a ordem, posio de cmeras ou assunto. As mdias CD-ROM e DVD-ROM devero se tornar como o LP, a fita cassete e o VHS: formatos quase extintos. medida que a internet fica mais segura e o transporte de dados adquire maior capacidade, informao que demanda transporte fsico e no pode ser atualizada em tempo real dever desaparecer. Para contornar o problema esto surgindo documentos dinmicos que, mesmo gravados em CD-ROM, conectam-se internet e atualizam suas informaes no ato da operao. Assim, d para se levar a maioria dos dados no CD e conectar com as informaes atualizveis pela internet.
5: Interface
Ningum ou quase ningum gosta de usar computadores. So mquinas estranhas, frgeis, que nos deixam trancados em salas escuras e causam vrios problemas sade. Em compensao, todos gostamos de ferramentas que nos ajudem a realizar um trabalho, de um culos a uma pina. Essa a idia que deve estar por trs das interfaces de sistemas digitais, tambm chamadas de GUI (Graphical User Interfaces) ou simplesmente de interfaces. Se forem simples, diretas, agradveis e divertidas, faro com que seu usurio se esquea que est usando a ferramenta e se concentre na tarefa. Se forem complicadas ou mal-feitas, daro mais trabalho. Imagine que voc est com um parafuso solto e precisa apert-lo. Soluo? Uma chave de fenda. No tem? Use uma faca. No tem? Que tal um clipe de papel? Ou uma tesoura? Ou a unha do dedo? Cada uma dessas ferramentas pior que a anterior e leva muito mais tempo para realizar a tarefa especfica. Se voc quebrar a unha no processo, vai se lembrar dele durante dias, e provavelmente continuar com o parafuso solto. Se, no momento que identificou o problema, voc tivesse uma boa chave de fenda do tamanho certo, provavelmente j teria se esquecido dele. Da surge uma distoro: muitos gostam de avaliar um website pelo nmero de pginas visitadas ou pelo tempo gasto em cada visita. Se esquecem que, ao contrrio da TV, rdio ou revistas, o processo de consulta s informaes na Web ativo e muitas vezes o usurio no est feliz por perder um tempo l. Em uma ferramenta verdadeiramente eficiente, como o Yahoo!, o processo simples e envolve trs fases: pergunta resposta sada. um processo rpido e envolve poucas pginas, mas muito satisfatrio. O mesmo acontece em bons sites de referncia e e-commerce. Um dos melhores exemplos de interface grfica a desktop, base dos computadores Macintosh (to eficiente que depois serviu de modelo para o Windows e outros sistemas operacionais). Ela mostra elementos que se parecem com objetos reais (pastas, disquetes e lata de lixo) e introduz outros imaginrios, mas bastante prticos (janelas com documentos e textos). Quando surgiu, os prprios engenheiros da Apple tomaram um susto ao ver que as pessoas gostavam de trabalhar com um Mac. Isso porque a opo da poca o DOS no tinha imagens e mostrava uma tela escura (preta ou verde) com um C:_ esperando comandos em linguagem de programao. A Apple Desktop Interface um bom exemplo da abrangncia que uma ao de design pode ter, pois ela no s mudou a cara dos computadores e programas como tambm a relao das pessoas com eles. Desde 1984, a interao baseada em comandos e no binmio lembre-se e digite vem sendo substituda pela relao de aponte e clique, muito mais natural e eficiente. Mas o que , afinal, uma interface? Ela o ponto de contato entre um ser humano e uma mquina. Se essa mquina for uma bicicleta, ser o conjunto formado pelo seu banco, guido, pedais e cmbio. No que nos diz respeito, a cara dos websites ou programas multimdia, o intrprete entre um computador (que entende de cliques do mouse e impulsos eltricos) e seu usurio. o ambiente grfico do produto digital, o canal de comunicao do usurio final com o contedo de um sistema de computador. Em outras palavras, onde tudo acontece. A interface uma das partes mais importantes de um website, pois concentra a relao visitantesistema. o que apresenta informaes e estmulos e recebe respostas, colocando a manipulao nas mos do usurio. Por isso, muito mais que um visual bonitinho, deve ser o elemento de transio entre o mundo real e o digital. O ideal que ela seja transparente, invisvel, natural, sinttica, intuitiva, prtica. No deve ser excessivamente realista, pois a metfora vai ficar forada, afinal o usurio sabe que est mexendo em um computador.
engajados em um processo de descoberta. sempre bom lembrar que, j que o computador uma ferramenta, deve ser agradvel e divertido us-lo. O que evitar em uma interface No existem regras especficas sobre o que deve e o que no deve ser feito em uma interface, mas como regra geral, condenvel: Repropositar a mdia no se deve adaptar o contedo produzido para a mdia convencional para um produto digital, pois as linguagens so completamente diferentes e o resultado pode ficar estranho; Confundir o visitante - deve-se fazer o design com coerncia e consistncia. Como no existem regras, os elementos da interface podem ficar em qualquer ponto da tela, mas, uma vez colocados em um ponto, devem permanecer nele por todo o produto. Complicar a navegao e levar a becos sem sada o boto de volta para a home page deve ser usado somente em ltima instncia. Se um website est bem feito e estruturado, um assunto levar a outro e no ser preciso voltar para a tela inicial e recomear a navegao. Excesso de texto ou letras em corpos pequenos - mais difcil ler em um monitor do que em uma folha de papel. Usar imagens escuras demais, densas ou que demorem para carregar - o usurio de um sistema digital est com toda a sua ateno voltada para o monitor, por isso tende a ser mais exigente e impaciente. Pode notar que um telespectador espera com tranquilidade os dois a trs minutos do comercial de TV. J na web
Outro ponto importante: os botes e cones no precisam ser tridimensionais. No comeo eles eram assim para imitar os botes do teclado, sugerindo ao usurio o que fazer. Contedo, mapa e navegao Ao contrrio dos livros e jornais (que so previsveis) ou do rdio e televiso (que so lineares) no h como saber o que h em um website. Por isso importante evidenciar onde est o visitante, como chegou ali e para onde seguir a partir desse ponto. Os mapas podem ser desenhados das formas mais esdrxulas possveis. O que importa dar ao usurio a manipulao e controle sobre a situao. No se esquea que um produto digital um conjunto de documentos. importante que o visitante saiba reconhecer, no emaranhado de possibilidades, caminhos a se seguir. Entrada de dados e resposta Voc j reparou que nossos pais e avs se comportam como se tivessem medo de quebrar aparelhos ou de tomar choque se apertarem os botes errados? No se age assim por acaso: provavelmente na poca dos primeiros aparelhos eletrnicos, um boto poderia significar uma exploso ou algo pior. Leve isso em considerao quando criar reas que impliquem em aes do usurio: bom que ele saiba que clicou em um boto ou que preencheu um formulrio. Som e interfaces O som pode ser usado de duas formas em uma interface: integrado a ela, para deixar o usurio a par do estado do sistema ou alertando o usurio de algum fato (que uma tarefa acabou, por exemplo). Se uma interface tem diferentes estados ou modos, cada um pode ter um som particular quando se entra ou sai dele. Isso pode enfatizar o modo corrente e evitar confuso. Entretanto, necessrio tomar cuidado com: Restrio - o excesso no acrescentar significado interface e provavelmente ser irritante; Redundncia - o som no deve ser a nica indicao de que algo aconteceu. Deve sempre existir uma indicao visual para reforo; e Invaso - muitos sons podem ser sutis e, mesmo assim, garantir a transmisso da mensagem. Sons invasivos ou desagradveis podem ser ofensivos ou intimidatrios. Sons repetitivos podem se tornar irritantes depois de exposio prolongada.
5-4: Interatividade
Uma das palavras mais gastas da internet hoje em dia a tal da interatividade. No importa onde, como ou com que objetivo, tudo deve ser interativo comerciais de TV, cartazes de rua, revistas, cardpios, peas de teatro. Se h um porqu, um significado por trs no interessa: ou se interativo ou arcaico, montono, passivo, atribua o nome que achar mais adequado. Isso tudo controverso. Se timo ter a oportunidade de responder a um anncio, conversar com uma empresa, marca ou produto, trocar idias com especialistas, por outro lado um saco ser obrigado a isso. Muitos sites tm dezenas de botes e cliques e links e coisas que piscam e pulam e berram pela sua ateno s para poderem contar que tm dezenas de milhares de pginas, mesmo que para isso obriguem o usurio a uma srie de aes para as quais ele no estava com o menor esprito. A interatividade acabou ficando como o sexo nos anos 90 o pecado est exatamente em no falar nele. Tsk, tsk, tsk Ningum quer interatividade o tempo todo - vrias vezes muito mais confortvel sentar na frente do computador, relaxar e deixar o website rolar, seja com sons, animaes ou msica, do que ser obrigado a ter um monte de opes para sair por a fazendo calo no dedo indicador da mo direita de tanto click. J foi o tempo em que a internet era a grande novidade e hipertexto uma caixa preta magnfica e indecifrvel, mas isso no significa que todo mundo tem as novas verses de todos os programas. Se voc se cristalizou em algum ponto do processo, bom ter em mente que a maioria dos seus usurios continua achando que computadores so mquinas complicadas, feitas para dar pau e j percebeu que a parte mais rica da internet o e-mail. A web, para a maioria dos velhos usurios, um lugar com 99,9% de puro lixo, a tal ponto que no vale mais a pena garimpar. Hoje em dia, para o usurio, no o fato de clicar que faz a diferena, mas o que h de verdadeiro e significativo por trs desse clique. Ele aprendeu a valorizar-se como cidado de um universo segmentado e especfico, ainda que virtual, e no engole mais qualquer besteira. Sabe que seu tempo precioso e olha para a web com muita desconfiana. Se for possvel ter acesso ao que precisa (de um simples esclarecimento compra de um drive de DVD-ROM) com o mnimo de esforo, essa ser, sem dvida, sua escolha. A interatividade s o tempero de um website. Se no colocar nada, ele fica insosso, besta, desperdiando uma das caractersticas mais ricas do meio. Se colocar demais, no d pra encarar. A arte est em escolher o ponto, mesmo que seja o de comida baiana, mexicana ou indiana. s vezes s estamos procurando por informao na internet. No queremos participar, brincar, jogar, interagir nem ver um monto de fotos bonitas e joinhas, quanto mais fcil e direto for seu acesso, melhor. Sob esse ponto de vista, no estranho o que sites de comunidades descobriram de especial humanos. Pode at parecer um paradoxo para quem ainda no est acostumado com a internet, mas j que todo mundo tem tecnologia, bancos de dados e sistemas seguros, um consultor humano, com todas as suas imperfeies e tendncias tambm aquele sujeito que tem o to apreciado bom senso, maravilhosa habilidade que at hoje, nenhuma mquina conseguiu reproduzir.
6: Arquitetura de informao
Ningum em s conscincia pensa em construir uma casa sem pelo menos trocar uma idia com um arquiteto. O mesmo vale para reformas estruturais, como mudar a rede hidrulica ou a montagem de um prdio comercial. Os motivos so pra l de bvios: sem planejamento as paredes podem ficar tortas, janelas podem dar para o vazio e quartos podem dar inveja a clausuras de convento. Na melhor das hipteses, uma casa construda sem planejamento tem janelas sem sol, quartos quentes e portas abrindo para o lado errado. Pena que, quando o assunto internet, poucos pensem em um planejamento da informao, por menor que seja. Muitos websites acabam virando o equivalente digital das casas de uma favela ou aldeia medieval, em que um quarto se emenda em outro em um labirinto confuso e tortuoso. A maioria das pessoas que os constri se procupa com o layout das telas, com as tecnologias que ele pode suportar, com sua capacidade de atualizao tecnolgica e at com sua manuteno peridica, mas esquecem de sua estrutura. Ou seja, preocupam-se com tudo menos com o pobre do visitante, que se perde em montanhas de pginas, links e efeitos at chegar na informao que estava procurando, se der sorte. Muitas das pessoas que enjoaram da internet reclamavam da dificuldade de acesso informao. Parece loucura: uma rede que foi feita para facilitar a comunicao pecando pela dificuldade de acesso informao. A maioria dos contedos dos endereos digitais departamentalizada, classificada em grupos com pouca mobilidade entre as sees, subdividindo e especializando a informao, como em sistemas de informtica. Mesmo quando a interface divertida ou bonitinha, a navegao peca, ficando presa a uma camisa de fora estrutural, triste de se ver. Um site deve ser leve, como dana. E no estou falando s de imagens. A estrutura, o encadeamento, o texto, todo seu contedo deve ser transmitido de uma forma sedutora e persuasiva. Mais do que isso, sua estrutura deve passar despercebida, para que o contedo, e s ele, aparea. E isso no nada fcil. Antes de se fazer um website preciso planejar sua estrutura e mapa. Isso se faz com lpis e papel, imaginando as principais reas e suas conexes. Todo site, por menor que seja, tem que ter um diagrama com tudo o que existe nele. S assim d para conhec-lo rapidamente e ter acesso a todas as informaes. Muitos endereos substituem o mapa por um mecanismo de busca ou por um questionrio. Isso, na maioria das vezes, no funciona. como entrar em uma loja de CDs e, em vez de ver produtos expostos, encontrar um funcionrio perguntando o que se quer comprar. So comuns os websites do tipo beco sem sada, em que o nico caminho voltar para a Home Page. Ou aqueles em que o visitante forado a passar por vrias pginas intermedirias, sem contedo, at chegar informao. Ou aqueles cujos links no funcionam. para acabar com esse tipo de problema que existe a Arquitetura de Informao, que visa a organizao de grandes massas de dados, preparando rotas de acesso a eles. Ela est se mostrando fundamental em colees de produtos como livros de referncia, supermercados, lojas de CDs e de departamentos, catlogos, sites na internet e CD-ROMs. O nome pomposo, mas a funo se baseia em um conceito simples, que o mesmo do design: o bom senso. Uma arquitetura eficiente torna a informao acessvel e compreensvel a outras pessoas, qualquer que seja seu nvel de conhecimento. Como os maravilhosos museus de cincia e histria natural, ela transforma o que complexo em pedaos simples e estimula seu desenvolvimento. Latch: opes de organizao No se pode falar de Arquitetura de Informao sem citar o pai da matria: Richard Saul Wurman, que cunhou o termo e seu conceito em 1975. Segundo ele, o que faz a comunicao possvel a
possibilidade de identificar, em seu interlocutor, o que ele no compreende, verificar se h algum interesse em compreend-lo e descobrir a melhor estrutura para transmitir a informao. Essa informao deve se relacionar com conceitos que ele j compreende e trazer alguma vantagem no processo. Na introduo de seu livro Information Architects, Wurman define poeticamente a avalanche de dados dos tempos modernos, comparando-a a uma tsunami, onda gigantesca provocada por terremotos submarinos: H uma tsunami de dados quebrando nas praias do mundo civilizado. uma onda de informao no relacionada e crescente, formada por bits e bytes vindo em uma desorganizada, incontrolvel, incoerente cacofonia de espuma. Nada nela facilmente relacionvel, nada vem com organizao metodolgica. medida que ela quebra nas praias, vemos pessoas com suas calas e sapatos molhados, andando estupidamente em direo gua, sorrindo um falso sorriso de confiana e controle. A tsunami uma parede de dados dados produzidos em uma velocidade cada vez mais rpida, em volumes cada vez maiores para se armazenar. Volumes que aparentam dobrar a cada dia. Mais rpido, mais e mais e mais. Para Wurman, as formas de se organizar informao so finitas e sintetizadas pela sigla LATCH: Local (mapas), Alfabeto, Tempo (perodos histricos e linhas de tempo), Categoria (grupos genricos, como verduras em supermercados ou vitaminas em farmcias) e Hierarquia (do maior para o menor, do mais claro para o mais escuro). S cinco formas, veja voc. Qualquer outra forma que tentei acabou recaindo em uma dessas acima. claro que podemos combin-las em diversos nveis. Uma lista telefnica de assinantes (pginas brancas) s organizada por ordem alfabtica. Uma lista classificada (pginas amarelas) pode ser organizada por local (cidade, bairro ou regio), depois por categoria de servio (com todas as categorias listadas em ordem alfabtica) e, dentro de cada uma delas, os profissionais e empresas tambm organizados por ordem alfabticas. Por toda parte assim: outro exemplo so os catlogos de carros usados, divididos por categoria, fabricante (tambm uma categoria), tempo de uso e preo (hierarquia). Supermercados organizam seus itens por categoria, farmcias empilham seus remdios em ordem alfabtica, pessoas so atendidas nos restaurantes por ordem de chegada e assim por diante. A escolha do critrio de organizao fundamental. J imaginou usar troc-los? Pense nos sites que est fazendo. Quais so os grupos de informao envolvidos? Como eles podem ser organizados? s vezes na escolha do critrio de organizao est a soluo criativa que far com que o site se destaque. De qualquer forma, os dados devem estar organizados por relevncia, ou seja, por terem algum ponto em comum e poderem ser interligados experincia do leitor. O processo de Arquitetura de Informao Por determinar os roteiros que o usurio poder percorrer dentro de um site e sua relao com o sistema, a Arquitetura de Informao tambm chamada de Design de Interatividade. Existem vrios processos para se planejar a arquitetura de informao de uma grande massa de dados. O que uso envolve as etapas: 1. Identificao do problema; 2. Classificao de suas particularidades; 3. Levantamento de dados; 4. Definio de estruturas hierrquicas (LATCH); 5. Aglutinao de temas relevantes; 6. Estudos de navegabilidade; e 7. Pontos de interatividade.
Com esses tpicos bem detalhados d para se ter uma noo completa do universo de informao disponvel. A partir disso definimos o mapa de estrutura do sistema, que pode ser feita como um organograma, como um grupo de conjuntos matemticos e suas interseces ou usando um conjunto de crculos concntricos mveis para definir sua estrutura organizacional, tanto faz. O importante mostrar os caminhos que o usurio possa percorrer no sistema. Esse processo no uma obra pessoal nem artstica. Ele deve considerar o contedo e como a informao servir ao usurio. Independente da vontade do designer, deve se concentrar na resoluo de problemas. Com o progresso dos sistemas digitais e das interconexes de hipertexto, importante dar s pessoas ferramentas cerebrais para a administrao dos vastos volumes de informao que surgiro nos prximos anos. Design de informao: visualizando estruturas Pronta a estrutura de informao, hora de torn-la visvel, avaliando seu contexto e deixando o usurio vontade nesse ambiente desconhecido. a que entram as barras de navegao e seus cones ou textos. Essa a parte mais importante da estruturao de uma interface e, por mais incrvel que possa parecer, normalmente a mais ignorada. Muitos designers de sites (e mesmo de comerciais de TV interativa e DVDs) esto to preocupados em criar um layout harmonioso que parecem se esquecer que os produtos digitais devem ser funcionais, pois tratam suas barras de navegao como meros elementos acessrios do design. sempre bom lembrar que, por mais bonito que seja o site como um todo, na barra de navegao que seu usurio vai concentrar sua ateno. Afinal, por mais bela que seja a pintura de um carro, para o painel e para a direo que olhamos quando estamos guiando. O design de informao a sinalizao que torna claros os ambientes e suas divises, facilitando a compreenso. As placas de orientao nas gndolas de um supermercado, como as barras de navegao e cones de websites, so formas de organizar as estruturas de navegao em um ambiente. Elas identificam a lgica implcita na disposio do ambiente fsico (e, se no houver, a criam) e ajudam seu usurio a identificar onde est e para onde quer ir, o que torna sua experincia mais agradvel. No meio impresso os elementos usados para isso so os ttulos, legendas, grficos e fotos que ajudam o leitor a se orientar na pgina. Na web so botes, cones, barras de navegao, mapas do site. Como no h estrutura fixa, esses elementos so fundamentais, e sua posio precisa ser sempre a mesma, seja qual for. Afinal de contas, em um ambiente virtual, o design de informao to fundamental quanto a arquitetura em um prdio: ele que determina as relaes entre os espaos.
6-3: Hipertexto
Voc sabe a diferena entre super e hiper? As duas palavras querem dizer a mesma coisa: exagero, excesso. Uma latim (super) e a outra grego (hiper). Hipertexto quer dizer a mesma coisa que supertexto: um texto enorme, que comunica muito. Mas, ao mesmo tempo, diferente da Encyclopdia Britannica. O hipertexto funciona como uma seqncia de documentos interligados. O internauta que navega em pginas de hipertexto vai acumulando conhecimento at se satisfazer. Se esse encadeamento de textos rene outras mdias (som, fotos, vdeos etc.) o que se tem um documento multimdia com recursos de hipertexto, ou, simplesmente, uma hipermdia. Hipertexto e hipermdia so formas melhores de se acessar a informao que as mdias comuns, lineares. Usando hipertexto, o usurio pode se mover atravs de estruturas de informao no seqencialmente, mas fazendo pulos entre os vrios tipos de dados de que necessita. Com hipermdia, pode-se acessar a informao expressa em uma enorme variedade de formatos. Uma das maiores atraes dessas tecnologias sua capacidade de suportar um mtodo mais natural de se processar informao, pois elas funcionam de uma forma parecida com a mente humana, que no recebe a informao linearmente, mas por associaes de idias. Esse recurso imita o aprendizado humano e no novidade. Uma boa aula uma hipermdia. Notas de rodap ou bibliografia tambm o so: so formas mais arcaicas de dizer ao leitor onde est a informao complementar a respeito do assunto. A novidade do hipertexto que ele s vivel em um sistema que abrigue a mensagem desconectada de seu suporte. Um sistema digital, como as telas de um computador, uma possibilidade. Um tutor grego outra possibilidade. Uma me ou pai pacientes tambm o so. Para dar um exemplo mais palpvel: hipertexto funciona como uma seqncia de pginas interligadas, sem numerao, trazendo informaes complementares a respeito de um assunto. Se o interesse do leitor for superficial, ele pode ser lido em cinco minutos. Se for mais profundo, os textos vo entrando em seqncia at cobrir o assunto por inteiro, partindo para assuntos relacionados ou temas parecidos. Trabalho para um ano de exaustivas pesquisas ou mais. Desde que o leitor se convena a manipular o texto, o computador s um acessrio a mais. Alguns textos msticos tm essa caracterstica. O I Ching um deles. Um dos grandes clssicos da antiguidade, ele vem sendo usado h milhares de anos como orculo e para meditao. Seu sistema de smbolos foi inventado h mais de cinco mil anos e composto de 64 hexagramas, que so combinaes de 6 linhas em dois estados possveis (26), cada uma com um texto grande e seis outros menores, um para cada linha. De uma forma simplificada, o ritual do I Ching consiste em fazer uma pergunta ao orculo, jogar as moedas de forma a obter dois hexagramas, relacion-los entre si e com a experincia pessoal do leitor para chegar a uma resposta. Essa estrutura aberta e o ritual das perguntas e moedas, no mudado nos ltimos trs mil anos, nos permite deixar de ser leitores para nos tornarmos agentes do texto. A combinao de dois hexagramas gera 4096 possveis textos, que, combinados com a pergunta do leitor e sua realidade, resultam em infinitas respostas. O I Ching um livro que no foi feito para ser lido do incio ao final. Se voc tentar l-lo em seqncia, vai chegar a um texto que no faz sentido. Ao mesmo tempo, se o ritual for seguido risca, no h como chegar totalidade do conhecimento e contedo do livro. um livro ilegvel pelos padres convencionais, pois no segue as convenes da leitura passiva. Outro exemplo de texto grande demais para ser lido o Cem Trilhes de Poemas (Cent Mille Milliards de Pomes) escrito por Raymond Queneau em 1961. Este livro pequeno tem 10 sonetos cortados em uma tira para cada linha, formando 140 elementos. O leitor estimulado a combinar aleatoriamente as linhas, gerando 1014 combinaes de sonetos, ou 100 trilhes. Ningum l todas as opes, elas no esto l para serem lidas.
As experincias mais delirantes em papel podem ser feitas com facilidade em sistemas de hipertexto na web. Livros como O Jogo da Amarelinha de Julio Cortzar, cujos captulos podem ser lidos em ordens diferentes, so pr-histria dos links. Livros cheios de referncias como um Finnegans Wake de James Joyce, tambm. E at livros fantsticos como Alice no Pas das Maravilhas de Lewis Carroll so mais fceis de se ambientar em um site. O texto comum, linear, como o conhecemos, apenas um caso especial do hipertexto multi-linear. Caso especial em que a conveno l-lo, palavra a palavra, do incio ao fim. Em outras palavras, o hipertexto um texto tridimensional, e, portanto, no tem comeo nem fim. Sua estrutura o que conseguimos reproduzir de mais parecido com o funcionamento do crebro humano, pois os eventos no acontecem em seqncia, mas simultaneamente. So vrias coisas acontecendo ao mesmo tempo e cabe a seu leitor organiz-las. Um bom exemplo disso acontece quando voc no consegue comear um texto, apesar de ter todas as informaes: na realidade voc est tendo uma enorme dificuldade em colocar toda aquela informao em gavetas de conceitos seqenciais e lineares. Regra rpida para fazer modelos simples de hipertexto:
Escreva pequenos textos, independentes entre si, mas com elementos em comum; Marque todas as palavras de cada texto que possam servir de conexo com os outros; Crie tabelas de conexo, marcando, para cada texto, quais so os textos que levam a ele e quais so os que saem dele; Organize as ligaes, evitando afunilamentos: textos com muitos pontos de entrada ou de sada; e Estruture esses textos em uma hiper-retrica, dando ao visitante uma falsa sensao de controle sobre os links enquanto o leva para o ponto desejado.
6-4: Roteiros
Muitos endereos digitais esto procurando uma forma de roteirizar suas pginas para conseguir alguma espcie de ordem no caos do contedo de um sistema de hipertexto. Essa preocupao fundamental porque muitas vezes a colocao indiscriminada de ligaes de hipertexto em uma mensagem pode desviar o leitor do contedo original. Uma seqncia ordenada de documentos faz com que o visitante se envolva progressivamente, como quem ouve uma histria. Se ela for bem contada, grandes sero as chances de que a escute at o final ou volte para escutar mais. Um bom roteiro deve deixar o visitante livre para saltar entre diversos textos, sem mudar de tema. Deve ser abrangente o suficiente para dar uma iluso de liberdade, sem permitir que se desvie da linha mestra da comunicao. Esse processo delicado, j que impossvel prender um visitante a um website. A visita sempre voluntria e a tentativa de bloquear essa liberdade pode trazer o efeito contrrio: o visitante se vai e no volta, pois se sente tolhido ou entediado. No entanto, possvel manter o leitor interessado no contedo de um hipertexto sem dispersar, empregando os mesmos artifcios utilizados pelos textos mais antigos: persuaso e seduo. Se um sistema de hipertexto no for totalmente claro e objetivo, mas, pelo contrrio, estimular a curiosidade do seu leitor sugerindo que sua explorao poder levar a caminhos surpreendentes; se, em vez de mostrar mapas ele sugerir rotas alternativas para o conhecimento, estimular no leitor um interesse em desvendar o contedo, como um videogame. Esse interesse pode se manifestar em uma experincia de longa durao, em que o visitante consulte diversas pginas, algumas mais de uma vez, ou atravs de repetidas e sucessivas visitas at saciar sua curiosidade. um processo indito, muito diferente do que se faz em mdias convencionais. Na nsia de explicar o mundo digital, de dar referncias palpveis para o leitor de um sistema de hipertexto, muitos sites usam metforas mal-sucedidas do mundo real, outros se apressam em mostrar todo o contedo informativo disponvel desde o primeiro instante em que o visitante entra. No h nada de errado nisso alis, deveria ser regra para endereos puramente tcnicos ou informativos , mas perde-se um pouco do charme da descoberta e explorao, sacrificando parte do poder de seduo que a descoberta de um novo mundo digital poderia proporcionar. Situao to frustrante quanto algum que nos conte o final de um filme ou livro que estamos comeando a experimentar. So as novas formas de contar histrias que podem transformar o hipertexto em uma experincia interessante. Para mostrar como bom inovar em roteiro, vamos ao cinema: o que faz um Quentin Tarantino de to legal assim? Seus folhetins sangrentos com atores canastres que usam palavres como vrgula entre as palavras? Certamente no. Isso passaria despercebido como mais um filme do Chuck Norris ou algo do gnero. Mas, ao picotar a histria e colocar o fim antes do meio, ele mostrou que, mesmo no cinema, uma narrativa no precisava ter aquela estrutura linear, caretinha. Ele no foi o primeiro, nem ser o mais importante, s hoje o mais popular (isso j era feito na nouvelle vague, mas Resnais e Goddard so muito chatos). O que importante que essas inovaes de roteiro respeitam as limitaes do meio: ningum est falando em cinema com cheiro, nem tridimensional, nem 180. o bom e velho telo no auditrio. Imagine uma histria, dessas que acontecem todos os dias, como um caso amoroso ou um assassinato. A estrutura simples: sujeito vai l e d um tiro no moo ou um beijo na moa. Finito. Ou pode ser que o sujeito d um tiro no moo por causa da moa, j melhor. Ou o sujeito pode dar um beijo na moa s pra matar o moo, e assim por diante. Quem o sujeito? Quem o moo? Quem a moa? Ela casada? Com o moo? Ou com o sujeito? Mas que baita confuso! E isso porque no se falou no espao em que eles vivem, roupas, hbitos alimentares etc. A resposta a cada uma dessas perguntas vai ajudando a construir um espao virtual, no melhor estilo da colcha de retalhos. Se o autor for bom, podemos ter um Casablanca, um A Sangue Frio ou mesmo uma pera como Carmen. Mesmo as histrias mais simples que voc conta no dia a dia
tambm tm suas referncias, seu histrico e o ponto de vista de cada personagem. Em um espao limitado folha de papel ou fita de vdeo, no h como saber todos os pontos de vista, ou mesmo todos os histricos, e interferir na histria fico. Transfira a mesma histria de assassinato para um espao virtual, como um videogame ou um RPG: antes de conhecer a trama, os jogadores tentam descobrir o mximo de cada personagem, suas armas e temperamento. Da entram no jogo, tentando interferir nos destinos dos seus personagens. Podem ver um mesmo fato sob diversas ticas e propor solues inusitadas. Voc pode at achar bobo, mas uma possibilidade literria ainda inexplorada pelos Guimares Rosa ou James Joyce do sculo XXI. Navegar impreciso Quando uma pessoa est procurando informao na WWW, dizemos ela est navegando ou surfando na internet. Esses conceitos podem ser poticos ou romnticos, talvez at ousados, mas so errados. O processo est mais prximo de saltando ou pescando: para haver uma navegao entre dois pontos necessrio haver o mar, o espao, uma estrada, um elemento intermedirio entre eles. Quando um computador brasileiro acessa um endereo internet nos Estados Unidos h uma navegao de verdade, realizada pelos impulsos eletrnicos, mas ns no temos a menor conscincia dela. Se, com um clic do mouse, deixamos o Brasil e vamos parar na China e de l para a Frana, no existe navegao para o usurio. Podem at existir rotas compostas por saltos, mas no h espao intermedirio. Por esses motivos o processo tambm pode ser comparado a uma pescaria: o usurio do sistema procura uma informao, captura-a em algum servidor e a traz para seu computador. No existe preocupao com navegao ou com a ordem e intercalao de pginas em design grfico, pois todos sabem como navegar atravs de um livro ou revista s virar as pginas. O mesmo vale para sistemas lineares / passivos, como a TV ou rdio, que o receptor no precisa fazer nada. Na comunicao digital, a estrutura das pginas e a forma de l-las varia conforme o caso, por isso fundamental guiar o leitor. Tipos de roteiros Para se fazer um texto comum, linear e unidimensional como este que voc est lendo, preciso organizar as palavras em frases, pargrafos e assim por diante, tomando todo o cuidado para que sua concatenao de idias no disperse o leitor, mas, ao contrrio, cative-o cada vez mais. Como um hipertexto tem sempre um grupo de textos, sua concatenao e seus pontos de ligao so fundamentais. Existem roteiros lineares. Sua estrutura tem uma seqncia obrigatria. Esse tipo de estruturao costuma ter setas para avanar, voltar ou ir para a home page, que est mais para um ndice que para uma tela de entrada. Um degrau acima esto os roteiros hierrquicos, que parecem organogramas. O visitante empurrado para nveis hierrquicos cada vez mais especficos at chegar a uma informao desejada, como se fazia nos bancos de dados antigos. Para consultar uma pgina relacionada, necessrio fazer o caminho de volta por vrias telas. Eles so parecidos com os antigos livros de geografia da stima srie, em que o clima da regio Sudeste e o da Centro-oeste esto separados por 4 meses e mais de 30 pginas, apesar de serem similares e inter-relacionados. Essa estruturao costuma ter, em cada tela, botes de volta e home page. Existem roteiros conectados, que respeitam a forma de pensar do visitante e aglutinam a informao por similaridade. Assim, algum interessado em marketing pode saber tambm um pouco sobre criao, mesmo que nunca procurasse por esse tipo de informao. Esses roteiros costumam fazer um uso inteligente dos links e estruturas de hipertexto. Nos roteiros verdadeiramente interativos a participao de um internauta no s por e-mail e no passiva. A organizao das telas feita de forma dinmica de acordo com o interesse do visitante.
Ainda mais interativos so roteiros multidimensionais, em que o visitante mergulha nos diversos nveis de um site, que so mveis e intercambiveis. Em um site desses impossvel medir seu nmero de pginas ou estrutura, que parece uma Mandala ou um cubo Rubik.
Uma das idias mais desenvolvidas de metacontedo substitui a atual metfora da desktop nos computadores pessoais por um visualizador tridimensional que permita ao usurio o vo atravs de um espao povoado por representaes visuais de informao. Pode-se voar em todas as direes, em diversas velocidades. Em princpio s se pode ver as principais bolhas no espao, mas, ao se mover em direo a elas, seu contedo se torna grande o suficiente para ser identificado. Esses itens podem ser outras bolhas ou elementos de contedo. Quando se v um item que se quer examinar, basta clicar nele. O usurio que voa dentro de um espao multidimensional encontra diferentes objetos inteligentes e no se perde, pois o ambiente proporciona o contexto. Cabe ao visitante descobrir, entre as mltiplas conexes oferecidas, quais so as que valem a pena e em que nvel de profundidade. Uma representao como essa pode parecer ainda mais confusa e delirante que a internet, mas acredita-se que essa ferramenta traga, se no ordem, pelo menos uma maior compreenso dos vrios bancos de dados conectados. Poucos imaginariam no comeo da dcada de 80 que o mouse e o sistema de pastas, cones e latas de lixo se tornaria to popular. Por mais natural que ele seja, bom lembrar que no existe nenhum equivalente na natureza a janelas com contedo ou barras de deslocamento.
construo de melhor relacionamento com o pblico-alvo abrir um canal de contato direto com o consumidor, 24 horas por dia; estmulo da resposta do usurio; criao de grupos de consumidores; menores custos na distribuio de material promocional/explicativo; divulgao de informaes atualizadas; construo de banco de dados para comunicao direta com o pblico alvo; pesquisas e oportunidades de negcios; aumento da distribuio internacional e penetrao em mercados estrangeiros; e-commerce, ou venda de produtos e servios; menores custos no atendimento ao consumidor; suporte aos esforos de propaganda e marketing.
Essas vantagens devem compensar o esforo e investimento para a construo de um site eficiente e atualizado, os custos de propaganda para a divulgao da sua existncia e o treinamento de funcionrios. Ou seja, entrar na web um processo que envolve a empresa inteira. Ele deve ser crescente e contnuo. Por isso esquea essa histria de atualizado em 1/4/97, pois um website no estanque, esttico, limitado. No existe primeira edio ou nada parecido. Ele deve ser avaliado freqentemente, reestruturado constantemente e modificado sempre que possvel. assim que funcionam as empresas, assim que evoluem as pessoas, isso que se quis dizer ao se definir a internet como algo gil e pulsante. Acima de tudo importante saber se o possvel consumidor usurio da internet e, em caso positivo, que servios ele procura l. Um endereo digital bem feito e divulgado pela mdia pode servir como: Fonte de informao - As pessoas acessam a internet em busca de informao. Um site o melhor lugar para colocar um catlogo de produtos e servios.
Canal institucional - Outro uso excelente para a rede o de relaes pblicas. Ao contrrio da maioria dos veculos de comunicao, um site pode divulgar uma srie de informaes institucionais sem chatear o leitor. O e-mail pode ser um excelente canal de comunicao com a empresa e seu Atendimento ao Consumidor. Fonte de pesquisa - possvel saber os hbitos e preferncias do consumidor sem precisar de entrevistadores nem de uma estrutura cara e complicada. Um website pode servir como excelente fonte de dados. Promoes - Visitantes de um site, se forem bem direcionados, so consumidores potenciais.
o consumidor final - buscando informaes de produtos, revendas e promoes; um nutricionista ou profissional da rea mdica procura de informaes nutricionais especficas; e um investidor corporativo - pesquisando dados, faturamento, desempenho etc.
Cada um desses pblicos tem um interesse diferente na marca e vai em busca de informaes especficas. Ao encontrar dados irrelevantes, ele desiste do site. Por que no criar, ento, trs endereos diferentes e objetivos, com caractersticas de linguagem e design prprios, especficos para cada pblico-alvo? A experincia est fazendo com que muitas empresas descubram o caminho da segmentao. A gigantesca Microsoft no conseguiria reunir toda a informao a respeito de seus produtos e servios em um nico endereo, e mesmo seu portal de informaes e servios (MSN) se liga a outros sites seus, que vo da escolha de veculos (Carpoint) orientao de viagens (Expedia). Alguns dos tipos de websites comerciais mais populares:
Institucionais - divulgam a empresa, faturamento, histrico e abrangncia mundial. Se concentram mais em dados institucionais que em produtos ou servios. So equivalentes digitais dos relatrios anuais de empresas. Produtos - concentram a comunicao em produtos, caractersticas e benefcios. So voltados exclusivamente para o pblico-alvo. Equivalentes a anncios e catlogos. Profissionais - para a divulgao de servios prestados por autnomos. Equivalentes a folhetos. Servios - endereos de consultoria e venda de servios especficos. Muitos concentram um grande volume de informao, para mostrar a expertise e evidenciar a necessidade da contratao de um profissional. Equivalentes a apresentaes e palestras. Entretenimento - jogos e brincadeiras, normalmente utilizados para a lanamentos de produtos. Equivalentes a revistas de passatempos e gincanas. Promocionais - sites curtos com promoes, tambm chamados de hot sites: concentram a informao em poucas telas para chamar a ateno do visitante sem desvi-lo do curso original da sua leitura. Equivalentes a promoes e campanhas de varejo. Educativos - endereos digitais que visam transmitir muitas informaes para educar o pblico-alvo. Normalmente utilizados por instituies e associaes. Equivalentes a newsletters. Comunidades - grupos de discusso sobre temas especficos, formando espaos maleveis, controlados pelos prprios usurios. Equivalentes a espaos comunitrios patrocinados.
Se vendssemos pizzas como produzimos sites Um possvel cliente liga pra pedir uma pizza. Do que no se sabe, ele s a quer porque todo mundo que ele conhece tem uma. E avisa que pediu a mesma pizza pra 5 outras pizzarias e s pagar a que gostar mais; No meio do trabalho, ele pede pra voc mandar uma prvia de como ela est para sua aprovao. Depois de receber a pr-pizza, pede uma alteraozinha, substituindo a mussarela amarela por verde, porque ele gosta mais de verde. Isso faz com que voc tenha de jogar a pizza antiga fora e produzir uma nova que, alm de dar mais trabalho, ficar de gosto duvidoso; O cliente pede 500 pizzas a serem feitas em 15 minutos, pois ele est com uma festa para comear e s lembrou de ligar agora. Voc destaca seus melhores pizzaiolos pra atender a esse pedido urgente e deixa as pizzas dos outros de lado, o que faz com que todos eles reclamem do atraso. Aps produzir quase todas as pizzas, ele liga avisando que no precisa mais de pressa porque errou o prazo. Na verdade, voc tinha 4 horas; Outro pede uma pizza incrementada e no entende como se pode cobrar to caro por ela, sendo que o boteco da esquina faz por bem menos. Ou diz que o sobrinho faz melhor por um dcimo do preo que voc pede (ele usa uma pizza semi-pronta comprada no Carrefour); O cliente pede todos os ingredientes do seu estoque, pois acha que isso far a pizza mais atrativa. Mesmo assim voc faz um bom trabalho, mas ele reclama que no tem garfo e faca em casa, por isso no consegue com-la. Muitas marcas esto sofrendo uma transformao nos ltimos tempos: de imagens estticas, slidas e estveis propagadas pela mdia de massa, elas esto se tornando cada vez mais ativas e participantes no dia-a-dia de seus consumidores e de suas comunidades. E a comunicao digital assume um papel importante nesse processo. Em um ambiente de multiplicidade, a presena que uma delas faz junto a seu pblico consumidor crucial para sua afirmao. Em um mercado interativo, ela deve conversar com o consumidor. Por isso elas esto mudando de estticas para interativas e depois para colaborativas: Estticas - a marca por si s. Sua fora um residual de seu histrico e campanhas de mdia de massa. Sua abrangncia e longevidade so limitadas. Interativas - a marca escuta seus consumidores (atravs de telefones de Atendimento ao Consumidor, cartas e e-mail) e procura esclarecer dvidas, tomar atitudes positivas e at aceitar sugestes para a alterao de seus produtos. Esse constante feedback do mercado faz com que seus produtos estejam cada vez mais adequados ao pblico e que novas linhas surjam para mercados especficos. Colaborativas (ou participativas) - a marca passa a assumir a liderana nas aes junto a seu pblico consumidor, promovendo aes educativas / comunitrias que ampliem a compreenso e a imagem de marca. Nesse caso, o papel da comunicao digital crucial. Ela pode criar relaes personalizadas e consensuais. Isso no significa perguntar o nome do visitante e reproduzi-lo nas pginas de um endereo internet, mas descobrir seus anseios e tentar realiz-los. medida que uma empresa escuta o consumidor, informa e respeita seus valores, estimulando-o, torna-se cada vez mais fcil estabelecer uma relao de confiana, fidelidade e respeito. O que torna um veculo vivel, seja ele um CD-ROM ou a xilogravura do Cordel de Dona Nen, um patrocnio. Para uma entidade ou empresa patrocinar um veculo necessrio que ele d retorno,
ou seja, atinja uma parcela significativa do pblico-alvo e divulgue sua mensagem para pessoas antes desconhecidas. Da esse contato gera dinheiro, que financia mais veculos e assim por diante. Convergncia das mdias Muito se fala na convergncia das mdias, uma espcie de amlgama que combinaria rdio, TV, impressos, internet etc graas s tecnologias digitais. Apesar do ar futurista, essa situao j acontece hoje em dia, em vrios ambientes. Veja os perfis profissionais no final do livro: os especialistas esto cada vez mais multidisciplinares. Do jeito que as coisas andam, daqui a pouco morreremos de vergonha das estruturas arcaicas em que criao criava, planejamento planejava, mdia veiculava e internet bom, internet usava cabelos coloridos, roupas inacreditveis e piercings em uma lngua que falava de termos esquisitos, de nmeros incompreensveis e inauditveis, mas com um faturamentozinho desprezvel. Mas convergncia das mdias muito mais que um nome bonito para se exibir em palestras e convenes. At os gerentes de marketing mais simplrios dos clientes esto percebendo que, sorrateiramente, as novas tecnologias de comunicao permitem cada vez mais que as mdias se misturem e se potencializem, ganhando uma enorme fora criativa e deixando de ser s as veiculadoras de uma idia. No que isso nunca tenha sido testado: voc certamente j viu outdoors chamando para sites, anncios com CD-ROM encartados e programas de TV com e-mails, mas eram excees ou alegorias, nada corriqueiro. Esta situao est mudando mais rpido que se aprenda a pronunciar click-trough rate, e, se j foi romntico o tempo em que uma bela foto, um bom ttulo e um texto cheio de sacadinhas bem-humoradas conseguiam fazer o consumidor se comover, essa poca j era: de carros colados em outdoors a velcro em revistas, as fronteiras da criao para a mdia esto cada vez menores. Em comunicao digital, no adianta criar apenas uma mensagem legal para ser usada em um veculo. Muitas vezes necessrio criar, em um site, o prprio veculo. Pois se ainda no possvel saber exatamente quem est visitando um site, fcil identificar de onde vem, quantas vezes j o visitou, quais as horas e dias em que o trfego mais intenso, quais as sees mais visitadas, browsers e verses mais utilizadas e um mundo de informaes que a mdia convencional incapaz de gerar. A prxima onda da publicidade na internet vai ser capaz de identificar um indivduo determinado dentro de um pblico selecionado e ating-lo em cheio. Algo como: vem a um novo carro com um enorme espao interno. Ideal para voc, que divorciado, tem trs filhos e casa na praia. Perceba que essa estratgia funciona ao contrrio das inconvenientes malas-diretas alis, muito mais para malas que pra diretas que o chamam pelo nome e erram na mosca ao oferecer um curso de ingls para quem morou no Reino Unido ou uma escola primria para quem no tem filhos nem pensa em t-los.
Linha telefnica - por mais que as formas de conexo por banda larga sejam realidade, sempre vale lembrar que, na maioria dos casos, o modem ainda est conectado a um fio telefnico e a conta do final do ms pode ser uma surpresa bastante desagradvel. Provedor de acessos - a no ser que o visitante esteja conectado a algum servidor pblico (bibliotecas ou universidades) ou em seu local de trabalho (diversas pesquisas afirmam que mais da metade de quem acessa no trabalho ou escola tambm a utiliza em casa) estar pagando uma taxa de, em mdia, R$ 2,00 por hora de acesso (usurios de banda larga ou de conexo por celular, muito mais). O acesso grtis uma idia muito simptica e popular, mas seu modelo comercial ainda no se mostrou sustentvel. Indisponibilidade - na maioria dos casos, a partir do instante em que o internauta se conecta rede, ele se desconecta de qualquer contato telefnico. Essa indisponibilidade tem seu custo, que pode ser refletido em oportunidades perdidas de lazer ou trabalho.
A todo esse custo internet podem-se somar os custos de energia eltrica, desgaste de equipamento e transtornos sade (sedentarismo, tendinites e outros males do uso de computadores) e voc comea a perceber porque as pessoas no perdem mais horas surfando sem destino, muito pelo contrrio: cada vez mais, o que acontece conecta a web - acessa o site - pega a informao (extrato bancrio, resultado de jogo, situao do trnsito, endereo etc) - desconecta. Por isso a qualidade, no a quantidade o que vale. A longo prazo, um site se mede e se sustenta pelo benefcio que proporciona. Em vez de fazer qualquer coisa para aumentar a visitao a seu site, melhor solidificar sua relao com os visitantes mais leais e, atravs deles, atrair outros tambm leais, fazendo-os voltar diversas vezes. Para desespero dos anunciantes, mais e mais consumidores tomam conscincia de que internet no de graa e ficam mais seletivos quanto ao teor da mensagem divulgada (e ao tempo que leva para ser transmitida). Um dado difcil de avaliar o nmero de pessoas que desiste de um servio online porque o custo no compensa o benefcio. A Rede Globo, em seu primeiro website, colocava uma narrao de seu locutor Galvo Bueno falando Globo e voc. Tudo a ver. At na internet. que tinha 250kbytes de tamanho e levava, na poca, aproximadamente oito minutos para poder ser ouvido. Realmente, nada a ver. Estudo de Caso: Coca Night Para ampliar mercado e no ficar associada ao segmento de dietticos, a Coca-Cola optou por um reposicionamento de seu produto light no mercado, buscando novos consumidores noite, em ocasies festivas. Esse novo posicionamento se chamaria Coca-Cola Light/Night e seria marcado por um conjunto de aes de promoo, propaganda, assessoria de imprensa e amostragem do produto em bares e restaurantes da moda. Nesse cenrio a internet seria complementar s aes de massa. Propus direo da empresa que experimentasse colocar a internet no centro das atenes todas as aes promocionais e de comunicao ocorreriam em torno do site e de seu contedo, que mostraria o melhor da noite em oito cidades selecionadas. Eles gostaram da idia, mas levantaram os seguintes problemas:
Antes mesmo de responder a essas perguntas, chegamos a outros pontos importantes: 1. O negcio do cliente no produzir notcia; 2. Produzir um banco de dados desse tamanho seria caro e demorado demais; 3. Esse banco de dados no seria consistente, pois nunca teria sido testado; 4. Mesmo que fosse excelente, enfrentaria resistncia do consumidor; e 5. Aqui entre ns: voc confiaria em uma dica de uma empresa de refrigerantes? Claro que no, pois difcil acreditar que seja completamente isenta. Percebi que o importante para a empreitada era oferecer acesso informao de qualidade com patrocnio exclusivo da Coca-Cola e isso no significava necessariamente ter que produzir a tal informao. Da corremos atrs de parcerias. Precisvamos de um guia de entretenimento e noite que tivesse um banco de dados confivel e consistente e seu equivalente em papel, pois nosso pblico ia muito alm do internauta tpico. Em So Paulo achamos uns jornais e a Revista VejaSP, no Rio, jornais e a VejaRio. Nas outras cidades tambm. No restou dvida: nosso veculo ideal (alis, o nico possvel) tinha que ser a revista Veja, edio local. Da surgiu uma idia com cara de Misso Impossvel: criar um veculo. Eu estava morrendo de medo. Na minha cabea, jornalistas seriam puristas demais com relao a seus filhos editoriais, no permitindo a opinio de ningum. Medo besta, mas fazer o qu? No foi na melhor das esperanas que fiz dois layouts para exemplificar a idia e sugerir revista Veja que criasse uma nova seo Veja Noite com o patrocnio exclusivo da Coca-Cola Light. A idia, estava mais para mecenato que para patrocnio: a Veja teria liberdade total para criar o que quisesse em sua seo Noite, contanto que mantivesse a lista completa de bares e restaurantes em um banco de dados e fechasse o patrocnio para a Coca Light. Para minha enorme surpresa o editorchefe adorou o projeto e aprovou-o integralmente. Dei uns 15 gritos depois que deixei o prdio da Editora Abril, pois ainda no acreditava: estvamos inventando um novo tipo de mdia, muito mais eficiente que o Banner, pois no demandava nenhuma consulta. Os acessos ao site eram mais significativos que qualquer taxa de clicktrough e elevavam um produto categoria de programa, no estilo do velho Reprter Esso. O site - quando samos a noite, fazemos duas perguntas: 1. O que fazer?; e 2. Com quem? Conforme a idade, estado civil ou grau de relacionamento, talvez a segunda pergunta seja desnecessria, mas a primeira no. Foi pensando nelas que estruturamos o site. O Que Fazer - acesso a todas as informaes do banco de dados de bares e restaurantes das Vejinhas locais. Essa seo tinha que ser diferente do portal para justificar a visita do usurio. Para isso, criamos um questionrio de intenes, ajudando-o a encontrar, no meio das centenas de opes disponveis, algo que combinasse com ele e suas intenes para a noite. Com as opes selecionadas, o site desenvolvido pela produtora ZeroUm procura os estabelecimentos disponveis e mostra as respostas. s clicar em uma das opes que se chega resenha do restaurante, fornecida pela Veja. Com Quem nessa seo digitalizamos o torpedo, o bilhetinho/paquera to comum nos bares. S que com uma diferena: em vez de ver a aparncia da pessoa e procurar conhec-la melhor,
fazemos o contrrio: o usurio se cadastra e participa da atividade com um apelido, d uma srie de dados a seu respeito, o que gosta de fazer, que tipo de msica ouve, hbitos etc. Da pode procurar sua alma gmea (ou outra no to gmea assim) sem ver uma nica foto, mandar e receber torpedos como o faria nos sistemas de webmail. Ao se criar um produto com patrocnio exclusivo, temos uma situao contrria dos banners, pois para o:
Consumidor a ao cria um novo servio e canal de contedo; Empresa a ao aumenta e qualifica a visitao e audincia, ajudando na imagem de marca; e Veculo a ao patrocina a criao de servios e faz com que novos produtos j nasam pagos, ampliando o leque de servios em operaes rentveis e de qualidade.
Forma vs. contedo Pense nos cinco sites que voc acha os mais bonitos. Agora pense nos cinco sites que voc mais visita. Pois , por que nunca so os mesmos? Seria o design na internet uma firula nessa terra de CNNs e Yahoos e salas de chat? Existem sites que visitamos por causa do contedo escrito, expresso, direto, e so altamente significativos. Bonitos ou feios, seriam visitados de qualquer jeito. E existem aqueles outros aos quais a gente vai s porque so lindos de morrer, e isso tambm contedo. Se no fosse assim, nenhum de ns ouviria msica, pois ela no tem finalidade prtica. Mas se voc tivesse que escolher entre perder uma perna ou nunca mais ouvir msica, garanto que a escolha no seria assim to fcil. A disputa entre forma e contedo normalmente s acontece quando no existe uma clara definio da sua funo, objetivo e pblico, e isso muito mais comum do que se imagina. Na internet vemos sites que se propem a fazer praticamente tudo, com resultados desastrosos: esforo desperdiado, como uma chicotada no mar. Um website de sucesso normalmente tem design e contedo em perfeita harmonia. No se prope a abraar o mundo ou ser o melhor em todas as categorias. A comunidade de um Geocities no mostra notcias, o Hotmail no tem chat, a Amazon no d e-mail de graa. E no so menores por causa disso, muito pelo contrrio. Seu design reflete claramente seu contedo. Um website deve ter conceito e foco, ou seja, deve ter claro o que se prope a fazer e, mais do que isso, o que se prope a no fazer. Surgiu uma nova oportunidade, faa um novo site, no tente aglutinar tenistas e jogadores de futebol dentro da categoria esportistas, mesmo que todo o mercado, todos os seus concorrentes e at os principais sites dos Estados Unidos o estiverem fazendo. No pense na forma com que seus amigos tratam as namoradas deles ou se o seu vizinho recicla lixo: pense no seu pblico, foque sua ateno no que ele quer e no d ouvidos aos outros. Nesse mundo digital e impessoal, mostre para ele que nico no uma palavra vazia que ele agradecer.
7-5: Do que as pessoas mais gostam (e o que elas odeiam) nos sites
A web demais. Tem sempre uma novidade, muito legal. Mais do que uma tecnologia, ela parece um organismo vivo, com imagens bonitas, coisas teis e grandes idias. legal passear por sites desconhecidos, descobrindo sua estrutura. Tudo o que a gente precisa est l. As relaes de espao e tempo podem ser alteradas, as possibilidades so praticamente infinitas Ao mesmo tempo, a web um saco: lenta, cheia de lixo, demora um tempo para achar algo que preste, trava o computador, tem contedo desatualizado Voc j parou para pensar o que mais curte na rede? E o que mais odeia? Faa esse exerccio e vai ficar muito mais fcil fazer um site. Provavelmente algumas das suas respostas voc ver nas pginas seguintes:
Possibilidades de design - alguns sites so lindos. Outros inovadores. Neles, cada imagem cuidada, o projeto grfico coerente, uniforme, um espetculo. Grandes idias e-commerce, ICQ, MP3, reservas de passagens, home banking, RPG, romances interativos, comunidades virtuais, webmail, salas de chat, sexo virtual a web parece o chapu de idias do professor Pardal: a cada instante um novo recurso, produto ou servio. Agilidade de informao de um texto do Ezra Pound a uma foto de um trombone, d para se achar de tudo na web. Mesmo que seja difcil e tome tempo, ainda muito mais fcil que achar a mesma informao sem ela. Personalizao os websites esto cada dia mais espertos: eles sabem quem voc , do que gosta, o que faz e como faz. E fazem isso para dar dicas, sugestes e recomendaes. Funcionam como aquele vendedor bacana que sabe seu estilo e s d bola dentro. Servios de pedir uma pizza a mandar flores, a web pode ser um grande auxiliar para um sbado noite.
Pois . Com todos esses motivos, era para as pessoas estarem passeando cada vez mais pelos sites, mas o que acontece exatamente o oposto. Tanto que, h algum tempo, as listas de hot links eram muito populares e hoje ningum fala mais nelas. O desnimo com o contedo da WWW cada vez mais comum, e as razes so:
Lentido quantas vezes voc teve que ficar esperando um tempo para ter acesso informao de um site? Imagens pesadas demais, banners demais, tecnologias demais, Flash demais ou at texto demais fazem com que se tenha menor velocidade, menos nmero de visitantes, menor resposta. H coisa mais irritante que aquele maldito Aguarde, carregando na entrada de um site? Excesso de bugigangas inteis existem tecnologias que trabalham contra o usurio: so aquelas que tornam uma pgina mais lerda ou dependem de um plug-in para serem carregadas e esse plug-in no acrescenta nada ao contedo: s uma firula de design. Quantas pginas feitas em Flash poderiam ser feitas em HTML e JavaScript? Se assim, porque fazer com que o usurio baixe um plug-in e espere um tempo para carregar o site s para ver uma letrinha mais bonitinha? Ou um desenho animado? Coisas que piscam e pulam certos websites parecem vidros traseiros de Kombis, de tantos badulaques e apetrechos pulando e piscando nas suas telas. So layers em DHTML, GIF animados, sons e outros trecos em Java e Javascript, janelas pop-up etc. Ser que no se percebe o quanto eles dificultam a leitura e incomodam? Informao escondida a web foi feita para facilitar o acesso das pessoas informao. A no ser que seu objetivo seja fazer com que o visitante se perca dentro do mundo de
informao que voc est mostrando (o que no muito difcil, considerando que no d para se saber o real tamanho de um site) vale sempre a pena colocar guias de orientao: mapas, barras de navegao, menus, mecanismos de busca e assim por diante.
Navegao inconsistente quer coisa pior que estar noite, em um bairro desconhecido e perceber que se est andando em crculos? Pois , assim que alguns dos sites nos deixam quando esto cheios de links quebrados, estruturas confusas e muitos cliques at chegar informao desejada. Design e layout ruins, letras voadoras ou que mudam de forma bom, deixa para l. Texto inadequado jargo, termos tcnicos, excesso de intimidade e o pior erros de portugus. Falta de cuidados com os detalhes imagens escuras demais, fundos mal recortados, legibilidade ruim, tamanho ou cor de link inconsistente, imagens ou documentos inexistentes so coisas to deplorveis quanto um cadaro desamarrado. E muitas vezes fazem com que seu layout tome um tombo equivalente. Design prejudicando o contedo muito cuidado com o design e nenhum com a estrutura, navegao ou performance o equivalente digital daquelas pessoas bonitas demais que ficam se olhando no espelho o tempo todo. Qual a imagem que fazemos delas? Ora, bonitinha, mas ordinria Websites em construo / desatualizados todos os sites de toda a internet esto e estaro sempre em eterna (re)construo. Se no h motivos para coloc-lo no ar, ento no ponha. E no conte para ningum quando o atualizou pela ltima vez. Alguns desses sites, pelas datas de sua ltima atualizao, parecem galpes abandonados.
deve ter as referncias de quem o consulta, no de quem o faz. Correndo velocidade da luz sem sair do lugar, nos agarramos s categorias, nem sempre tendo o cuidado de examin-las. Elas so nossas placas de orientao em uma paisagem confusa, gastas de to velhas e usadas. Reflexos de controle, elas nos reafirmam que h um tempo e um lugar para tudo. Declarando o que certo e o que errado, elas reforam esteretipos, murmurando a falsa humildade do senso comum, que nos faz ter um ar enjoado de conoisseurs nostlgicos de tempos que nunca existiram. As categorias so sistemas fceis, confortveis. Use-as mas duvide delas. Elas so as regras do jogo, mas talvez no mais do que est sendo jogado. Clement Mok, um dos maiores arquitetos de informao dos Estados Unidos, divide o processo de produo de um sistema de comunicao digital em quatro fases: definio, conceito, criao e implementao. Definio: coleta e anlise dos dados disponveis, identificao de objetivos e sua anlise seguindo parmetros prticos, oramento e prazo. A abrangncia e profundidade de um projeto so definidas nesta fase. Conceito: fase de avaliao do contedo e estruturao da informao. Definio dos dados relevantes, prioridades e interligaes. a fase do planejamento que define em que parte do projeto ficaro as informaes e que meios sero utilizados (som, fotografias, ilustraes, diagramas, texto, vdeos) para divulg-la. o momento de construo de modelos e prottipos, para checar sua viabilidade. Criao: design e finalizao da interface. Aglutinao das diversas mdias e concatenao das partes do projeto definido nas fases anteriores. O projeto comea a tomar forma e perde sua caracterstica mecnica, ganhando uma estrutura mais criativa e visualmente rica. Implementao: sntese das idias e atividades dos processos anteriores; programao e testes. a poca da reavaliao do design e sua preparao final. Roger Black, outro grande designer, usa outras quatro fases: instrues, pginas-teste, prottipo e lanamento. Instrues: descrio da abrangncia do trabalho, tarefas a serem executadas e seus responsveis. Definio de um mapa do endereo digital e levantamento de todos os recursos necessrios para a sua produo. O cliente mostra seus objetivos e necessidades, o estdio faz o planejamento estratgico e engenharia. Pginas-teste: diferentes formas de abordagem de um produto digital, em diferentes estilos. Do uma idia geral do que poder ser o produto final. O cliente opina e refina o contedo e o estdio entra com o design e marketing. Prottipo: desenho final da interface, testes, programao e aprovao pelo cliente. Implementao: assim que o prottipo estiver revisado e aprovado hora do lanamento. Para isso, necessria a programao do contedo, levantamento e adequao de todas as mdias, documentao e preparao de estilos que possam ser seguidos pela equipe de atualizao. iD5: um plano de negcios online A consultoria iXL, como a maioria das empresas do gnero, tem uma metodologia usada para a anlise de planos estratgicos de empresas que pretendam montar uma operao online. Apesar de mais focada no planejamento que no design, ela interessante porque integra produtos ou servios online a seu mercado e concorrncia. Chamada de iD5, essa metodologia tem cinco fases consecutivas: 1. Estratgia de negcios - reconhecimento do ambiente; levantamento dos objetivos e recursos iniciais; anlise do planejamento estratgico, nicho de mercado e concorrncia; mapeamento de oportunidades. Com esses dados em mos desenvolve-se uma estratgia para atingir o
consumidor e definine-se a direo que a empresa tomar. A partir da o plano de implementao e suas prioridades so traados, reunindo as reas envolvidas; 2. Planejamento de solues - conhecimento adquirido, define-se o modelo operacional, funes e necessidades. Monta-se o projeto grfico inicial, mapas, modelos lgicos de dados, arquitetura do sistema e plano de estruturao; 3. Detalhamento - seguindo as diretrizes criativas definidas na fase anterior, nessa fase que se desenvolvem todos os elementos necessrios para o produto completo: mapas detalhados, design estrutural, criao de todas as interfaces e pontos de interatividade, preparao dos modelos de dados para gerao e atualizao de pginas e sua integrao com sistemas preexistentes de informtica. A identificao problemas ou gargalos estruturais ocorre aqui. 4. Desenvolvimento - com os elementos preparados, est tudo pronto para a programao, estruturao de servidores e sua conexo, criao dos bancos de dados, testes de funcionalidade e usabilidade; e 5. Lanamento - ajustes finais no projeto, preparao dos elementos, campanhas de relaes pblicas e propaganda e acompanhamento de seu desenvolvimento. A metodologia que uso Por ter trabalhado com diversas equipes de um grande nmero de empresas, no costumo impor minha forma de pensar a nenhum grupo de trabalho. Muito pelo contrrio, prefiro absorver elementos da cultura de cada cliente para montar seu site de uma forma bastante personalizada. Existe uma srie de etapas que sigo, mais baseado em bom senso que em qualquer frmula heurstica. Elas so doze: 1. Definio das necessidades e objetivos da empresa em um ambiente digital (por que estar l?); 2. Desenvolvimento do conceito (comercial, criativo, tcnico) e seus objetivos; 3. Especificaes, planejamento e cronograma; 4. Organizao dos grupos de informao e seu fluxo, design estrutural; 5. Design, texto e direo de criao; 6. Produo de contedo; 7. Integrao de contedo; 8. Programao e integrao de software; 9. Testes e controle de qualidade; 10. Lanamento e marketing; 11. Manuteno; e 12. Acompanhamento do usurio. Essas etapas so feitas individualmente mas, no correr do processo, muitas delas acabam se acumulando, invertendo ou simplesmente englobadas por outras. Consideramos, para o processo como um todo, quatro grandes fases: Lpis (definio e estrutura - 1 a 4); Photoshop (design e produo visual - 5 a 7); Cdigo (programao e testes - 8 e 9); e Manuteno (lanamento, atualizao e suporte - 10 a 12). Para cada fase bom contar com profissionais ou equipes especializadas. Antes de comear, reno os profissionais envolvidos (todos os que consigo, o que nunca passou de 70% da equipe) e discutimos o projeto integralmente. Acertadas as diferenas de viso e compreenso, as equipes trocam idias medida que realizam as tarefas at que o projeto esteja finalizado.
Nas etapas 1, 4, 6 e 8 fundamental a presena de um profissional multidisciplinar (como um Arquiteto de Informao, Diretor de Criao ou Coordenador de Projeto) para que o material final saia uniforme, sem emendas ou diferenas de filosofia. Como voc pode ver, cada profissional tem metodologia e filosofia diferentes, mas todos se baseiam em um conceito slido e um planejamento seguido risca para que o produto final saia consistente, eficiente, funcional e muito mais do que simplesmente bonitinho.
Uma velha piada em estdios diz que voc leva 90% do tempo para fazer 90% das tarefas e outros 90% (ou seja o mesmo nmero de horas) para fazer os 10% finais, tempo esse gasto em finais de semana, noites viradas e pizza. Isso acontece porque ns simplesmente no sabemos medir tempo com preciso e porque todo processo cerebral no-mecnico no pode ser sistematizado. Em outras palavras: tem horas que produzimos como motonetas envenenadas e tem horas que somos menos produtivos que funcionrios de repartio pblica. Desesperar-se com isso ir contra a natureza humana. Com os dados do projeto bem definidos, deve-se dividir a produo em etapas e estimar um prazo para cada uma delas, considerando as que forem simultneas. Com isso h um tempo total e um prazo parcial para cada etapa. Se alguma atrasar, as outras j ficam alertadas. Quando no erramos os prazos, o inesperado acontece para nos atrapalhar, de mquinas dando pau e blecautes a uma priso de ventre. Por isso calcule um mnimo de 30% do tempo previsto para cada tarefa e coloque como adicional para cuidar do imprevisto. Monte o cronograma e faa seu oramento com base nesses parmetros. Deve ajudar, mas no garantido. Alis, nada . Produtor: o sndico digital O processo de produo de um website envolve uma srie de tarefas complementares, e fica muito mais fcil se temos um profissional especializado para dar conta: o produtor. Eu tive a sorte de trabalhar com produtores muito bons como a Ana Lcia. Em suas palavras, o processo: E Fiat Lux: depois de ter o material reunido, arquitetura de informao feita e o lay-out aprovado, hora de finalizar, transformar o que era s uma idia em um site utilizvel. Para isso a organizao fundamental, necessrio saber preparar as etapas coordenando a equipe para ter o material pronto na hora certa. E o que preciso para produzir um site? Primeiro, estar a par das tecnologias a se usar. Conhecer programas e linguagens to importante quanto saber como e quando us-los. Muita gente acha que conhecer HTML e Flash o suficiente para ser produtor, mas isso muito limitado. Programas mudam, tecnologias mudam, suportes mudam, e sempre importante pensar em maneiras diferentes de se produzir o mesmo material. At porque nem sempre a maneira mais comum a melhor. Para isso recomendvel que se conhea um pouco de tudo: de design a programao. Sees bem estruturadas e material acompanhado de perto podem economizar muito, muito trabalho. E nessa rea, ser eficiente fundamental. Para isso recomendo o domnio de um programa HTML WYSIWYG, Flash ou qualquer tecnologia especial que venha a ser utilizada no site, um editor de texto para corrigir eventuais falhas na programao, um programa de edio de imagens para web, e claro, um de upload. Depois mo na massa: bit a bit coisa de arteso dos tempos modernos o produtor responsvel pela construo de um sistema que vai ser usado por pessoas e que, portanto, deve funcionar bem. o momento em que todo o trabalho anterior converge para o produto final. Pronta a parte grossa do site, o pode-se, dependendo da necessidade, trabalhar em parceria com um programador, acompanhando o andamento do processo, pois erros de comunicao sempre acontecem e podem ser minimizados com um pouco de ateno. Nesse momento, testes de usabilidade podem salvar seu site. Produto pronto, hora de mandar para o cliente, que normalmente o mostra pra todos na empresa, na famlia, no condomno e pede modificaes. Esperar que um site saia pronto na verso 1.0 pura iluso. Nessa hora comum que o cliente pea para fazer algo que no o mais apropriado, embora ele acredite firmemente que seja necessrio. Sobra para o produtor municiar o atendimento com razes pelas quais as coisas esto daquela maneira. Muita gente faz simplesmente o que o cliente pede (como diz o chavo publicitrio, o cliente sempre tem razo, e quanto maior a verba, maior a razo) mas se isso pode sacrificar a qualidade, no devemos pensar pequeno. Alm de tudo, o site vai fazer parte de seu portflio. Embora confesse
que nem sempre seja possvel convencer o cliente, tentar fundamental. E para isso, a regra simples: argumentos convincentes, e, acima de tudo, racionais. Nesse processo final, muito comum fazer e refazer vrias vezes o mesmo trabalho. Se conselho vale algo, faa sempre como se fosse a primeira vez. Faz parte da personalidade de quem produz querer sempre mexer com coisas novas, mas aparar as frestas to importante quanto iniciar o site e nos detalhes que se v a qualidade do trabalho. Com as modificaes finais feitas, o produto est pronto para ir ao ar, certo? No. Ainda temos que resolver como ser atualizado. funo do produtor garantir que a ferramenta de atualizao que ser operada por pessoas comuns, sem noo de tcnica seja funcional e de fcil entendimento. Programador pensa como programador, jornalista pensa como jornalista e o produtor tem que saber como todo mundo pensa para fazer um produto inteligvel. E essa a caracterstica mais importante do produtor: multidisciplinariedade. Estar atendo a tudo, saber o que se espera do site , como o pblico o est entendendo, como os outros envolvidos esto participando do projeto, avaliar a qualidade do trabalho dos colegas e estar sempre atento s mudanas. Aprender sempre, com tudo, de livros, artigos e sites at comentrios ouvidos em uma tarde de domingo. Isso acaba fazendo do produtor uma figura inquieta, questionadora. Essa a melhor maneira? O que tenho que saber antes de fazer isso? O que posso endender deste comentrio, a princpio to inocente? Em que situaes se aplicam ou no as regras de determinado guru? Essa inquietao muitas vezes gera desconforto, ansiedade, que no pode se transformar em hesitao. importante entender que no necessrio ter respostas para todas as perguntas, mas preciso saber:
quais so as perguntas certas; e onde encontrar as suas respostas, mesmo que voc no faa a menor idia de quais elas sejam.
Farol Digital: uma produtora fora do eixo Depois de criados pela agncia ou estdio, muitos sites so finalizados por empresas dedicadas que, como tudo na web, no precisam estar na mesma cidade que a equipe de criao. A FarolDigital, por exemplo, uma produtora com estrutura, qualidade e tecnologia de dar inveja. Por isso que, mesmo de Goinia, me atendia via ICQ, SEDEX, e-mail e, de vez em quando, pessoalmente. Com mais de 30 profissionais em vrias reas, eles fazem: Criao de Campanhas onLine: banners, hotsites; Criao de Sites/Portais: em WWW e WAP; Criao de Aplicativos e Sistemas: aplicativos ligados a Banco de Dados, formulrios, CGIs, Sockets, Protocolos; Comrcio Eletrnico: B2B, B2C, C2C, aplicao de camada criptografada, homologao de segurana em sites/portais, disponibilizao de pagamento por Carto de Crdito, Boleto Bancrio e Dbito Online; Inteligncia Artificial: criao de Redes Neurais, Algoritmos Genticos, Fuzzy Logic etc; Implementao de Ambientes de Segurana; Apresentaes em CD-ROM e DVD-ROM; Consultoria e Implementao de intranets; e Desenvolvimento de Sistemas Especficos: CRM, ERP, WebCallCenter etc. A Farol Digital tem pouco mais de um ano. Entre seus clientes esto McDonalds (sistema de software que compe a McEntrega), RedeCard (integrao de internet, intranet, extranet e transaes online, a Safenet) e o portal da dupla Zez Di Camargo e Luciano, hospedado no portal Globo.com.
A sndrome da primeira idia um mal que ataca estagirios em agncias de propaganda, clientes que tm idias geniais e profissionais que esto mais empenhados em mostrar que so bons que em preparar algo divertido e inteligente. normalmente aquela idia fcil, at meio bvia, que qualquer um teria. Como qualquer um teria, qualquer um acaba tendo, e a piada no tem a menor graa, como aquele sujeito que, em uma festa, faz questo de agradar. Todo mundo quer distncia. Antigamente era mais difcil fazer uma primeira idia vingar. O processo de criao tinha muito de artesanato e, at ficar pronto, uma idia melhor chegava. Quem aprendeu a desenhar usando um mouse e no sabe como produzir aqueles efeitos dos filtros do Photoshop usando tcnicas de fotografia e laboratrios deve tomar cuidado para no fazer, em design, o equivalente a uma msica dos Engenheiros do Hawaii ou Kid Abelha. E, o que pior: achar genial. O trabalho em criao uma habilidade como outra qualquer. Para se arriscar a viver dele necessrio algum talento inicial, mas isso no suficiente. A prtica deve ser desenvolvida com muitos exerccios e trabalho duro, at que o processo seja natural. Lembra quando voc resolveu aprender a dirigir? No comeo, muito esforo e muitas batidinhas. Com o tempo fica mais fcil. Quanto tempo? Para alguns, umas semanas. Para outros, vrios anos. E como exercitar a criao? Fazendo exerccios, ora. O crebro um msculo como outro qualquer e precisa se mexer para ficar em forma. Existe um ditado alemo muito bacana para essa teoria: Du bist was Du it ou voc o que come. Seu crebro s vai produzir material derivado do que recebe. Por isso necessrio entupi-lo com estmulos, informao. Para idosos que adoram TV, os mdicos recomendam palavras cruzadas. Para qu? Para evitar um derrame, mantendo o crebro ativo. Com o tempo o msculo cerebral endurece e o exerccio fica ainda mais difcil, gerando desconforto e dores, pode acreditar. E a, um malabarismo mental equivalente a fazer cinco abdominais, vira uma tarefa herclea. Para alguns, isso acontece antes dos 20 anos, uma pena. Seguindo o mesmo raciocnio, existe uma enorme diferena entre o seu tio que dana bem e um Nijinsky, entre aquele cunhado que adora um violo e um Paco de Lucia, entre todos ns e um Picasso ou um Leonardo. E onde est essa diferena? Para comear, no talento, no tem jeito. Mas tambm em uma obstinao cega e muita, muita prtica. No estou dizendo que, com exerccios, nos tornemos Matisses ou Gauguins, mas que, sem desafiar a verve criativa a cada instante, o que temos de talento desperdiado. Aquele tio que dana bem, se tivesse se dedicado em tempo integral dana, desde os 18 anos, poderia ser um coregrafo como o Antonio Gades, por que no? Imaginem o Gilberto Gil aposentado como gerente de produto da Gessy Lever, quanto desperdcio. Por isso, se voc adora comer pipocas na frente da TV, no largue a pipoca, largue a TV. V passear, leia uma revista ou mesmo converse com o pipoqueiro. um enorme exerccio, e requer muito mais fora de vontade que voc imagina. Os resultados, entretanto, podem ser fascinantes. Desde uma boa idia at a simples desconexo com o mundo real, fechando as portas da racionalidade para a criao criar coragem e ganhar fora. Observe uma criana inquieta (ou seja, normal): ela pergunta tudo, quer saber mais, l muitos livros sobre planetas e dinossauros. Adora desenhar e criar msicas, monta jogos e brincadeiras com as coisas mais esdrxulas, de uma luminria ao tapete da sala. Faz associaes de idias malucas, inventa mquinas de voar, carros com uma roda s, avies com trs asas, tem amigos invisveis, cdigos secretos e passa horas brincando debaixo da chuva. Agora observe o comportamento de msicos, ilustradores, arquitetos e escritores: so distrados, usam roupas inacreditveis, fazem perguntas esquisitssimas sobre, por exemplo, mitocndrias, lem tudo que passa pela frente, de bulas a Machado de Assis, ouvem msicas que poucos conhecem, so normalmente muito engraados e imprevisveis, verdadeiras crianas crescidas. Eu disse crianas? Pois . Muitas delas crescem e viram aqueles adolescentes chatos, metidos, que querem ser iguais a todos do seu grupo e mesmo assim ficam dizendo que so diferentes, Adoram falar mentiras e contar vantagens. Eu disse adolescentes? Desculpe, quis dizer mauricinhos. Ou pessoas que falam milhes de termos em ingls. Ou que falam que o Brasil no presta. Ou que
andam armados e brigam no trnsito. Que pena, eles eram to engraadinhos quando criana, hoje so apenas patticos. No adianta ler um monto de livros sobre design de uma vez, como no adianta fazer 1.400 abdominais se voc sedentrio. O que vale mudar de postura, fazer o crebro se mexer, aliment-lo com idias doidas, coletar referncias de todos os lados e, acima de tudo, no esperar resultados rpidos. A cultura, como a fisicultura, demanda tempo.
Um editor de textos para a digitao de textos grandes e ajustes em linhas de cdigo. Dois tipos so teis: um simples, para alterar partes do cdigo sem se preocupar com formatao e outro mais sofisticado para que o redator escreva os textos e j os entregue convertidos em HTML. Browsers variados, em diversas verses, para testar o resultado em diversos tipos de computadores de usurios. Programas para ilustraes , que trabalham com curvas (para formas geomtricas, botes e logotipos) como Adobe Illustrator, Macromedia FreeHand e Corel Draw. Programas para retoques fotogrficos, para melhorar a qualidade grfica das fotografias digitalizadas, alterando cada pixel da imagem, como o insupervel Adobe Photoshop. Programas de finalizao de imagens so usados para reduzir o nmero total de cores de uma imagem e convert-la ao formato final. O Photoshop, a partir de sua verso 5.5, resolve o problema. Programas para a edio de sons e vdeos usados no processo de edio e preparao de matrias-primas para uma multimdia. Se o produto final for CD-ROM, ser necessrio um aglutinador ou ferramenta de autoria, como o Director ou Authorware, da Macromedia para reunir todas as matrias-primas e programao em um nico aplicativo. Um programa de layout HTML (de preferncia, do tipo WYSIWYG). Um programa de Upload para transferir o material digital para o provedor de acessos. Programas de codificao para plug-ins, como Macromedia Flash, Real, iPix, MP3 e Adobe Acrobat.
Contedo testa se o contedo est correto e relacionado. A reviso de textos entra aqui. Funcional testa se o produto funciona: se suas imagens carregam, se a ordem das pginas est correta, se os cones em todas as pginas levam para os lugares certos, se o som entra no momento esperado, se o vdeo funciona etc. Ambiental testa se o material funciona no computador do usurio. Analisa os vrios equipamentos, nas mais diversas configuraes, browsers e plug-ins.
O processo de testes minucioso e deve ser feito verificando cada pequeno detalhe. Envolve a reviso dos principais tpicos, adaptao das mdias produzidas ao projeto grfico e elaborao do material final. Lembre-se: por mais cansado que esteja, nunca deixe passar nenhum detalhe, pois so sempre esses erros os que aparecem no final, quando a pressa e o cansao j passaram. Cada detalhe to importante quanto o todo.
certamente no ser voc. Nem eu. Muita gente mais rica, culta e inteligente que ns no faz a menor idia da forma de um j em Stone Serif, nem as dificuldades para se escrever um javascript e vive muito bem sem isso. Pense nisso. E adapte seu design a seu pblico, no tente fazer o contrrio. O resultado poder ser gratificante.
9: Equipe
Quantas pessoas so necessrias para uma produo de material digital? Nos Estados Unidos h equipes de 60 profissionais para um nico projeto. No Brasil, trs pessoas cuidam s vezes de 8 clientes. Ponto para ambos: por l eles tm paz para pesquisar e desenvolver suas idias com maior grau de especializao, o que explica boa parte da qualidade grfica e diversidade dos servios oferecidos pelos sites. Por aqui, ganhamos habilidades mltiplas, independncia e criatividade, o que nos d uma viso melhor do processo como um todo. Nas prximas pginas vamos examinar as principais funes relacionadas produo de multimdia. Para isso contei com o depoimento de alguns amigos que so profissionais experimentados na rea, nos mais diferentes nveis, com os quais eu concordo 150%. bom lembrar que funes distintas no significa que sejam sempre realizadas por funcionrios diferentes: algumas so terceirizadas, outras contratadas para a empreitada, outras so parcerias, consultorias e assim por diante. Leia o texto de todos e tente identificar o que eles tm em comum entre si, talvez voc seja bem parecido com vrios deles e nem desconfie.
A internet est tomando posse do glamour que j foi da propaganda nos anos 80: atrai pessoas de todos os tipos, inchando o ego de muitos e premiando gente que no tem necessariamente tanto talento assim. Convivo com publicitrios e alunos de publicidade h aproximadamente vinte anos e achei que j tinha visto de tudo em termos de arrogncia e atitude vazia, mas percebo que as piores partes desse filme esto sendo reprisadas. Ficarei contente quando a internet deixar de ser moda, pois isso atrair para a profisso somente gente sria e compenetrada, disposta exclusivamente a fazer um trabalho com muito teso o que, afinal, o que nos mantm vivos, no um cargo de criativo em um departamento homnimo.
Ser autnomo? se saber se virar, no bom sentido, claro. o papel de um designer em uma empresa claro e objetivo: voc tem sua mesa, um computador, chegam briefings, saem layouts para programadores, produtores, assistentes; fora de uma empresa, comea o one-man-show, nas mos o banjo, nas pernas o bumbo e na boca a gaita. Voc o atendimento, o financeiro, o contato, o produtor, muitas vezes o programador e finalmente, o designer. No uma profisso cmoda de modo algum. Idas e vindas a clientes, dos mais diversos tipos, tamanhos, gostos e temperamentos, idas e vindas ao banco que obrigam aquele lado esquerdo empoeirado do crebro a trabalhar. Lado esquerdo que se mostra bem til para aquela programao bsica em HTML, javascript e actionscript flashiano tudo isso ocupa uma parte considervel de seu tempo exercendo a funo cerne da profisso, designer. Pr-requisitos so: crebro, organizao, f, experincia no mundo profissional no-autnomo (indispensvel para no cometer erros bsicos, at de ordem contbil), equipamentos que funcionem, uma boa rede de contatos com colaboradores (programadores, fornecedores, parceiros) e possveis clientes (o principal, claro). Se vale a pena? Bem, se por um lado a correria muita e a jornada de trabalho varia do cio a 48 horas dirias de Photoshop, por outro no vemos aquele diretor folgado da poderosa holding multinacional de propaganda comprar um iate com os dividendos do suado trabalho de um submisso designer, muito menos aquele chefe chato reclamando dos quinze minutos de atraso de manh, ou dizendo que vamos todos trabalhar no feriado em que cai seu aniversrio. o gostinho da liberdade - uma liberdade que pode aprisionar mais que qualquer outro emprego mas que continua sendo a boa e velha liberdade. Dica para quem est comeando: no comece. No antes de estar bem preparado. Avalie friamente a qualidade de seus trabalhos, reflita se voc j tem a experincia bsica necessria para encarar o feroz mercado sozinho, analise sua infra-estrutura aquele macintosh performa velho pode abrir o bico e no aguentar a onda de seus trabalhos novos e boa sorte. Voc vai precisar dela. Talvez at mais do que imagina.
100% errado. Depois de um ano e meio resolvi abrir uma empresa e uma conta em banco para a pessoa jurdica que, conforme o dia, tambm servia para comprar cuecas ou pagar cervejas. Da mesma forma, a conta de pessoa fsica tambm dava uma fora para saldar fotolitos e disquetes. Alguns trabalhos deram certo por absoluto milagre, outros por interveno divina. Ningum sentia firmeza no que sabia e isso nos levou a fazer boas amizades com gente de bureau, fotolito e grfica. Uns trabalhos deram muito errado, dando o maior preju: chegamos a perder um cromo original de um cliente pra l de importante, fizemos algumas burradas com outros clientes e seguamos em frente, sem medo. Alis, oramentos eram um captulo parte: o preo de criao variava conforme as necessidades bsicas, de um disco do Zappa a um final de semana acampando na Ilha Grande. Tomvamos um Jack Daniels ou um vinho do Porto no fim do dia, muitas vezes jantvamos pizza da padaria e jogvamos sinuca antes de ir para as modorrentas aulas. Com o tempo ganhei dinheiro, assumi responsabilidades e posei de executivo. Eu e minha scia Sandra fizemos umas escolhas pra l de erradas, ficamos estressadssimos, brigamos com amigos, vivamos emburrados. Mas ao mesmo tempo a Kropki crescia, inventamos outras empresas (como a Hipermdia, a primeira agncia de propaganda digital do Brasil) e chegamos a ter 23 funcionrios em um galpo metido a besta no corao da Vila Madalena. Parecia tudo muito legal, mas sentia que algo havia se perdido no meio do caminho. Acho que era o que chamavam de alma. A desencanei. Deixei minhas scias (nessa poca j ramos trs donos) com a Hipermdia e remontei a Kropki, com uma estrutura menor, mas organizada, eficiente e consciente. Atrs da casa tinha umas redes para a galera descansar depois do almoo e, na frente, um gramado para deitar em um dia de sol do inverno, enquanto discutimos um briefing. Sa da Kropki h trs anos, entregando-a para dois amigos e, de l, j trabalhei em Nova York, Londres e em grandes agncias de propaganda de So Paulo. Para todos os lugares que vou, levo comigo o esprito dos primeiros dias do meu estdio, montando equipes unidas, amigas e divertidas, em que todos principalmente eu so apaixonados pelo que fazem. Quando olho para trs, percebo que fiz a coisa certa. Em muitos momentos o jeito foi errado, mas a coisa era certa. E isso que me deixa to feliz. Nessas horas desligo o celular e saio sorrateiramente para dar uma volta no quarteiro, assim ningum me pergunta o motivo daquele sorriso besta no canto da boca.
A parte boa: com o mapa do site na mo, comece a criar. Idia. Pblico. Contedo. Tecnologia. Referncia. Arte. Texto. Fonte. Pense, estude, faa e refaa. Muito suor e tentativas depois, mostre para algum, de preferncia o diretor de criao. Ele vai ajudar muito (mesmo que na hora s parea que ele est acabando com o seu trabalho). Passe para a tecnologia, reze para o cliente aprovar exatamente como est e parabns: seu site est no ar.
11: Modernidades
So muitos esquisitos os tais tempos modernos. As coisas esto acontecendo to rpido que nos fazem ficar perdidos e sem reao diante da novidade. Os textos das prximas pginas so extrados de alguns artigos que escrevi e expem algumas de minhas inquietaes a respeito desse novo mundo. Eles no tm finalidade prtica direta, mas podem ajud-lo a criar algo realmente novo e impensado. Sculo XXI: guia do usurio Chegou. O sonho de um mundo cheio de mquinas em que apertamos botes finalmente chegou, e ningum parece se dar conta disso, ou pelo menos estar satisfeito. Analisando tudo o que se fala sobre a virada do milnio, percebemos que ela anunciada mais como um assustador bug que com a era de Aqurio. A sensao geral que, agora que chegamos to falada Utopia, sentimos um enorme desconforto e uma irresistvel saudade de casa. Em todos os lugares as pessoas se queixam da vida moderna: o estresse, o trnsito, a correria das grandes cidades, a lentido dos computadores, a ineficcia dos celulares, colesterol, triglicrides e todas as agruras e incertezas de uma era digital. Fazem um enorme sucesso as lendas de alquimia, os contos medievais e a imagem de uma vidinha tranqila nas pequenas comunidades analgicas do comeo do sculo, um tempo em que carreiras e geladeiras eram construdas para durar para sempre, cuja nica rede de informaes era a fofoca e a coisa mais prxima da realidade virtual era o Paraso. Muitas pessoas assumem uma nostalgia esquizofrnica de um tempo no vivido, sentindo saudades da Paris nos anos 20 ou da Itlia na renascena. Outros pem a culpa de toda essa incerteza na revoluo das tecnologias de informao, que deveria aumentar nossa produtividade para garantir-nos mais horas de lazer, mas acabou dando errado, pois estamos mais produtivos do que nunca e, ao mesmo tempo, mais sobrecarregados. Os mais radicais acham que hora de parar com essa onda esmagadora e voltar aos princpios bsicos do ser humano, como os Talebans do Afeganisto ou os Amish, que vivem em comunidades agrcolas nos Estados Unidos. Mesmo entre os mais moderados h um visvel desconforto com a velocidade das mudanas. Provas de resistncia atltica que submetem pessoas de aparente bom senso a cinco dias no meio do mato sem nenhum aparelho eletrnico so um bom exemplo dessa confuso de valores: entre os atletas vencedores, a absoluta maioria treina em academias muito bem equipadas, come energticos que so a fina flor da engenharia de alimentos e veste roupas com fibras inimaginveis. Ora, por que ento satanizar a pobre da eletrnica? S por que ela a mais visvel e democrtica das tecnologias? Da mesma forma que aborgenes tm medo que fotografias lhes roubem as almas, ns, seres humanos modernos, informados, cultos e inteligentes morremos de medo que a tecnologia nos roube a humanidade, deixando-nos isolados, lobotomizados, pragmticos e melanclicos. Acreditamos que os progressos da cincia no valem nada, pois nunca teremos tempo para aproveit-los, mesmo que, hoje em dia, tenhamos uma expectativa de vida saudvel e produtiva muito maior que a dos nossos avs. Mas ser que a tecnologia algo to estranho ao ser humano? Ou ser exatamente o contrrio: no seria a tecnologia um dos ingredientes mais essenciais da humanidade? O que nos destacaria das outras espcies seno uma irritao e uma insatisfao geral com o estado das coisas a ponto de procurarmos, sempre, mud-lo? Ns, macacos pelados, desde o Homo Habilis inventamos ferramentas para modificar o mundo e nunca nos satisfizemos com elas, a tal ponto de estarmos mais para Homo Dissatisfactens que para Sapiens. De qualquer forma, no h como parar o progresso. Os regimes autoritrios que acreditam nisso
agem como a criana que fecha os olhos para se tornar invisvel. A evoluo tecnolgica est presente em toda a parte, no uma conspirao de um grupo de manipuladores chamado de sistema e seus industriais sempre em busca de dinheiro, forando-nos, atravs da publicidade, a comprar coisas inteis e frgeis. O socialismo no quis ver isso, forou um igualitarismo entre pessoas que sempre buscaram melhorias e deu no que deu. Alm do mais, tecnologia qualidade de vida e nem o mais lrico dos mortais quer voltar para o passado, com toda a razo. Ou voc iria a um tempo qualquer tempo em que chuveiros e telefones no funcionavam direito, carros eram perigosos e no andavam a mais de 60 km/h, partos e visitas ao dentista eram realmente dolorosos e podiam custar a vida? Isso sem contar espartilhos, sabonetes fedorentos, maquiagens pegajosas e lminas de barbear que realmente cortavam? Ou sem comodidades mnimas como cuecas ou absorventes internos, zperes, lycra, velcro, teflon? Cujo nico meio de transporte para a Europa era o tedioso navio, cheio de pulgas, ratos, baratas, escorbuto e tuberculose, sem ar-condicionado e cuja viagem demorava sculos? Tsk, tsk, tsk sempre bom lembrar que sushi e caf expresso eram excentricidades de imigrantes h apenas 20 anos, uma poca de liberao sexual, mas sem o Viagra que todos, cedo ou tarde, abenoaremos. Se pretendemos sobreviver e explorar as maravilhas de uma era digital que se avizinha, precisamos aprender a pensar digitalmente, a usar as mquinas online como verdadeiras extenses do nosso pensamento, sem amaldioar nossas ferramentas de trabalho. At porque lutar por um estado buclico no uma opo. A melhor forma buscar na tecnologia formas de resgatar nosso esprito humano, nossas caractersticas independentes e primitivas, das quais muitas vezes nos envergonhamos: virtudes como f, esperana, caridade; emoes como paixes e dio; alm, claro, dos sete pecados capitais. isso que nos conecta aos tempos de Shakespeare, no uma roupa de algodo cru. Fala-se que a internet separa as pessoas. verdade. Mas ela tambm conecta, mesmo que seja sem contato fsico. Se no fosse assim, as salas de chat no seriam to populares. No comeo do sculo escrevamos cartas, agora mandamos e-mail ou ICQ e a mensagem de ambos no to diferente assim. As histrias de hoje como os seres humanos de hoje so as mesmas de sempre e tratam daqueles que, por mais que tenham se tornado Sapiens, continuam sendo, fundamentalmente, Homo. A que ponto teremos que chegar para que os personagens de Fellini, a Guernica, as msicas de Cole Porter se tornem incompreensveis? Certos esto os evolucionistas, que dizem que nosso futuro no est no que seremos ou vestiremos ou onde viveremos caractersticas maleveis mas sim no que pensamos. Muita coisa muda em um ambiente digital, e ao mesmo tempo, nada muda: so as relaes humanas de sempre que agora so automatizadas e ganham dimenses mundiais. O sucesso da Amazon se deve quase que exclusivamente ao fato de ter sido uma das primeiras a perceber essa tendncia e, ao invs de mimicar a concorrncia, resolveu se comportar como a livraria ou a mercearia da esquina, trabalhando com sua freguesia, reconhecendo seu local no mundial, adivinhando seus anseios e fazendo sugestes no melhor estilo gostou deste? Ento leve este tambm. Da mesma forma que este texto, que foi escrito na praia, mais um exemplo da tecnologia usada como meio, no como fim. No assim que deveria ser? As tias velhas da internet Muito bonito todo esse papo de new media, mas o fato que a internet mudou muito pouco. Desde os primeiros exerccios quase acadmicos do comeo da dcada de 90 at hoje, os sites continuam lerdos, feios e chatos, com quase as mesmas coisas: barras de links esquerda, logotipos no canto superior, coisas animadas que piscam e pulam, contedo excessivo, desnecessrio, confuso ou desfocado, com cones esquisitos, textos com clique aqui, muito barulho e pouco servio de verdade. Enquanto isso, os videogames esto cada vez mais sensacionais, o cdigo-fonte dos DVDs j foi quebrado, MP3 faz com que os milhares de reais gastos em sua coleo de CDs parea um
estrondoso desperdcio, Linux de graa e ameaa o Ruindows, e-mail funciona em telefone celular, SimCity em PalmPilot, ICQ um vrus que corri muito mais horas de trabalho que qualquer ILOVEYOU, adolescentes de piercings e cabelos coloridos continuam sendo o nico grupo capaz de acertar o relgio de um videocassete, crianas decoram todos os nomes dos malditos Pokmons e eu e voc, perdidos nesse turbilho, ouvimos profetas profetizando sobre qualquer coisa e no sabemos a quem recorrer. Que raio de abismo cultural separa as crianas de hoje dos adolescentes, estes dos jovens profissionais de trinta e poucos anos e estes de seus experientes colegas de cinqenta e poucos? Boa parte da culpa da lei de reserva de mercado para produtos de informtica, que s caiu em outubro de 92. Essa bravata tupiniquim deixou em todos ns seqelas culturais incurveis: enquanto crianas que nasceram h 7 anos ou menos acham o computador mais natural que uma bicicleta, para todos ns ele pode at ser prtico, interessante, til, mas temos medo de um 1984, do poder dos Hackers, de usar carto de crdito, nos envergonhamos em ser chamados de usurio e portamos um orgulho ingnuo e infantil em pensar que, no ntimo, poderamos at viver muito bem sem ele. E quem esse tal usurio? Usurio, no meu tempo, quem usava drogas. Provavelmente no seu tambm. Talvez por isso se diga tanto que algumas pessoas esto viciadas em internet. Honestamente, isso ridculo. como dizer que algum est viciado em falar. O usurio uma pessoa comum, como ns, a quem oferecido um poder formidvel, e que no sabe muito bem o que fazer com isso. Como uma bela menina de 14 anos, que no faz a menor idia do fascnio que causa em velhos de mais de 30 e at tem um bocado de medo deles. O usurio comum no quer saber de WAP, banda larga, e-commerce ou outros bichos. Essa nomenclatura o deixa confuso, perdido. O que ele quer algum para conversar, uma boa sugesto de presente, uma dica bacana de restaurante, um hotelzinho na praia para o feriado. Pensando bem, todos ns conhecemos muito bem os usurios de tecnologia digital: eles so nossos irmos, nosso sobrinhos, nossas tias, aquele sujeito que nos fechou o carro no trnsito. Ser que to difcil fazer comunicao para esses caras? Ser que preciso fazer anncios com cones? Que alguma multinacional com foco na latinoamrica venha nos dizer como fazer comunicao, com seus sites que lembram novelas Televisa? Honestamente, eu duvido. Est nascendo uma cultura popular digital. Ns somos as suas tias, acostumadas com Jeannie um Gnio e achando que isso televiso. Os novos Spielbergs esto agora em casa, sujando fraldas ou jogando videogames e no se preocupam com o que vem pela frente. Nunca teremos sua viso, mas podemos estar preparados para eles. Tempo irreal Um termo muito usado para definir a cultura de resultados instantneos em que vivemos o tal tempo real, que simboliza o instantneo, o tudo-ao-mesmo-tempo-agora. S que no h nada verdadeiramente real em tempo real, e certamente nada de humano nele. Se voc parar para pensar, vai ver que a demora e a espera o que nos d contato com o mundo de verdade. Esperar por um prato pode ser um bom motivo para papear, como esperar pela conta ou por um cafezinho. Ou esperar o sol se pr, o dia raiar, o chuveiro esquentar. Uma mulher esperando um beb parece to serena. Do mesmo jeito que aquele sujeito distrado que olha pela janela vendo a paisagem enquanto o nibus no chega a seu destino. Crianas esperando pelo Natal so to radiantes etc. No d para radicalizar dizendo que os melhores tempos da nossa vida nos so proporcionados pela espera, mas que ela nos d pausa em uma correria, estimula a reflexo e nos faz aproveitar melhor as coisas incontestvel. Ou existe coisa pior que viver de fast food? Quantas vezes voc no viveu um momento que queria que no acabasse nunca? Deitado debaixo de uma rvore, com algum, olhando o cu o contato entre as pessoas toma tempo, e nesse tempo no s informao pura e simples que se troca. Demoras e pausas so imprevisveis no mundo de troca de informao. So o tempo no qual a vida acontece e em que se trocam outras experincias sensoriais, afetivas, sinestsicas prazeirosas, intangveis e enriquecedoras.
Cada cultura tem sua prpria percepo do tempo e seu significado. Para os chineses especialmente para os velhos chineses o tempo presente tem uma dimenso ridcula, desimportante, que s um pas com mais de cinco mil anos de histria pode oferecer. Talvez isso faa dos americanos povos mais histricos e ansiosos que os europeus. Talvez no. O que importa que nossas vidas so marcadas tanto pela velocidade quanto pela lentido. O tempo inquestionavelmente nosso mais rico recurso, e o que mais sofre risco de extino. No dia-a-dia das grandes cidades vemos barbaridades cometidas no trnsito em nome de uma ansiedade, o desespero das pessoas com os telefones celulares que no funcionam, a irritao que surge quando no se consegue atingir um padro ideal de beleza, de fsico, de inteligncia, de eficincia. Ao igualar o real ao eficiente, perpetuamos uma idia positivista em que a acelerao (progresso) o principal objetivo da vida como um todo (ordem) e, assim, minimizamos o valor do contato humano. engraado que as mesmas pessoas que cultivam essa eficincia do tempo real como viciados at, os workaholics se apaixonam por cidades pequenas e reclamam por uma melhor qualidade de vida. Ora, por que esse tempo no-instantneo no percebido como tempo para a reflexo? Ou tempo criativo? Ou como uma caracterstica da prpria qualidade de vida? Talvez isso explique a popularidade de esportes como o Golfe, em que o tempo e a caminhada tm um papel importante. Plantas para crescer levam tempo. Flores so bonitas porque so efmeras e demandam cuidado. O pr-do-sol dura poucos minutos e s aparece uma vez por dia. E muito mais bonito que um cu inteiro lils ou cor de laranja, como acontece algumas vezes em Cubato. Ao passearmos nas paisagens informativas digitais, temos a impresso que nossa cultura se enriquece, quando o que acontece o contrrio: nos tornamos depsitos de dados e citaes impensadas, no refletidas. Isso d o que pensar. Pois no fundo, nada do que vemos ao nosso redor real, a no ser a nossa disposio a aceit-lo. Problemas e mistrios O linguista Noam Chomsky uma vez sugeriu que nossa ignorncia o desconhecimento que temos a respeito de um tema qualquer pode ser dividida em duas categorias: problemas e mistrios. Quando encaramos um problema, podemos no conhecer sua soluo exata, mas temos uma idia razovel do que esperamos como resposta. Quando o que se tem pela frente um mistrio, s nos resta olhar para ele maravilhados e espantados, no tendo a menor idia de suas causas ou estrutura. Boa parte das religies, crendices e mitologias surgiram para explicar mistrios do dia-a-dia. Todos os povos primitivos tm razes poticas e ingnuas para fenmenos esquisitos, como a noite, a chuva, a morte. medida que ns crescemos e vamos nos tornando adultos, velhos mistrios passam a ser simples problemas e acabamos ficando pragmticos. Arrogantes com nosso conhecimento, criamos novos mitos para as coisas que no temos mais vontade ou pacincia ou energia para pesquisar o funcionamento. E nos tornamos velhos, com a cabea cheia de mistrios que, como no temos coragem de desvendar, resistimos o quanto pudermos. Olhe para qualquer site na internet com os olhos de um leigo: todos so pequenos mistrios, caixas pretas que no fazemos a maior idia de como desvendar. E o que muito pior, no estamos nem a. Como que se clica em uma palavra e se l outro texto? Como possvel ir to rpido de um site a outro, da Dinamarca para a Nova Zelndia? Onde estou, se em uma janela vejo o UOL e em outra a Wired? Como pode uma janela ser maior que toda a tela do meu computador? Como um pequeno site pode abrigar dentro de si um grande site? Essas perguntas bvias, simplrias, patticas at, so muito importantes para quem se preocupa em desenvolver um bom site e fundamentais para quem busca empatia com o visitante, portanto essenciais para o desenvolvimento de websites. Olhe no espelho e voc ver um excelente exemplo de inovao e resistncia: quando aprendemos uma nova tecnologia ou forma de comunicao, estamos abertos a todas as novas informaes disponveis formatos, programas, estruturas. Com nosso pouco conhecimento, fazemos
verdadeiros milagres. Depois de alguns meses aprendendo e dominando a tcnica, preguiosamente nos adaptamos a uma ferramenta e preferimos faz-la dar n em pingo dgua a estudar formas alternativas. Antes de criar um site necessrio ver seus objetivos com clareza e reinventar a roda: no importa o que a concorrncia faz, no importa o que o usurio est acostumado a ver, no importa o que existe de mais novo em tecnologias. Importa o contedo. Veja um bom exemplo: videogames. No incio da dcada de 80, quem acreditasse que coisas como um Telejogo Philco ou um Space Invaders iriam movimentar uma indstria de bilhes deveria com razo ser chamado de maluco. Mas foi exatamente porque o pessoal envolvido na criao desses produtos se preocupou em inovar e criar novas estruturas que surgiram coisas como um Mortal Kombat, Ultima, Sim City, Quake e muitos outros. Precisamos de um choque de idias, tecnologias para elas ns temos de monto. A web est to obcecada em imitar os modelos tradicionais que esquece de sua verdadeira riqueza. Faltam boas idias, produtos que faam a diferena, coisas bacanas e simples que deixem as pessoas felizes e satisfeitas. Como fazer isso? Com lpis e papel. Talvez umas cervejas ajudem. Para muitos, criar esse tipo de coisa um mistrio. Para desenvolver bons produtos digitais (e para se desenvolver como profissional na era digital) preciso abrir a cabea e transformar esses mistrios em problemas. Assim ser bem mais fcil solucion-los. Essa , na minha opinio, a principal funo da Arquitetura de Informao. Malditos Pokmons! Voc entende alguma coisa de Pokmons? Eu confesso que no entendo nada. Na poca em que escrevi este artigo, o desenho animado era uma espcie de mania nacional, com todos os termos esquisitos de seu ambiente. Mas, em muitos aspectos, seu mundo to hermtico e incompreensvel quanto o da internet. Com isso em mente, escrevi este artigo, sem nenhuma inteno de ofender seus fs. Quem conhece o mundo Pokmon no entendeu do que se trata e qual sua relao com o design para a internet. Quem no sabe nada deu boas risadas. Leia-o e pense em como seus clientes pensam na internet: Pokmons. Pokmons. Pokmons.. AAARRGGGHHHHH!!!! Malditos Pokmons. Eles esto em todos os lugares. Nas suas variantes Fogo, gua, Eltrico, Grama, Gelo, Guerreiro, Veneno, Voador, Paranormal, Fantasma, Drago, eles esto por toda a parte. Nas formas de Arbok, Fearow, Beedril, Carterpie, Ivysaur, Bulbasaur, Kakuna, Metapod, Charizard, Blastoise, Charmeleon, Ekans, Venusaur, Pidgeot (e Pidgeotto e Pidgey!), Raticate, Rattata, Squirtle, Buterfree, Charmander, Raichu, Spearow e do fiel, indefectvel e onipresente Pikachu, eles esto em cada esquina. Evoluindo com a Pedra Lunar ou a Pedra Trovo, a mando de seus treinadores no h lugar em que eles no estejam. Espertos com suas malditas Pok-balls, eles esto em cada cantinho. Em suas aventuras com Ash, Brock e Misty contra o Team Rocket de Jesse, James e do trapaceiro Pokmon Meowth, ser que existe algum bendito lugar em que eles no estejam? um saco, mas no tem jeito: eles esto mesmo por toda a parte. Modinha miservel de qualidade duvidosa, esse seriado japons um dia vai acabar e da s ouviremos falar de Tentacruel, Geodude, Graveler, Golem, Ponyta, Rapidash, Slowpoke, Slowbro, Magnemite, Magneton, Farfetchd, Doduo, Dodrio, Shellder, Cloyster, Gastly, Haunter, Gengar, Onix, Drowzee, Hypno ou Voltorb em alguma onda retr besta, ainda mais efmera. Ainda bem. Mas imagine por um instante se essa onda no acabasse, muito pelo contrrio: se o que estivssemos vendo fosse s o comeo de uma nova era Pokmon. Imagine jornais e revistas srias dedicando parte de seu precioso espao a explicar as diferenas de um Sandshrew para um Sandslash. Imagine palestras e programas de TV para explicar que Abra, Kadabra e Alakazam no so mais s palavras mgicas faladas pelo Mandrake. Imitando a maravilhosa pea O Rinoceronte do Ionesco, imagine que seus colegas comeassem a
se interessar por Chansey, Horsea, Goldeen, Seaking, Staryu a ponto de s falarem disso e passarem a renegar tudo o que fizeram anteriormente. Que a Design Grfico criasse uma seo para o design de Pokmons. Que o espao do desenho na TV aumentasse e que muito mais sites fossem criados para falar do tema? Na NASDAQ, empresas de Pokmons fariam uma reviravolta com seus IPOs e aumentariam a carga dos cyberdlares em criaturinhas mutantes. Enquanto isso, um Pokmon latino, de sombrero e radicado em Buenos Aires, iria tentar unificar pela 450 vez aquele continente cucaracha abaixo do equador. A onda do Pokmon grtis criaria filas quilomtricas nos postos de troca. No seu escritrio, voc seria procurado por um moleque imberbe, de cabelos prateados e embrulhado em celofane que falaria maravilhas da onda dos monstrinhos, de empresas ganhando uma fortuna com isso. Uma fortuna? Sim, algo em torno de uns R$ 1000 com Hitmonlees e Hitmonchans. Voc o mandaria passear e ele sairia na capa da Exame, cuidando de um investimento de risco de milhes. De Euros. Pessoas comeariam a olhar para voc de um jeito estranho, s porque voc achou que Weedle e Wartortle eram pratos da cozinha hngara, que Seel, Dewgong, Grimer e Muk eram danas blgaras e que Lickitung, Koffing, Krabby e Kingler prticas de caa esquim. Na empresa em que voc trabalha, profissionais bem estabelecidos e com carreiras garantidas deixariam seus empregos para trabalhar em Clefable, Parasect, Golbat, Rhyhorn, Rhydon, Poliwag, Seadra, Scyther, que, apesar do nome, no eram aqueles laboratrios onde se escondem cientistas malucos que querem poluir o mundo com um gs verde, e de cujo Mr. Mime no era o CEO. Assustado, voc acaba entrando em um curso para aprender que Dragonite no doena, nem que Nidoran, Nidorina, Arcanine, Vaporeon, Venonat, Jolteon, Omanyte, Snorlax, Vulpix, Flareon e Porygon so nomes de remdio genrico. Nenhum desses nomes faz sentido para sua cabea perturbada e voc comea a se achar burro, se perguntando se algum na famlia Magmar ou tem sndrome de Starmie. E o nico nome que fica na cabea o tal Pikachu, mesmo assim voc no consegue soletr-lo. Desesperado, voc comea a mentir pra fingir que entende tudo de Pokmons, mas se trai ao descobrir que Nidorino, Omastar e Missigno no so aqueles nomes esquisitos que tem no serto, nem que Kabuto, Primape, Machoke, Dratini, Kabutops, Paras, Kangaskhan, Tauros, Lapras, Pinsir, Tangela, e Marowak so cidades de pases da selva africana. Os monstrinhos viram realidade e conquistam as corporaes mais tradicionais e voc comea a colecionar cartes de visita com nomes que mais parecem estdios de design ingls: Bellsprout, Electrode, Diglet, Cubone, Exeggcute, Oddish, Tentacool. Quando voc finalmente descobre que Dragonair no uma linha area asitica, chegou a hora de desistir. Da voc contrata um carinha desses esquisitos para lidar com coisas de nomes que mais parecem produtos do 0800-14-06: Vileplume, Poliwhirl, Jigglypuff, Dugtrio, Electabuzz, Poliwrath. E d vontade de fazer a piadinha: no responda ainda - voc ainda pode ganhar um Weepinbell, um Victreebell, um Exeggcutor, um Nidoqueen, mas voc no tem mais humor para essas coisas. E corre o risco de parecer o tio da Sukita, por isso deixa pra l. Palavras horrorosas surgem a cada instante: Nidoking, Clefairy, Wigglytuff, Zubat, Gloom, Ninetails, Venomoth, Persian, Psyduck, Golduck, Manky, Growlithe, Machop, Machamp, Weezing, Jinx, Magikarp, Gyarados, Ditto, Eevee, Aerodactyl, Articuno, Zapdos, Moltres, Mewtwo, Mew, Meyu. Desesperado e empapado em suor, voc grita. Da voc acorda. Ufa. E percebe que foi tudo um horrvel pesadelo. Ao tomar um belo banho gelado, sorri por nada disso ser verdade. E veste sua roupa clubber, coloca o piercing e vai de patinete trabalhar como webdesigner em uma pontocom, esperando que o cliente largue a mo de ser burro e entenda de uma vez por todas que no d pra fazer frameset em Flash.
Alm de tudo isso o leitor deve decidir a cada conexo se deve ir em frente ou se desviar de seu caminho. Ir para a frente pode levar a movimentos circulares ou a voltar a um momento anterior. Desesperador? Formidvel! So essas possibilidades que podem ser exploradas e nunca foram tentadas. Veja uns possveis modelos de hipertexto: Histrias interativas / participativas Um sistema de hipertexto via internet permite a construo de uma histria multi-autoral, ou seja, um texto com muitos autores. O autor tradicional muda de postura e se torna um coordenador. Ele cria uma linha narrativa bsica e alguns personagens com histrico e carter difuso. Publica os trs primeiros captulos para que o leitor tenha uma idia dos personagens e de seu ambiente. Depois abre a narrativa para que qualquer pessoa possa inserir trechos, sugestes ou personagens narrativa principal, que passa a ser uma grande histria coletiva. A estrutura parecida com a de jogos de salo em que um participante comea uma frase, que continuada por outro, at que todos os integrantes tenham falado e se chegue a uma histria totalmente diferente da planejada. A obra coletiva pblica e qualquer colaborador que no concorde com os rumos da histria pode criar narrativas dissidentes. Lego Um hipertexto ainda pode funcionar como os blocos LEGO: o leitor apresentado a um conjunto de pequenos textos, imagens, sons e vdeos, com a opo de combin-los vontade at construir uma histria sob medida, faa sentido ou no. A essa histria podem ser acrescentados vrios elementos para montar um conjunto. Desse conjunto, ou de suas partes, outros se apropriaro e, construindo seus prprios blocos, formaro uma estrutura auto-alimentada sem final. Esse processo pode ser novidade em comunicaes, mas bastante utilizado em lgica de programao matemtica. De certa forma o que certos roteiristas de cinema fizeram sobre o trabalho que diversos roteiristas de quadrinhos fizeram sobre a histria e os personagens originais de Batman&Robin. Uma grande galeria Um dos maiores problemas dos museus do mundo seu acervo: como consegui-lo, transport-lo, fazer seu seguro e exibi-lo com segurana? Outro problema sua eficcia: como transmitir os dados de uma forma didtica para cumprir sua funo social? Uma galeria virtual pode ser a soluo. Como um sistema digital no precisa obedecer s leis da Fsica, pode-se criar um ambiente em que uma sala maior que o prdio inteiro ou que o museu se transforme em uma sala de aulas ou conferncias a qualquer instante. Nesse exemplo, ao entrar na galeria (acessando seu endereo digital) o visitante teria acesso a um conjunto de obras de destaque como uma exposio. Se alguma obra o interessasse, poderia examin-la com mais calma ou conhecer o acervo permanente, um conjunto de obras espalhadas pelos melhores museus do mundo. O museu teria diversas salas, dedicadas a movimentos, pintores e tcnicas. Em cada sala, diversos quadros estariam expostos. De cada obra examinada o visitante poderia ler textos / ver vdeos sobre seu autor, movimento e tcnica. De uma tcnica, ver outras obras usando tcnicas semelhantes, mesmo que se chegue a movimentos diferentes. Em movimentos diferentes, ver autores diferentes e tcnicas diferentes, em uma espiral recursiva sem fim, acumulando dados e informaes ao conhecimento do visitante. O projeto da galeria vale para qualquer processo, da macroeconomia indstria de pes. S necessrio organizar sua informao.
Mltiplos pontos de vista A maioria das histrias que conhecemos nos apresentada sob um nico ponto de vista, seja ele um narrador neutro onisciente, um personagem ou mesmo um mero observador. Um sistema de hipertexto permite que uma mesma histria seja apresentada sob diversos pontos de vista, em diversos momentos, dando uma abrangncia muito mais ampla e uma compreenso melhor do assunto. Imaginemos uma histria com cinco personagens em cinco episdios / momentos / captulos. Teremos uma seqncia linear de elementos. Se a mesma histria for contada de cinco formas diferentes, uma para cada personagem, teremos vinte e cinco captulos. Se o autor fizer pequenas alteraes na estrutura do texto, dando ao leitor a possibilidade de come-la em um captulo aleatrio e seguir em qualquer seqncia, os mesmos vinte e cinco captulos podero gerar 3125 histrias possveis (55). Ao acrescentar a opinio de um narrador em mais cinco captulos pode-se gerar 15.625 histrias (56) e assim por diante. Com um pouco de esforo de roteiro e estruturao, os captulos de uma histria podem no ter fim, serem misturados s experincias dos leitores em um exerccio nico de comunidade. Esse processo , em parte, usado na formao e estruturao de comunidades virtuais.
no se atualizam nem se propem a reformular seus conceitos. Terrvel? Em termos. Nem todos os casamentos terminam em monotonia, nem todos os professores do aulas maantes, nem todas as crianas enjoam de seus brinquedos, da mesma forma que nem todos os designers acabam caindo na mesmice. Para isso, necessria uma atitude com relao ao design (calma, ningum aqui vai falar em comportamento pr-ativo nem nenhuma bobagem do gnero) tomando alguns cuidados para no ser levado pelo marasmo. No podemos nos esquecer que um designer cria interfaces para que as pessoas que as utilizem esqueam que usam computadores. Por isso, elas precisam ser naturais, divertidas e interativas. Isso s vai acontecer quando o designer mantiver um estado contnuo de fascnio e explorao, como aqueles professores que do uma aula espetacular, com tanta paixo, que at comovem. Tenho o imenso orgulho de dizer que meus pais so assim.
Crditos
O livro Design/Web/Design:2 foi escrito por Luli Radfahrer (http://www.luli.com.br) e disponibilizado no endereo http://www.luli.com.br/dwd2. A converso para PDF foi feita por Marcus Danillo (http://danillonunes.net), usando o software OpenOffice.org (http://www.openoffice.org) e o site Media Convert (http://www.mediaconvert.com).