Arquitetura da Informação sem Wireframe
Upcoming SlideShare
Loading in...5
×
 

Arquitetura da Informação sem Wireframe

on

  • 7,506 views

Apresentação realizada em 22/out/2011 no 5o EBAI - Encontro Brasileiro de Arquitetura da Informação por Karla Cruz e Rodrigo Gonzatto.

Apresentação realizada em 22/out/2011 no 5o EBAI - Encontro Brasileiro de Arquitetura da Informação por Karla Cruz e Rodrigo Gonzatto.

Statistics

Views

Total Views
7,506
Slideshare-icon Views on SlideShare
2,209
Embed Views
5,297

Actions

Likes
17
Downloads
75
Comments
0

20 Embeds 5,297

http://arquiteturadeinformacao.com 2854
http://arquiteturadainformacaodigital.blogspot.com.br 824
http://www.gonow.com.br 405
http://www.faberludens.com.br 389
http://karlacrux.com 217
http://arquiteturadainformacaodigital.blogspot.com 180
http://www2.gonow.com.br 163
http://www.gonzatto.com 160
http://arquiteturadainformacaodigital.blogspot.pt 47
http://arquiteturadainformacaodigital.blogspot.ru 30
http://translate.googleusercontent.com 15
http://www.linkedin.com 4
http://arquiteturadainformacaodigital.blogspot.nl 2
http://www.arquiteturadainformacaodigital.blogspot.com 1
http://webcache.googleusercontent.com 1
http://blog.gonow.com.br 1
http://julianaconstantino.wordpress.com 1
http://arquiteturadainformacaodigital.blogspot.de 1
http://arquiteturadainformacaodigital.blogspot.se 1
https://www.linkedin.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

CC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • \n
  • \n
  • \n
  • \n
  • 1. perguntar: quem já fez projeto sem wireframe?\n2. quem já fez projeto sem wireframe e se considerou fazendo AI?\n\nIsso é bom ou ruim?\nNós perguntamos “porque”?\n\n- quem nunca fez mas sabe o que é etnografia.\n- onde a etapa mais negligenciada é a de implementação/avaliação\nou seja. projetamos e não sabemos se ou como funciona\n\na entrega de documentos como o wireframe marca a finalização da participação de um arquiteto em um projeto?\n\npessoal, o que queremos discutir com vocês é o seguinte: \n- será que o wireframe não está atrapalhando a Arquitetura da Informacao?\n- impedindo que o arquiteto desenvolva outras habilidades?- tanto na própria opção de processo quanto na expetativa do outro\n- pq? pq a galera só ve o trabalho do arquiteto no wireframe\n- não TOCAm, nao VEEM o processo . e por isso não dão valor\n
  • esta é umaproblemática no nível do profissional\n\neste é um assunto discutido no próprio EBAI\n\n"maestro de uma orquestra, concebendo e movendo a equipe para frente" MORVILLE\nou \no operador de axure?\n\nao mesmo tempo que o wireframe é a atividade mais executada temos... (póximo slide)\n\n\n“a natureza holística do trabalho de arquitetura de \ninformação, certas pessoas claramente não se darão por satisfeitas até \nque tenham controle direto sobre todos os aspectos do trabalho que \npossam afetar a arquitetura. Esse modo de pensar é um sinal do pior \ntipo de arrogância e solapa todo esforço de convencer as empresas do \nvalor da disciplina” GARRET\n
  • este desejo de dominar todo o processo\n\nisso impacta onde?\n\nno ponto máximo onde o arquiteto de informação pode tocar\nno cheirinho de interface do usuário\n\nonde temos o reflexo?\nas consequencias aparecem no desejo, na fome... (próximo slide)\n
  • ... na ansiedade do wireframe\n\nTemos “ansiedade de wireframe”: de que a resolução dos problemas de arquitetura estão num documento e podem ser manipuladas, tocadas...\n
  • \n
  • \n
  • \n
  • \n
  • um documento\numa especificação: acordo entre profissionais sinalizando o caminho decidido para aquilo que deverá ser produzido\n- um setor de agências de publicidade ("manda pro wireframe")planta baixa de uma agência com "área dos post-its"\n- e as vezes até uma pessoa ("chama ai o… wireframe")pessoa com cara de wireframe\n\nestaria o destino do arquiteto ser tipo um “flasheiro” ou “htmler”?\n
  • \n
  • \n
  • SLIDE 3 FUNÇÕES DO WIREFRAME COMO DOCUMENTO:\n- comunicar ( espaço entre pessoas par amanifestar possibilidades mais definidas)\n- colaborar (especificar... e por isso, espaço de disputa) \n- documentar ( registrar E MATERIALIZAR)\n\n“O wireframe é uma maneira de manifestar\ndecisões realizadas em torno de um projeto,\ne pode ser utilizado com diferentes propósitos.”\n
  • o ponto mais importante da sua utilização é como colaboração.\n\nSegundo James Garrett, quando arquitetos \nde informação e designers são separados, a única maneira de se produzir wireframes de \nsucesso é por meio da colaboração.\n\ne quando isso fica na mão de um profissional, outros aspectos são deixados de lado... \n\nfalando de desenvolver conceitos, de acordar, de decidir, o arquiteto com o wireframe tem nas mãos este controle e passa a fazer parte da disputa \n\né nesta dinâmica que\n
  • e quando a colaboração não acontece nós percebemos o conflito, \n\no conflito é algo positivo, quando amenizada as relações de poder, quando existe diálogo e troca, e o wireframe não tem um “pai”, um dono\n\nO projeto de interfaces é um processo político (AGNER, 2006, p.140-144) onde se \nmanifestam conflitos de perspectivas e prioridades, em um jogo que envolve múltiplos \ninteresses de clientes, usuários, arquitetos, designers, desenvolvedores, entre outros. \n\no wireframe está no limiar entre a arquitetura de \ninformação e o design de interface. O modo mais comum de se fazer wireframes reforça uma \ndicotomia conteúdo e forma, onde o arquiteto trabalha em prol deste último e, desta maneira, \ninevitavelmente interferindo no trabalho de Design Visual.\n
  • \n
  • http://darmano.typepad.com/logic_emotion/2006/05/the_guided_wire.html\nhttp://boxesandarrows.com/view/the_guided_wire\n
  • \n
  • pensando no quanto interfere na arquitetura de infromação, na relação dos profissionais, o quanto não é positivo te-lo centralizado.\n\nenquanto o arquiteto se coloca como ”fazedor de wireframes”, ele também é percebido...\n
  • a pergunta é: quais são as implicações disso?\ncomo isso retorna ao profissional ou a disciplina?\n\né desta maneira...\n\nserá que era isso que o arquiteto de informação, ao adotar o wireframe, adotar de fato como sua obra, esperava?\n\n\n
  • aqui ele já projetou arquitetura de informação, achou que projetava experiências, e chegou ao wireframe thinking.\n
  • afinal, dá para fazer AI sem wireframe? \nlevantamos algumas 3 maneiras que \najudam a pensar no objetivo do \nwireframe: documentar, colaborar e \ncomunicar -- e modos de fazer sem ele\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • falar do problema de começar a \nespecificar sem antes testar \npossibilidades com sketch, \ngogosketch, etc\n\nfalar que o fred criou o termo\n
  • Já o wireframe detalhado, assim como qualquer trabalho que exija tempo e \ndedicação, pode gerar um apego entre seu produtor e o resultado do trabalho e, assim, \nrestringir possibilidades de desenvolvimento em um estágio inicial\n
  • \n
  • o que fazer se o wireframe nem \nsempre é a melhor pedida?\n
  • explorarem nos seus \ntrabalhos as alternativas: dar uma \nchance para olhar a Arquitetura \nsem wireframe pode dar inights \nde novos métodos e práticas \n
  • \n
  • \n

Arquitetura da Informação sem Wireframe Arquitetura da Informação sem Wireframe Presentation Transcript

  • 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 . Etnografia
  • dissecando o wireframe
  • 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 especifica 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, fio; 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
  • wireflowconheç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