Home

topo

abas informam

13/12/07 | web

UOL vídeos, em versão de testes, informa de forma divertida que terá novas opções

Estudos de Eye-Tracking: 23 lições práticas

27/11/07 | web, design

Algumas conclusões adquiridas em pesquisas de Eye-tracking podem ajudar a aprimorar o design de interfaces

  1. Textos atraem atenção antes das Imagens. Maior parte dos usuários chegam em um site procurando por informações, não imagens.
  2. Inicialmente os olhos focam no canto superior direito da página.
  3. Usuários olham para o topo esquerdo e percorrem movendo para direita inferior no formato de um “F”. Certifique-se de que os elementos importantes estão localizadas nessas áreas-chave para manter os leitores envolvidos.
  4. Banners são ignorados. Geralmente mantém o foco por poucos segundos.
  5. Formatações enfeitadas são ignoradas. Usuários confundem com anúncios e acham que nestas áreas não irão encontrar as informações que ele precisa. Manter o site racional, sem extravagância para não confrontar com os elementos mais importantes.
  6. Mostrar números numericamente. São identificados muito mais rápido do que números por extenso.
  7. Tamanho das fontes influenciam no comportamento. Fontes menores aumentam o foco (específico) enquanto fontes maiores induzem a varredura dos olhos (geral). O uso adequado irá depender da necessidade.
  8. Usuários apenas olham para um sub-título se lhe interessar. Apenas inserir subtítulos para informações que possam ser relevantes.
  9. Pessoas geralmente percorrem até partes inferiores da página. Para tirar vantagem disto, pode-se oferecer algo que o prenda ao longo da página. Destaques ou listas com marcadores podem demostrar que as informações são facilmente achadas no site.
  10. Parágrafos curtos têm melhor desempenho do que longos. Informações devem ser concebidas para o curto tempo de atenção dos internautas. Mantê-las enxutas sempre que possível é fundamental.
  11. Formatos de 1 coluna fixam mais os olhos do que os de várias colunas. Não sobrecarregar o visitante com muita informação. Muitas colunas poderão ser ignoradas pelos usuários. Evitar ruídos com a simplificação realmente é melhor em alguns casos.
  12. Anúncios no topo esquerdo da página receberão maior atenção do olhar. Integrar anúncios no canto superior esquerdo aumentará sua visibilidade. Claro que não necessariamente serão clicados, portanto, não sacrifique o visual para ganhar visibilidade extra.
  13. Anúncios posicionados próximos ao conteúdo principal são vistos com mais frequência.
  14. Anúncios em texto foram intensamente mais vistos do que qualquer outro tipo testado. Não distraem e misturam-se com o conteúdo da página, são visualmente menos irritantes e mais aceitos.
  15. Imagens grandes chamam mais atenção. As pessoas se interessam mais pelas imagens em que podem ver detalhes e informações claras. A maioria dos usuários têm conexão banda-larga atualmente e não sentem receio em optar por ver imagens grandes.
  16. Imagens “limpas” atraem a atenção dos olhos. Obras de arte podem não atrair tanto o olhar das pessoas. Ao usar fotos de pessoas, prefira fotos limpas, de fácil compreensão. Inclusive, fotos com pessoas “reais”, e não modelos, têm melhor performance.
  17. Títulos direcionam os olhos. Primeiras informações buscadas pelos leitores ao longo da página.
  18. Usuários gastam muito tempo olhando para botões e menus. Por isso vale a pena dedicar tempo extra para garantir que serão bem concebidos, afinal, não só apresentam alto grau de fixação dos olhos, como também é um dos mais importantes elementos do site.
  19. Listas prolongam a atenção do olhar. Quebrar os parágrafos em listas mantém os usuários mais concentrados. Usar números ou marcadores para destacar as informações mais importantes torna o site mais fluente e facilita que o usuário encontre as informações que procuram.
  20. Longos blocos de texto são evitados. Estudos mostram que internautas não investem tempo lendo blocos longos, por mais relevante que possam ser. É preciso quebrá-los. em parágrafos menores, destacando áreas específicas.
  21. Formatação pode chamar a atenção. Diferenciar a formatação de um texto destaca uma determinada informação, porém use com moderação para não tornar a página difícil de ler.
  22. Espaço em branco é bom. Deixar áreas livres de qualquer informação, mantém as coisas simples e permite melhor acomodação visual.
  23. Ferramentas de navegação funcionam melhor quando posicionadas no topo da página. Torna a navegação fácil de encontrar.

Texto original: Scientific Web Design: 23 Actionable Lessons from Eye-Tracking Studies, de Christina Laun - Dica do Vitor Lourenço

é campeão!

26/11/07 | 1st life

coritiba O Coxa perdia a partida até os 42 minutos do segundo tempo, quando Keirrison empatou. Já nos acréscimos, aos 47, Henrique Dias garantiu a vitória e o caneco ao clube: ÉE Campeão!!! :)))~

Parabéns à toda nação alviverde pelas festas no Couto! COXAA!!

Free Magenta

15/11/07 | web

free magentaProtesto pelo livre uso do magenta, cor que uma empresa alemã de telefonia diz ter os direitos para peças de comunicação e têm aberto processos contra outras empresas que usam o magenta nas marcas.

tipografia no G!maps

11/11/07 | web, design

Site que escreve texto usando elementos achados no Google Maps como tipografia para enviar cartões virtuais. ver

GeoGreeting

Colaboração - Se achar alguma “letra” no maps, pode enviar pra eles: geogreeting@gmail.com

Breathing Earth

7/11/07 | 1st life, web

Este site simula “em tempo real” a incidência de pessoas que nascem e morrem e também a quantidade de emissão de gás carbônico pelos países.
breathing earth

Interessante comparar que os EUA emitem 1000 toneladas de CO² a cada 5,4 segs., enquanto o Brasil a cada 1,7 min… kyoto now!

chega de minimalismo!

6/11/07 | design

Nada de área de respiro, ou espaços em branco, afinal, vc paga pelo layout e não pra deixar “em branco”!

o início de uma nova era!

MySpace Brasil

1/11/07 | web

Em tempos de guerra (redes sociais), no ar o MySpace Brasil em vs. beta.
…mas sinceramente, o que quero mesmo é o meu Gmail novo !!! :D

OpenSocial

1/11/07 | web, tecnologia

Após perder para Microsoft na participação com Facebook, Google retruca com uma pertinente proposta de agrupamento em código aberto de diversas redes sociais. [mais]

Multianualidade: 10%

20/10/07 | 1st life

Um pouco atrasado, mas interessante divulgar que a partir de 26/09/2007 a renovação dos domínio no registro.br custam R$27,00.
“não precisa mais pagar os 10%”… ;D

Blog Action Day

15/10/07 | 1st life

Meio ambiente é o tema de hoje. Uma campanha mundial, promovida pelo site Blog Action Day. A ideia é estimular uma discussão pelo planeta sobre o mesmo assunto, no mesmo dia. Para se registrar no movimento, entre aqui. O BlogTV Brasil é o representante da iniciativa no país.
blog action day

Você pode optar por participar de diversas iniciativas sugeridas pela campanha, em prol da questão. Eu escolhi adotar um pedaço do céu no site adoptthesky.org pelos Blumenthaizinhos que virão ao mundo um dia :)

Google experimental search

13/10/07 | web, tecnologia

Ontem, dia das crianças, conheci alguns brinquedinhos que o google está testando. Saõ 4 opções: visualização alternativa dos resultados da busca; atalhos de teclado; navegação na esquerda ou navegação contextual à direita.
Timeline View

A imagem acima se refere à visualização alternativa, que, ao fazer uma busca, vc tem opções de visualização dos resultados, como “info”, “timeline (img)”ou “mapas”. Estas opções extraem datas, lugares, medidas, etc. e facilitam pra ver rapidamente a informação em dimensões variadas.

Com relação ao experimento de atalhos do teclado, ainda senti falta de uma opção para “próxima página” nos resultados de imagens e dentre os experimentos direta/esquerda, eu optaria pelo da direita :)

bbb8

6/09/07 | web

bbb8 Cinco dias após o lançamento do site de inscrições do BBB8 já foram mais de 27 mil perfis pro ar e mais de 1.500 deles com vídeo, além de 106 mil fotos postadas.

É a prova de um projeto muito bem concebido e com um nível de interatividade excepcional. Parabéns à todos, em especial aos camaradas Pouzada e Vítor.

Obs.: navegar no site é extremamente viciante.

Estrutura html em gráficos

22/08/07 | web, design

O Aharef disponibiliza uma ferramenta em que vc “traduz” o código html de um site graficamente. Abaixo, o resultado obtido por este blog:

onde,
azul: número de links (tags “a href” )
vermelho: número de tabelas
verde: número de tags DIV
violeta: número de imagens
amarelo: número de forms (FORM, INPUT, TEXTAREA, SELECT e OPTION)
laranja: quebras de linha e indentações (BR, P e BLOCKQUOTE)
preto: HTML tags
cinza: outras tags

Ele também sugere contribuir uma galeria com estas imagens de diversos sites.

vc comeria?

26/07/07 | .Defenestrando

Vc comeria a “Vaca Atolada com Mandioquinha“?

Alguns trechos do “Modo de Preparo”:

“Descasque as mandioquinhas (…) até atingir uma temperatura bem quente.
(…)moreninha, (…)mexa bem até sentir a fragância (…) e permaneça mexendo sempre. (…) se a carne for boa já estará (…) ao fogo (…). Passado este tempo, (…) Acrescente as mandioquinhas (…) até que fiquem macias (…) fica uma delicia). (…)”

Lactobacilos vivos

24/07/07 | .Defenestrando

Incrível como a embalagem do Yakult se mantém a mesma desde que nasci e nunca tinha reparado nisso.
Certo dia fiquei encarando uma dessas garrafinhas… me remeteu a um frasco de remédio com “cinturinha”!

Play with yakultEncontrei um jogo da Yakult, em que deixam muito claro o orgulho por nunca terem mudado (”Yakult não é uma coleção de milkshakes exóticos”) e se referem à sua garrafa como “forma perfeita, de tamanho perfeito e apaixonante”.

Interessante, se não fosse ambíguo (é remédio ou não é?). De qualquer forma, até remédios costumam rever suas identidades.

Pq nunca mudam? Pq 65ml e não 70? Pq é vendido “aos goles”? (No orkut já têm umas 390 mil pessoas pedindo em pet 2L e até em galão…) Pq uma tampa de chapéuzinho?! Pq tãão difícil de abriir? :#

Daniel Blumenthal 2.0

7/07/07 | design, .Defenestrando

Em tempos de web 2.0, nada mais sugestivo do que lançar a segunda versão do meu site, publicada hoje, 7/7/7 , com maior ênfase nos trabalhos, inclusão de doses moderadas de cores e outros fru-fru de designer.

Foi pro ar mesmo cheio de bugs (senão não vai nunca), mas é só dizer que é “beta” que não dá nada :P mesmo assim, me avise se achar algum.

Daniel Blumenthal 2.0

Rola uma metaforazinha abstrata de uma máquina de brinquedos, afinal, se não é pra se divertir não tem graça (e vice-versa)! ;D

A ‘máquina de brinquedos’ contextualiza o ambiente do personagem, que adquiriu alguns pequenos movimentos, tornando o site mais lúdico.

Sósias

3/07/07 | web, plagio

As semelhanças entre o GP1, “Primeiro grande portal do Piauí” sosia

…e o G1, “Portal de notícias da Globo”, são realmente inúmeras.
sosia

Mas o mais interessante é ver como a agência que desenvolveu o GP1 assina embaixo e com grandes pretensões: se posicionam como sendo praticamente “os grandes revolucionários da nova Era“.

Minefield: Firefox 3 beta

29/06/07 | tecnologia

minefield Já está disponível para download um beta do Firefox3 (A instalação não conflita com o já instalado).
A maior mudança do Firefox 3.0 está no mecanismo de renderização, q promete maior agilidade. Visualmente não apresenta diferença (pelo menos até agora).

No beta o nome do programa é ‘Minefield’. A variação se estende também ao ícone do programa, o que costuma ser uma raposa em chamas, agora é o pavio de uma bomba. A forma esférica dada pelo desenho do planeta da versão anterior se mantém e adquire evidência.

O resultado é bem diferente dos boatos que vinham aparecendo na web, em que especulavam possíveis modificações do ícone:minefield

Congresso Internacional: Design da Informação

25/06/07 | design

eventoCuritiba | 8 – 10 outubro | 2007
3º Congresso Internacional de Design da Informação
http://www.sbdi.org.br/congresso2007

em conjunto com

2º InfoDesign Brasil
Congresso Brasileiro de Design da Informação

3º Congic | Congresso Nacional de Iniciação Científica em Design da Informação

e logo em seguida:

ivla 2007 | 39th International Visual Literacy Annual Conference
Curitiba | 10 – 13 outubro | 2007

[ Serão oferecidos descontos nas inscrições conjugadas. ]

O 3º Congresso Internacional de Design da Informação e o IVLA 2007 - International Visual Literacy Association Annual Conference receberam oficialmente o apoio internacional do ICOGRADA - International Council of Graphic Design Associations e o apoio nacional do CNPq - Conselho Nacional de Desenvolvimento Científico e Tecnológico e da AEND|Brasil Associação de Ensino e Pesquisa de Nível Superior de Design do Brasil.