Conheci arquitetura de informação em 2006 na Agência Click e desde 2007 exerço a função de arquiteto de informação. Já são alguns anos trabalhando na área. Pensar no usuário antes de tudo sempre foi algo natural desde que comecei fazer os primeiros trabalhos digitais lá em 1999. Já fui designer e interface e conheço um pouco do processo de desenvolvimento. A experiência de experimentar outras etapas do processo foi bem rica no meu caso.
Quem conhece a disciplina de AI sabe que o wireframe é a entrega final do arquiteto de informação. Algumas empresas chamam esses profissionais de designers de experiência, designers de interação ou mesmo arquitetos. O importante mesmo é o pensamento estratégico e o resultado final do projeto.
Durante minha trajetória na área percebo que nem sempre todos entendem o que são e para que servem os wireframes. O wireframe é apenas o meio para o fim de uma criação de um website ou aplicativo. Ele define a primeira camada de conteúdo que o site irá ter. Não tem a função de limitar a criatividade do designer, redator ou desenvolvedor. Não existe essa história que o arquiteto definiu assim, vai ficar assim. Toda ideia que vem depois do wireframe existe para evoluir o projeto e não para corrigir o que o arquiteto fez de errado. Como disse em outro post, a experiência do usuário é responsabilidade de todos. Não custa nada lembrar novamente.
Rabiscoframes
O rabiscoframe é o momento que antecede o wireframe. Todo dia vejo uma ferramenta nova ou um aplicativo para o iPad, por exemplo. Mas não vejo nada melhor que papel, lápis e borracha. Ontem li um artigo sobre o assunto onde um designer sugere que usemos papel e caneta para não cair na tentação de apagar e desenhar novamente do zero. A ideia é desenhar uma, duas, três ou o tanto que for necessário. Assim você consegue evoluir a ideia nos estágios iniciais. Isso tem funcionando bem comigo.
Esse é o momento de testar o maior número de soluções. Interface se faz assim. Desenha, testa e desenha novamente. O legal é usar várias folhas e comparar as saídas para ver o que é melhor.
Wireframes
O wireframe é muito mais detalhado que o rabiscoframe. Separei wireframe até para diferenciar de protótipo. Antigamente se usava muito o PowerPoint para fazer o trabalho. O wire era estático e as interações tinham que ser imaginadas pela equipe de desenvolvimento. Era um tempo que a navegação acontecia praticamente tela a tela.
Protótipos
Atualmente as interfaces estão muito mais ricas. As possibilidades com HTML, CSS e Java Script são bem maiores. E tudo isso acontece sem a necessidade do Flash. Lembrando que não tenho nada contra a utilização do Flash. Vejo que o ferramenta da Adobe tem o seu valor e funciona muito bem em games. E também sou contra a história que um site só fica bonito quando feito em Flash. Essa lenda é bem antiga e não cola mais nos dias atuais.
Existem várias ferramentas para a criação de um protótipo. Eu uso e gosto muito do Axure. Ele permite a criação de um protótipo capaz de mostrar como a interface funcionará no final.
É importante ressaltar novamente que é apenas um protótipo. É o primeiro passo daquilo que se imagina para o resultado esperado.
Hoje em dia é difícil ver um site feito em Flash. Lembro da época que eu conheci essa poderosa ferramenta, que ainda pertencia a Macromedia. Fiquei fascinado pelo poder de interação que ela proporcionava, pois o HTML ainda se mostrava bastante limitado.