Wireframes
Há alguns dias na lista de discussão de Arquitetura de Informação estava rolando uma thread que comentaram sobre ninguém nunca ter visto - de outros arquitetos de informação - wireframes, mapas de fluxo e outras modelagens que são necessários no processo de arquitetura de informação. É certo que alguns arquitetos de informação trocam figurinhas, pedem alguns pitacos, mas isso acaba ficando restrito a um grupo de conhecidos. É claro, muitos projetos também tem que ser mantidos em sigilo absoluto por pedido dos clientes.
Durante a minha passagem por uma instituição de ensino superior, depois de brigar muito pela importância da arquitetura de informação, consegui aplicar alguns testes de usabilidade, criei sitemaps, wireframes, mapas de navegação e irei disponibilizá-los aqui nas próximas postagens.
Antes que alguém pergunte, mas o que é esse tal de wireframe, eu explico:
Um wireframe é uma representação gráfica prévia de uma interface. No wireframe estão posicionados os elementos básicos da interface, a navegação entre a informação posicionada na tela. Existem dois tipos de wireframes: Estáticos e Navegáveis.
Os wireframes estáticos são mais simples, neles são desenhados os principais blocos de apresentação de informação sem muito detalhamento, apenas para se ter um ponto de referência do produto final.
Já os wireframes navegáveis, chegam a ser confundidos com protótipos, pois apresentam algumas respostas aos comandos (cliques e acionamento de teclas) aplicados. Por serem um pouco mais complexos, tendem a tomar um tempo maior de desenvolvimento.
Existem muitas ferramentas para fazer wireframes, entre as mais conhecidas o Axure e Microsoft Visio, alguns arquitetos de informação utilizam até mesmo o Microsoft Power Point ou outro programa de apresentação de slides para desenhar os rascunhos da interface.
Eu sempre usei o Axure para os wireframes e o Visio para fluxo de navegação. Já que formatei o PC, vou baixar novamente a versão trial do Axure para abrir os wireframes e exportar para formato de figura jpeg.
O Felipe Memória em seu livro Design para a internet publicou alguns cases e seus wireframes e mapas de fluxo, achei muito bacana a idéia e estou trazendo para o meu blog.

April 12th, 2008 at 2:46 pm
Parabéns pelo sitee !
mesmo não entendendo os assuntos.. eu gosto de ler hehe
querido sucessooo!
bjos
April 15th, 2008 at 8:46 am
Eu sempre criava wireframes para os designers na ultima empresa que eu trabalhei. Mas agora na minha atual, o pessoal usa Linux, e eu não conheco nenhum software bom pra isso, vc tem algum para indicar?
Achei otimo o post.
Abraços
April 16th, 2008 at 2:39 pm
Claudio, as ferramentas que eu recomendo são essas que disse que uso:
Axure (versão de teste, é muito cara a licença)
Visio e também o Power Point
Esses são os principais, e o legal do Axure é que as telas chegam mais proximas da realidade, por causa dos botões e formatos de objetos, assim como no Visio que tem muitos objetos já prontinhos.
Obrigado por ler o xbilidade.net
Assim que eu terminar a mudança, colocarei aqui alguns exemplos de wireframes feitos no axure.
August 17th, 2008 at 1:45 am
[…] Mapa de Fluxo de Navegação permite reunir todos os wireframes desenhados, detalhando em cada objeto ou bloco de conteúdo suas interligações com outros […]