A Arquitetura da Informação no desenvolvimento de Projetos para Web

Este artigo foi criado para a disciplina de Gerenciamento da Produção do curso de Tecnologia em Artes Gráfica da UTFPR.

Palavras-chave
Arquitetura da Informação; Usuário; Projeto Web

01. INTRODUÇÃO
Este estudo pretende esclarecer a necessidade de aplicar as premissas da Arquitetura da Informação no desenvolvimento de projetos para web, explicitando métodos e ferramentas que fazem parte do processo.
A Internet tem crescido em tamanho e importância no cotidiano da sociedade. Com isso, o volume de informação disponibilizada na rede mundial de computadores se torna quase infinito, mas seu acesso não se apresenta necessariamente de forma organizada. Os usuários têm à disposição diversas opções e a organização inteligente desse conteúdo se torna vital para conquistar a atenção do público desejado. A Arquitetura da Informação tem o papel de tornar a navegação de sistemas de informação, neste caso websites, o mais fácil e claro possível para que o usuário consiga encontrar a informação que busca.

02. METODOLOGIA
A metodologia empregada foi a de revisão de literatura para aumentar a extensão e a profundidade dos conteúdos investigados. (SANTOS, 2001)

03. DESENVOLVIMENTO

3.1 Definição de Arquitetura da Informação
Arquitetura da Informação (A.I.) é a combinação entre esquemas de organização, nomeação e navegação dentro de um sistema de informação. (LOU e PETER, 1998) Cabe ao arquiteto da informação desenhar uma solução otimizada para a distribuição da informação, respeitando as necessidades, limitações e peculiaridades dos usuários do sistema, neste caso sites na internet - ou websites.

O público deve ser capaz de encontrar a informação que necessita no menor tempo possível e da forma mais intuitiva, evitando a frustração com o meio e a transferência dessa frustração para a marca a qual o site representa. Para isso, é imprescindível conhecer bem as características dos futuros usuários, ter consciência da finalidade do website (o contexto) e dominar a informação a ponto de conseguir distribuí-la eficazmente.

Os limites da aplicação da A.I. ainda não estão bem definidos, é um processo recente, mas os estudos sobre o assunto crescem em quantidade e qualidade. Alguns defendem que seu objeto de estudo deve se limitar à organização do conteúdo textual e o fluxo da sua navegação, mas neste artigo será considerado que o contexto, por definir a qualidade do conteúdo e ser determinante na experiência do usuário, também faz parte do processo, e por isso deve ser estudado e definido dentro da A.I.. Logo, pode-se considerar que a Arquitetura da Informação engloba tecnologia – forma, design - apresentação e texto - conteúdo.

3.2 A Arquitetura da Informação no Projeto Web
A primeira etapa de um projeto é o briefing, documento no qual são definidos objetivos e prioridades. Com esses dados em mãos, o arquiteto da informação irá elaborar estudos, planejar funcionalidades e entregar documentos (deliverables) que orientarão os processos de programação, criação de layout e testes de usabilidade.

A Arquitetura da Informação se encontra na fase de planejamento, sendo de extrema importância para alcançar o retorno definido na fase do briefing.  Por meio dela, é possível segmentar o processo, facilitando a detecção de problemas de aplicação e suas correções. É um processo que funciona de maneira ótima no início de um projeto (Figura 1), mas que também pode ser aplicado em projetos já concretizados, como forma de corrigir problemas encontrados em testes de usabilidade.

Muitas vezes é uma etapa ignorada no projeto web, tendo a criação do layout logo após a coleta de informações, o que freqüentemente gera um produto sem foco claro e com graves problemas de interação com o usuário pela falta de planejamento.

FIGURA 01. ELEMENTOS DE UM PROJETO WEB

FONTE: http://www.jjg.net/elements/translations/elements_pt.pdf

3.3 Aplicação, Ferramentas e Documentação

Para facilitar o entendimento, pode-se observar a aplicação da A.I. por etapas. Abaixo serão apresentadas algumas aplicações e respectivas ferramentas consideradas importantes.
O conteúdo textual precisa ser organizado e rotulado para que o usuário possa encontrá-lo facilmente, para isso, é dividido em pedaços que receberão rótulos e estes rótulos poderão ser agrupados, os grupos rotulados e assim sucessivamente. O card sorting (Figura 2) é uma ferramenta aplicada para entender como o usuário organiza as informações na mente, sendo eficaz para definir os rótulos mais próximos da realidade do público-alvo. Basicamente trata-se da distribuição de cartões com rótulos ou conteúdo, para que o usuário faça a correspondência que considera lógica, em alguns casos os rótulos são preenchidos pelo próprio usuário.

FIGURA 02. APLICAÇÃO DE CARD SORTING

FONTE: http://www.flickr.com/photos/skillclouds/2595306341/

Definidos os rótulos, é necessário definir o fluxo da navegação, ou seja, os caminhos que o usuário percorrerá até cada informação. Esse processo de navegação pode ser representado por meio de fluxogramas (Figura 3) que são bases para outra ferramenta, o mapa do site – lista hierárquica com links diretos para os conteúdos das páginas. O fluxograma não depende necessariamente da rotulação.

FIGURA 03. FLUXOGRAMA DE NAVEGAÇÃO

http://www.flickr.com/photos/henriquecostapereira/1392820227/

Com a organização mental do texto definida, é necessário determinar a localização desse conteúdo na página física, a interface. Essa distribuição deve considerar tanto elementos textuais quanto imagens e animações, e deve ser feita aplicando conceitos de diagramação para evidenciar a hierarquia de importância das informações. Desenvolve-se o rascunho da página apontando a localização dos itens, o wireframe (Figura 4), como numa planta de arquitetura.
FIGURA 04. WIREFRAME

FONTE: http://webinsider.uol.com.br/index.php/2003/12/09/wireframe-documento-cada-vez-mais-importante/

Para garantir que os estudos feitos terão resultados próximos do esperado, são feitos testes de usabilidade nos quais os usuários são submetidos a simulações do website. Protótipos feitos de papel ou virtuais são usados para que as pessoas tentem encontrar uma informação específica e relatarem suas dificuldades ou afirmarem seu sucesso.

04. CONCLUSÃO

A Arquitetura da Informação é uma ferramenta poderosa na organização do conteúdo, tornando-se uma etapa imprescindível na criação de websites realmente direcionados para o usuário. É um processo cíclico que, fazendo uso de outros processos como as análises de usabilidade, pode facilitar ainda mais a navegação pela Internet, tornando as informações cada vez mais acessíveis para as pessoas por meio de uma navegação instintiva.

Os produtos resultantes dos processos da Arquitetura da Informação são três documentos. O wireframe, para facilitar a integração com a criação artística do layout informando a posição dos elementos gráficos principais; O fluxograma de navegação, definindo o curso das informações; e o mapa do site, relatando a divisão hierárquica dessas informações.É possível aplicar os conceitos da A.I. em qualquer tipo de projeto web, decidindo quais etapas serão necessárias de acordo com tamanho, prazo e recursos a serem utilizados.

REFERÊNCIAS

Arquitetura da informação para os que chegam agora

A arquitetura da informação segundo Lou e Peter

Arquitetura de Informação, Usabilidade e Web Design

Jakob Nielsen

Laboratório de Utilizabilidade da Informática

O que é arquitetura de informação em websites

Organizando websites com os parâmetros da Arquitetura da Informação

Por que você precisa de um arquiteto da informação?

The Elements of User Experience by Jesse James Garrett

Wireframe, documento cada vez mais importante

O cliente não sabe o que precisa (mas sabe o que não quer)

É um fato bem comum em briefings: esperar a resposta para os problemas do cliente perguntando o que ele quer. Acredite, na maioria das vezes ele não sabe, nem faz idéia. Certo ele, somos contratados para dar soluções e não para fazer o cliente pensar. Descubra os limites do que não se quer e trabalhe as soluções dentro disto. Nesse contexto, você conseguirá um espaço para solucionar de forma criativa os problemas pontuais do cliente, correndo menos riscos de ter que refazer todo o trabalho - ou ter que publicar um Frankeinstein que não tem coragem nem de assinar.

Ao contrário do aplicado geralmente, briefing não é um questionário, é a definição inicial do projeto, um guia para saber por onde ir. E antes de definir um produto ou layout, é preciso saber quais as necessidades do público-alvo do cliente, veja bem, do público. Quando se pergunta para o cliente coisas do tipo “quais cores gostaria de usar”, é como se dissesse “o que você, fulano, quer?”. Pergunte o que ele não quer ver e proponha suas soluções para a situação comercial dele (e não para o gosto).

Quando se dá espaço para decidir detalhes do projeto em que base teórica e estudo de caso são cruciais, o profissional começa a se tornar “marionete” do cliente, rebaixado a mero de operador de software para realizar vontades pessoais - perde a posição de provedor de soluções. Ele não pode pensar que é capaz de fazer o seu trabalho, a partir daí não importa quantos cursos, livros e faculdades você tem, o seu valor já foi perdido.

Depois do estrago feito, a culpa (e as reclamações) sobrarão para você. E não adianta reclamar que a culpa é do mal gosto alheio, se algo foi escolhido, então existiram opções e dentre as opções estava alguma coisa que não serviria como solução no projeto. Exemplo prático: depois de ouvir todas as idéias mirabolantes do cara, você resolve criar uma opção em cima daquilo com a desculpa de que “ele vai ver como ficou horroroso”. Se ele imagina uma coisa daquele jeito, é bem provável que ele vá gostar, e até decidir que aquilo é melhor para ele do que o layout estruturado e direcionado que você levou horas fazendo. Sendo assim, o seu trabalho foi feito pelo cliente e não para o cliente. Ou faltou direcionamento pelo profissional, ou o cliente não era para você.

E o seu público-alvo?

E sim, acredito que existem clientes certos e errados, assim como designers cujo estilo é bem específico.
Fazendo uma analogia entre layout e roupa:

1. A cliente é uma mulher esbelta, alta, bonita, executiva de uma grande empresa, se ela for na C&A comprar uma roupa, vai poder se vestir, pode até ficar apresentável, mas dentro do ambiente em que trabalha, provavelmente se destacará negativamente pois o tecido da roupa não é fino, o acabamento é menos cuidadoso, o caimento não é perfeito - além de correr o risco de estar igualzinha a sua secretária.
2. Steve Jobs precisa de um site para o iPhone e vai ao Template Monsters comprar um layout. Os layouts são até bem executados, têm mil efeitos, tem espaço para todas as informações, mas outras 10 pessoas de qualquer área terão o mesmo layout.

Se o cliente tem um produto superior e pensa pequeno, é menos complicado de mostrar como exclusividade e individualização farão a diferença para o seu negócio (manter a imagem diferenciada, no caso da executiva e do iPhone), do que convencer o cliente pequeno (a secretária ou os compradores de templates) de que eles precisam investir em tecnologia e soluções exclusivas, que isso é essencial.

São dois públicos diferentes e não adianta tentar vender a mesma coisa para os dois. Se o seu trabalho engloba soluções totalmente inovadoras e diferenciadas com tecnologia de ponta, consumindo grande quantidade de recursos - tempo e pesquisa, provavelmente será uma dor de cabeça trabalhar com clientes pequenos que precisam de soluções simples, perdendo tempo com propostas complexas. De outra forma, se você prefere lidar com soluções práticas e de pequena dimensão, terá dificuldades em lidar com a complexidade de um cliente grande cheio de necessidades e complicações.

Tenha consciência do seu trabalho, escolha bem o cliente e proponha somente as melhores soluções. Se você está aí só para ganhar dinheiro, ponha o seu operador de software no comando e boa sorte.

Para saber mais:
Arquitetura da informação
Design de Interação
Padrões no Design de Interação

(Tirando, aos poucos, os três anos de ferrugem dos dedos.)

Penso, logo pesquiso (pesquiso, logo penso mais ainda)

Assim, bem óbvio: quem pensa, precisa de respostas e quem pesquisa, fica sabendo. Aqui dividirei com vocês os frutos das minhas pesquisas e alguns devaneios tolos. Design, desenvolvimento e tecnologia são assuntos constantes no meu dia-a-dia e é provavelmente o que mais vai se encontrar por essas bandas.

Estudo Design Gráfico na UTFPR, mas já passei 1ano e meio em Publicidade (UFPE). Nerdzinha desde os 8, comecei a me interessar por design digital com 12, mas com o rabo do olho na programação. Queria ser designer/programadora de jogos, especificamente Adventures (culpem o Guybrush). Já pensei em fazer Administração, Engenharia da Computação, Psicologia e Sistemas de Informação. Nesses 16 anos, a ênfase do meu trabalho tem sido web: HTML, CSS, Webstandards. Também trabalho com edição de imagens, fotografia (paixão) e vetores, aliás, tento criar sempre que possível.. meu caderno de rabisco anseia desesperadamente que eu dê vida ao seu conteúdo (desenhos e produtos), mas cada coisa no seu tempo.

Há 1 ano entrei no mundo do Flash e comecei a gostar da brincadeira com ActionScript (convenhamos, animação em timeline é um saco). Ao mesmo tempo, minha preocupação com Arquitetura da Informação, Usabilidade e experiência do usuário aumentou em progressão geométrica. Infelizmente ainda não tenho o espaço que gostaria pra aplicar o que entendo por experiência de navegação e usabilidade, mas acredite, eu luto bastante por isso. (Estágio, sabe como é). Agora aqui no ITC as coisas estão ao meu favor.

Totalmente hiperativa, mil coisas rolando ao mesmo tempo e as pesquisas entram aí. Sou daquele tipo estranho de pessoas que encontra tudo na Biblioteca sem procurar no sistema. Abas abertas enlouquecidamente, del.icio.us em constante crescimento e postando no twitter o que julgo mais interessante. Meu TCC vai ser na área de AI e Usabilidade, e a pesquisa já começou. Paixão por soluções.

No mais, amor incondicional por latidos e miados, música diluída no ar, garganta e nos dedos, idéias mirabolantes, tatuagens, cozinha experimental + pimenta, dominó avançado, House M.D., Saramago e Gabo.