Arquitetura da Informação sem Wireframe

Arquitetura de Informação sem Wireframe @cruzk @gonzatto

@cruzk @gonzattoArquitetura de Informação sem Wireframe

Wireframe:a atividade mais executada pelo AI brasileiro

o que faz AI?

ansiedadede wireframe

Wireframing Information Architecture a centralidade do wireframe

InformationArchitecture Research . Etnograﬁa

dissecando o wireframe

page schematic (esquema de página) versão tosca do site arquitetura de informação protótipo blueprintwireframetambém conhecido como:

wireframe designa:LoremIpsum! uma pessoa? um documento um setor

wireframeÉ... 1. o contorno daquilo que será a interface 2. esboço da interface que o usuário terá contato 3. diagrama que especiﬁca uma página do website 4. renderização “bruta” que ilustra quais as informações mais importantes de cada tela 5...

wireframeo que é afinal Wodtek e Govella (2009, p.182) sugerem imaginar o wireframe como a armação usada por um escultor para dar forma e suporte permitindo, depois, adicionar o barro. Seu próprio nome já evidencia a metáfora: "wire", de arame, ﬁo; e "frame", de esqueleto ou estrutura. arame . estrutura

o m e de sp u co n cid e ic lab c a ir ifi r or cri or ca ga ar ar r niz a t ar p co ipa ro rd r to arwireframeé usado...

como criaçãoPara explorar e desenvolver conceitos e testarpossibilidades de organização visual de elementos. como *colaboração Um “acordo" colaborativo sobre como o como sistema deverá ser protótipaçãoDetalhamento de um projeto para validar o processo deimplementação e a própria arquitetura de informação como documentação Uma das ferramentas para se registrar diversas decisões sobre o projeto

relações de poder . interface . disputa . controleDa pra deixar Então deixaas caixinhas Posso fazer eu escolhermais ali... o wireframe as cores? com você?

Como ir alémdo Wireframe “tradicional”?

wireframe com narrativa guiada conheça mais no corais.org

wireﬂowconheça mais no corais.org

pensando sobreo wireframe...

problemas?

UX designer o grande AI o pequeno AI wireframe thinker

AI sem wireframeé possível?

prototipação comunicaçãodocumentação tirando o wireframe para melhorar

alternativa para... documentaçãoImagem de Globalista1

diagrama de descrição de página conheça mais no corais.org

alta (Prioridade) baixa1 2 3Em qualquer página web, um Ajudar o cliente focar As áreas de conteúdo sãopedaço de informação pode conversas em conteúdo, descritas em texto, como emter maior ou menor peso funcionalidade e prioridade uma especificação funcional, evisual, dependendo do uso dos conteúdos das páginas, distribuídas na página emda cor, contraste, posição e sem travar a criação dos ordem de prioridade , nestetipografia. Mas estas são designers. caso, a prioridade se da maisferramentas de um designer para itens na parte superior evisual, são os fundamentos do na esquerda do que aquelesdesign gráfico, e estão fora na parte inferior e na direita.do negócio do arquiteto deinformação. (BROWN, 2002) 1 2 3 O documento pode conter componentes de interface.

alternativa para...comunicação

troca . diálogo . contação de históriasgogosketch . AI ágil . improviso

alternativa para...prototipação

processo divergente . experimentação . baixa fidelidade . articulação 09/ 0/2 1 011 wire rvor sa erabiscoframe . sketch . desapego

e agora?greve de wireframe?

experimentem!

agradecimentos @lucianolobato @usabilidoido @belkiss

Obrigado!@cruzk @gonzatto

http://arquiteturadeinformacao.com	2084
http://www.gonow.com.br	365
http://www.faberludens.com.br	324
http://www2.gonow.com.br	163
http://karlacrux.com	128
http://arquiteturadainformacaodigital.blogspot.com.br	126
http://arquiteturadainformacaodigital.blogspot.com	123
http://www.gonzatto.com	46
http://translate.googleusercontent.com	14
http://blog.gonow.com.br	1
http://arquiteturadainformacaodigital.blogspot.pt	1

Arquitetura da Informação sem Wireframe

by Rodrigo Gonzatto on Oct 21, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

11 Embeds 3,375

Statistics

Arquitetura da Informação sem Wireframe — Presentation Transcript