Arquitetura de Informação em 7 etapas

1,269 views
1,144 views

Published on

Um exemplo de processo pra fazer Arquitetura de Informação.

Published in: Education
1 Comment
1 Like
Statistics
Notes
No Downloads
Views
Total views
1,269
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
34
Comments
1
Likes
1
Embeds 0
No embeds

No notes for slide

Arquitetura de Informação em 7 etapas

  1. 1. ARQUITETURA DE INFORMAÇÃO PROJETANDO A EXPERIÊNCIA DO USUÁRIO Com André Silveira @energizadorArquitetura de Informação em 7 etapasNão vou falar sobre a importância de existir uma etapa específica onde seja trabalhada a Arquitetura deInformação e como isso traz qualidade pro seu produto, pois isso já fiz neste post http://energizador.blogspot.com/2011/10/preciso-mesmo-ter-arquitetura-de.html. Quero mostrar um exemploprático elaborado através de entrevistas com colegas, pesquisas e minha experiência de trabalho nasagências por onde passei.1. BRIEFINGTudo começa com a captura de informações essenciais essenciais pro projeto. Pode ser seu primeiro pontode contato com o cliente, então vou dar algumas ideias pra você começar bem essa relação:• Antes da reunião, estude o mercado do cliente, busque saber tudo sobre ele;• Questione apenas o necessário, não canse o cliente fazendo perguntas que já estão respondidas em seu site ou nas redes sociais;• Formule diferentes tipos de briefing para projetos promocionais, institucionais, sistemas, mobile, etc.;• Foque em questões estratégicas do negócio, como objetivos, diferenciais e problemas a resolver - isso é o básico;• É hora de ouvir;• Você não precisa ter as respostas agora. Pegue as informações para depois estudá-las;Recursos utilizados:• Basecamp, sistema de colaboração entre o cliente e você;• Qualquer editor de texto, como MS Word;• Mindjet MindManager, um software de mapas mentais;• Gravador de voz digital (uso o Sony ICD-PX 820, mas os da Olympus são ótimos também).2. ANÁLISEApós captar os dados, é hora de aprofundar o estudo examinando/ evoluindo os itens do documento etrazendo tipos de análise que possam contribuir. A análise pode ser uma evolução do Briefing pra um (51) 3325-2596 1 www.targettrust.com.br
  2. 2. ARQUITETURA DE INFORMAÇÃO PROJETANDO A EXPERIÊNCIA DO USUÁRIO Com André Silveira @energizadordocumento estratégico e norteador ao projeto (v2_briefing_website_Nome da Empresa). Principais técnicasutilizadas:• Se for um redesenho, gosto de fazer uma análise da usabilidade atual do site, assim vejo as falhas do projeto. Uso as Heurísticas do Nielsen e um Checklist que montei com o passar do anos;• Análise SWOT, é boa pra tudo;• Ambientes de referências ou empresas benchmark são ótimos caminhos pra você viver mais o mercado do seu cliente (veja, anote, faça observações quanto ao design, tecnologia e tudo mais que achar interessante);• Através dos meus contatos do GMail ou Facebook, monto uma espécie de grupo de interesse, pessoas tudo-a-ver com o público dos caras. Entrevisto pelo menos 10 pessoas com questões relacionadas ao projeto;• Relatórios estatísticos do consumidor (como os do IBOPE), do site (Google Analytics), etc.;• Por fim, consolido minhas descobertas, reescrevo o Briefing de uma forma fácil e objetiva e envio pro cliente.Recursos utilizados:• Editor de texto;• Grupos do Facebook;• Sites de referência como Behance, CPLUV, INfront, TAXI, Design is Kinky, Fubiz, Creattica, entre outros. Durante essa fase de pesquisa e maturação das ideias, eu crio um .txt onde coloco: Lista de sites com observações de pontos interessantes da estrutura (exemplo: "Sofitel: área pra reserva"; Nike: menu...); Ideias que vão surgindo, anoto tudo e depois filtro o que é ou não possível; Lista de assuntos possíveis ao site (como se fosse um sitemap, mas sem questionar se vale ou não - vejo isso depois).3. BRAINSTORMINGVocê pesquisou, quebrou a cabeça, pensou várias vezes que era um inútil por não achar soluções? Calma,seus problemas acabaram ;-): utilize o time de projeto, apresente a questão e discuta as possibilidades.Importante: (51) 3325-2596 2 www.targettrust.com.br
  3. 3. ARQUITETURA DE INFORMAÇÃO PROJETANDO A EXPERIÊNCIA DO USUÁRIO Com André Silveira @energizador• Não se iluda com todas as ideias possíveis, muito menos com as pessoas "do contra"; absorva o que importa pra você definir o projeto - se quiser, deixe claro isso pra seus colegas, antes de começar;• Não faça escândalos se uma de suas ideias "morrerem" ou forem vencidas por outra melhor. Aceite e siga em frente.Recursos utilizados:• Mindjet MindManager;• Browser Steck Pad pra esboçar possibilidades.4. CONCEITOFaça um balanceamento com o escopo contratado e formule o Conceito (de AI) do projeto, pois é a partirdeste validamento que você montará a estrutura e a ideia de navegação do site. Lembre que você já temdados pra isso, coletados durante o Briefing. Aquelas palavras são as fontes pra redação de um conceito.Siga o processo, não crie um protótipo sem antes definir a ideia do produto, nem que seja mentalmente, porhora. O Conceito será o seu argumento de venda, sua defesa pro GP e cliente, logo ali. Você encontraráótimas referências de conceito no livro Advertising Now. Online.5. SITEMAPPossivelmente você já tenha alguns rascunhos, agora crie um mapa que demostre claramente aorganização do site:• Formule através de nós (quadrados), conexões, esquemas de numeração e rótulos o seu sitemap;• Mostre quais são os itens da primeira tela;• Quais são as seções principais e locais - grupos de informação com rótulo adequado;• Quais seções serão gerenciáveis;• Quais itens serão comuns à Arquitetura de Informação (utilidades, ferramentas...);• Se inserir mais atributos de página, crie uma legenda.Recursos utilizados:• Mindjet MindManager ou Visio; (51) 3325-2596 3 www.targettrust.com.br
  4. 4. ARQUITETURA DE INFORMAÇÃO PROJETANDO A EXPERIÊNCIA DO USUÁRIO Com André Silveira @energizador6. WIREFRAMEO wireframe é a planta baixa do seu site, é o desenho NÃO estético, o esboço. Ele é o esqueleto do seusistema de navegação e, com exceção da hierarquia, do posicionamento dos componentes, em nada deveriase parecer com o layout final (Wireframes não precisam ser bonitos, não servem pra isso). O Wire nada maisé do que o resultado do seu processo de Arquitetura de Informação, a demonstração visual do projeto deinterface. Algumas dicas:• Primeiro, concentre-se num esboço, de preferência feito no papel; depois, refine, utilizando software de preferência, marcando e fazendo observações nas funcionalidades;• Não se preocupe com a estética, explore as possibilidades e utilize imagens e texto de marcação Lorem ipsum http://www.lipsum.com por enquanto;• Os padrões têm grande importância, pois ajudam o usuário no processo de habituação, predição, reorientação http://tinyurl.com/62u8gxt; logo, pense neles, templates http://pt.wikipedia.org/wiki/ Templates e na melhor forma de indicar para o usuário o conceito do projeto, o que é mais e menos importante em nível de informação em página inicial vs internas;• Com uma home e uma página interna, já é possível sentar-se com o cliente e aprovar o protótipo do projeto, dando possibilidade pra você progredir com o restante das páginas. É um erro do mercado achar que o DA consegue fazer ao mesmo tempo a Arquitetura de Informação e o Layout, pois uma coisa é organizar, classificar ou pensar no melhor rótulo (nomenclatura) pra um um item, outra coisa é pensar em cores, fontes e formatos. Fazer os dois juntos, literalmente, aumentará seu tempo de criação e, pior, prejudicará a usabilidade do site. Lembre-se que usuários toleram um design tosco, desde que ele funcione, desde que eles consigam REALIZAR algo. Mas usuários não toleram um site lindo, mas que é difícil de navegar, é desorganizado, é enigmático, que tem problemas com vocabulário... O importante é ter equilíbrio entre as disciplinas.Recursos utilizados:• Browser Steck Pad;• User Flow Stencil Kit;• Mockingbird ou Axure;• Adobe Fireworks (51) 3325-2596 4 www.targettrust.com.br
  5. 5. ARQUITETURA DE INFORMAÇÃO PROJETANDO A EXPERIÊNCIA DO USUÁRIO Com André Silveira @energizador7. TESTESEste item pode estar no final, mas realizo Testes constantemente, durante todo o processo, masprincipalmente antes de apresentar o protótipo ao cliente. Praticamente volto pra etapa de Análise e revisoo projeto, utilizo algumas das técnicas novamente, comprovando se estou atendendo aos objetivos denegócio da empresa. Ou seja, critico e realinho muito meu Conceito, Sitemap e Wireframe.(Fora as técnicas) Recursos utilizados:• UserTesting.com;• Concept Feedback;• Crazyegg (mapas de calor)Você viu que não tenho uma etapa pra documentação. Isso porque faço Wireframes com observações ondedescrevo o funcionamento das áreas onde é necessário explicação. É uma forma menos maçante e maisvisual de explicar o funcionamento do sistema.Por fim, aconselho que você acompanhe a produção do projeto até o final, fazendo manutenção daArquitetura de Informação proposta e, com isso, permanecer atendendo desejos iniciais, controlando riscose qualidade do produto. (51) 3325-2596 5 www.targettrust.com.br

×