DWD:2

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.

1: Design: a cara do mundo civilizado

Muita gente acha que design uma coisa fcil, que s demanda talento. Alguns acreditam que esta
uma atividade ftil, uma firula muitas vezes desnecessria. Ou uma subdiviso da propaganda, um
emprego para artistas temperamentais que esperneiam por causa de um fundo azul. O que design,
afinal?
A traduo direta do termo desenho, mas deveria significar projeto. Em uma definio pra l de
resumida, os designers criam a cara do mundo civilizado. Quase todos os produtos e marcas que se
v em um espao urbano foram criados por designers: de um parafuso aos botes de um elevador. A
cadeira em que voc est sentando, o computador que voc usa, seu automvel ou nibus, tudo isso
tem a mo de um designer. Algumas idias bacanas, como a bicicleta, o garfo, as sandlias
Birkenstock e a garrafa de coca-cola, persistem. Outras, como o puff, pogobol, bilboqu e a tandem
(bicicleta para dois), desaparecem e no fazem histria.
Ao contrrio do glamour que pode aparentar, a profisso costuma reunir abnegados idealistas, gente
que luta por uma causa quase que perdida, que a de criar produtos que faam a diferena para um
mundo mais confortvel e bonito. Costumam ser teimosos e at pouco sociveis: muitas vezes, seu
apego ao produto sacrifica sua relao com muitas pessoas. Um designer costuma ser inquieto e
fazer as perguntas mais estranhas: como funciona o arco do violino? Ou: por que no inventam um
chiclete de coco? Ou ainda: que vermelho bonito faz o sangue, no? Pode parecer uma viso
romntica da profisso, mas muitos designers no se acreditam capazes de fazer outra coisa da vida
a no ser lutar incansavelmente por uma esttica melhor ou mais inventiva. Alguns se sentem quase
obrigados a isso o tempo todo, como aqueles professores de portugus que, inconscientemente,
corrigem as derrapadas que escutam pelo rdio ou TV, mesmo que ningum v ouvi-los.
Um designer nunca est satisfeito e, nesse ponto, d at para compar-los com cientistas: curiosos,
sempre propondo, nunca considerando uma soluo como definitiva. Seriam os designers cientistas
com charme?
No. Acredito que da estaremos exagerando um bocado, at mesmo para pessoas conhecidas por
terem egos incontrolveis. Uma melhor definio talvez fosse que os designers so os rbitros do
bom gosto e nos orientam a separar o que bonito do que feio. Eles servem para mostrar s
pessoas o que elas realmente querem e orientam o caminho para chegar l. Sua responsabilidade
enorme, e, para isso, devem se concentrar nos mnimos detalhes para que o que fazem seja
harmonioso e funcione.
Por isso um designer se irrita quando o cliente s prope a troca da cor do fundo de uma
embalagem. Essa troca, s vezes, o equivalente meia branca para quem veste terno e sapato
pretos ou ao pedacinho de alface que fica grudado no dente depois do almoo: um pequeno detalhe
que compromete o conjunto inteiro.
O design especialmente o design grfico e de web para voc? Bom, depende. Voc adora
letras? Acha linda a curva que o Q do Goudy faz? Gosta de mexer com cores? detalhista? Adora
pesquisar tipos de papel e formatos? Acha videogames ou RPG experincias interessantes de
linguagem? Se a resposta foi um apaixonado SIM, sem vacilar nem um pouquinho, a profisso
sua, para o bem ou para o mal. Se a questo financeira pesar, mas pesar muito, abandone a rea.
Voc sempre poder ser um bom advogado ou cirurgio plstico com uma coleo de belos quadros
em casa.

1-1: Qualquer imbecil faz design: design, designers e Frankensteins

Voc conhece algum que se meta a besta de criticar uma estrada, uma prtese ou um satlite de
telecomunicaes, a no ser que eles estejam evidentemente errados, colocando vidas em risco?
Pode acreditar que no seja louco um engenheiro que mande emendar uma ponte pnsil a uma
antena parablica? Pois compare com msicas. Mesmo que no entendam nada de compassos ou
harmonias, todos se sentem no direito de criticar uma trilha sonora, baseados exclusivamente em
seu gosto pessoal. Com culinria ou layouts no diferente.
Infelizmente, gosto no se discute, lamenta-se. parte da cultura individual e resqucio de sua
formao. , portanto, subjetivo e malevel. E, para piorar, o gosto pessoal uma das principais
formas para se demonstrar personalidade e refinamento, o que o torna um elemento terrvel nas
mos de gente insegura ou segura demais.
Hoje em dia, todos querem mostrar que tm bom gosto e dar palpites sobre obras artsticas e
composies visuais, mesmo que estejam completamente equivocados ou que no tenham nenhuma
informao a respeito, tornando muitas vezes o trabalho do designer um martrio.
Por mais chato que seja um paciente em um hospital, ele dificilmente dir ao mdico como quer ser
operado e que resultado pretende obter, principalmente se isso fizer mal a sua sade. Por que, ento,
muitos insistem em alterar os layouts do pobre designer ou diretor de arte, arruinando sua
legibilidade, impacto, unidade e harmonia ou combinando elementos de layouts diferentes? Se
contrataram os servios de um designer, por que querem mexer no seu layout?
Parte da culpa da prpria classe de designers e diretores de arte. Como no h uma formao
especfica requerida, fica muito difcil avaliar se um sujeito bom ou no. Em salas de mdicos e
advogados h paredes forradas de diplomas. Mdicos esto sempre de branco, advogados de terno.
No se fala em feeling ou instinto, mas em cincia. No h arrogncia nem superioridade criativa,
mas a conscincia de um conhecimento especfico que deve ser explicado. Mdicos adoram dar
pequenas aulas sobre o funcionamento do corpo dos pacientes, e o fazem sem jargo. Nenhum
engenheiro se apresenta como ganhador de diversos prmios como se fosse um cavalo treinado
nem diz que quer fazer uma estrada igualzinha que est na moda em Heidelberg. Tampouco um
sujeito se diz psiclogo depois de ler um livro de Jung. Em compensao, h designers
Graas a atitudes prepotentes como essas, tomadas indiscriminadamente por pessoas sem formao
ou preparao, o esteretipo do designer no Brasil to injusto, ao contrrio de pases como a
Espanha ou Sua. De uma classe dessas, o cliente normalmente formado em reas de cincias
exatas ou exatizadas, como economia, administrao de empresas, advocacia ou relaes pblicas
tende a se proteger, reagindo negativamente. Contrata os servios e palpita o que puder, usando
argumentos inacreditveis, que vo da cromoterapia e Feng Shui ao simples no gostei. De todas
as interferncias, a pior o hbito de criar Frankensteins, misturando partes de vrios layouts em
uma nica pea.
Para essas pessoas, qualquer um pode fazer um site na Web, logotipo ou anncio, como qualquer
um pode compor uma msica, fazer um filme ou escrever um texto. Muitos acreditam que o
dinheiro gasto com programao visual um desperdcio. So comuns comentrios do tipo: mas
tanto dinheiro para fazer s isto? ou no mudou quase nada do meu logotipo ou ainda quero
aquele negcio que eu vi em uma capa de CD. Um dos maiores problemas que a profisso de
design enfrenta hoje em dia a falta de parmetros slidos para a sua anlise. No h como analisar
uma pea de design sem levar em conta caractersticas como dinamismo, legibilidade e equilbrio e
o resultado que a maioria dos clientes aprova ou rejeita baseado em seu gosto pessoal ou na
argumentao do profissional que apresenta a campanha, o que pode levar a grandes distores.
Pode parecer estranho a quem no da rea, mas quando um designer ou diretor de arte est
olhando um anurio ele est estudando. Ele est colecionando referncias visuais e vendo como

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.

1-2: Talento vs. Preguia

Trabalhando com design ou comunicao (qualquer que seja o veculo ou sua funo nele) voc vai
cansar de ouvir falar em talento, como se fosse uma palavra mgica. Pessoas talentosas so
cultuadas por muitos, que as acham iluminadas, mgicas, divinas. Se que conselho vale alguma
coisa, no caia nessa. Talento muito importante, mas no nada divino
Parte dessa histria de atribuir genialidade a pessoas com habilidades bem desenvolvidas
autodefesa: como gostamos muito de ns mesmos mas no queremos nos dar ao trabalho de
encenar, escrever ou desenhar algo grandioso (e nem queremos dedicar tempo para isso) nos
fazemos acreditar que existe um dom divino e rarssimo. Assim, nossa vaidade favorece o culto
personalidade, pois s quando pensado como algo diferente, distante e especial inacessvel,
portanto o gnio no incomoda.
A origem do talento bastante questionvel, e a maioria das teorias modernas prova que ele tem
muito a ver com a formao do indivduo: filhos de musicistas ouvem msica em casa desde criana
e a associam a treino e pacincia, por isso se tornam melhores candidatos a msicos. Escritores,
jornalistas e advogados certamente leram muito desde a infncia, por isso seu texto mais fluido.
Assim, designers que no tm familiaridade com o processo tendem a ser mais limitados que seus
colegas estudados.
Fica muito mais fcil compreender o que um dito gnio tem de especial quando acompanhamos de
perto a dedicao ferrenha de pessoas focadas em uma s forma de arte, pesquisa ou atividade. Veja
um cientista ou cozinheiro, por exemplo: eles passam o dia inteiro procurando estmulos e correndo
atrs de novidades. Cada nova descoberta comemorada e combinada com as anteriores e dessa
forma agem como crianas que fazem perfumes misturando todos os ingredientes do banheiro.
Compare-os com ilustradores que no param de desenhar ou designers que vem design em cartazes
rasgados, em restos de fax, em jornal velho.
Outra caracterstica admirvel das pessoas que dizemos ter talento est no processo com que elas
realizam suas obras: primeiro recolhem as matrias-primas e as combinam, trabalhando cada
elemento para faz-lo se destacar e ao mesmo tempo se harmonizar no conjunto. Quase toda
grandeza conquistada com a seriedade de um sapateiro, que primeiro aprende a montar as partes
para construir um todo. Isso toma tempo, requer experincia e construdo com o cuidado em cada
detalhe. s assim que se faz, no tem outra receita.
Infelizmente a maioria das pessoas no comea pelas partes, mas pelo todo e o quer pronto sem
disposio ou esforo. Essa cultura fast-food fcil de se identificar: est em gente que larga
academias ou cursos de instrumentos musicais, desiste de escolas de lnguas e acredita em
emagrecimento milagroso. Impressionveis, no percebem que a busca por um resultado sem
ateno na dedicao e detalhe s gera frustrao e angstia. Pra piorar, a tal sorte de principiante
s atrapalha, pois falta aos espertinhos que acertam no primeiro lance e se julgam geniais a
dedicao, o que gera ainda mais insatisfao a mdio prazo.
Talento ou jeito para a coisa importante, mas no justifica a preguia: fcil dar receitas de
design e de como se tornar um bom designer, mas a sua realizao implica em dedicao, estudo,
pesquisa e outras qualidades que ignoramos quando dizemos que no somos iluminados. Sem
disciplina, o talento s metade do caminho. E a recproca pra l de verdadeira.
O medalhista olmpico Gustavo Borges treinou por uns meses na piscina do clube que freqento.
Era estimulante ver que, mesmo com sua glria, ele chegava todos os dias no mesmo horrio,
nadava suas piscinas humilde e concentrado e ia embora quieto. Em compensao, h designers
como dizia o filsofo Nietzsche: acreditar que um artista seja genial e no dar valor a um professor
ou engenheiro no passa de uma infantilidade da razo.

1-3: Carta da Califrnia

Trabalhar com websites me fez conhecer melhor o design grfico dos Estados Unidos e desconfiar
que a diferena bsica dos gringos para ns estava na escola, no no mercado de trabalho. Da
recebi esta carta de um amigo que foi estudar na Califrnia. Leia e tire suas concluses:
Finalmente terminou o Fall Term no Art Center College of Design. Como todo bicho
estpido e eu sou bicho no Art Center, fiz a asneira de pegar aulas demais e acabei
quase afogado em trabalho. Durante umas cinco semanas pelo menos, dormi menos de
cinco horas por noite e vi mais aquela moa que aparece quando o Illustrator abre do
que a minha mulher. Aqui dizem que todas as histrias tm duas verses: a coberta de
acar (para os parentes) ou a verdadeira. Vou na verso Muhammad Ali, direto no
estmago: o Brasil est pelo menos 15 anos atrasado em graphic design. A diferena que
tem entre o que os estudantes fazem aqui e a melhor revista, ou livro, ou qualquer coisa
que tenha tinta no papel no Brasil to grande quanto a diferena entre o porta-avies
Minas Gerais e o U. S. S. Omaha.
Em propaganda ainda d para tentar competir, mas em mdia impressa e web d medo.
E o pior que eles tm os mesmos programas, as mesmas verses, os mesmos livros na
estante que os designers brasileiros. O que acontece? Foi o que eu me perguntei no
incio. Uma das aulas que tive era basicamente uma srie de excurses aos melhores
escritrios de design dos EUA na Costa Oeste. Pensei que ia encontrar o segredo l, mas
que nada. Igualzinho que nem que nis. Me senti em casa. S faltou ver algum lendo
sobre o campeonato brasileiro na pgina de esportes. At a to propalada meia quadra
de basquete presente nos escritrios mais cool, agora tem em qualquer lugar.
Por que ento, meu Deus, por qu? Eu me perguntava. s vezes eu via vrios designers
com computadores piores do que tinham os redatores das agncias em que trabalhei,
mas o que saa da impressora era o melhor design que eu j tinha visto. Ignorante,
deslumbrado, vendido, americanizado, amigo da garotada, podem me chamar do que
quiser, mas no tem comparao.
A explicao me veio lendo as 150 pginas de artigos sobre histria do design que fui
obrigado a ler e resumir. Se ao menos os profissionais brasileiros gastassem tanto
dinheiro para aprender design quanto gastam para colocar RAM no computador
quantos designers ou diretores de arte brasileiros com menos de 30 anos conhecem a
histria da tipografia? 20%? Quantos tm o Netscape 5 instalado? 70%? Por que David
Carson apareceu? Porque cansou de surfar? Por que ele desapareceu? (Sim, ele
desapareceu. ) Quem foi El Lissitzky? Por que nunca ouvi ningum citar o nome dele?
Quem conhece o trabalho de Bradbury Thompson pode levantar a mo?
Essa uma discusso sobre a esttica do trabalho e tambm sobre o contedo do
designer ou diretor de arte. H algum tempo atrs, os melhores designers no mundo
publicaram um documento chamado First Things First 2000. Em poucas palavras, eles
diziam que a propaganda, ao mesmo tempo que sustentava os designers e diretores de
arte, tambm escravizava a criatividade a coisas triviais e banalizava o raciocnio,
enquanto outros desafios e tentativas realmente novas ficavam na gaveta esperando um
tempo livre que nunca chegava, porque o mundo sempre precisava vender dentifrcio e
cartes de crdito.
Mas o incrvel que os mesmos ianques que inventaram esse consumismo todo
protegem a educao em design a todo custo. Estava na hora da gente ser antropfago

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.

1-4: Pensando visualmente

Para se fazer design necessrio ver. E, alm disso, conseguir transmitir essa experincia visual
para seus interlocutores. S que ver no uma tarefa simples, e, na maiorias dos casos, muito
subjetiva. O que evidente para alguns pode passar despercebido para outros. Ou voc nunca ouviu
a expresso: puxa, nem reparei?
Uma imagem, diz-se, vale por mil palavras. Acredito que valha um pouco mais, algo em torno de
oito milhes, j que necessrio um espao de 34 Megabytes mais que todo o texto da Bblia
para armazenar digitalmente os dados capturados em um negativo 35mm, digitalizado em alta
resoluo. Como as imagens mentais so muito mais detalhadas que uma simples fotografia, fcil
entender porque um sujeito barbudo faz com que a gente se lembre de outro barbudo, mesmo que os
tenhamos conhecido em lugares e situaes completamente diferentes.
Indo um pouco mais alm: na realidade o mundo no simplesmente tridimensional. nossa
organizao dos sentidos que nos faz v-lo assim. medida em que voc vai lendo este livro,
outras dimenses esto interferindo na sua percepo. So emoes, cheiros, tato, pensamentos,
memrias, interferncias que simplesmente no levamos em conta e encaixamos em uma
conveno, como se nada disso existisse e a leitura fosse simples e linear. Nossas assimilaes do
mundo, entretanto, so visuais. At para uma coisa to abstrata como dinheiro. Pense em 100 reais.
Pensou? Pois . No muito mais fcil imaginar a nota, ou as coisas que se compram com ela, do
que um nmero (a no ser que voc esteja pensando no extrato bancrio)?
As imagens, como os sons, podem servir a vrios fins, conforme o contexto. Mas se estiverem
ligadas a palavras, sua interpretao estar comprometida. As palavras limitam nossa visualidade,
nos dizem o que ver. Legendas em fotos so lidas para que se conte ao leitor o que est
acontecendo, quando o que basta olhar. Imagens sem palavras so como o cenrio visto por um
turista que no fala a lngua de um pas: a nica forma de entender olhando. Aprende-se assim a
ver toda a cena e descobre-se detalhes que permaneceriam escondidos para sempre. O estrangeiro
passa a ver coisas que os nativos no vem, pois, sem palavras, ele tem que decidir por si s do que
trata cada imagem.
Na pr-escola as crianas so estimuladas a usar ferramentas visuais como blocos, lpis de cera e
pintura a dedo. Rapidamente os meios artsticos so trocados por instrues verbais e lineares dos
textos. Muito ocasionalmente, uma ou outra disciplina pede um diagrama ou mapa e na
universidade a arte j desapareceu do currculo. Somos o tempo todo orientados a fazer
verbalizaes, a explicar conceitos, a preparar argumentos. Com essa formao, no difcil que
muitos adultos apresentem severas falhas de compreenso visual ou de mdia em geral. Em uma era
de comunicao visual crescente, esse problema ainda mais grave. Pessoas que no leiam imagens
a no ser que saibam analis-las, question-las e at resistir a elas so quase analfabetas em
uma linguagem que, mais que qualquer outra, tem tudo para ser verdadeiramente universal. Se voc
tem alguma dvida, veja o disco que foi mandado com a sonda Viking para fora do sistema solar:
ele leva imagens com saudaes e sons de diversos pontos da Terra, pois assume que s na fico
cientfica os ETs falavam ingls.
Muitos de ns olham imagens para compreender melhor a informao. Um conceito complexo pode
ser facilmente explicado em rabiscos feitos com uma caneta em um guardanapo de boteco ou em
uma lousa, muitos artigos ficam mais claros quando h tabelas ou explicaes. Isso acontece porque
a palavra um conceito mais complicado que a imagem e o texto escrito, mais difcil ainda, pois a
imagem de uma palavra. Para piorar, o texto pode apresentar referncias, estilos e construes
elaboradas esttica, repetio, exemplos, metforas que melhoram seu estilo, mas atrapalham
sua compreenso, coisa que uma imagem no tem.
Em resumo: se a imagem pode ser at didtica, o texto no deve se dar esse luxo. O designer deve
perceber, analisar, compreender e propor. Todos os sentidos (tato, audio, paladar, olfato) so

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.

1-5: Tintim por tintim: o impacto dos mnimos detalhes

Uma das diferenas mais visveis entre o trabalho de um designer experimentado e o de um
iniciante com jeito pra coisa est no acabamento. Empolgados com a fora de uma idia nova,
muitos deixam de lado a produo. O resultado que poderia ser genial, acaba ficando com aquela
cara mambembe das produes estudantis ou caseiras: o argumento e o roteiro at que so bons,
mas o produto
aquela velha histria: deixa passar que ningum vai reparar. Muita gente usa essa regra para
imagens que esto um pouco fora de foco, colunas levemente assimtricas, imagens com a cor
quase certa, famlias de letras parecidas, texto revisado por cima e assim por diante. A pressa, o
prazo apertado, o estresse, o sono tudo desculpa para deixar passar pequenos deslizes, algumas
gambiarras, defeitos que ningum de bom senso repararia e, mesmo que reparasse, no levaria a
srio.
E a realidade que, na maioria das vezes, no se repara mesmo. Muitas vezes o erro mnimo e no
interfere na comunicao como um todo, mas deslizes desse tipo passam a impresso de um
material mal acabado, estranho, malfeito, descuidado como aquela roupa que no combina e
ningum sabe dizer o porqu. tremendamente pedante dizer que um leitor ir notar uma coluna de
texto que esteja 0,2mm mais larga ou que algumas imagens estejam levemente desalinhadas, mas
algo na diagramao o incomoda e o mal-estar persiste.
O designer deve ser pedante e detalhista quando o assunto em questo for o layout em que se est
trabalhando. Perfeccionista, obstinado ou chato so outros adjetivos cabveis. Deve se desesperar e
se irritar por bobagens que ningum repararia, pois, afinal, tambm para isso que ele foi
contratado. Um velho ditado em estdios de agncias de propaganda que a pressa passa e a
porcaria fica, ou seja, na hora em que o trabalho final estiver pronto, nenhuma desculpa ser vlida
para um deslize, por menor que seja.
Essa preocupao bvia e fcil de se compreender em outras profisses por melhor que seja o
cirurgio plstico, ningum admitir que ele quebre um dente de um paciente durante a operao;
por melhor que seja o poltico, todos repararo se ele fala menas coisa ou cem real; por melhor
que seja o garom, nenhum cliente o suportar se ele enfiar o dedo no prato de sopa. Aos que
realmente acreditam que o talento o principal, e que ele justifica quaisquer aberraes, lembro que
boa parte da graa de uma piada vem da habilidade de seu contador.
O talento por si s no justifica tudo, muito pelo contrrio. Se no for executado, desenhado,
provado, no adianta nada. Muitos layouts so brilhantes na cabea de quem os criou, mas tm
como resultado um produto medocre, graas a falhas na fotografia, no texto, na diagramao, no
ator e assim por diante. Por melhor que seja a idia, ela s valer se houver muito trabalho para
refin-la. aquela histria dos 99% de transpirao.
E assim que, quando olhamos os portflios de candidatos a designers ou diretores de arte,
reconhecemos em poucos instantes a diferena entre quem tem experincia e um iniciante, por mais
talentosos que sejam. assim tambm que avaliamos a qualidade de um filme no cinema logo no
incio da histria: se as imagens esto meio escuras, se o som no nenhuma maravilha, a histria
ter que ser muito melhor para agradar.
O talento continua sendo fundamental, o principal ingrediente da receita. Mas mesmo a idia mais
talentosa pode parecer insossa se no for bem preparada e temperada. claro que s vezes todo o
material aparece pronto em um estalar de dedos. Diz-se que o Led Zeppelin no gosta da msica
Smoke on the water porque ela foi composta em meia hora, enquanto eles olhavam um incndio no
hotel em que estavam. E justo essa msica se tornaria a mais famosa deles. Disse Led Zeppelin?
Puxa, desculpe, quis dizer Deep Purple. Viu como uma besteirinha pode estragar tudo?

1-6: Identidade corporativa: misso e viso empresarial

Imagem identidade. A identidade corporativa de uma empresa como ela se coloca perante o
mundo. Essa identidade est em cartes, instalaes, folhetos, cartazes, propaganda, website, em
seus funcionrios, no que a imprensa diz seu posicionamento estratgico na sociedade, uma
geral da empresa.
A primeira coisa que vem cabea quando falamos em identidade visual de uma empresa seu
logotipo. Isso acontece porque o logo (para os ntimos) normalmente o primeiro e muitas vezes o
nico contato que ela ter com seu pblico. Por isso to importante e deve sintetizar todos os
elementos que diferenciam essa empresa do resto. Um bom logotipo muito mais que um desenho
bonito ou uma sacada visual. uma declarao de intenes e no deve deixar dvidas.
Algum desses gurus de administrao, em uma ao delirante, definiu que as empresas deveriam ter
impressas em um cartaz e coladas em todas as paredes significativas sua viso e misso
empresariais. Se voc nunca viu um cartazete desses, sorte sua: normalmente um treco meio
bvio, ufanista e complexo. Diz algo como Nosso objetivo visa Excelncia na qualidade dos
servios, dentro dos ambientes interno e externo. Para alcanar a nossa meta h um efetivo
comprometimento entre os componentes da equipe em exercer um papel estratgico na formao e
sustentao de empresas lderes. Nossa Misso: fornecer competncia em marketing, visando ao
sucesso e perenidade de nossos clientes. Nossa viso: exercer papel importante na formao e
sustentao de empresas lderes. Bl, bl, bl. Se pedirmos a qualquer funcionrio da empresa
incluindo o que escreveu o texto que nos conte o que est escrito l, sem colar, poucos sabero.
A identidade de uma empresa como uma relao afetiva: no adianta impor nem relatar, preciso
sentir. Se os funcionrios esto realmente comprometidos na busca de excelncia, isso evidente:
todos esto com os olhos brilhando, trabalhando at tarde e super satisfeitos, sem pensar em trocar
de emprego nem que uma empresa maior oferea um salrio maior. Se a empresa for assim, o cartaz
com sua viso e misso intil. Seno, hipcrita.
a que entra o design de identidade corporativa: se uma empresa quer ser conhecida como
inovadora, ela deve ser realmente inovadora e, para que todo mundo saiba disso, ela deve parecer
inovadora. A identidade a expresso da viso de uma empresa e o trabalho do designer exprimir
essa inteno em uma forma pura e eficiente, em um desenho fcil de ser compreendido. S assim
seu discurso ser coerente e nico. Uma mensagem consistente ajuda a clarear e divulgar toda a
viso de uma empresa.
Depois de definido o design, necessrio aplic-lo, ou descobrir formas de transmitir essa
mensagem nos vrios lugares em que a imagem da empresa visvel, do carto de visitas ao prdio.
Isso no significa colocar o logotipo em um lugar que fique bonitinho, mas transmitir a mensagem.
Quando bem feito, isso funciona melhor at que a publicidade para reforar a imagem de uma
empresa, principalmente em seu pblico mais importante: seu quadro de funcionrios.
O manual de identidade visual ajuda a relacionar o logotipo com suas aplicaes, mas no as limita:
d o tom. Ele explica em detalhes a identidade corporativa para que a empresa no tenha que
reinventar a roda toda vez que us-lo. No significa colocar o logotipo sempre do mesmo jeito e na
mesma posio, mas adapt-lo ao contexto, como adaptamos certas frases e conhecimentos a uma
conversa. Quem no as adapta fica ridculo, vomitando chaves.

1-7: Cada coisa com seu porqu

Peas grficas com um design bem feito so normalmente equilibradas e harmoniosas: todos os seus
elementos se combinam para formar um resultado que muito mais que a soma das partes. Esses
elementos tm normalmente pesos, tamanhos e formatos completamente diferentes, mas, se
tirarmos algum deles temos a impresso de que algo est faltando e o conjunto todo fica estranho,
irregular. Como uma orquestra levemente desafinada. Ou como um quadro incompleto. Terico
demais?
Ento imagine uma sopa salgada demais. Ou um bolo doce demais. Ou um acaraj apimentado
demais. Ficou mais fcil? A culinria o melhor exemplo de harmonia que existe no dia-a-dia, e
deve servir de exemplo para o design. Todos sabem que a culinria uma arte e demanda muita,
muita prtica. E um dos principais cuidados no exagerar nos ingredientes. Salvo em pratos como
moquecas e feijoadas, poucos componentes que fazem o sucesso. Bons cozinheiros so
cozinheiros experientes, que fazem com que at um bife com fritas daqueles bem martelados,
cujo suco molha o arroz soltinho, contrastando com batatas fritas bem crocantes fique
sensacional. Ficou com fome? Eu tambm, lembrei da minha av. Pois esquea a fome e compare
esse bife com o design.
O designer um harmonizador de elementos, por isso deve se comportar como um maestro ou um
cozinheiro. Pode ser difcil avaliar o design e separar o bom do ruim, e gosto no se discute. Mas
existem algumas regras que, se no so completas, pelo menos do uma fora. Funcionam como um
livro de receitas: do referncias. Se forem seguidas risca, daro resultados eficientes e
comportados. Se forem seguidas com inveno podem dar maravilhas ou catstrofes. Quanto maior
for a prtica, menos catstrofes acontecero.
O computador ajudou a criar msica e design sem a prtica, e o resultado no dos mais
animadores (espero no ver o dia em que s for considerado bom cozinheiro aquele que operar bem
o computador). Em uma sociedade informatizada, todas as pessoas ganham a habilidade tcnica
para tirar fotos, escrever ttulos, criar desenhos, fazer layouts e escrever texto. Livros como este so
escritos para encorajar esse processo. O problema que as pessoas esto trabalhando em reas cada
vez mais especficas, o que, se por um lado aumenta o foco e tcnica, por outro faz com que percam
a idia geral do que esto fazendo. Da fazerem partes que podem at ser legais, mas que no
combinam no todo. Um mesmo molho no pode ser usado para linguado, codorna e coelho.
O design especialmente o design digital serve para criar um ambiente para a informao e
torn-la consistente. Por isso, cada pequeno elemento tem que ter um porqu. No adianta colocar
um grafismo em cada canto da tela s para estar l. Em uma situao ideal todos os textos, fotos,
ilustraes e layout acontecem a partir de uma mesma idia. O problema que acontece exatamente
o contrrio: muitas vezes o design uma usina de reciclagem de mdia, reaproveitando tudo o que j
est pronto e fazendo concesses ao conceito para adaptar o layout.
Muitas empresas consideram a WWW uma verso online do saco sem fundo, e enfiam tudo o que
podem nos seus sites, do balano anual a dicas de cinema, na maior parte das vezes em informaes
incompletas que nunca vero uma atualizao. Outras empresas e muitos designers fazem
para cada tela um layout diferente. E ainda h os que preferem no se arriscar e fazem tudo sempre
igual.
A internet nova e muitas de suas regras ainda esto por serem descobertas, mas isso no significa
que seja a casa da Me Joana, muito pelo contrrio. Por ser livre, a web demanda fortes estruturas
de relaes entre seus documentos e um projeto grfico bastante rgido, sem que isso faa dela uma
coisa careta. No fundo, so os mesmos pontos que diferenciam uma revista de um amontoado de
folhas coloridas de papel.

1-8: Percepo: um processo ativo

Alm de se ver, para se fazer design necessrio pensar no que se v. S que a viso e compreenso
do ambiente no so processos simples, muito menos passivos. A maioria das pessoas acredita que
quando vemos s absorvemos informao. No to simples assim. Na verdade, a viso
percepo e leitura so processos dinmicos, uma espcie de dilogo que envolve leitor e objeto.
Quando olhamos para uma paisagem, layout, tela ou pgina, temos uma tendncia natural e
instintiva a organizarmos o que vemos. Os vrios elementos que compem o campo visual definem
estruturas, resolvem ambigidades e impem conexes, dizendo-nos o que ler e em que ordem.
Muitos dos problemas que vemos em design acontecem porque o leitor quer ler a pgina de um jeito
e o designer impe outro. Ou muda as regras de leitura o tempo todo.
A organizao espacial de um texto pode ser usada para reforar ou calar uma mensagem. O uso de
espaos em branco, a organizao do contedo em linhas e colunas, a composio de palavras e
imagens podem ajudar a influenciar a forma com que se l um texto. Ao se fazer um layout, estamos
na realidade querendo criar relaes espaciais para orientar o leitor a ver os objetos em uma certa
seqncia. Isso no fcil, pois no h como prever como um leitor reagir a eles.
Duas escolas da psicologia tentaram descobrir como absorvemos as mensagens que nos empurram
diariamente: o Behaviorismo dos Estados Unidos e a Gestalt alem. Ambas foram desenvolvidas
nos anos 20: enquanto a primeira se preocupava com as formas de aprendizado, a outra focava o
estudo da percepo, em especial da percepo visual, e acabou gerando uma srie de conceitos
que, se no servem como regras, pelo menos podem nos ajudar a entender o que teoricamente se
passa na cabea de quem consome nossos layouts. Deixemos o Behaviorismo para os psiclogos e
vamos nos concentrar na Gestalt, cujo principal objetivo era explicar porque o mundo tem essa
aparncia para pessoas comuns em ambientes naturais. Cientistas especializados como Max
Wertheimer, Wolfgang Khler e Kurt Koffka estudaram as propriedades das formas do mundo
visual em nossa percepo e fizeram vrias revelaes que, se hoje parecem bvias, nem sempre o
foram.
A Gestalt quase uma filosofia. Ao mostrar como funciona nosso processo de percepo, nos faz
questionar o ambiente que nos cerca. Os antigos se orientavam pelas estrelas e atribuam desenhos e
significados mitolgicos s constelaes, que serviam tambm para contar histrias e medir o
tempo. Hoje, como no mais necessrio olhar para as estrelas ou se guiar por elas, poucos
conseguem v-las como mais do que um amontoado de pontos brancos em um cu azul-preto, e
pouqussimos conseguem sinceramente enxergar qualquer formao estelar mais sofisticada que o
Cruzeiro do Sul ou as Trs Marias.
1. Organizao entre elementos
Uma das primeiras descobertas da Gestalt foi que as coisas tm sua aparncia no s pelas
propriedades de suas partes individuais, mas tambm e principalmente por sua organizao.
Mostraram que podemos ver algumas formas que no existem na realidade, mas cuja relao entre
suas partes sugere.
Os objetos com que temos que lidar no mundo prtico (mquinas, automveis, prdios etc.) falam
conosco visualmente, como grupos organizados, e exatamente a relao entre esses elementos que
faz com que reconheamos um objeto. assim que reconhecemos cadeiras feitas dos materiais mais
estranhos. o mesmo princpio que nos faz reconhecer se a msica parabns a voc est sendo
tocada por um rgo, uma soprano, um coral ou pela Marylin Monroe: as pessoas reconhecem as
relaes entre as notas, mais que as notas em si.
2. Imagem vs. fundo
Depois de reconhecer objetos pelas relaes entre suas partes, as pessoas focam a ateno neles e os

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.

1-9: Relao palavra / imagem

Os principais elementos para se compor um design so a imagem e a palavra. Eles interagem e se
completam transmitindo melhor a informao. Relacion-los pode ser uma bela dor de cabea.
Quando valorizar o texto? Quando valorizar a imagem? O que um dever falar? O que fica para o
outro dizer?
A forma mais apropriada para se mostrar informaes depende das caractersticas dos usurios e da
complexidade da tarefa. Textos simples so mais fceis de se entender do que diagramas simples. J
esquemas ou situaes complexas so muito melhor explicados por imagens. Ao juntar imagens e
palavras de uma forma harmoniosa, o designer estar criando uma estrutura para que as pessoas
possam usar a informao. Se queremos que nossos leitores sigam uma ordem, necessrio gui-los
e estar conscientes de que eles nem sempre seguiro nossos conselhos.
Existem quatro tipos de relao entre o texto e a imagem:
Redundante os mesmos elementos so reproduzidos visual e verbalmente, repetindo as idias
principais e contando a mesma histria. Nesses casos, ler o texto ou ver a imagem traz exatamente a
mesma informao.
Complementar texto e imagem apresentam contedos diferentes. preciso ver os dois modos para
que se entendam as idias principais.
Cenrio um dos elementos define um cenrio (ou ambiente) e conta a situao. O segundo conta
uma histria dentro desse ambiente.
Suplementar os contedos de texto e imagem so diferentes. Um modo domina, mandando as
idias principais enquanto o outro refora, elabora ou as explica.
Ao se combinar os elementos, sempre bom levar em conta que o usurio no est nem ligando
para qual dos dois o mais importante: ele procura por informao, e ela deve ser reforada. Para
isso bom conectar o texto imagem, relacionando-os atravs de legendas e ndices, auxiliando o
leitor a entender o que est se passando. Se o conceito for mais difcil, bom refor-lo com
redundncia, detalhando a imagem ou repetindo a informao no texto.

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.

3-1: Grids: cada coisa em seu lugar

Uma das melhores formas de se organizar os elementos em uma pgina ou tela usar grades de
alinhamento, tambm chamadas de grids. Essas ferramentas dividem o espao visvel em reas e
do maior consistncia a um layout. So o terror de quem est comeando a fazer design e a
salvao de quem j tem alguma prtica.
Sua funo criar ordem no caos que pode se transformar um documento. O grid padroniza os
espaos e ajuda o usurio a achar o que procura no lugar esperado todas as vezes. E fora o designer
a pensar construtivamente, de forma estruturada, para que o visitante no tenha que descobrir, a
cada instante, o que foi projetado.
Se ele assim to bom, porque apavora quem est comeando? Exatamente por falta de prtica.
Como no esto habituados com a estrutura, no conseguem conceber grids inovadores ou ocupar
criativamente seus espaos e acabam se prendendo a uma camisa de fora estrutural. Pura bobagem.
O processo correto deve ser: examine os elementos a mostrar monte o grid encaixe os
elementos. Se no se encaixarem sinal de que o grid no funciona. Nesses casos, deve-se
redesenh-lo. Mas ateno: s se faz um grid para todo o projeto grfico de uma revista ou website.
No existem documentos com um grid para cada pgina, isso Calvinball.
O grid d apoio legibilidade, reconhecimento, alinhamento e compreenso da mensagem. Se ele
for bem feito vai garantir a repetio (os elementos ficam sempre nos locais esperados), composio
(facilita o equilbrio dos elementos na interface) e comunicao (sua estrutura previsvel facilita a
compreenso das diversas telas de uma interface). Seu principal uso a unificao do campo visual
em uma mensagem consistente e harmoniosa.
Acima de tudo, um grid deve se encaixar como uma luva ao layout e servir exclusivamente para ele
e para nenhum outro. S assim teremos certeza de que ele est adequado. Grids muito genricos so
como folhas em branco, s que com umas linhas para atrapalhar. Grids muito detalhados so como
folhas de papel quadriculado, igualmente inteis.
Referncias visuais
O grid usa o princpio da Gestalt de reconhecimento de formas estveis e fortes. Ao organizar o
contedo da pgina ou tela em grandes imagens, ajuda o leitor a agrupar os elementos em conjuntos
de significado e orienta a leitura. Ele no precisa ser retangular, pode seguir qualquer forma. O
calendrio maia, em referncia ao Sol, era organizado em uma estrutura circular. O mesmo acontece
em mapas astrais. O grid retangular o mais comum por um motivo bastante simples: os papis e as
telas de TV e computador so retangulares.
Espaos horizontais e verticais
Outro princpio da Gestalt o relacionamento entre objetos em um campo visual estimula o uso
sensato dos espaos horizontal e vertical. Espaos horizontais so a entrelinha, o espao entre os
pargrafos, o espao entre um texto e uma imagem, os espaos entre duas imagens e assim por
diante. Espaos verticais so margens, larguras de colunas, espaos entre objetos e textos, espao
entre cones e botes etc. Em uma relao equilibrada, eles so mltiplos entre si. Alterar um deles
implica na alterao de todos os outros.
Os espaos horizontais e verticais interagem e influenciam para transmitir ao usurio a estrutura do
documento, que percebida como um todo, dinamicamente, de uma s vez. Por isso, preciso
considerar os espaos horizontais e verticais e sua interferncia na pgina como um todo. Medir
pginas em unidades mais precisas como pontos tipogrficos ou pixels, em vez dos genricos
centmetros um bom comeo.
O grid deste livro, por exemplo.

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.

3-2: Fazendo um grid

1. Faa um levantamento completo dos elementos que sero usados no layout ou conjunto de
layouts.

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:

Ilustraes ou fotos com legendas; e

Ttulos, subttulos e textos.

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.

3-3: Caligrafia, tipografia e legibilidade

Cada letra um desenho. Exagerando um bocado, cada letra um pequeno milagre. Graas a elas
podemos registrar nossa histria, transmitir a cultura, divulgar a cincia etc. etc. etc. Letras so
muito bonitas, so pequenos desenhos fonticos que sobreviveram a todas as doideiras da histria.
Se voc parar para examinar todas as curvas e detalhes de um simples r minsculo vai entender
melhor do que estou falando. Letras podem ser de tudo, s no so fontes. Fonte uma esttua de
pedra que costuma ficar no meio de uma praa cuspindo gua. Letra letra. Pode tambm ser
chamada de tipo (ou face, do ingls typeface).
As letras e a escrita parecem ser daquelas invenes que existiram desde sempre, mas no
exatamente assim. As minsculas, por exemplo, vm do latim e s foram desenvolvidas entre os
sculos VI e VIII para facilitar a escrita mo: o imprio de Carlos Magno estava se expandindo e
era necessrio aumentar o nmero de Bblias. Para escrever mais rpido, monges adaptaram os
formatos das letras, criando desenhos menores ao longo do texto. Essas letras minor (menos
importantes) eram chamadas de minuscule, deixando as majuscule (de major) para iniciar os nomes
prprios. Na lngua alem os substantivos at hoje se iniciam com letras maisculas.
Por volta de 1454 o ourives Gutemberg inventou a prensa de tipos mveis, tornando o trabalho de
alinhar letras, formar linhas, compor pargrafos e imprimir muito mais fcil, de artesanal para
mecnico. A impresso ficou mais rpida e popular, mas o design ainda era o mesmo. A maioria das
letras derivava de desenhos da renascena, especialmente de Veneza. Esses designers tipogrficos,
por sua vez, se inspiraram nas inscries feitas na coluna romana de Trajano, esculpidas por volta
de 114 D.C.
No era fcil criar uma famlia de letras naquela poca: primeiro era preciso desenhar todas as letras
mo, esculpir moldes em madeira com o negativo de cada forma, moldar seus carimbos em
chumbo derretido (que foi substitudo mais tarde por uma liga metlica de chumbo e antimnio) e
formar um molde para cada letra criada. A palavra abracadabra, por exemplo, demandava cinco
moldes para a letra a, dois para b, dois para r e assim por diante (Edgar Allan Poe escreveu
um conto divertidssimo x-ing a paragrab sobre esse processo).
A primeira inovao tecnolgica de peso foi a inveno do linotipo, no final do sculo XIX,
permitindo que se chumbassem linhas inteiras de tipos de uma s vez. Da o nome: lin-o-type. At o
comeo do sculo XX, as regras para o desenho de letras eram as mesmas dos entalhadores de
pedras romanos, com pequenas excees.
A primeira letra a romper completamente com a estrutura clssica, se concentrando em suas formas
bsicas e na comunicao foi a Futura, desenhada por Paul Renner em 1930. Anos depois surgiram
Helvetica e Univers.
No final dos anos 80 ainda era comum o uso de processos mecnicos para se fazer impressos: tipos
moldados, fotolitos feitos diretamente a partir de fotografias, artes finais desenhadas a nanquim ou
montadas a partir de colagens e outros materiais feitos mo. A Desktop Publishing, viabilizada
pelos produtos das empresas Apple Xerox Adobe Aldus Linotype, s se tornou realidade
fora dos Estados Unidos no incio dos anos 90.
Hoje, qualquer computador pode permitir a seu usurio a criao e alterao de formas de letras,
dando a qualquer um a possibilidade de inventar alfabetos e aplic-los.
Serif, Sans-serif?
Voc j deve ter ouvido falar por a de letras serifadas ou sem serifa. Em uma definio resumida,
serifa a haste perpendicular que termina os principais traos de algumas letras. Esta letra N (Times
New Roman, Bodoni) tem serifa, esta N (Frutiger, Helvetica) no. Esse recurso facilita a leitura de
textos impressos, pois ajuda a aglutinar as letras em palavras. No design grfico quase obrigatrio

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.

4: A Internet a resposta. Qual era mesmo a pergunta?

Todo mundo estava feliz e satisfeito com a publicidade, o marketing direto e as vrias formas de
comunicao de massa quando, sem ser convidada e sem pedir licena, surgiu a tal rede mundial
e todos os seus servios, que at hoje pouca gente sabe quais so.
A Internet e os outros produtos de comunicao digital (CD-ROM, DVD-ROM, multimdia,
realidade virtual, videogames, WAP, P2P, ICQ etc.) s vezes parecem como sexo para adolescentes:
ningum sabe o que direito mas todo mundo fala sobre e quer fazer. E, por mais insatisfatria que
seja a experincia, fazem questo de cont-la para todo mundo em detalhes. E isso acontece porque,
como o sexo para adolescentes, a internet uma experincia nova, digital, diferente de tudo que j
foi feito antes em termos de comunicao. A TV lembra, na maior parte de sua comunicao, teatros
e tribunas, que so conhecidas desde que o mundo mundo. O jornal e as revistas usam papel, que,
desde crianas, ao manipular o Tio Patinhas, sabemos como funciona. J para a comunicao digital
no existem parmetros, referncias ou estruturas conhecidas. Assim, como no h com perdo
da m palavra paradigmas, faz-se de tudo e tudo lindo, lindo, lindo, um desbunde. Falar em
qualidade , seguramente, mudar de assunto.
A entrada dos computadores nas comunicaes causou trs revolues em um perodo de pouco
mais de dez anos, virando empresas de cabea para baixo, desempregando e abrindo espao para
novos profissionais. Primeiro foi a desktop publishing, ou editorao eletrnica, que substituiu todo
o processo de design grfico que vinha sendo feito, com poucas modificaes, desde a inveno da
tipografia mvel pelo velho Gutenberg. Depois foi o vdeo digital, que substituiu as cmaras de
tubo e o processo de edio usando fitas magnticas e geraes. Agora a internet que chega para
deixar todo mundo confuso. No toa que ela provoque tantas reaes apaixonadas.
A chegada da internet, na realidade, tem muito pouco a ver com a informtica e no pode ser
comparada com a transformao causada pela entrada dos Macintoshes coloridos nos estdios em
1986 (eu sei, voc no dessa poca, mas saiba que livros inteiros como esse j foram feitos sem
computador). A editorao eletrnica e o vdeo digital nada mais so que meras extenses de um
processo que todo mundo estava acostumado a fazer: troca-se a Letraset pelas famlias de letras de
computador, o aergrafo pelo Photoshop e o resto continua igual. J para a internet tudo muda: ao
fazermos criao digital no estamos aprendendo a falar outra lngua, estamos aprendendo outra
forma de comunicao. E a no d para traduzir um texto em alemo para linguagem de surdomudo. At d, mas o resultado pobre.
A internet no ser a ltima revoluo, pelo contrrio: de agora em diante elas tendem a ser cada
vez mais constantes e volumosas. Vm a a TV interativa, o papel digital e a wireless broadband.
Depois disso, nem o cu ser o limite.

4-1: Design grfico vs. design digital: berimbau no gaita

Pense em um videogame. Mesmo que voc nunca tenha jogado, faa um esforo. Pense em um
Super Mario, que voc tem que subir e descer escadinhas etc. No se sabe qual o tamanho do prdio
ou quantas escadas existem para se percorrer, simplesmente corre-se tentando descobrir. Imagine
um Quake, Doom ou qualquer outro do gnero. Voc est l, matando seus inimigos sem saber o
porqu, nem quantos vai ter que matar. Tampouco sabe o ambiente em que est, mas isso realmente
o incomoda? No. Na realidade voc no precisa fazer a menor idia do ambiente, muito pelo
contrrio. Descobri-lo, explor-lo, analis-lo o verdadeiro nome do jogo. O que importa a eterna
redescoberta e no um mapinha pronto, dando tudo mastigadinho tintim por tintim. Como em uma
conquista e relao amorosa. Ou em um jogo de futebol.
Voc j reparou que quase ningum l o manual de um novo programa de computador? Ou melhor,
os que o lem normalmente s o fazem depois de oper-lo (e quebrar a cara) ou quando algo d
errado. A maioria quer explorar o programa, brincar com ele, descobrir suas potencialidades. o
mesmo princpio que leva um beb a colocar um chinelo na boca ou os dedos na tomada.
Agora lembre-se do jornal que voc recebe em casa todas as manhs. Voc realmente precisa de
todas aquelas pginas impressas ou o importante a informao impalpvel que elas contm?
Quando lemos um jornal no necessrio saber quantas pginas ele tem ou seu total contedo. No
importante saber se ele fala sobre futebol quando estou lendo sobre economia. Isso informao
irrelevante, desnecessria. Mas como em papel impossvel criar material a partir do nada, o jornal
de domingo acaba tendo que ser volumoso, com mais da metade de seu contedo desnecessrio e
pronto para ir para a usina de reciclagem. Ou seja, jornal e notcia no so a mesma coisa. A mdia
de massa os transformou em sinnimos por falta de opo, pois impossvel por enquanto
entregar um jornal diferente para cada leitor.
Disseram que a fotografia iria acabar com a pintura, mas o que ela fez foi abrir novos horizontes,
trazendo mais idias e parmetros e amplificando o panorama. O mesmo pode se dizer do cinema,
teatro e pera. Da mesma forma, a internet e a comunicao digital s vo valer a pena se puderem
proporcionar estruturas inovadoras e diferentes, impossveis de se criar em outras mdias. S a
poderemos dizer que estamos descobrindo sua verdadeira linguagem. At l estaremos com
mmicas pobres apesar de bonitinhas.
Com a internet nunca foi to fcil mudar de canal ou desistir da leitura no meio. Fazer design para a
WWW no fcil, porque cada tela pode se comportar de uma forma diferente: so browsers,
computadores, sistemas operacionais, cores, letras, tamanhos de monitor etc. No h como desenhar
documentos que fiquem iguais em todos os sistemas a no ser que se nivele por baixo. Por isso
muito importante saber o que o meio comporta e o que no comporta.
Toda linguagem tem sua sintaxe, que o conjunto de regras que a estrutura e sua potica, que so
idias criativas elaboradas a partir dessas regras. Se no conhecemos a sintaxe, s poderemos
elaborar poticas por acaso ou sorte, e no d para contar com isso todos os dias. O design grfico
tem vrias regras: organizao do material em pginas, ndice, ttulos etc. No seria fascinante e
desafiador se, de repente, todas as regras de design e todo o design como o conhecemos
desaparecesse? Se o papel e a relao do design com o leitor fossem completamente reinventados?
Assustador? Pois . Eis o desafio do design digital.
Para imaginar suas possibilidades, imagine uma revista diferente. Para comear, na forma: ela um
cubo. Em cada uma das suas seis faces existe uma capa diferente, dizendo respeito a um contedo
diferente. Ao abrir a revista, mais surpresas: as pginas no tm numerao nem ordem fixa. Podem
ser lidas em qualquer seqncia, como fichas soltas. medida que as pginas so lidas, a sua ordem
se altera. As matrias no tm fim, vo se misturando e complementando de tal forma que a
impresso que se tem que todo o contedo um artigo s, emaranhado e complexo. Esse contedo

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.

4-2: O que voc precisa saber

O que h de to diferente, afinal? Para comear, no existe mdia virtual, design virtual, criao
virtual. Isso porque virtual quer dizer inexistente. Aprendemos nas aulas de fsica que virtual a
nossa imagem no espelho, pois ela no existe, mas parece estar l. Os computadores e sistemas
digitais fazem aparecer componentes virtuais: pginas que no existem de verdade, que no podem
ser tocadas, no tm cor, cheiro ou forma. O rdio, ao descrever situaes e ambientes, tambm
trabalha com o virtual. A maior parte das coisas que hoje nos so virtuais vm atravs de uma
tecnologia digital, mas nem tudo que digital virtual e vice-versa. As informaes disponveis na
Internet so digitais; o espao que elas determinam que virtual. Quando clico e vejo uma pgina,
quando entro em uma sala, essa pgina ou sala no existem de verdade. So projees que fazemos
para tentar compreender o mundo esquisito que o digital.
Complicado? Desculpe-me. Em resumo: virtual algo como a Julia Roberts, que no existe no
mundo real. Esse foi seguramente o conceito mais difcil e intil. Ele s serve para dar uma pequena
noo do tipo de ambiente em que voc est entrando. Os outros so mais prticos: do uma noo
geral dos elementos usados no design para a internet. Se voc j sabe um mnimo, pule essa seo.
Pginas e sites WWW
Site, em ingls, quer dizer stio, lugar. Um site internet pode ser definido como o lugar ou o
endereo de uma pessoa ou empresa na WWW. Na realidade, apenas espao em um disco rgido
de um computador ligado internet. O contedo de um website s pode ser alterado por um grupo
restrito de pessoas autorizadas, mas qualquer um pode v-lo. Ele funciona ao contrrio das caixas
postais de e-mail, para que qualquer um pode mandar contedo, mas s autorizados podem v-lo.
Dizemos que um site est no ar quando ele pode ser acessado via internet.
O contedo de um site um conjunto de documentos multimdia de acesso remoto, nada mais. O
que existe nessa multimdia que faz a diferena: algumas contm textos extensos, outras colees
de fotos, outras ainda estimulam a participao e a conexo dos visitantes a bancos de dados,
utilizando recursos de hipertexto.
Muitos chamam um website de Home Page. Outros chamam cada tela de Home Page. Na verdade,
home o nome dado primeira tela de sites de navegao simples, usando a mesma metfora: se
o endereo completo o stio ou local, a primeira pgina o lar, um local ntimo ou amigvel que o
recebe. Ela deve ser bonita, de acesso fcil, mostrar do que trata o endereo e o que fazer ali. Se
estiver perdido, volte para casa e veja como seguir adiante.
Endereos digitais com navegao bem trabalhada no usam home page. Tm, claro, uma
primeira tela para recepcionar o visitante e depois entrelaam seu contedo, ligando informaes
relacionadas.
Da mesma forma que no se volta recepo de uma empresa quando se vai de um departamento
ao outro, um site bem desenhado no deve fazer com que o visitante volte para a home page.
Convencionou-se chamar de pginas os documentos de hipertexto armazenados na WWW. Eles
no so exatamente pginas, pois tm dimenses e caractersticas muito diferentes de seus
equivalentes em papel. Mas tambm no so telas, uma vez que seu contedo pode facilmente
ultrapassar as dimenses de uma tela. Talvez o certo fosse documento web ou elemento de
hipertexto. Como esses termos so especficos e sofisticados demais, usa-se a idia de pgina web
ou pgina digital. Um website composto de vrios documentos de hipertexto intercalados e dos
recursos relacionados a eles: imagens, sons, vdeo, multimdia etc, que ficam gravados no disco
rgido do servidor.
Cada vez que um computador acessa esse endereo, uma cpia digital do primeiro arquivo de
hipertexto transmitida, chamando todos os recursos aos quais est interligada. a tal home page,

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:

simplesmente ilustrar;

servir como um boto com link de hipertexto;

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.

4-3: O que voc no precisa saber

Quem est envolvido na criao de sites deve ESQUECER a programao. Pensar em viabilizao
s atrapalha o processo. No importa saber como programar em todas as linguagens e plug-ins.
Tudo o que se deve ter em mente para que serve cada coisa, suas possibilidades, limitaes e usos.
Isso no fcil, pois preciso esquecer tudo o que se sabe sobre design e publicidade feitos para o
papel ou TV e tudo o que se acha que sabe sobre sites e comear do zero, trabalhando com lpis e
papel e inventando as idias mais malucas possveis e entreg-las assim, no papel e no Photoshop,
para os programadores. Fim da fase I.
Depois desses delrios criativos, hora de colocar o p no cho. Alis, como diria um amigo meu,
os quatro ps: conversar muito com o programador ou empresa de produo e ter enormes doses de
pacincia ao explicar que aquilo que vai dar trabalho para fazer e aparentemente no acrescenta
nada ao contedo do site , na realidade, fundamental para o design.
Designers e programadores costumam nutrir uma relao destrutiva de desprezo mtuo. Um acha
que o outro bitolado e preguioso, o outro acha que o primeiro adora frescuras e firulas sem
sentido que s comprometem a compatibilidade e a navegao. Ambos esto errados e assim no se
vai a lugar algum. A relao deveria ser o inverso, j que so pessoas especialistas em reas to
diferentes que at ficam em metades separadas do crebro.
A habilidade lgica especialidade do pensamento digital, que fica do lado esquerdo. A habilidade
grfica tarefa para o pensamento analgico, do lado direito. Tenho uma profunda e sincera
admirao pelos malucos que enfrentam uma selva de linhas e mais linhas de variveis de cdigo
sem medo. Voc j conversou com um programador, daqueles bem doides? E tentou respeitar o
seu ponto de vista, escutando o que ele fala e tentando seguir a sua linha de raciocnio? Experimente
esquecer a aparncia, entusiasmo ou mesmo as roupas deles (reze, alis, para que faam o mesmo
com voc) e preste ateno nas suas idias: nelas est a maioria das solues criativas de design e
roteiro de que voc precisa.
Muitas pessoas que trabalham hoje com comunicao digital querem ser profissionais
multifacetados, tentando dominar a criatividade e a tcnica. Isso no funciona porque essas reas
no so complementares e o que acontece que uma acaba passando por cima da outra: fazem sites
com belo design mas com navegao ruim ou tentam forar a barra para o uso de uma tecnologia
qualquer sem necessidade.
Pode parecer ridculo, mas o que no falta para a execuo de belos e eficientes websites a
tecnologia. O problema que a maioria dos websites est sendo feita por profissionais que ainda
no entenderam direito para que serve o hipertexto e como us-lo, ou seja, no conhecem as
ferramentas com que trabalham. a que mora o problema. Ou, como diz aquela msica: se no
sabes aonde vais, porque teimas em correr?

4-4: Possibilidades e limitaes

Falamos mil maravilhas das caractersticas do design na internet e suas possibilidades, mas a
realidade bem diferente: a maioria dos sites lerda, feia e chata. s dar uma passeada pelos sites
das principais empresas do Brasil que o resultado desanimador: a maioria pobre, vazia,
espartana. Os que fazem algo diferente criam endereos confusos, cheios de informao irrelevante
e de bugigangas tecnolgicas que precisam de downloads lerdssimos ou travam qualquer
computador que no seja do ltimo tipo, no tenha mundos de memria nem esteja usando o ltimo
modelo de browser. claro que no so todos assim. Existem excees louvveis, mas so poucas.
E isso no exclusividade brasileira. Mesmo estando no ar h mais tempo e terem um pblico
maior, sites americanos sofrem do mesmo mal. Os que fazem melhor se enquadram, em sua
maioria, em duas categorias: os bonitinhos, cujo layout imita a mdia impressa e os tecnolgicos,
que falam uma lngua esquisita e tm mil coisas que piscam e pulam na tela. O primeiro peca pela
covardia, ao no usar bem os recursos da rede. O segundo, pelo excesso, ao no entender que usar
esses recursos no quer dizer us-los todos de uma s vez.
A internet tem vrios recursos que os outros meios de comunicao no tm. Os dois principais so
a personalizao criao de veculos que permitem um contato verdadeiramente individual e a
manipulao, que muita gente adora chamar de interatividade: os documentos se reorganizam e se
acumulam, o que torna cada contato uma experincia nica. Na sua essncia, ela bem parecida
com um bate-papo tpico: um assunto vai levando ao outro, que leva a mais um e assim por diante,
de uma forma agradvel, de acordo com o interesse do ouvinte. Parece tambm com uma conversa
com uma criana de cinco anos na fase dos porqus: uma palavra que ela no entendeu leva a uma
nova histria, e a velha esquecida. Um site que respeite essa linguagem estar fazendo web com
cara de web, e que s poder acontecer na web.
O digital s vai valer a pena quando puder proporcionar algo que o papel no proporciona, e isso
pode demorar para acontecer. No comeo, a internet super legal: um clic e voc est em Paris, no
Louvre. Outro, e voc est fazendo compras em Nova Iorque, sem tirar o pijamo. E da? O que
fazer com isso tudo? Pra que serve tanta informao? A televiso teve que esperar mais de 30 anos
para perder a cara de teatro filmado ou de cabeas falantes e, mesmo assim, boa parte de sua
programao ainda poderia estar no teatro ou rdio. Foi s quando a gerao que cresceu vendo
Jeannie um gnio resolveu fazer TV com cara de TV que surgiu o videoclipe e a MTV. E da
mesma forma que ns no nos entusiasmamos com livros ou teatro da mesma forma que nossos
pais, as prximas geraes vo achar o cinema e essa histria de ficar duas horas sentado em uma
sala escura de uma chatice incomparvel.
Pela primeira vez em mais de 3000 anos o design mvel e participativo. Pena que poucos saibam
disso e se preocupem em estruturar sites adequados realidade do que esto promovendo. Pois
nunca, em toda a histria recente das comunicaes, um meio foi to livre de dogmas e estruturas.
Algumas caractersticas para se levar em conta:
Adimensionalidade - um produto de comunicao digital no tem dimenses fsicas, nem h como
saber o volume de informao disponvel, estimulando a investigao;
Alinearidade - o contedo pode ser consultado na ordem e conexo que o leitor quiser;
Disponibilidade - os documentos esto sempre mo;
Hipertexto - cada assunto abordado em um documento pode apresentar diversos nveis de
profundidade, conforme o interesse do leitor;
Manipulao - um mesmo contedo pode ser visualizado, alterado e transformado vrias vezes;
Multimdia - ao combinar dados em diversos formatos (som, fotografias, vdeos, desenhos

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.

4-6: Pginas pessoais

Nos primeiros tempos da popularizao da web festejou-se a existncia de pginas pessoais,
websites individuais que dariam rede mundial um ar mais democrtico. Como uma variante das
tribunas, em que qualquer um poderia subir e discursar sobre qualquer coisa. A idia louvvel e
alguns endereos digitais fazem jus a ela: so impressionantes pelo contedo e dedicao de seus
mantenedores, quase altrustas, mesmo que no se goste do tema. No fundo, cada um de ns
especialista em alguma coisa: selos, futebol, carros, Sandra Bullock e um site pessoal pode ser
um lugar bacana para se disponibilizar esse tipo de informao, fazer contatos e at trocar idias.
O desenho de websites sem objetivo comercial direto considerado por alguns a mais nova
manifestao da arte pop. Na mesma linha, diz-se que a www o maior evento pblico de arte da
histria pera, devagar com o andor. Se de certa forma louvvel a existncia de mais um canal
de comunicao para artistas em sites que nunca seriam viveis comercialmente, outros esto
aproveitando o canal para um exibicionismo sem parmetros. A questo uma s: h algo a dizer?
Se no houver ou se no conseguir atualiz-lo, no o diga. At porque a tal democracia virtual
limitada. Pois se fcil conseguir um espao em um provedor de acessos, est cada dia mais difcil
pagar os custos de bons redatores, fotgrafos, designers e programadores para se produzir um
contedo decente.
Alis, a esttica desses sites um captulo parte. Sem a menor noo de princpios de design e
navegabilidade, mais fascinados pelas possibilidades que a tecnologia oferece que conscientes das
necessidades de comunicao, muitos autores de sites pessoais agem como adolescentes em
rodzios de pizza, tentando consumir o mximo. Isso cria na cabea de muitos a necessidade de algo
piscando e pulando na tela para um site de sucesso.
a esttica dos sem noo, que seria at cmica (como o a esttica das videocassetadas) se todo
mundo tivesse opinio formada a respeito do que bom e do que ruim na internet como
acontece com a televiso mas muita gente no v diferena entre o ingnuo e o profissional. E,
se quem aprova o website tambm no entender de design ou comunicao, a situao s pode
piorar.
Com tecnologias tipo Flash, Cascading Style Sheets, QuickTime VR, pginas geradas
dinamicamente, bancos de dados e sistemas de busca ao acesso de todos, ficou muito mais fcil
fazer design digital. Muitas empresas de informtica se especializam em programao e gerao de
infra-estrutura. Com isso viram fornecedores e do aos designers possibilidade de inventar cada vez
mais.
Mas ao mesmo tempo parece-me que um vrus continua a se manifestar: muitas peas criadas para
clientes importantes ainda tm objetos inteis, tridimensionais, girando s para estarem l. Ou
coisas tpicas de pginas pessoais, como arrobas giratrias, envelopinhos que voam, setas que
giram, textos coloridos, fundos de tela confusos.
O pior de tudo que h uma esttica embutida nessas pginas pessoais. E ela como o Kitsch, as
calas boca-de-sino e as batas psicodlicas vai demorar para desaparecer e ainda bem capaz
de voltar para nos assombrar. Se voc duvida, s pensar que o designer David Carson (que, entre
outras coisas, fez o projeto grfico da revista Trip) se inspirou nas placas de rua desenhadas nas
redondezas de sua casa.

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.

5-1: Caractersticas de uma interface

Ao contrrio dos cinco mil anos de histria da palavra escrita, o design de espaos digitais um
processo to recente que ainda no existem regras ou movimentos estticos para defini-lo. Alguns
princpios bsicos de legibilidade se conservam (simplificao, harmonia, contraste) outros so
invertidos (o tipo de letra adequado para a leitura) e outros ainda so completamente novos (no
existe regra para a criao de ligaes de hipertexto). O mais comum hoje em dia a adaptao de
idias do design grfico ou da televiso para os meios digitais, o que no passa de uma soluo
provisria. bom levar em conta:
O tamanho da tela varivel. CD-ROMs costumam limitar a rea til em 640480 pixels, browsers
podem ocupar qualquer tamanho em um monitor. Muitas pessoas usam monitores de 800600
pixels, outras de 832624, ou 1024768. Mesmo a tela sendo grande, nada impede o usurio de
abrir uma janela pequena.
Como no existe tamanho fixo nem definitivo para a interface que aparecer na tela, o design deve
ser bastante verstil para poder se acomodar a qualquer configurao.
Consistncia - deve existir uma forma coerente de ao para que o usurio se familiarize com o
sistema. Ele no deve ser forado a tentar adivinhar como o programador pensou, muito pelo
contrrio. Por isso importante achar uma boa soluo de design e mant-la por toda a interface.
As pessoas procuram padres e formas reconhecveis nos espaos para se orientarem e conseguirem
entend-los: ao entrarmos em ambientes desconhecidos gastamos um tempo razovel tentando nos
situar dentro deles. Por isso que, muitas vezes, ao sairmos de um elevador viramos para a direo
errada. Em um website a importncia da consistncia ainda maior, pois no h espaos reais nem
dimenses fixas. Tudo pode acontecer, at sermos redirecionados a outro site. Por isso importante
mostrar para o visitante que ele no deixou o ambiente. Essa consistncia deve ser visual (manter a
cara das telas), mecnica (navegao) e conceitual (a tnica do site) em todas as telas.
Estruturas de aponte-e-clique, no lembre-se-e-digite. A maior parte das aes se apia em
reconhecimento, no lembrana. Assim, no faz sentido forar o usurio a decorar qualquer dado
que o computador j saiba. O usurio interage diretamente com a tela do computador (tanto que,
sempre que a mquina trava, queremos dar um tapa no monitor, no na CPU): ele v na tela o que
est fazendo e aponta para o que v. Por isso, os objetos e cones devem ter uma aparncia
condizente com a sua funo. S quando o usurio estiver certo do que quer e familiarizado com o
sistema, comandos de teclado podem ser uma boa soluo para garantir rapidez.
A navegao e comunicao devem ser facilitadas. Ao contrrio dos outros meios de comunicao,
as dimenses e estrutura de um sistema digital so sempre imprevisveis, por mais convencionais
que sejam. A interface deve facilitar a explorao e leitura. Voc pode colocar seus botes em
qualquer ponto da tela, contanto que eles fiquem na mesma posio por todo o site.
cones no so obrigatrios. Pequenas ilustraes, cones e botes s devem ser colocados em uma
interface se facilitarem a comunicao. muito comum o uso de elementos acessrios, degrads ou
animaes dispensveis, dificultando a leitura e tornando a interface mais lenta e confusa. Nesse
caso, uma boa alternativa pode ser troc-los por texto. J um cone simples, sinttico e claro
funciona melhor que um amontoado de palavras. A placa de proibido virar direita seria
compreendida at por um aliengena. J as placas de PARE e Proibido estacionar variam conforme a
cultura.
Manipulao direta. importante dar ao usurio a sensao de controle das atividades do
computador. Mover o mouse uma atividade fsica que deve ter uma resposta fsica no mundo
digital: lpis desenhando, tpicos iluminados. O usurio sempre quer saber quais so as funes
disponveis e o que fazer a cada instante. Assim, ele e no o computador quem deve iniciar e
controlar todas as aes de um sistema. Todos ns aprendemos e reagimos melhor quando estamos

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

5-2: Elementos de uma interface

Qual o assunto? Uma interface precisa ser bastante clara e objetiva. Deve deixar evidente onde
para se clicar e onde no . No pode dar margens a dvidas e ambigidades. Acima de tudo, um
instrumento de comunicao, por isso deve transmitir a informao da melhor forma possvel.
Mesmo que o usurio no goste de um website, importante que saiba do que se trata.
Isso no quer dizer que deva colocar frases do tipo clique aqui para entrar ou outras besteiras do
gnero, no desse tipo de objetividade que estamos falando. Isso ofende a inteligncia do usurio
e s dificulta a comunicao. O importante dar certezas ao usurio.
Um website uma apresentao, uma demonstrao, uma aula. E deve se comportar como tal.
Acima de tudo, deve ser previsvel e fcil de usar, dando acesso a toda a informao da forma mais
rpida e clara possvel, pois, a qualquer vacilo, ele est a um clique de outro website.
Para que a interface seja clara, ela deve usar smbolos fceis de se entender. Se no der para fazer
bons cones facilmente inteligveis, no force a metfora: use texto. infalvel e voc sempre
poder disp-lo em uma famlia de letras extravagante. Uma interface deve sempre levar em conta:
Mobilidade. O design digital combina elementos estticos com animaes, vdeos, letreiros e com a
prpria movimentao que o usurio faz de todos esses elementos. Essa harmonia delicada (os
outros veculos de comunicao so inteiramente estticos ou dinmicos) e deve ser levada em
conta na criao de uma interface, para que o resultado final no incomode.
Navegao. No necessrio dizer ao leitor de um livro ou revista como navegar por ele: o
processo quase sempre o mesmo, no importa qual seja o ttulo, e o leitor j est habituado a virar
as pginas. No meio digital essa mamata no existe, por isso importante dar ao visitante uma
orientao em sua explorao do espao virtual.
Conexo. Ligaes de hipertexto so pontos de conexo com outros documentos e desvios na
leitura linear de um texto. Por isso sempre importante tomar cuidado com o destaque das ligaes,
j que a cor, formato ou elemento grfico pode direcionar a ateno do leitor e indicar o sentido da
ligao de hipertexto.
cones e botes
So os principais elementos de contato entre o usurio e o produto digital, por isso devem ser
desenhados com muito cuidado. Se verdade que eles devem acompanhar todo o estilo da interface,
muito mais importante que eles sejam prticos e de compreenso fcil, caso contrrio sero
inteis.
Smbolos elaborados so muito difceis de fazer, porm duradouros. Os signos universais para os
sexos funcionam melhor que muitos desenhos de banheiros de restaurantes descolados. A no ser
que voc tenha uma excelente idia para substituir os tringulos e quadrados que representam os
controles de um videocassete, no o faa: pode ser que seu usurio no tenha uma percepo to
criativa.
Duas histrias curtas sobre banheiros, para que voc tenha idia do desconforto que um cone
confuso pode causar:
1) No interior da China a maior parte dos banheiros tem os nomes masculino e feminino
escritos na porta. Em Kanji, alfabeto chins;
2) Na itlia comum vermos banheiros com os dizeres Bambini (meninos) e Bambine (meninas); e
3) Existe uma velha histria de um garotinho que foi para os Estados Unidos e entrou no banheiro
feminino, pois leu Women como U OMEN (o homem). Na real, somos todos estrangeiros quando
entramos em um site novo.

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-3: Por uma esttica digital

Pode parecer muito estranho, talvez at meio ridculo, mas uma das coisas que mais sinto falta na
web hoje em dia de tradio. Seria to bacana se pudssemos ter contato com anos e mais anos de
histria da digitalidade ou seus similares para nos entupir de referncias. Ah, perder dias em busca
de referncias em uma pesquisa/diverso pelas interfaces e roteiros dos Gauguins digitais, seus
Leonardos, Disneys, Sfocles, Ionescos, Pirandellos, Van Goghs, Hitchcocks, Spielbergs usar os
hyperlinks como Aristteles, Capote, Joyce, Pessoa, Vincius seria to bom poder citar
influncias de arte sacra, de escrita carolngia, de mitologia tupinamb em nossas interfaces
Seria lindo, mas bom acordar: nada est disposio, pois no tinha sido inventado na poca
deles. E, se temos a nosso favor um terreno criativamente virgem, em que ainda nenhum Joo
Gilberto inventou nenhuma Bossa Nova digital, temos tambm contra ns o fato de nenhum Joo
Gilberto ter inventado nenhuma bossa nova digital e termos que ficar confinados a nossos escassos
recursos, como homens das cavernas esperando a descoberta do fogo.
E, quando o fogo digital for descoberto, saberemos reconhec-lo? Por desconhecimento e falta de
exemplos, no h, na internet, a riqueza visual nem mesmo de um videoclip ou um videogame. Por
mais que geninhos talentosos venham a encher nossa pacincia com suas piraes tecno-flash,
todo mundo precisa de referncia e a prpria web nova demais e livre demais para s-la. Por isso,
no adianta procurar na internet as influncias grficas que possam servir de referncia para o seu
trabalho, pois elas simplesmente no esto l. Picasso j dizia que, antes de se desenhar abstraes,
preciso saber desenhar e muito bem o clssico.
Mimados pelo excesso de liberdades, olhamos para as pginas em branco da web e no sabemos o
que fazer. Invocamos nossos bookmarks e neles no encontramos inspirao, a resposta
simplesmente no est por l. Da, por pressa, preguia ou simplesmente por falta de referncias,
criamos as coisas como todas as outras coisas so criadas, cpias das cpias das cpias dos
primeiros sites, feitos por quem entendia de HTML, mas no sabia nada de design ou comunicao,
e da vem todo o blablabl que voc j est careca de saber.
Pois se na web pode tudo, cabe tudo, por que a maioria dos sites tem botes do lado esquerdo da
tela? Ora, porque assim que tem sido, assim que tem que ser, pensa a maioria (e os clientes esto
nessa maioria). No h, infelizmente, nenhuma esttica.
A Bblia e outros antigos documentos so a base de qualquer ergonomia que possamos vir a querer
para a mdia impressa, o teatro a base para a TV, e isso j feito h muitos, muitos anos, e foi se
aperfeioando com o tempo. Quanto a ns, muitos sites no so muito diferentes dos bancos de
dados que controlam o estoque das farmcias mais vagabundas e eles so parecidssimos, no que diz
respeito experincia do usurio, aos carssimos sites de internet banking e e-commerce.
triste e estimulante, mas no existe web com cara de web. E o que , afinal, web com cara de
web? Sei l, como voc, tambm estou tentando descobrir. A resposta, como sempre, est l fora.
preciso prestar ateno no mundo de coisas que acontecem nossa volta, nos trabalhos
experimentais, nas idias mais esdrxulas, seno ficamos viciados e nossa criatividade no se
renova.

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-1: Design estrutural

Portais e websites de contedo atualizado dinamicamente no podem se dar ao luxo de ajustar o
layout de cada pgina, pois isso atrasaria muito o processo. Nesses casos, o design segue os mesmos
princpios de uma revista: todas as suas sees so estudadas cuidadosamente e se prepara um
Projeto Grfico, indicando os lugares que os elementos grficos ocuparo em cada tipo de pgina.
Um projeto grfico de um produto digital, no entanto, envolve bem mais elementos que seu
equivalente em papel (fotos, textos, botes, formulrios e outras reas de interao com o usurio).
Ele normalmente no feito pelo designer, mas pelo produtor ou arquiteto de informao. Esses
profissionais identificam e categorizam as aes que podero ser feitas a cada pgina e testam sua
interao e conexo, pois assim que for implementado, qualquer alterao envolver programao e
alterao das pginas individualmente, o que consome muito tempo e esforo.
Os diagramas desenvolvidos so encaminhados para o designer grfico, servindo de referncia para
seu trabalho. Isso no significa necessariamente que o design fique engessado, quadrado, careta
ou algo do gnero. sempre bom lembrar que as revistas MTV e Supermercado Moderno usam
praticamente o mesmo formato de papel, com layouts e mensagens completamente diferentes.
Cabe ao designer desenvolver, sob essas premissas, algo criativo e visualmente interessante.
Respeitar contedos, sua prioridade e pontos de interatividade, no significa seguir o padro careta
da maioria dos portais que conhecemos. Alguns j esto comeando a mudar.

6-2: Grupos de dados

Uma das crticas que se faz s pessoas que usam a internet como fonte de pesquisa a falta de
profundidade dos conhecimentos: citam-se autores e teorias alimentados exclusivamente pelo
encontrado em uma pesquisa rpida, sem referncias de base. Isso acontece porque a maior parte
das pessoas se preocupa com a informao simples e no se preocupa com seu contexto. Ao
planejar um website, necessrio levar em considerao trs categorias de material informativo:
dado, informao e conhecimento. Sua relao constri um sistema de informao:
Dados - estmulos isolados, fatos independentes, irrelevantes. O dado a unidade bsica de
informao. A casa branca, o dia est chuvoso, estou com fome, fogo na Amaznia so
dados, e ficam armazenados na memria de curta durao. Como estes ns recebemos todos os dias,
do leite que acabou na geladeira ao novo ministro da sade. Os dados so descartveis. Ningum
capaz de dizer com preciso a hora em que escovou os dentes todos os dias da semana que passou, a
no ser que isso faa parte de um ritual. Dados guardados tm um valor pitoresco, extico: o nome
de um personagem de desenho animado, um termo tcnico esquisito ou a escalao de um time de
futebol em 1974 so alguns exemplos.
Informao - quando um dado se torna relevante, ele se transforma em informao. por isso que
se chama processamento de dados a tcnica de sua aglutinao em conjuntos relevantes para a
gerao de relatrios. Quando essa tcnica feita por uma mquina, ela chamada de informao
automtica, ou informtica. Por mais que os cientistas de computao queiram criar mquinas
capazes de gerar informao a tal da inteligncia artificial quem decide se os dados tm
relevncia para serem conectados somos ns. A informao resultante dessa combinao de dados.
Conhecimento - o mais raro e duradouro tipo de material informativo. O conhecimento se forma
quando a informao se conecta experincia pessoal e passa a fazer parte dela. Conjuntos de
valores, educao, religio, ideologia, cultura ou mesmo experincias sensoriais, afetivas,
transcendentais e sociais so, na realidade, conjuntos de informaes aplicveis na histria
particular de um indivduo. Se a nova mensagem (novo dado) se encaixa nesses padres, tem-se um
aprendizado que gerar conhecimento. Por isso, cada experincia interpretada de uma forma
diferente, de acordo com a histria pessoal de cada um. Uma chuva forte que apague um incndio
pode significar para um ndio que Tup teve piedade, enquanto que, para um homem urbano e
civilizado, pode significar que coincidncia feliz.
As coisas no so como as percebemos. Cada instncia de um objeto uma oscilao nos rgos
dos sentidos. A mente sincroniza essas oscilaes, gerando uma sintonia que se reflete como
percepo (um morcego, por exemplo, no v objetos, mas sim os escuta). A linguagem uma
representao simblica, que gera outras oscilaes.
A mente humana unifica todos esses sinais e capaz de armazen-los e reproduzi-los, sincronizando
as oscilaes externas (percepes) com as internas (experincia). Um beb recebe sinais puros,
ainda no modulados por sua vontade. medida que cresce, vai sincronizando esses sinais e se
familiarizando com o mundo.
Grandes inteligncias e grandes conquistas so menos questo da capacidade de processamento e
mais capacidade de se estar apto a extrair pistas relevantes de cada processo. As pessoas de grande
sensibilidade ou capacidade para descobrir coisas tm, na verdade, uma ateno de rastreamento
imensa, usando toda a informao ambiental para, de maneira rpida, corrigir a rota de seu discurso
e condutas.
Assim, o desenho de uma ma, a palavra ma, seu cheiro ou fotografia so elementos
completamente diferentes, mas equivalentes para a mente. Essa a idia bsica da representao
grfica das interfaces.

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.

6-5: Paisagens informativas

Como apresentar o conhecimento de uma forma acessvel? Existem muitas formas. A tradicional
criar uma narrativa em que a informao se desdobra, como em livros e palestras. Ou sistemas
espaciais, sem uma seqncia predeterminada, como fotografias, diagramas e mapas. Outras formas
so ainda mais abrangentes, como mtodos conversacionais, baseados em perguntas e respostas, ou
ainda atividades prticas, workshops e simulaes, que permitem s pessoas a construo de
modelos e seu manuseio. Para reunir esses meios de informao em um ambiente digital,
desenvolveu-se um conceito chamado paisagem informativa, em que os dados esto disponveis em
vrias formas e estruturas.
Ao chegar a uma paisagem informativa o visitante pode escolher vrias opes de visualizao:
seguir uma trilha linear, vivendo a experincia passivamente do comeo ao fim, como se estivesse
em um nibus. Ou ter controle local, como se estivesse dirigindo um automvel. Mapas podem
mostrar uma viso panormica do territrio e guias podem acompanhar o visitante em sua jornada.
O terreno de uma paisagem informativa um simples banco de dados. A estrutura da informao
que d a ela suas caractersticas.
Para que no fique muito terico, vou exemplificar o controle local (automvel): um website de
uma empresa razoavelmente hermtica uma indstria qumica, por exemplo pode usar desse
conceito e criar um roteiro do tipo play: a informao corre linearmente, informando passivamente
o visitante como se fosse um vdeo at que ele aperte a tecla stop. Aparecem os botes e ele retoma
o controle do site. A parte linear fornecer insumos para que as pessoas saibam do que se trata o
site, o que perguntar, e, a partir disso, saber onde clicar.
Acompanhe a descrio de uma paisagem informativa de acordo com Muriel Cooper e David
Small, pesquisadores do grupo de linguagem visvel do Instituto de Tecnologia de Massachussetts.
No parece uma experincia psicodlica?
noite. Voc est dormindo. Voc flutua sobre sua
casa, deslizando tranquilamente no cu noturno.
Voc voa cada vez mais alto, veloz como o pensamento
e acha um espao, denso de informao.
A paisagem muda lentamente, algumas informaes
desaparecem, outras se aproximam at que ficam
claros seus contornos e relevo.
Ao olhar mais atentamente para uma parte da
imagem, novos interesses vm mente: eles parecem
constelaes no horizonte.
Com um pensamento voc pode ir a qualquer uma
delas, procurando, descobrindo.
um verdadeiro vo da imaginao.
A busca por informao dentro de uma grande massa de dados pode ser um esforo enorme, muitas
vezes desesperador. A situao tende a piorar medida que os sistemas ficam mais ricos. O caminho
em busca de informao relevante dentro de um universo como este em breve se tornaria invivel
com as ferramentas disponveis hoje em dia. Conscientes do problema, pesquisadores de interfaces
quebram a cabea em busca de uma ferramenta para representar visualmente a informao de cada
parte de um sistema digital. Esse processo de visualizao se chama metacontedo. Ele se baseia
em uma estrutura tridimensional que se reorganiza o tempo todo.
como se, em uma biblioteca, os livros pudessem se reposicionar de acordo com o tema
pesquisado e, ao olhar para a capa de um deles, fosse possvel ter uma noo exata de seu contedo.
O metacontedo uma das aplicaes mais abrangentes da paisagem informativa.

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.

7: Quem precisa de um website?

Todo mundo quer estar na internet. Por que, exatamente, poucos sabem, mas o fato que as
empresas se sentem arcaicas se no tiverem o seu registro de domnio WWW. Isso pode ser
complicado, pois um site ruim, desatualizado ou com dados errados pode ser muito mais nocivo
imagem da empresa que simplesmente no estar l.
realmente necessrio fazer um site na internet para a divulgao de produtos e servios? Os
resultados justificaro o esforo? Se a empresa envolvida a Sony ou a Volkswagen, no h sombra
de dvida: poder divulgar seus produtos, servios a oferecer, atendimento ao consumidor e at
estimular vendas. Mas ser que uma floricultura, uma pizzaria, um canil, uma metalrgica ou um
estdio de futebol realmente precisam colocar um site na internet para divulgar seus servios e
lanamentos?
O principal motivo para se colocar um site no ar e que deve tambm orientar o seu contedo
muito simples: relevncia. Ao contrrio da mdia impressa, que recebida passivamente e sem
esforo, o que levaria um usurio a gastar dinheiro e tempo para consultar o site de uma cervejaria?
Ser que o consumidor sabe que o site existe? Ele o visitar? No adianta colocar um videogame
como atrativo no site de uma empresa de seguros: o visitante no est indo l para isso. E pior ser
se o jogo for bom, pois vai distrair o consumidor do seu objetivo.
Alguns dos motivos que justificariam o website de uma empresa so:

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.

7-1: Tipos de websites

Muitas empresas consideram seu endereo internet como um produto nico e coeso, que deve
concentrar todas as informaes, produtos, servios e revendas. O resultado a criao de
monstrengos: websites enormes, complicados e de navegao confusa, em que o usurio se perde
antes de conseguir a informao desejada. Esse mesmo endereo digital poderia ser dividido em
uma srie de pequenos produtos, diretos e objetivos, voltados exclusivamente para uma parte do
pblico-alvo.
Imagine uma fbrica de alimentos, com trs pblicos:

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.

7-2: Publicidade de massa e internet

A comunicao digital revira todos os conceitos que conhecemos de mdia e propaganda, e por
isso que se fala tanto nela. A publicidade convencional foi estruturada para um mercado de mdia de
massa, falando para milhes de consumidores ao mesmo tempo. Sob esses parmetros no d para
se promover debate, interao nem participao. J as formas digitais de comunicao alteram a
percepo do consumidor e sua tolerncia, por isso necessria uma adaptao da mensagem.
A internet no um veculo, uma mdia. Seus milhes de sites que so veculos, no anncios.
Isso muito importante e acaba sendo o que faz a diferena entre um site bem feito e outro s
bonitinho. O site da Bombril deve ser a revista da Bombril, no o anncio engraadinho do Carlos
Moreno. O visitante quer sempre mais, espera mais, quer informao, trocar idias, dar a sua
opinio.
Ele est completamente concentrado na frente do monitor, por isso to exigente e impaciente. Por
isso, os sites devem respeitar conceitos como legibilidade, contraste, estrutura e, acima de todos
esses, projeto grfico. No adianta sair criando pginas adoidadamente em um website sem um
planejamento, baseado em uma firula grfica, uma teoria esotrica ou no planejamento do pessoal
da informtica. Isso no pode dar certo.
A adaptao de formato um recurso conhecido da propaganda. Um anncio de mdia impressa, um
comercial de TV e um spot de rdio devem ser adaptados para se aproveitar ao mximo as
caractersticas de cada mdia. De nada adiantaria filmar uma fotografia esttica e narrar seu texto
para adaptar um anncio para a TV. Tambm no adianta apesar de ser muito comum tirar a
trilha sonora de um comercial e toc-la no rdio. Infelizmente pouca gente pensa nisso e produz
material especialmente para a internet, e o resultado um desastre: sites estticos e sem graa, ou
parecidos com jornais, ou tentando imitar os efeitos da televiso.
A propaganda precisa mudar para dar certo na internet. Se a mdia de massa empurra informao
para o consumidor, na web ele coleta o que quiser. preciso entender como a web funciona e
aplicar esse conhecimento. No adianta criar pop-ups, drop-downs, intersitials, push-media ou
qualquer outro nome inventado por um consultor ou guru de mdia gringo. Mais do que isso,
preciso voltar s origens, descobrir o que emociona e aplic-lo, seno estaremos agindo como a TV
dos anos 50, que imitava o rdio.
Os meios de comunicao como os conhecemos no devem desaparecer, muito pelo contrrio. O
que dever acontecer um equilbrio dinmico, como j aconteceu com cinema, teatro, rdio etc. S
devero desaparecer as formas de comunicao que no tinham razo de existir. A televiso no vai
perder seu poder, mas mudar de status, tornando-se mais uma mdia. O que desaparecer o
monoplio provocado pela limitao tecnolgica.
At porque o problema no est na tecnologia, mas no que vai dentro dela. Considere a TV aberta:
se fizermos uma pesquisa entre os telespectadores perguntando qual o seu maior problemas,
acredito que poucos diro que a qualidade da imagem, j que o sistema que usamos foi feito para
mostrar uma imagem boa em uma televiso de tamanho razovel (at 21). Provavelmente a
maioria das pessoas diria que o problema est na programao, e no h HDTV ou udio de alta
fidelidade que mude isso.
O maior problema que a criao enfrenta para o desenvolvimento de um bom website hoje em dia
exatamente esse: sua valorizao enquanto veculo. necessria uma revoluo criativa para
fazermos com que os sites sejam to bacanas quanto o resto da propaganda, e, para isso, preciso
criar pensando nas possibilidades do meio, no em suas limitaes.
A propsito, veja recebi este texto outro dia por e-mail: eu odeio piadinhas que circulam pela
internet mas no posso deixar de publicar partes deste, de autor annimo:

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.

7-3: Porque banners no prestam

Diz a lenda que, em um tempo que a internet era divertida e ningum falava de startups e bilhes,
uns maluces que cuidavam do site da revista Wired receberam um pedido de um de seus
anunciantes de mdia impressa: um anncio na web. Depois de muito pensar no chegaram a
concluso nenhuma e apelaram para uma gambiarra: colocaram uma fina faixa colorida de um lado
a outro da tela, com o logotipo do cliente no meio. Como no tinham nenhum nome criativo para
empregar, chamaram seu quebra-galho de faixa, que, em ingls, atende pelo singelo apelido de
banner. Comeava a toda a nossa confuso.
Se a lenda verdadeira ou no, o fato que banners so muito arbitrrios (em formato, tamanho,
peso, tecnologia) e virou moda falar mal deles, especialmente entre o pessoal de criao, que
reclama de suas limitaes e no sabe muito bem o que fazer com eles. Mas isso fugir do real
problema. Ao compararmos o banner com o anncio impresso, spot de rdio ou comercial de TV,
percebemos porque ele uma gambiarra que tem vida limitada e est deixando todo mundo
preocupado.
Anncios publicitrios de mdias ditas convencionais, em sua maioria, tm um custo operacional
irrisrio para o veculo, so eficientes para os anunciantes e, se no encantam o pblico, pelo menos
no o atrapalham. J o banner caro para o anunciante, carssimo para o veculo e nefasto para o
consumidor. E por isso que to ruim.
No incio dos tempos, banners eram apenas botes a mais que ficavam nos rodaps dos sites,
imagens que no davam trabalho algum. Os mais conhecidos eram o do Internet Explorer e o do
Flash, convidando o visitante a atualizar seu software. De adaptao em adaptao chegou-se ao
formato atual, divises em full e half banner, rodzio e controle do nmero de impresses por dia.
Como um fusca a que se adaptaram asas e de que depois se reclama por falta de aerodinmica, os
banners atuais precisam de servidores dedicados, auditorias, profissionais especializados, grficos e
equipes de vendas que, muitas vezes, podem significar um custo pesadssimo para um site. Em uma
situao surreal, vender publicidade fica mais caro que produzir o prprio veculo. Compare com a
relao custo/benefcio que uma revista tem em imprimir quatro pginas a mais para acomodar
quatro novos anunciantes e fica fcil perceber que alguma coisa est errada.
Mas no haveria tanto barulho se o banner fosse ruim e caro apenas para o veculo. O que acontece
que, para os anunciantes, ele tambm no grande coisa, muito pelo contrrio. Vendido como
uma panacia para se descobrir o perfil detalhado do consumidor, percebeu-se que no era bem por
a: as taxas de clicktrough so mais baixas que retorno de mala direta e os custos muito, muito altos.
Se voc tem alguma dvida, aplique a velha lei da oferta e procura: quantos sites existem? Quantas
pginas eles portam? Quantos banners cabem diariamente em uma pgina? s fazer a conta que se
v que no d pra cobrar o mesmo preo que um anncio de revista ou comercial de TV.
Caro para o anunciante, carssimo para o veculo. Como a obrigao principal de qualquer mdia
levar a marca ao seu consumidor, todos esses prejuzos poderiam ser contornados se pelo menos
parte do pblico ainda estivesse satisfeita, se interessasse, clicasse ou pelo menos se divertisse com
os banners, mas exatamente o contrrio que acontece. Qualquer pesquisa de recall dir o que todos
ns sabemos ser bvio: que o consumidor em geral no d a mnima para os banners, tendendo a
olhar para o site como se eles no existissem. Pessoas com 15 minutos de experincia em internet j
sabem da quantidade de lixo que circula na web e no clicam mais. Pra piorar, muitas das novas
tecnologias prejudicam a leitura ou at do pau no browser, o que no exatamente simptico.

7-4: Qualidade da experincia: foi bom pra voc, meu bem?

Mais do que aproveitar as caractersticas particulares da internet, necessrio descobrir o que leva
uma pessoa a visitar um site, qual a vantagem que ela leva l. E depois construir o site inteiro em
torno dessa vantagem. A web funciona como extenso da propaganda convencional: enquanto a
mdia de massa trata da imagem de produto, servio ou empresa, a internet trata de relacionamento
(informao e participao). Ela uma das poucas formas de propaganda em que o receptor paga
para cada instante de exposio. So trs custos:

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:

Como gerar um catlogo completo de todos os endereos de bares e restaurantes do pas?

Como garantir que no houvesse omisses ou erros?

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.

8: O processo de produo e suas etapas

Ok, ok At agora muita teoria, tudo muito bonito. Mas imagine que voc tem um website para
fazer: por onde comear? A idia desta seo esclarecer o processo: cada designer tem uma
metodologia, que gosta de patentear com uma sigla prpria, e todas elas dizem mais ou menos a
mesma coisa. A produo de websites consistentes e coerentes passa por quatro fases:
A) Briefing ou conceito - definio do foco do website, seu consumidor, objetivos de marca e
vendas a ser apresentado. Essa fase procura conhecer o cliente, seu consumidor e o que o
levaria a gastar algum dinheiro para acessar a internet. a parte mais difcil e a mais
importante.
B) Estrutura ou roteiro - como vai ser a navegao atravs do endereo, a ordem das pginas e
todas as alternativas de visitao. a hora da definio do mapa, conjuntos de dados e
arquitetura de informao.
C) Interface - design de estruturas informativas, barras de navegao e relao computador usurio. O design estrutural, projeto grfico e direo de arte acontecem aqui, formando a
cara do site.
D) Programao ou manuteno - escolha da tecnologia e sua utilizao na viabilizao do
projeto, sua consistncia, auditoria e manutenes peridicas.
Rtulos
H uma mstica na categorizao das coisas. Desde crianas estamos acostumados a classificar tudo
que vemos, ouvimos e sentimos em pequenas gavetas, de acesso fcil, restritivo e imediato. Assim,
da mesma forma que uma cadeira um mvel feito de madeira, as cincias so exatas, humanas,
biolgicas, os objetos so clssicos ou populares, artsticos ou comerciais. No h meio termo, um
mundo de absolutos, habitado por pessoas tmidas ou encrenqueiras ou gordas ou carecas ou
sedentrias. Os museus so exibicionistas dessa compulso classificatria, mas no so os nicos.
Em revistas, TV, jornais e na conversa das pessoas vemos cada vez mais o impulso que nos faz
parecer velhos ranhetas.
Nesses tempos digitais, nada poderia ser mais perigoso. O encapsulamento e a definio em
categorias podem ser elementos de segurana, pois nos garantem um certo controle, mas so muito
perigosos. Sempre que rotulamos algo ou algum, automaticamente o limitamos e perdemos o
contato com a real experincia de conhec-lo, o que morte para o design ou criao em geral. No
ciberespao as fronteiras so muito tnues, tudo corre muito rpido e um link pode levar a opinies
opostas. Como uma revoada de vaga-lumes, todos os conceitos parecem virar de cabea para baixo,
misturando-se, opondo-se, completando-se.
Os tempos mudaram e o mundo se apresenta a ns de mltiplas formas inditas. A tecnologia, esse
espetculo de mgica contnuo, muda as nossas vidas enquanto aumenta e encolhe nosso campo
cultural. A narrativa pulou da pgina para a tela (e para a pgina na tela), a msica precisa agora ser
vista alm de ouvida, os computadores bagunaram nossa relao com a informao, e a internet,
seguindo a tradio da televiso, terminou por demolir o resto da solidez que tnhamos. As coisas
parecem se mover depressa demais, mas a realidade que os conceitos que agrupavam e
aprisionavam os contedos esto sendo demolidos rapidamente, deixando todo mundo confuso.
Para se inventar um produto novo usando uma tecnologia igualmente nova preciso examinar cada
pequeno objeto que pegamos: v-lo cuidadosamente, calcular as sensaes de quem o utiliza, pensar
com sua cabea e criar uma pea que s poderia ser utilizada por ele, explorando essas sensaes.
Assim, uma secretria eletrnica no um eletrodomstico, mas a frustrao de quem quer falar
com algum ao telefone e no o encontra. Uma mensagem gravada nesse aparelho tem que dar esse
conforto. Um website no o folheto de uma empresa e nem precisa ter os links esquerda, mas

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.

8-1: Algumas dicas de marketing

Deixando as coisas bastante claras: este no um livro de marketing e nem h espao nesse livro
para fundamentar os argumentos deste captulo. Resumo aqui um pouco do bom senso que tirei de
artigos tcnicos, livros especficos e conversas com profissionais da rea:
Antes de colocar um endereo digital no ar, importante conferir sua qualidade, pois muito difcil
recuperar um endereo ruim ou inconsistente. Isso significa um investimento em anncios nos
meios de comunicao convencionais para ser visitado novamente.
Muitas vezes a empresa se decepciona porque pensa que um endereo Internet vai aumentar as
vendas. Por enquanto isso raro. A maioria dos sites serve para divulgar informaes institucionais
e servios, contribuindo apenas indiretamente para as vendas. Mesmo os sistemas de e-commerce
enfrentam problemas de confiabilidade e logstica, alm de no poderem dar ao usurio a satisfao
instantnea de sair com um produto na mo.
bom procurar saber se o consumidor vai usar as informaes do seu endereo digital, seno ele
intil. No se v TV em um site de agncia de propaganda, no se participa de sala de chat em sites
de empresa, no se procura uma empresa farmacutica para ver dicas de ginstica, a no ser em
casos muito especficos.
muito importante que o consumidor se identifique, mande pelo menos seu e-mail para receber
comunicao futura. Isso garante um banco de dados para promoes.
No vale a pena colocar um endereo digital no ar s porque os outros colocaram. Se no o
primeiro da categoria, tente ser o melhor possvel.
Apesar de cpias serem fceis e razoavelmente corriqueira na WWW, nunca se deve copiar nada,
pois essa prtica pode sujar a imagem de uma empresa e nunca mais acreditaro que o endereo
digital seja indito.
Um endereo digital precisa estar constantemente atualizado. No se deve usar informaes antigas
e deve-se tirar do ar qualquer fato errado ou j acontecido.
As mquinas no funcionam sozinhas. Para um endereo digital eficiente, com promoes e
interatividade, bom ter profissionais para conduzi-las, atender o pblico, direcionar ou responder
todos os e-mail recebidos.
O volume de dinheiro gasto em um projeto WWW um investimento. Alm de ganho institucional,
a Internet responsvel por uma grande economia na produo impressa e sua distribuio.
Uma empresa deve ser rigorosa ao construir sua imagem na Internet: deve falar com profissionais e
esperar gastar dinheiro na sua criao e produo. No porque a qualidade final baixa para
ser vista em um monitor que se deva dispensar um fotgrafo profissional ou um sistema
sofisticado, muito pelo contrrio.
Os sites web variam muito a maneira com que apresentam seu contedo. Vale a pena considerar,
antes de anunciar, o contexto em que as diversas pginas web e suas faixas publicitrias sero
vistas.
No se deve atrair a ateno e os cliques de acesso a qualquer custo se o contedo no valer a pena.
Deve-se tentar direcionar o visitante para que ele saiba o que o espera, para evitar decepes.
importante ir rapidamente ao ponto e estimular o usurio ao.
Essas so apenas algumas dicas. Na dvida, sempre considervel usar o bom senso.

8-2: Especificaes, planejamento e cronograma

O que diferencia uma estrutura profissional de produo do sitezinho feito pelo sobrinho a clara
determinao de parmetros: o que se quer, que ferramentas esto disponveis e de quais deveremos
lanar mo (necessariamente nessa ordem, no o contrrio) e como dever ser feito.
Acima de tudo, tenha em mente que seu site deve:
Manter-se simples e objetivo - o usurio web no tem tempo para papo furado;
Ser realista - melhor fazer um site simples que cumpre o prometido que propor sistemas
elaboradssimos e no conseguir realiz-los; e
Ter parmetros claros de avaliao - ver se cumpre os objetivos da comunicao.
Sugiro uma lista de tpicos:
Perguntas a se fazer ao cliente:
1. Qual o produto digital desejado CD-ROM, website, quiosque multimdia, intranet, s
interface, s arquitetura de informao?
2. Por que esse produto? Que caractersticas (mobilidade, abrangncia, disponibilidade)
levaram sua escolha?
3. A ao ser isolada ou far parte de uma campanha mais abrangente, envolvendo outros
meios de comunicao?
4. Quais so os objetivos da empresa com o produto ganho institucional, ampliao de
mercado, venda de produtos ou servios?
5. Qual o perfil do usurio o que quer, o que espera do produto, quais so suas queixas
com relao aos servios prestados hoje?
6. Ele tem todos os dados que quer publicar (textos, fotos, pessoas de contato, estrutura fsica)?
Em que estado est esse material? Ser necessrio reverbalizar, ilustrar, traduzir ou
refotografar? Existe alguma possibilidade de esse material ser entregue em formato digital?
7. Que tipo de resposta (surpresa, diverso, chamada ao, informao) se pretende do
usurio?
Perguntas a se fazer ao estdio:
1. Qual o produto? Existe uma clara definio do que se quer? O cliente conhece a tecnologia
e sabe o que esperar de seus efeitos? Como esto as expectativas?
2. Existe uma clara definio do volume de trabalho, promessas e limites de produo (prazo
mximo, nmero de layouts ou horas-limite)? Alguns servios que parecem fceis podem se
tornar verdadeiros pesadelos quando esse requisito no cumprido.
3. Quais so as ferramentas mais adequadas (no importa se voc as tem ou no) para a
realizao da tarefa? Isso importante para se ter uma viso realista do projeto.
4. Quais sero os profissionais externos envolvidos (fotgrafos, redatores, ilustradores)? Existe
a necessidade de se contratar auxiliares ou profissionais de produo?
5. Quais sero as tecnologias envolvidas para fazer o produto (JavaScript, DHTML, Real,
Flash, CGI)? Existe a necessidade de se terceirizar alguma infra-estrutura tcnica ou servio
especial?
6. necessria alguma atualizao que no seja automtica? Em que periodicidade?
7. H um cronograma de produo? Ele envolve todos os parceiros? realista? Ah, ento t
Mente quem diz que acerta os prazos.

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.

8-3: Organizao dos grupos de informao

Aprovado o projeto, a primeira coisa a se fazer analisar todo o contedo. Esquea as estruturas e a
navegao e organize os dados em conjuntos, baseados em seus temas principais. O ideal formar
trs ou quatro grandes conjuntos, no mais do que isso. Esse processo ajuda a focar a mensagem e a
estabelecer o que fundamental comunicar. Elementos que pertenam a dois conjuntos ficaro em
sua interseco.
Se voc est tendo alguma dificuldade em separar esses conjuntos, imprima uma tira de papel para
cada elemento e tente organiz-los espacialmente, se concentrando na relevncia da unio. Algo
como isto tem a ver com isto, que tem a ver com aquilo. Isto e isto so mais prximos, isto
viagem e assim por diante.
Agora hora de estabelecer as relaes entre cada elemento. Fazer linhas entre os tpicos de um
diagrama pode ficar confuso, ento melhor partir para uma tabela ou lista numerada com cada
contedo individual, os que se referem a ele e os a que ele se refere.
Com a organizao em grandes grupos e a tabela de conexes, j d para se ter uma boa idia de
toda a informao disponvel e como ela se comportaria se, em vez de um website, existisse uma
pessoa explicando-a: quais so os assuntos mais referenciados, quais so os temas mais importantes,
quais as principais dvidas e como acontece o fluxo dessas informaes (de onde se parte, para
onde se vai).
Com isso o mapa est quase pronto, e no tem nada a ver com aqueles organogramas que a gente
est careca de ver. Seu formato lembra as aulas de matemtica em que aprendamos a teoria dos
conjuntos (unio, interseco, lembra?).
Elementos que pertenam a um mesmo conjunto tm relaes entre si. Os que pertenam a dois
conjuntos esto em uma rea mista. As linhas que cortam os conjuntos representam os saltos,
mudando de um tema para outro.
A hora de finalizar: conjuntos muito grandes podem ser divididos, pedaos de conjuntos podem
ganhar autonomia e a relao entre os elementos deve ser revista. Veja quais elementos merecem
destaque desde a tela inicial e o mapa est pronto.
No se esquea: o conjunto de documentos de hipertexto deve tentar imitar o pensamento. Por isso,
tente integrar as pginas o mximo possvel, nunca demais. Deve se dar acesso a qualquer
informao relevante e ligada pgina que se estiver vendo em um ou dois cliques. Para o acesso a
qualquer outra informao, trs cliques o mximo.

8-4: Direo de criao, projeto grfico e linha de design

Determinar o conceito criativo e o ambiente em que a comunicao ocorre fundamental para se
fazer um site de sucesso. Esse tal conceito o que vai estabelecer o jeito do site: estilo, tnica,
texto, interface o design, enfim. E como ach-lo? Usando o bom senso.
A primeira coisa a se pensar : do que trata o site? Do que voc est falando? um produto
tradicional, inovador, tecnolgico, caro, popular qual a dele? Depois disso: qual a vantagem
real que ele traz para quem o est consultando? Por ltimo: o que ele tem que os outros no tm?
Foi pensando assim e no mostrando uma foto do produto e colocando uma srie de botes para
clientes, servios, caractersticas tcnicas e revendas que se criaram embalagens e campanhas
publicitrias geniais.
O conceito o mais importante. Se ele est claro, bem definido e transmite segurana, todos os
outros elementos contedo, arquitetura, interface, navegao se integram mais facilmente.
Seno o design fica inconsistente e a mensagem se perde.
Designers no nascem feitos: sua formao demorada e pouco formal. O normal comear como
assistente de arte, o primeiro degrau acima do estagirio. No vou fazer falsos elogios a essa fase,
pois todo mundo sabe que um saco fazer a parte mais trabalhosa e menos criativa do estdio:
digitalizar fotografias, traar logotipos, reduzir a quantidade de cores em imagens, procurar
referncias, gerar quadros de animaes, adaptar famlias de letras para cones, trabalhar imagens de
fundo e ttulos. Um saco, mas muito importante para a formao. Ao lapidar o processo, o assistente
toma conhecimento de cada etapa e aprende a dar ateno aos detalhes. bom permanecer pelo
menos um a dois anos nessa funo antes de se dizer designer.
Isso no significa que um assistente no tenha talento, ele apenas no tem experincia ou
conscincia suficiente do processo. Se voc est trabalhando sozinho, todo cuidado pouco:
estabelea um conceito bem forte e crie uma linha de design coerente com ele. Se o seu design no
encaixa no conceito, no force: mude um deles. Mas mantenha sempre a unidade das pginas, pois
qualquer inovao que fuja da sua linha de design tem mais chances de ser fatal do que de
apresentar alguma espcie de xito.
Gnio!
Este artigo, publicado na design Grfico n 11, uma espcie de desabafo do Diretor de Criao
contra os auto-intitulados geninhos, que nos mostram layouts muito mais em busca de elogios que
de opinies.
Situao convencional: voc est pensando uma soluo de design para um endereo Internet e
nada, absolutamente nada vem sua cabea. De repente surge uma idia. Voc: a) Aplica a idia
imediatamente; b) Desenvolve opes para a idia, ou; c) Joga fora?
Pode parecer incrvel, turminha do NewDesign, mas a velha escola de criao recomenda a ltima
opo. Se voc est liso de idias, o melhor dar um passeio, ver as pessoas na rua, esquecer dos
problemas, distrair, tomar uma cervejinha, ver no vdeo um musical dos anos 40 ou (minhas
solues prediletas) ouvir msica, comprar um gibi bem besta, tipo Tio Patinhas ou Mnica e ler do
comeo ao fim. O mesmo vale para um jornal daqueles que se torce e sai sangue, ou para uma como
a Caras. O importante deixar os neurnios empoeirarem, pois algum probleminha do dia-a-dia est
bloqueando sua criao.
E porque no usar ansiosamente a primeira idia? Sinto muito, meu amigo, mas porque ela no
boa. Na maior parte das vezes ela sai dura, cerebral demais, conceitual demais para ser divertida.
Seu crebro est travado e voc est forando a sada de uma idia. um processo to artificial
quanto ir ao banheiro quando no se tem vontade. O resultado inclusive pode ser parecido: ou no
sai nada ou impublicvel. Pois , tanto esforo pra nada.

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.

8-5: Prottipos e aprovao

Mostrar layouts para o cliente uma atitude de defesa: se ele v e aprova um prottipo,
mudar pouco o produto final, o que representa menos trabalho intil. Como no existe cliente que
no d palpites, o ideal conduzir as decises para que os prejuzos de design sejam os menores
possveis.
A melhor forma mostrar prottipos: fotos de telas, feitas normalmente em algum programa
grfico, que so meros layouts do resultado: o texto falso, as imagens ainda no esto
comprimidas e no h uma nica linha de cdigo programada. O prottipo um conjunto de
imagens, no de documentos. Esse processo apresenta vrias vantagens.
Pra comear, o cliente pode mudar tudo. Se no gostou de uma foto, se as polticas do departamento
no permitem uma cor, se houve erros de compreenso ou mudanas no pedido, tudo malevel.
No h preocupaes com posio de tabelas, programao de cenas em Flash ou nmero de cores
de um GIF. Mas deve deixar claro para o cliente que, aprovada essa proposta, o prximo layout ser
programado e sua estrutura no poder mais ser alterada: tipos de letras, posio de elementos,
formatos de imagens, depois de aprovados, devem ser fixos. Ele poder alterar textos e fotos, mas a
estrutura bsica do layout estar garantida. Esse processo acelera os layouts iniciais, agiliza sua
aprovao, evita trabalho intil e facilita a relao entre o cliente e o designer.

8-6: Mos obra

Chegou a hora de arregaar as mangas, vestir a luva de tendinite, ligar o som, limpar o mouse, pegar
bolachinhas e mandar bala no contedo, tendo em mente o conceito e a direo da criao. Idias
geniais s sero geniais se encaixarem, seno devem ser guardadas para outro trabalho. Se forem
muito boas, podero reformular o conceito, o que significa, na prtica, recomear.
Acima de tudo, no invente surpresas: se o cliente aprovou um prottipo, execute-o. Se voc teve
uma idia melhor, pode at mostr-la como opo, mas lembre-se de que ele vai invariavelmente
querer fazer um Frankenstein. As ferramentas de software so muito importantes nessa fase. Um
estdio deve sempre ter pelo menos um PC e um Mac (mesmo que sejam velhos) para testar o
produto em vrias plataformas. Alm disso importante:

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.

8-7: Controlando as entranhas do cdigo

No se pode esquecer que um produto de comunicao digital um programa de computador. Por
isso, ele deve ser amigvel, fcil de usar e mostrar ao usurio o que est fazendo e como faz-lo.
Trs princpos da indstria de informtica podem ser muito importantes na hora da avaliao do seu
website:
Resposta e dilogo - necessrio informar o usurio das aes do computador: quando esperar
demoras, quando o processador estiver realizando outras tarefas etc. A comunicao deve ser breve,
direta e expressa na linguagem do usurio, evitando o jargo tcnico.
Perdo - Pessoas cometem erros. importante perdo-los. Um sistema deve permitir que o usurio
volte atrs na maioria das aes e avisar quais forem irreversveis.
Usurios gostam de aprender como crianas: explorando, com muita ao e muito feedback. Como
resultado, muitos cometem erros ou exploram mais do que gostariam. Uma interface deve ser
tolerante e compreensiva, ou seja, permitir o que for razovel, deixando claro que nada ser
quebrado. E deve avisar quando entram em territrio arriscado, permitindo-os voltar atrs com
elegncia ou mesmo avanar, sabendo quais so as conseqncias.
Estabilidade perceptvel - Nos sentimos confortveis em um ambiente que se mantm
compreensvel e familiar. Para acompanhar a velocidade de processamento e mudana de um
sistema digital, os usurios precisam de alguns pontos estveis de referncia. a iluso de
estabilidade que importante, no a estabilidade em si. O ambiente pode e deve mudar
medida em que os usurios interajam, mas eles devem ter um conjunto de pontos slidos como
referncia.
Testou? Pois teste de novo.
Uma das partes mais importantes do processo de produo de uma multimdia o teste: se os links
existem, se as fotos carregam, se as pginas esto certas, se o boto verde leva para a imagem verde
e assim por diante. Esse processo pode ser exaustivo, e, no cansao ou repetio, muitos erros
cruciais podem escapar. Os trs tipos mais importantes de testes so:

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.

8-8: Registro em mecanismos de busca

Uma das formas mais comuns de pessoas que nunca ouviram falar de voc e no fazem a menor
idia de que apito seu website toca chegarem a ele atravs dos mecanismos de busca, sites como
Yahoo!, Cad? ou outros, como o RadarUOL e AltaVista. O registro nesses sites gratuito e
bastante fcil, porm alguns cuidados devem ser tomados no cadastramento para que ele seja mais
eficiente.
A maioria desses servios pede para que se escolha uma categoria e se escreva uma descrio do
seu site ao submet-lo. Analise com muito cuidado todas as categorias disponveis e seu texto antes
de envi-los. Se possvel, at os imprima e leia com cuidado, pois uma vez feito, praticamente no
h volta: so esses textos, e no o nome da sua empresa que valem nesse instante, at porque, se o
usurio souber o nome da sua empresa, ir direto ao seu site, no passando por servios de busca.
Na escolha de categorias, uma dica: se voc estiver em dvida sobre qual escolher, escolha a menos
povoada, pois h maiores chances de seu site aparecer nela. Isso tambm vale para a inscrio em
prmios e em servios de hospedagem gratuita de sites.

8-9: Auditoria e medio do trfego

Bill Bernbach, fundador da DDB e um dos mais criativos publicitrios de todos os tempos (criador,
entre outras, da campanha think small para a Volkswagen), costumava dizer que metade do
investimento feito em propaganda era jogado fora, e que era impossvel descobrir qual metade.
Na internet, em compensao, pode-se identificar tantas coisas do usurio que chega a impressionar,
a ponto de muitos neoparanicos terem medo de um Grande Irmo. Como, ao entrar em um site, o
usurio conecta seu computador a um servidor e transfere documentos, possvel, sem muito
esforo, saber a data, hora, tipo de computador, sistema operacional e browser utilizado. Com a
ajuda de programas dedicados, possvel saber quais pginas foram visitadas, se esta a primeira
vez que o site visto ou se um retorno, quais so as reas mais visitadas, qual o caminho que a
mdia dos visitantes faz no site, por qual pgina entra e por qual sai, de que cidade a conexo
feita, quais so os principais servidores que o acessam, de quais banners vem a informao etc etc
etc.
E tem mais: tambm d para saber quais mensagens de erro ele encontra, e em que partes do site,
quais so os arquivos mais baixados (e em que freqncia) em resumo: no d para saber o sexo
do internauta, se ele est com fome ou se seu cabelo est despenteado (para isso o computador ainda
precisa perguntar), mas, do ponto de vista do servidor, d pra saber quase tudo.
Isso pode parecer assustador, mas na maioria das vezes o tipo de dado resultante s vale para que o
servidor identifique trfego, erros e reas que demandem ateno e, assim, aumente sua eficincia.
Ele ainda no tem autorizao para identificar se voc est vendo aquele site porn ou mesmo para
identificar o e-mail de quem o visita, essas informaes so sigilosas e responsabilidade do
provedor de acessos que elas continuem assim.
At porque, para quem pretende vender um produto ou servio, no vale a pena levantar um monte
de informaes individuais, mas sim tendncias de grupos sociais. Se, por exemplo, um site mais
acessado noite, vale a pena concentrar suas promoes (e a ateno para possveis sobrecargas em
seu trfego) nesse perodo.
Esses programas de auditoria de visitao so normalmente instalados nos servidores e funcionam
transparentes: so completamente invisveis para o usurio final.
Cookies
Essa tecnologia de bastidores no tem nada a ver com aqueles sites que, como a Amazon.com, o
reconhecem a cada nova visita. Nesse caso, o que normalmente ocorre a gravao de um cookie,
um inofensivo arquivo de texto em uma rea bem especfica do seu browser. Cada vez que um site
desse tipo visitado, ele l o arquivo de cookies e mistura essa informao com o que tem
armazenado em seu banco de dados.
Eles so bastante prticos, pois personalizam boa parte dos produtos e servios. Mas se voc sentir
que sua privacidade violada por eles e no quiser que isso acontea, basta entrar nas opes de
segurana de seu browser e desabilitar a opo de receb-los.

8-10: Manuteno e acompanhamento do usurio

Depois de tanto trabalho hora de botar a boca no trombone: no se esquea de avisar a assessoria
de imprensa do seu cliente para que ela comunique o fato aos principais veculos da rea (se no
tiver uma assessoria, e s nesse caso, contacte voc mesmo). Pode deixar uma rea para crditos no
site, visvel, mas no evidente. Ela deve seguir o princpio da etiqueta da roupa: s a v quem
procura por ela.
No adianta s atrair a ateno de um visitante para um endereo digital. necessrio sustent-la,
seno ele ser um equivalente do acidente de trnsito: todo mundo que passa quer ver, mas no se
compromete. E fazer com que um usurio desinteressado volte a um site de que no gostou pode
significar um enorme esforo de propaganda. O processo de produo de um endereo digital no
termina quando o material est funcionando, sem erros, no ar. Uma boa dose de empenho
necessria, por isso bom:
Administrar o site - ver se ele est no ar, quais so as pginas mais visitadas e o que faz mais
sucesso nele.
Responder a todos os e-mails - o mais rpido possvel. Isso no significa uma resposta automtica:
deve ser personalizada. Usurios, acostumados com o imediatismo da internet, aceitam uma demora
de at um ms para a resposta a uma carta, mas no toleram mais que alguns dias para a resposta a
um e-mail.
Estimular o visitante - cada pessoa que dedicou esforo, dinheiro e tempo para a visita a um website
deve ser estimulada a participar, opinar, perguntar, reclamar, contar problemas e aguardar respostas.
Abrir um canal de comunicao entre a empresa e o consumidor - o nvel do internauta alto, e ele
espera ser tratado como igual. Se ele fez todo o esforo de chegar at o site e cadastrar seu e-mail a
empresa deve, no mnimo, responder altura.
As pessoas so simples. E voc uma delas.
Esquea tudo o que escrevi. Tudo o que foi dito at aqui no vale absolutamente nada se o designer
ficar olhando para seu umbigo, concentrado em seu estupidificante talento e no se preocupar com o
usurio, com o consumidor, com quem vai ver todos esses trecos que estamos desenhando. Existem
excelentes agncias de propaganda e estdios de design no Brasil que so especialistas em criar
campanhas cultas, inteligentes e estupendas, que levam vrios prmios menos um: o
reconhecimento de quem a v.
Todo esse psicologus que foi colocado neste livro s serve para uma coisa: tentar entender o que se
passa na cabea das pessoas quando vem layouts. Gestalt, Bauhaus e outros nomes
impronunciveis no foram colocados aqui para que voc se exiba perante seus clientes, mas para
que fique melhor preparado.
Se reparar bem, vai ver que o texto desse livro coloquial. s vezes at coloquial demais. Tem um
monto de exemplos relacionando o design com culinria ou ocasies sociais ou acidentes de
trnsito etc. Precisar de tudo isso, no precisava: tanto eu como voc somos capazes de nos
expressar em um portugus mais culto e elaborado, com construes subordinativas. Mas isso faria
com que sua velocidade de leitura baixasse e talvez voc nem chegasse at aqui. Ento pra qu?
Na realidade, as pessoas so simples. Muito simples. E gostam de coisas simples: emoo, diverso,
companhia, alegria e, sobretudo, informao. As peas de Shakespeare so imortais por serem
simples e tratarem de temas muito simples traio, paixo, inveja, dio. Elas poderiam ser
entendidas por qualquer um, desde que encenadas e traduzidas para o portugus cotidiano.
Mas dizer que as pessoas so simples no quer dizer que sejam simplrias. Ou burras. Elas no
precisam de ningum para educ-las, nem para dizerem onde clicarem. Mesmo que precisem,

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.

9-1: O webdesigner, esse pobre centauro

Escrevi este artigo para a edio n 37 da revista Design Grfico. Gerou resultados explosivos. O
reproduziram no site da revista. Mais exploses. No podia deix-lo de fora.
De acordo com a Voc S/A, webdesigner a profisso do futuro. No rdio, um spot de uma escola
promove o curso de webdesign sob a mesma tica. De vez em quando me surpreendo com a
quantidade de pessoas que falam a respeito de webdesigners e de webdesign com a maior
naturalidade, a tal ponto de no duvidar que ser webdesigner deve at ajudar a vida sexual de muita
gente, garantindo boas cantadas (ei, princesa, vamos fazer uma multimdia no meu ap?) ou at
servindo de pontap inicial para muito papo furado regado a lcool.
Em outras palavras: est na moda ser webdesigner. muito chic. Ou, em portugus, hype. cool,
cult, fashion, hip talvez. Ainda mais sexy se o webdesigner usar um Macintosh, programar flash,
usar dreamweaver, fazer arquitetura de informao para sistemas WAP. Como diria o Chico: ai,
quem me dera ser garom - ter um sapato bom - quem sabe at talvez - ser um garom francs falar em champignon - falar em molho ingls - pra te dizer gentil.
Como reconhecer um webdesigner? Eles so coloridos, u. Usam cabelos coloridos, sombrancelhas
coloridas, tatuagens coloridas, roupas coloridas, piercings coloridos. Mais ou menos como os
clubbers, mas com uma atitude mais cyber, meio Londres, se que voc me entende, mano. Se no
entender, azar: voc est por fora, unplugged, no ouve MP3, no tem nmero de ICQ, no sabe o
que o iBest, no tem pgina pessoal, analgico, no existe.
Todas essas cores, infelizmente, nem sempre correspondem a idias igualmente coloridas. J vi
muita gente colorida com portflio vagabunda, com pginas que contam o nmero de visitantes,
cheios de GIFs de quinta categoria, letras que voam e se deformam, usando todos os exemplos de
animao pr-programada, copiando modelos de sites de sucesso, com os links esquerda da tela
ou botes tridimensionais que mudam de cor quando so clicados, usando clip arts em cones que
precisam de legendas etc. etc. etc (ah, se um gnio me desse um nico desejo, eu desinventaria a
clip art e alguns programas de ilustrao a fome mundial bem que poderia esperar um pouco).
Mas afinal, o que um WEBdesigner? Que centauro esse que a mdia gosta tanto de popularizar?
Qual a sua formao? O que ele tem que fazer profissionalmente? Seriam os webdesigners
designers que entendem de web? Mas existe gente que no entende de web hoje em dia? Ou seriam
eles designers que sabem programar? Seriam eles, enfim, designers? Diretores de Arte? Ou
programadores enrustidos? Na minha humilde opinio, sejam o que forem, eles esto extintos: so
resultado de uma poca em que no era possvel separar o design da programao e os coitados
tinham que perder um tempo enorme na gerao de excrescncias do tipo tabelas HTML para fatiar
as imagens. Por sovinice de patres que no entendem direito de design, muitos designers coitados
so obrigados a programar. Mal sabem seus chefes que resultados obtidos por um designerprogramador esto bem longe de ser a soma dos de um designer com os de um programador, muito
pelo contrrio.
Acredito sinceramente que designer designer e ponto final. Designers grficos usam programas
grficos, designers de TV usam programas de vdeo, Designers de produto usam programas de
modelagem, designers de websites usam Flash ou DreamWeaver, administradores de empresas
usam Excel e no precisam saber de cor a tabuada do oito, a raiz quadrada de trs ou o logaritmo de
doze na base quatro. o talento e a dedicao que fazem um designer, no uma roupa colorida e
uma atitude fashion. No estou dizendo que no se deva usar roupas coloridas ou tingir os cabelos
de verde (pois estaria dando um tiro em meu prprio p), mas que isso no condio obrigatria
nem suficiente para ser designer. Em outras palavras, essa uma profisso como qualquer outra, e,
se voc for bom, vai acabar se destacando mesmo que tenha o fentipo de um professor de qumica.
Alis, muitos amigos meus, designers de muito talento, no se intitulam webdesigners e usam
roupas normais, como gente normal.

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.

9-2: Incubao e novos produtos

Qualquer um capaz de ter boas idias para um website. Transform-las em negcio lucrativo,
entretanto, coisa para bem poucos. Isso apavora o investidor, ainda mais se for estrangeiro. Para
canalizar recursos de grandes grupos de investimento em boas (e viveis) idias existem as
incubadoras e aceleradoras de negcios. Elas analisam as oportunidades, pblico, mercado e
eventuais anunciantes, ajudando inventores a se tornarem empreendedores.
Segundo Indio Brasileiro, Uma Aceleradora de Negcios uma evoluo do conceito de
incubadora: uma empresa que acelera a viabilizao de projetos com aplicaes na rea
pontocom. Para isso avalia o plano de negcios, partes legal e fiscal, equipe, tecnologia,
posicionamento de marca e estratgia comercial, monitorando gastos e investimentos.
Uma empresa, seja ela pontocom ou no, sempre deve ser criada para dar lucro. Por isso, se voc
est montando seu site, lembre-se que empreendendorismo se faz com muito controle de custos,
inovao e incentivo gerao de demanda. Afinal, capital de risco no capital de desperdcio.
Enumero 10 mandamentos essenciais para um plano de negcios vencedor na Internet:
1. Defina claramente qual o modelo de negcio, qual sua viso e quais seus diferenciais em
relao ao que j existe. No adianta desenvolver planos para atuar em um segmento onde j
h forte concorrncia estabelecida
2. Defina claramente quais so as fontes de receita e quais os valores que podem ser cobrados
para prestar o servio
3. Saiba porque este servio ir atender uma determinada necessidade e a tecnologia necessria
para implement-lo
4. Analise o mercado; se h concorrncia e o que pode ser feito para neutraliz-la;
estabelea parcerias exclusivas que agreguem vantagens para o projeto
5. Garanta que sua equipe tenha conhecimento da rea de negcio em que o projeto ir atuar
6. Tenha conhecimento fiscal e legal do mercado
7. Estude a possibilidade de expanso geogrfica regional e de gerao de fontes de receita
complementares
8. No esquea de registrar todas as propriedades: Marca, domnio da URL, Patentes de
Software etc
9. Avalie custos e capital necessrio a investir e estabelea um cronograma focado em
resultados quanto ir gastar e quanto ir faturar
10. Desenvolva um plano de marketing e relaes pblicas inteligente e eficaz o negcio no
deve necessariamente depender de grandes gastos com marketing para ter xito.

10: Vamos falar de voc

Design arte? Designers e diretores de arte so descolados, bacanas, joinhas. Esto em eventos
badalados, so engraados e despreocupados, usam roupas coloridas. A profisso no poderia ser
mais bacana, a comear pelo nome: criao. O designer no deve ser interrompido, pois est
criando. Ele faz isso o tempo todo. um gnio, quase sempre incompreendido. Tanto que perde
muito tempo discutindo o bom e o mau design (entenda-se como bom aquele feito por ele e como
mau o feito pela concorrncia). Parecem aqueles poetas que tentam vender seus livrinhos na porta
de espaos culturais ou bares alternativos e que reclamam do sistema esmagador.
triste dizer, mas a maioria dos designers composta por cinderelas que acreditaram na fantasia.
Depois de passar tanto tempo tentando convencer o cliente da importncia da unidade e coerncia
visual em um trabalho e buscando traduzir visualmente a maioria dos conceitos, muitos designers
acabam acreditando que realmente so especiais.
Um designer especial? . Sem ironia. Em um mundo brutalmente verbal difcil encontrar
algum visualmente alfabetizado, capaz de ler uma fotografia e formular um visual interessante.
Designers so compositores que, como poetas e msicos, coordenam uma sinfonia de elementos,
gerando um resultado harmnico. Como esse resultado, na maioria das vezes, inusitado, ele
precisa de muita autoconfiana e auto-estima para no matar uma idia nova em nome de uma
possvel rejeio do pblico. Por isso que, como a maioria dos artistas, muitos designers tm egos
imensos e comportamentos inaceitveis.
S que sempre bom lembrar que UM DESIGNER NO UM ARTISTA, na melhor das
hipteses um artista em funo do mercado. Ele pode fazer a embalagem mais linda e premiada do
mundo, contanto que ajude a vender. Ele pode fazer o relatrio anual ou folheto mais chique deste
sistema solar, contanto que mostre bem os produtos e idias do cliente. Enquanto o artista deve ser
coerente consigo prprio, o designer deve lealdade ao cliente e ao produto, ficando a arte em
segundo plano. No gostou? Pois v fazer artes plsticas.
Um bom designer no deve ter seu estilo pessoal, pois seus projetos so resultados de um mtodo
objetivo. Ao contrrio do artista, ele trabalha em grupo, visando esttica da lgica.
Para o design vale sempre a regra da observao. O que seu cliente faz? O que presente no
cotidiano dele? Quais so os elementos significativos? Chico Buarque faz msicas comoventes
tiradas do dia a dia sem graa de uma classe mdia esmagada. Mgica? Duvido. Mesmo o
famosrrimo e manjadrrimo David Carson tira suas idias de desconstruo tipogrfica de placas
pintadas por gente simples dos bairros pobres perto da sua casa.
Essas idias ingnuas muitas vezes so brilhantes exatamente por no procurar nada especial,
extraterrestre, e sim tentar retratar o que se v. Os donos de uma banca de jornal prxima de casa
tiveram outro dia uma idia dessas: impressionados com o crescente nmero de vdeos
pornogrficos venda e com o constrangimento de pais que viam suas crianas olhar as fitas e fazer
perguntas, resolveram cobrir, com papel sulfite e fita adesiva, os exemplares do topo da pilha. Se
um adulto quisesse ver, que pegasse os de trs e visse vontade. Resultado: das trs bancas da
praa, a que vende menos ttulos erticos, mas a que tem mais pblico geral.
Em resumo: ao fazer seu website, no se preocupe em ver o que o pessoal da Nike ou da Wired est
aprontando, nem tente descobrir o que h de mais moderno em HTML e plug-ins, muito pelo
contrrio: tente descobrir, no material que voc vai fazer, elementos singelos de destaque e
identificao e trabalhe neles. Pois, se a interatividade e o excesso de efeitos podem at atrair, no
conseguiro prender o visitante, que busca participao e reconhecimento. So como uma
maquiagem, que cedo ou tarde descoberta.
O que preciso para ser autnomo?

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.

10-1: Seu estdio

Quando se est comeando, normal sentir uma srie de medos, curiosidades, anseios. Os caras que
chegaram l parecem inacessveis e inatingveis. A diferena entre seu estdio e as grandes
agncias parece gigantesca. E o pior dessa situao que a maioria dos publicitrios e designers
com relativo sucesso fazem questo de reforar essa idia. Antes que voc desenvolva sentimento
de inferioridade, veja minha histria. Provavelmente ela ter muitos pontos em comum com a sua:
Era um escritrio bem pequeno, no quinto andar de um prdio decadente de uma avenida
igualmente decadente na zona sul de So Paulo. As paredes eram de um bege manchado pelas
marcas de poeira que os quadros e o PABX do antigo inquilino tinham deixado. Manchado e bege
tambm era o carpete, s que de um tom um pouquinho mais escuro. Uns mveis velhos e persianas
tortas completavam o cenrio. O ar-condicionado, quando funcionava, era barulhento demais para
ser suportado. Apesar de tudo isso aquele era, para mim, o lugar mais bonito do mundo.
O prdio abrigava um Bobs, uma tica e uma padaria no andar trreo. Cheguei l em uma manh
quente de fevereiro, estava com um gesso no brao esquerdo e o direito carregava uma revista
Grfica novinha. Falei com o seu Nemsio, zelador e o Manoel, ascensorista, me levou at o
conjunto 501, me ajudando com a chave para abrir a fechadura emperrada. Entrei, liguei o ar
condicionado e li a revista. Depois passei a mo nos mveis, olhei para a paisagem l embaixo e
comecei a fazer planos enquanto durava a minha hora de almoo: meu estdio que legal vai ser
muito legal
Voltei para meu emprego (ainda teria que trabalhar at o final do ms) e passei o resto do dia
pensando no que faria. Tempos depois vendi uma bicicleta, juntei toda a (pouca) grana que tinha,
pedi um reforo emprestado para meus pais e comprei meu primeiro Macintosh. Um ms depois
viria o telefone. Trs meses depois eu teria um estagirio. Cinco meses depois deu para pagar meus
pais. O nome Kropki viria s no ms seguinte. Ele significa pontos em polons. Por que
ponto? Ora, porque ponto o elemento essencial do design. Por que polons? Ora, ta uma boa
pergunta: por que no? At porque so to poucos os que falam polons, o dava mais pano pra
manga.
No foi fcil chegar a esse nome: o estdio era para se chamar quadrados cada vez menores, mas
(ainda bem) a gente desencanou. Nomes assim eram comuns. Um amigo tinha montado o
PI.N.O.D.O.R. design grfico (no, no era um nome grego, era sigla para pimenta nos olhos dos
outros refresco). Ns ramos, essencialmente, alunos da Escola de Comunicaes e Artes da
USP. Posvamos de gente grande e armvamos planos mirabolantes para tentar conquistar o mundo.
Metidos, ouvamos Mahalia Jackson, Alberta Hunter e Carmen McRae, j que ningum tinha grana
para comprar um CD e o jeito foi se virar com uma vitrolinha do Mickey e discos de vinil de um
sebo.
Quase um ano depois veio a secretria eletrnica. Antes, quando a gente deixava o estdio deriva
e saa para pegar um cinema na sesso das 4 largvamos o telefone fora do gancho para parecermos
ocupados e importantes. Na verdade, no tnhamos quase nada para fazer o dia inteiro, ento
jogvamos videogames, brincvamos de fazer retoques mirabolantes no Photoshop, fazamos,
refazamos e refazamos logotipos. Claro que tambm apostvamos corrida em cadeiras com
rodzios e jogvamos hquei usando duas cadeiras, um canudo de papel vegetal e um disquete
estourado, com gols de papelo.
Acabei montando uma escola de Macintosh para ocupar o tempo livre, conhecer uma galera, ganhar
um dinheiro. Fiz as apostilas de QuarkXPress, FreeHand e Photoshop mais pirateadas de todo o
Brasil (alis, se algum tiver uma dessas, por favor mande para mim, pois perdi os originais e queria
guardar uma de lembrana). E a Kropki foi se firmando, se firmando, se firmando
No preciso dizer que no havia absolutamente nenhum planejamento. Alis, quando havia, dava

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.

10-2: Seu portflio e promoo: como tornar as suas peas

conhecidas?
Um curriculum vitae pode ser bom para avaliar a trajetria e competncia de profissionais cujas
habilidades no so diretamente palpveis, como diretores de marketing, nutricionistas, psiclogos e
gerentes de RH. O processo de seleo razoavelmente simples: a empresa coloca um classificado
no jornal, chamando pessoas e no se identificando. Essas pessoas mandam seus resums para uma
caixa postal qualquer. Da so avaliadas por headhunters e consultores, e, se valer a pena, chamadas
para uma entrevista com uma psicloga e, talvez, alguma pessoa da empresa. Bacana. Deve at
funcionar.
Para design e profisses artsticas funciona exatamente ao contrrio: o diretor de criao (ou
equivalente) d sinal verde para uma contratao e avisa a faixa salarial. A partir da os profissionais
da empresa saem perguntando e procurando criativos de destaque que estiverem fazendo algum
sucesso em outras agncias ou at em outras reas interligadas, como ateliers de artistas plsticos,
produtoras de vdeo e escritrios de arquitetura. A notcia corre no boca-a-boca e os candidatos
comeam a se apresentar: ligam para a empresa e marcam entrevistas para mostrar seus portflios
(tambm chamados de pastas) a algum profissional da criao. Este os analisa, d algumas dicas e,
se valer a pena, o indica para o diretor de criao, que quem vai decidir todo o processo.
Normalmente no importa onde e por quanto tempo o profissional trabalhou, o que vale a pasta:
bons trabalhos, idias legais, produtos inteligentes. Prmios so acessrios: se o profissional tiver
ganho algum, no precisa dizer, o outro saber. bvio que quem nunca passou por um estdio ou
agncia grande teve menos oportunidades de trabalhar com bons profissionais e grandes verbas, por
isso precisa ser mais talentoso para aparecer.
J que um currculo no vale nada para a rea criativa (ou quase nada seu verso pode ser usado
como rascunho para alguma boa idia ou para anotar recados de telefones) o negcio caprichar na
pasta. Se sua primeira tentativa de emprego coloque trabalhos escolares, voluntrios ou fictcios,
ningum est preocupado em saber se eles existiram de verdade: o importante mostrar talento.
Mostrar, alis, uma palavra-chave. Para se apresentar material desenvolvido para a web no
necessrio marcar uma entrevista: basta um e-mail com os endereos digitais que se tenha criado ou
com uma pgina pessoal. Lembre-se que mentira tem pernas curtssimas e, se voc mentir seu papel
em uma pea, vo questionar todas as outras, sem exceo. Outra coisa: se voc no tiver orgulho
de uma pea, no a mostre: melhor uma pasta com poucos e consistentes trabalhos que uma penca
de balangands.
Idias so obras coletivas: se for avaliar uma pasta, leve em conta as parcerias. Se s h uma idia
boa, parabns ao chefe ou ao companheiro de equipe. Se h vrias idias boas, verifique os nomes
das fichas de crditos: quanto mais nomes, melhor o profissional.
Ou, nas palavras de Angela Bassichetti: Se voc est comeando, vai precisar de um portflio.
Ainda no precisa ser genial. Tem que ser, no mnimo honesto, apresentar bem voc e suas idias.
Ponha no ar, queime um cd ou grave num zip, no leve um portflio digital numa pastinha de
impressos.
Voc tambm vai precisar de um e-mail para contato. No o utilize para pedir emprego, mas para
pedir dicas. Assim voc mata a dvida do que um portflio honesto e faz um genial. S no
tente ser engraadinho e ntimo demais. Lembre-se que o mercado pequeno e voc no vai querer
virar um mala logo de cara.
Assim que voc tiver tudo o que precisa e entrar numa grande agncia, produtora, estdio, a coisa
funciona assim: cheque seus e-mails, ligue o ICQ, verifique a lista de jobs, procure o atendimento
para saber mais sobre o trabalho porque o briefing nunca est claro, reclame do prazo, verifique o
material disponvel e chegue concluso de que no o bastante. Tudo bem real.

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.

12: Comunicao no-linear, se que ela existe

Apesar do muito que se fala de comunicao digital (e de como ela no respeita as tradicionais
estruturas lineares e dimensionais) no existe comunicao no-linear. Mesmo que os estmulos
sejam os mais variados possveis e a percepo do leitor seja extraordinria, a multiplicao das
mensagens e possibilidades de conexo gera uma comunicao que permite vrios caminhos
possveis, mas nunca dois ao mesmo tempo, pois quando visualizamos um texto fora de seqncia,
imaginamos imediatamente outro, corrigido, em seqncia. Isso fundamental para quem
pretende criar contedo em hipertexto.
O que chamam de comunicao no-linear, portanto, pode ser melhor descrito como uma forma de
expresso que permite vrias seqncias possveis, todas lineares (multilinear) ou comunicao
multidimensional, organizada em camadas, como pginas de texto impressas em papel transparente,
que oferecessem ao leitor vrios textos.
Ele no precisa comear em um ponto especfico nem ter final. certo que deve comear em algum
lugar, mas a home page no obrigatria. No h a necessidade de uma seqncia, nem da diviso
do contedo em departamentos fixos e estanques, muito pelo contrrio. A hierarquia pode ser
mvel, alterando conforme o interesse do visitante. Alm disso, as telas podem ter ordem aleatria.
Um visitante pode ver como primeira pgina uma mensagem do interior do site e visit-lo de
dentro para fora.
Pode parecer estranha a proposta de uma narrao sem comeo e com vrias seqncias possveis,
mas exatamente o que acontece quando conversamos ou discutimos com outras pessoas: o comeo
da conversa simplesmente o incio da comunicao, no o comeo da histria. Como cada pessoa
pode criar relaes a partir de cada ponto do texto, e como essas relaes podem lig-lo a outros
textos, outras partes do mesmo texto ou mesmo a outros pontos de sua experincia pessoal, no
existir uma seqncia obrigatria de assuntos e, por suas conexes, no haver concluso, pois
sempre existir um outro texto de continuao da narrativa.
At mesmo uma histria sua qualquer, do tipo cara, ontem me aconteceu uma coisa inacreditvel
vai recorrer a episdios anteriores e fazer pausas para explicar certos pontos de destaque. Isso
acontece porque o tempo contnuo, e as coisas no comeam nem terminam em lugar algum.
Muitas vezes voc conta um fato para algum e depois tem que ficar um tempo explicando alguns
detalhes para a histria fazer sentido. Outras pessoas so famosas por contarem histrias que nunca
terminam.
Concluso
Isso tudo me faz pensar na questo da concluso: necessria uma concluso, um final para todas
as narrativas? Na vida real isso no acontece: qualquer histria se conecta com outras, divide
personagens, busca referncias, depende de pontos de vista e tem um final aberto. Mesmo os contos
de fadas, que comeam com era uma vez e terminam com e viveram felizes para sempre se
apressam em definir que o bandido malvado e o mocinho, bonzinho.
Por uma limitao tecnolgica aprendemos que os livros, filmes e documentrios devem ter um
final, mesmo que seja um the end ou game over. Enquanto isso, na vida real as pessoas
continuam interagindo com outras e com o meio, e a histria nunca tem fim, pois um processo
orgnico, contnuo, interativo e influencivel.
Enquanto livros e filmes devem ter seu final, documentos de hipertexto podem prosseguir medida
que haja interesse, abrindo conexes para outras histrias. Por isso, ler uma narrativa de hipertexto
pode tomar muito mais tempo que ler uma narrativa convencional. Ou levar menos de um dcimo.
Por no ter divises e cortes claros entre os episdios ou linhas narrativas, existem poucos pontos
em que o leitor pode interromper temporariamente a leitura ou dar por terminada uma verso entre
as vrias possveis.

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.

12-1: Hiperespao e ciberespao

Imagine que voc est sentado a uma mesa, com duas outras pessoas, A e B. fcil calcular a
distncia entre elas e a sua distncia para cada uma. medida em que voc se afasta da mesa, a
distncia entre elas parece diminuir e fica mais difcil calcular a diferena entre a sua distncia para
uma e para outra. Com uma distncia cada vez maior, fica mais difcil diferenciar as duas pessoas
ou a sua distncia para cada uma delas. Em uma situao limite, como se a lei de Newton fosse
revogada e as duas pessoas ocupassem o mesmo lugar no espao ao mesmo tempo. A sua distncia
para cada uma delas seria a mesma.
Isso uma das definies de Hiperespao. Nele, as dimenses fsicas no importam mais e, para
falar com algum do outro lado da rua ou na China, o esforo seria o mesmo. assim que, ao
apertar o botozinho hiperespao, a nave vai para o mesmo espao, s que em um local diferente.
Parece com algo conhecido? Pois .
Ao falar com uma pessoa pelo telefone, voc est em uma casa, ela est em outra. O contato
telefnico no o leva para l nem a traz para onde voc est, mas cria um espao intermedirio,
inexistente, onde ambos convivem. Esse espao proporcionado por meios tecnolgicos (ou
cibernticos) chamado de ciberespao. Ele vale para qualquer tipo de comunicao remota de
resposta imediata, como o telefone, chat, rdio etc.
Ao desligar o aparelho, esse espao deixa de existir.
Quando estamos lendo um livro, imaginamos os personagens a partir das informao que nos
mostram. So pessoas que no existem, em um mundo que no existe. Se um espao no existe, ele
imaginrio, fantasioso, inverdico, virtual. S acontece nas nossas mentes.
Imagine, por exemplo, uma macarronada. No uma macarronada qualquer, mas uma tremenda
macarronada daquelas que s uma nonna faz. Com um molho de tomate pedaudo, soltando
fumaa. Com queijo parmeso ralado grosso por cima, manjerico, almndegas por melhor que
fosse a fotografia ou filme que mostrssemos na revista, no seria to bom quanto a imagem do
macarro que se forma na mente de cada um. Por qu? Porque o macarro virtual rene as
melhores lembranas de todos os macarres reais, j vividos e experimentados, sendo
garantidamente maravilhoso. Se um macarro fica to bom, o que dizer de viagens alucingenas por
hipnose ou da vedete do virtualismo, o sexo?
O sucesso dos RPGs (Role-playing Games) mostra como poderoso um mundo virtual. No incio
do jogo os personagens concordam com as regras que definem o que possvel no jogo (a
verossimilhana) e, depois da, imergem em um mundo paralelo, parecido com o nosso, mas
diferente. Essa experincia, na rea psicanaltica, chamada de Psicodrama, e levada bastante a
srio.
O espao que aparentamos manejar quando navegamos atravs de documentos de hipertexto pura
imaginao: estamos estendendo o ato de leitura (tradicionalmente linear) para uma terceira
dimenso quando viajamos atravs de um link, como se duas pginas estivessem coladas nessa
palavra. As possibilidades que se abrem para a literatura so enormes e criam oportunidades para
que o leitor se engaje nessa experincia, como quem se deixa levar por um sonho ou alucinao, em
que as relaes de causa ou cronolgicas deixam de existir.
A Internet o que as tecnologias podem nos dar de mais prximo do hiperespao. Com um simples
clique, estamos do outro lado do mundo. Usando frames, estamos em dois lugares no espao ao
mesmo tempo. Mas, por ser tecnolgico, apenas um ciberespao. Cabe ao designer inventar
mundos que explorem essas tecnologias, estimulando a imaginao do visitante. para isso que
serve o Design.

12-2: Comunidades digitais: as novas igrejas, partidos, padarias

So trs da manh. Voc no consegue dormir direito. Precisa de algum para conversar.
Amenidades. Ou no. A quem vai recorrer? Na realidade, voc brigou com a namorada e quer
espairecer. Ou sacaneou algum no trabalho e precisa abrir seu corao. Mas no quer ser
identificado. Ou sua vida est meio sem graa e voc procura por um pouco de emoo. Ou voc
solitrio e s quer ver pessoas conversando, imaginar suas histrias. Ou voc mora em Joaaba e
quer discutir cinema iraniano. Ou est para se mudar para o Rio e no conhece nada por l. Ou
marcou viagem para Cabo Verde e s sabe que fica na frica. Ou est nos Estados Unidos e sente
saudades de casa. Ou ainda quer saber as melhores trilhas de bicicleta na Serra da Bocaina. Ou tem
um parente com Alzheimer e no sabe o que fazer. Ou precisa de um advogado. Ou s quer um
pouco de sacanagem. Ouvir fofocas. Pegar conselhos
As salas de chat, listas de e-mail e grupos de discusso da internet so as novas ruas, igrejas,
partidos, padarias: praas pblicas onde as pessoas apressadas e atarefadas e estressadas conseguem
ser um pouco humanas. So simples espaos para que todos possam trocar idias, brigar, brincar,
pedir ajuda, postar mensagens, conviver, ser humano, enfim. O excesso de tecnologia entupiu todo
mundo de trabalho a tal ponto que todos ficam cansados demais para sair quando chegam em casa.
Isso estimula o encasulamento: as pessoas ficam cada vez mais isoladas, fechadas, sozinhas.
Em um ambiente social mutvel e imprevisvel, cada vez mais as pessoas querem pertencer a um
grupo. Muitos procuram mais do que informao quando entram em um sistema online, vendo-os
como lugares em que podem interagir com outras pessoas, pedir conselhos, compartilhar
experincias etc., mesmo que no seja em ambientes reais, com pessoas reais ou mesmo que no
sejam experincias reais. O contedo no importa, o importante pertencer.
Fala-se por a que a internet uma rede de computadores interligados. Bobagem. A internet uma
rede de pessoas conectadas, isso sim. Pessoas com experincias, anseios, idias e, acima de tudo,
uma inteligncia que est muito longe de ser artificial.
O servio About.com, dos Estados Unidos, identificou essa tendncia e montou um portal em que
gente comum, com interesses pra l de corriqueiros, ganha espao para falar sobre aquilo que
especialista, seja profissionalmente ou o que muito mais interessante um hobby.
Assim, se voc precisa saber algo sobre anestesiologia ou quer um guia de viagens com dicas
completamente isentas (to isentas que podem at estar desatualizadas) este o lugar: gente
autntica, informao autntica com todas as suas incorrees, como se falssemos com elas ao
vivo. Um belo exemplo do que chamo de rede de pessoas.

12-3: Ansiedade de informao

Muitas pessoas se angustiam ao entrar em contato com a internet ou com grandes sistemas baseados
em hipertexto, pois perdem os parmetros de tamanho. Outras se desesperam porque desligam o
computador e sabem que a internet continua funcionando. Outras ainda se irritam porque o
computador evolui muito mais rpido que podem acompanhar. Procurar informaes na rede pode
gerar a sndrome da fadiga da informao, como batizou o psiclogo britnico Davis Lewis. Essa
sndrome caracterizada por tenso, irritabilidade e sentimento de abandono, causada pela
sobrecarga de informaes na rede (comparada com a que o ser humano comum estava exposto
antes). Boa parte dela causada pela tenso e presso que conceitos artificiais como tempo real
provocam. Ou pela necessidade compulsiva de se transformar dados em informao palpvel.
A situao atual mostra a necessidade urgente da busca de novas ferramentas de pensar. O homem
moderno bombardeado pela mdia e pelas diferentes formas de acesso aos mais diversos dados.
Ao mesmo tempo que se exige dele uma velocidade cada vez maior de decises, h uma
necessidade de um pensamento crtico para avaliar a enxurrada de informao, suas fontes e
conexes. Somos uma civilizao banhada por informaes e constituda por pessoas desatentas,
ansiosas e despreparadas para tirar concluses sensatas baseadas no ambiente volta. O resultado
a criao de pseudoculturas.
O neurologista Henrique Del Nero sintetiza:
Cobra-se do crebro moderno o desempenho de um carro de corrida e, ao mesmo
tempo, a constncia e a falta de manuteno de um carro de passeio. Um carro de
corrida deve sofrer ajustes para se adaptar a cada situao nova. A mente humana
tambm. As velocidades cada vez mais rpidas fazem parte da corrida evolutiva. Achar
que no h espao para a manuteno ignorncia.
E complementa com:
O crebro / mente est todo o tempo a fazer uma sntese da informao que chega
dispersa. Se essa informao muita e chega muito rpido, pode amplificar quadros de
patologias ansiosas. () A mente continua a mesma. No haver uma revoluo do lado
de fora se no houver algo proporcional do lado de dentro.
necessrio um posicionamento crtico com relao a essa avalanche de informao. A maior
dificuldade que temos para isso nossa total falta de referncias. Em um mundo digital e
interconectado, que se modifica rapidamente e exige de seus integrantes um poder de deciso cada
vez mais abrangente, um erro pode causar uma catstrofe, (como as que vemos no mercado
financeiro).
Essa constante exigncia ameaa o ser humano e o deixa acuado pois no compreende o universo
digital nem sabe como se posicionar com relao a ele. Isso , sem dvida, uma das maiores causas
de estresse, ansiedade e angstia da modernidade.

12-4: O ciclo da descoberta

Repare como um beb v o mundo sua volta: olhos arregalados, mos tentando pegar tudo que
estiver ao alcance, um fascnio total. s observar e voc ver que o mesmo acontece com crianas
aprendendo a escrever ou a andar de bicicleta, adolescentes diante de um carro novo, casais recmcasados, pais diante do primeiro filho, ex-inquilinos em sua primeira casa prpria,
microempresrios no novo escritrio, professores na primeira aula, namorados no primeiro beijo,
estagirios diante do primeiro layout aprovado, isso sem contar o velho exemplo da primeira vez.
Ah, que alegria, que fascnio, que medo, que prazer. Pena que dure pouco. cada vez maior a
quantidade de pessoas que se empolga com um brinquedo novo e, em pouco tempo, enjoa dele e
parte em busca de algo diferente.
Sempre que h uma tecnologia ou experincia nova, a reao do pblico passa por um ciclo de
entusiasmo e desnimo. Chamo isso de ciclo da descoberta. Ele tem sete etapas: ignorncia,
fascnio, posse, explorao, angstia, decepo e hbito.
Em princpio ningum sabe nada, e os pobres coitados que sabem so chamados de gnios. As
pessoas comuns at evitam comentar sobre o tema, ou disfaram, falando em termos genricos,
fingindo falta de interesse. Muitas pessoas tratavam a internet dessa forma.
Se o mundo novo no absolutamente ridculo ou dispensvel, a pessoa, para no correr o risco de
ficar como o ltimo jornalista que ainda usa mquina de escrever, corre atrs da nova tecnologia,
v tudo o que ela proporciona e fica absolutamente fascinado, meio besta at. Como aqueles pais
que tm o primeiro filho e falam do exame de fezes do moleque at em reunies de diretoria.
chato, mas houve uma poca em que muitos falavam de internet usando uma grandiloqncia
pedante e um monte de termos em ingls.
Fascinados, vamos tentar aprender um pouco mais: a fase da posse. hora de tentar entender
como tudo aquilo funciona, como tirar algum proveito, como pertencer ao seleto grupo das pessoas
que fazem. Em design fcil de identificar essas pessoas: so aquelas que usam clip-arts, botes
tridimensionais, efeitos prontos do Photoshop ou animaes pr-programadas do Flash. Todos
passam por essa fase ou uma equivalente, mas no tem problema, elas esto aprendendo.
Depois da posse, a explorao: cozinhar no to complicado nem coisa de mgico, e voc
experimenta uns temperinhos diferentes para aquele velho fil de frango. Quando algum elogia
seus pratos, voc se faz de desentendido. Voc passa a se sentir habituado com a tcnica e exercita o
talento sem bloqueios. a fase ideal, mas muito difcil ficar nela.
Considerando toda a energia que foi gasta no aprendizado e no domnio da tcnica, incluindo a
perda de tempo em que se gasta com atitudes, como usar gravata colorida ou casaco de couro ou
camiseta branca para fora da cala, em um look desencanado, chega-se a uma fase perigosa: a
angstia. Angstia de ter que ir dormir enquanto a internet continua funcionando, angstia de saber
muito, mas no saber tudo, angstia de querer colocar sites compatveis com a ltima verso de
cada browser e com todos os plug-ins existentes. O angustiado nunca est satisfeito e quer mais,
cada vez mais. Resultado: faz sites impenetrveis, usa um jargo difcil e precisa de muitos plug-ins
para transmitir uma simples mensagem.
Depois de perceber que no possvel conhecer a internet em sua totalidade, da mesma forma que
no d para ver simultaneamente todos os canais de uma TV ou estar em todas as festas ao mesmo
tempo, vem a decepo, to errada quanto a angstia. Isso acontece porque cada nova descoberta
apresentada como uma panacia, como um meio que vai suplantar todos os outros, trazendo a
soluo final. Quem acredita nisso se decepciona, fazer o qu?
Quando nada mais resta, h o hbito, a rotina. Aquela mesmice em que nada acontece e tudo
extremamente montono. No h exatamente um prazer em se fazer novos endereos internet e
todas as pginas tm quase a mesma cara. Ou, em casos piores, o abandono total, profissionais que

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).