projetando experiencias

67
Projetando Experiências Arquitetura de Informação e User Experience Design VII Semana de Biblioteconomia – ECA/USP 26.set.2012 por Paula Macedo

Upload: paula-azevedo-macedo

Post on 19-May-2015

2.928 views

Category:

Career


0 download

TRANSCRIPT

Page 1: Projetando experiencias

Projetando ExperiênciasArquitetura de Informação e User Experience Design

VII Semana de Biblioteconomia – ECA/USP26.set.2012 por Paula Macedo

Page 2: Projetando experiencias

Oi. Meu nome é Paula =)

Page 3: Projetando experiencias

Oi. Meu nome é Paula =)

• Formada na Biblio-ECA/USP em 2009

Page 4: Projetando experiencias

Oi. Meu nome é Paula =)

• Formada na Biblio-ECA/USP em 2009

• Trabalho como User Experience Designer

Page 5: Projetando experiencias

Oi. Meu nome é Paula =)

• Formada na Biblio-ECA/USP em 2009

• Trabalho como User Experience Designer

• Semana de Biblio = Compartilhar minha experiência e aprender com vocês

Page 6: Projetando experiencias
Page 7: Projetando experiencias

O AMOR POR LIVROS ME

LEVOU PARA A BIBLIOTECONOMI

A

Page 8: Projetando experiencias

e um livro me “tirou” das Bibliotecas…

• Ansiedade de Informação : como transformar informação em compreensão.

Richard Saul Wurman

“Existe um tsunami de dados que bate sobre as portas do mundo civilizado. É um maremoto crescente de dados desconexos formado por bits e bytes, vindo em uma forma desorganizada, descontrolada, incoerente e cacofônico”.

Obs. Grifos e adaptações livres

Page 9: Projetando experiencias

Arquiteto de Informação, por Wurman

devem ser tornar o complexo claro,

transformar a informação em algo compreensível

para outros seres humanos.

Obs. Grifos e adaptações livres

Page 10: Projetando experiencias

Arquiteto de Informação, por Wurman

- alguém que humaniza a tecnologia focando nas pessoas.

- organiza os padrões inerentes da informação, torna o complexo, claro.

- cria estruturas ou mapas de informação que permite outros encontrarem seu caminho para o conhecimento

Obs. Grifos e adaptações livres

devem ser tornar o complexo claro,

transformar a informação em algo compreensível

para outros seres humanos.

Page 11: Projetando experiencias

Arquiteto de Informação, por Wurman

Obs. Grifos e adaptações livres

ME GUSTA!

- alguém que humaniza a tecnologia focando nas pessoas.

- organiza os padrões inerentes da informação, torna o complexo, claro.

- cria estruturas ou mapas de informação que permite outros encontrarem seu caminho para o conhecimento

devem ser tornar o complexo claro,

transformar a informação em algo compreensível

para outros seres humanos.

Page 12: Projetando experiencias

Arquitetura de informação?

Page 13: Projetando experiencias

Arquitetura de informação?

Usabilidade ?

Design Centrado no

Usuário

UX Design?User Experience?

Design de Interação?

Content Strategy?IHC?

Page 14: Projetando experiencias

CONCEITOS QUE VALEM A PENA VISITAR.

Page 15: Projetando experiencias

CONCEITOS QUE VALEM A PENA VISITAR.

CONHECER

Page 16: Projetando experiencias

CONCEITOS QUE VALEM A PENA VISITAR.

CONHECER

REVISITAR

Page 17: Projetando experiencias

CONCEITOS QUE VALEM A PENA VISITAR.

CONHECER

REVISITAR

APROFUNDAR

Page 18: Projetando experiencias

CONCEITOS QUE VALEM A PENA VISITAR.

CONHECER

REVISITAR

APROFUNDAR

Page 19: Projetando experiencias

“Arquitetura de Informação é a arte e a ciência de organizar, estruturar e categorizar a informação para torná–la mais fácil de

encontrar e de controlar”

ARQUITETURA DE INFORMAÇÃO #1

Obs. Grifos e adaptações livres

Page 20: Projetando experiencias

ARQUITETURA DE INFORMAÇÃO #1

Obs. Grifos e adaptações livres

O princípio básico da Arquitetura de Informação é a busca pelo equilíbrio entre os três fatores: Conteúdo, Contexto e Usuários

Page 21: Projetando experiencias

ARQUITETURA DE INFORMAÇÃO #1

Obs. Grifos e adaptações livres

são bibliotecários <3

@louisrosenfeld @morville

Page 22: Projetando experiencias

USER EXPERIENCE #2

Page 23: Projetando experiencias

USER EXPERIENCE #2

Como eu me sinto quando...

Page 24: Projetando experiencias

USER EXPERIENCE #2

"a maneira como uma pessoa se sente sobre o uso de um

produto, sistema ou serviço. [Isso inclui] percepções

de uma pessoa de aspectos práticos, tais como a utilidade,

facilidade de utilização e eficiência do sistema. "

Obs. Wikipedia, tradução e adaptação livres

Page 25: Projetando experiencias

USER EXPERIENCE #2

Page 26: Projetando experiencias

USER EXPERIENCE #2

Page 27: Projetando experiencias

USER EXPERIENCE #2

Page 28: Projetando experiencias

USER EXPERIENCE #2

Page 29: Projetando experiencias

USER EXPERIENCE #2

Product Experience vs User Experience

Page 30: Projetando experiencias

USABILIDADE #3

Page 31: Projetando experiencias

Usabilidadeé o componente do Standard de ISO 9241-11 (1998), e é definido da seguinte forma:

“Usabilidade é a eficiência, eficácia e satisfação com a qual os públicos do produto alcançam objetivos em um determinado ambiente”.

USABILIDADE #3

Fonte: WebInsider. Usabilidade: um pouco da história e definição

Page 32: Projetando experiencias

Atributos (de uma interface) com boa Usabilidade por Jakob Nielsen

• Ser fácil de aprender• Ser eficiente na utilização• Ser fácil de ser recordado• Ter poucos erros• Ser subjetivamente agradável

USABILIDADE #3

Fonte: Design para a Internet. Felipe Memória

Page 33: Projetando experiencias

USABILIDADE #3

Fonte: Design para a Internet. Felipe Memória

“ Eu quero um site fácil de usar, agradável e “user friendly”

Page 34: Projetando experiencias

USABILIDADE #3

Jakob NielsenPhd. IHC, “user advocate”

Donald NormanPsicólogo e Cientista Cognitivo

Page 35: Projetando experiencias

USABILIDADE #3

BônusHá usabilidade em TUDO mesmo, até no jeito certo de usar o papel higiênico (se quiser evitar o desperdício).

Page 36: Projetando experiencias

USABILIDADE #3

BônusHá usabilidade em TUDO mesmo, até no jeito certo de usar o papel higiênico (se quiser evitar o desperdício).

Page 37: Projetando experiencias

DESIGN CENTRADO NO USUÁRIO#4

Lembra dos Controles?

Page 38: Projetando experiencias

DESIGN CENTRADO NO USUÁRIO#4

Lembra dos Controles? Lembra do “tio” Norman?

Page 39: Projetando experiencias

DESIGN CENTRADO NO USUÁRIO#4

Lembra dos Controles? Lembra do “tio” Norman?

Page 40: Projetando experiencias

DESIGN CENTRADO NO USUÁRIO#4

por Donald Norman

• A psicopatologia das coisas do dia-a-dia

• A psicologia nas ações do dia-a-dia

• Conhecimento na cabeça e no mundo

• Saber o que fazer• Errar é Humano• O desafio do Design• Design centrado no usuário

Page 41: Projetando experiencias

DESIGN CENTRADO NO USUÁRIO#4

Um produto bem projetado envolve muito mais que apenas um conteúdo de

qualidade – facilidade de uso, desempenho e design gráfico também são

importantes. A satisfação subjetiva, a

“agradabilidade”, tanto estudada por Don Norman, também faz parte desse todo.

Fonte: Design para a Internet, p.10. Felipe Memória

Page 42: Projetando experiencias

DESIGN CENTRADO NO USUÁRIO#4

1 - Identificar Requisitos

2 - Criar soluções alternativas

3 - Construir protótipos testáveis

4 - Avaliar com usuários

Fonte: Think Design. Services: User Experience.

Page 43: Projetando experiencias

DESIGN CENTRADO NO USUÁRIO#4

Fonte: Blog de Ai. Design centrado no usuário vs. Design de persuasão

“O Design Centrado no Usuário, quando radical demais, acaba se tornando economicamente irrealista e inviável. O Design de

Persuasão, por outro lado, pode forçar mudanças de comportamento que não são naturais para os usuários do produto.”

Page 44: Projetando experiencias

DESIGN DE INTERAÇÃO #5

by @p_kwiatkowski

Page 45: Projetando experiencias

DESIGN DE INTERAÇÃO #5

Fonte: Dan Saffer. Designing For Interaction.

Design de Interação é a arte de facilitar ou fomentar interações entre humanos mediadas por artefatos (produtos) e serviços.

1) Focar sempre no usuário 2) Encontrar boas soluções3) Gerar muitas idéias e buscar uma prototipação rápida4) Saber trabalhar de forma colaborativa5) Criar soluções apropriadas6) Desenvolver com um amplo campo de influências7) Saber incorporar a emoção para seus projetos – O aspecto emocional dentro do desenvolvimento de um produto é o elo de ligação entre as pessoas e os aparatos tecnológicos. Produtos sem o componente emocional estão desconectados das pesssoas e são produtos sem-vida.

Page 46: Projetando experiencias

Interação homem-computador (human-computer interaction): É uma disciplina muito próxima do “design de interação”, mas com métodos mais quantitativos. Ao invés de questionar como os homens se relacionam entre si, investiga a relação dos homens com as máquinas. Os sistemas operacionais dos computadores, como o Windows, são um exemplo de IHC

IHCInteração Humano Computador

IHC #6

Page 47: Projetando experiencias

CONTENT STRATEGY #7

“Planejamento, design e criação de métodos de gestão de conteúdo. Buscando promover soluções de conteúdo para alcançar objetivos de negócio e de comunicação, com conteúdos que sejam úteis, usuais, que sejam facilmente encontrados e compartilhados.” Louis Rosenfeld

"Traça um roteiro possível para indivíduos e organizações para criar e manter o conteúdo que o público realmente se interessa. ” Kristina Halvorson, Content Strategy for the Web.

Fonte: UX BOOTH. Complete Begginer´s Guide to Content Strategy.

Page 48: Projetando experiencias

ENTREGÁVEIS

CONCEPÇÃORoad MapBenchmarkMétricas de Sucesso(KPIs)PersonasModelo conceitual BlueprintEcossistemaConsumer JourneyEntrevistaObservação etnográficaPesquisa QuantitativaCard SortingInventário de ConteúdoAnálise de TarefasMapa do SiteFluxogramaWireframesProtótipos NavegáveisStoryboardsMoodboards

IMPLEMENTAÇÃOCasos de UsoDocumento de EspecificaçãoAnálise HeurísticaTeste de UsabilidadeControle de QualidadeAnálise de AcessibilidadeRecomendações deSEO

VERIFICAÇÃOTeste de UsabilidadeTesteA/BEye TrackingAnálise de MétricasAnáliseQuantitativa e Qualitativa

http://tinyurl.com/entregaveisdeux

Page 49: Projetando experiencias

Road Map É um plano de ação, um roteiro, um passo-a-passo para o desenvolvimento de um projeto que precise de entregas faseadas, ajudando a coordenar e planejar os avanços. Além de deixar claras as datas, ajuda também a enxergar o conjunto de tecnologias que podem ser aplicadas para o projeto e o esforço necessário para cada etapa.

http://tinyurl.com/entregaveisdeux

BenchmarkÉ a observação e estudo de produtos que tenham semelhança, em comportamento ou conteúdo, com o projeto que vamos desenvolver. É a análise dos pontos positivos e negativos que devem ser considerados no momento em que iremos criar o “jeitão” das telas e seus comportamentos.

PersonasSão formatos de entender e enxergar melhor esse usuário. Pode ser uma descrição mais simples (como na imagem acima) ou detalhadíssima, com o intuito de personificar um usuário fictício dentro do público-alvo.

ENTREGÁVEIS (alguns)

Page 50: Projetando experiencias

ENTREGÁVEIS (alguns)

Jornada do Usuário (Consumer Journey)Entender o caminho que diferentes personas percorrem na experiência com a marca. Entender quais são as necessidades, emoções, problemas, desejos e angústias do consumidor em cada etapa dessa experiência

http://tinyurl.com/entregaveisdeux

Ecossistema (Brand Ecossystem)Quando um projeto é formado por diversas peças (um site, um aplicativo mobile, uma página no Facebook, um banner, um hotsite etc.), é um mapa detalhado de como esses diversos ambientes conversam entre si. Para onde você quer levar cada usuário e por quê? Qual o caminho que você espera que ele percorra?

Page 51: Projetando experiencias

ENTREGÁVEIS (alguns)

Mapa do Site e FluxogramaMapa do Site é um organograma mostrando todas as páginas que o site irá conter, especifica as várias telas e mostra a relação hierárquica entre elas. Geralmente é produzido no início do projeto e refinado durante todas as etapas conforme as demandas posteriores.Fluxograma é um sitemap com QI acima da média onde é organizado o fluxo de informações. Desta forma é mais fácil compreender a transição (e variáveis) das informações em cada tela.

http://tinyurl.com/entregaveisdeux

Wireframe e Protótipos NavegáveisA planta baixa do site, seu esqueleto. O resultado de pesquisas onde podem ser encontrados todos os elementos em cada tela e suas disposições e orientações. O intuito é mostrar a hierarquia das informações, das telas e o fluxo de navegação que irá existir.

Protótipos navegáveis são uma variação dos wireframes, mas com links entre as telas. Você pode clicar e navegar entre elas, como se estivesse navegando no produto final. Pode ser usado com diversos objetivos: desde ser exibido em um teste de usabilidade até fazer com que o público interno do projeto (desenvolvedores, gerentes de projeto, designers, cliente) visualizem mais facilmente como determinada peça vai funcionar

Page 52: Projetando experiencias

Mas o que eu faço afinal ?

http://www.intuicaocriativa.wordpress.com/

Page 53: Projetando experiencias

CASES (alguns)

Record NewsFoco nos vídeos, divisão das categorias conforme programação. Ressaltar os apresentadores.

http://www.behance.net/paulinhah

Page 54: Projetando experiencias

CASES (alguns)

RebeldeAtender público da Novela, amantes da banda, e fã clube.Dar espaço para Covers da Banda.

http://www.behance.net/paulinhah

Page 55: Projetando experiencias

CASES (alguns)

CineclickReestruturação da Arquitetura do site para dar visibilidade e hierarquia ao conteúdoEsse + Esse = relação entre filmes e pessoas.

http://www.behance.net/paulinhah

Page 56: Projetando experiencias

CASES (alguns)

OfficebookA ideia era usar a Timeline do Facebook - através do Facebook Connect - e entregar de volta para o usuário um Documento em Word, Power Point e Excell totalmente customizado e editável, onde os consumidores poderiam ver quanta coisa diferente é possível se fazer com o pacote Office.

Graph API Explorer - desenvolvedor do Facebook onde é possível saber todas as informações do Facebook que podemos usar e à partir disso começamos a montar que informações seriam legais de ter no Documento final.

O Officebook está hospedado no Windows Azure - na nuvem - e virou até case interno para a Microsoft.

http://www.behance.net/paulinhah

Page 57: Projetando experiencias

tá, agora sou Arquiteta de Informação, preocupada com o usuário e Usabilidade das interfaces

Page 58: Projetando experiencias

mas e a biblioteconomia?

Page 59: Projetando experiencias

Paul Otlet: o precurssor

1892 . "Something about bibliography” Os livros são uma forma inadequada de armazenar informações, porque a disposição dos fatos contidos dentro deles foi uma decisão arbitraria por parte do autor, tornando cada fato difícil de ser localizado. Um sistema melhor de armazenamento, propôs Otlet em seu ensaio, seriam cartões contendo pequenos trechos com informação, os quais permitiriam que "todas as manipulações de classificação e continua busca“

Fonte: Wikipedia.

Page 60: Projetando experiencias

Ranganathan: o defensor1931 . “Raganathan”

1. Os livros são para serem usados: design por design não é nada, design bom é design usável.

2. Todo leitor tem seu livro. Conheça as necessidade do seu público alvo: pesquise.

3. Todo livro tem seu leitor. Defina seu público alvo: pesquise

4. Poupe o tempo do leitor. Usabilidade!

5. Uma biblioteca é um organismo em crescimento . Projete para o futuro, a web está e está em TODO o lugar.

Fonte: Wikipedia.

Page 61: Projetando experiencias

Bibliotecários sempre criaram e organizaram informação.

Responsáveis pela organização do Conhecimento

Page 62: Projetando experiencias

Bibliotecário trabalha com informação e todos os formatos. É capaz de fazer busca em todos os recursos informacionais. Sabe onde e como encontrar informação relevante. Analisa o comportamento de busca do usuário.

Page 63: Projetando experiencias

E... Como o conhecimento de Arquitetura de Informação pode ser usado nas bibliotecas?

Page 64: Projetando experiencias

Estudo de Comportamento de Busca e Uso das novas tecnologias.

= Infoeducação : ensinar a buscar informação, reconhecer as fontes, interagir.

Cria espaços de informações encontráveis e acessíveis

= permitir que usuários aprendam a se movimentar na biblioteca, encontrar sozinho os documentos, decidir onde e como vão consumir a informação

Pontos de Contato entre a Informação e Usuário, Interação e Comunicação Multimídia

= levar a biblioteca para fora dela, onde ela pode se comunicar além do espaço físico (sala de aula, site, blog, facebook...)

= arquitetura de bibliotecas digitais e virtuais, meios de comunicação e interação entre os usuários e também com a comunidade científica.

Inspiração: Stanislaw Skorka. Building the bridge : Librarian as Information Architect.

Page 65: Projetando experiencias

Técnicas de rotulação, mapas conceituais, mapas mentais, design centrado no usuário

= Bibliotecas centradas no usuário, em como ele busca e consome a informação.

Usabilidade, Interação Humano Computador

= Salas de leitura, espaços físicos, pontos de acesso (fora da biblioteca) catálogos, site da biblioteca, softwares de bibliotecas

= arquitetura de bibliotecas digitais e virtuais, meios de comunicação e interação entre os usuários e também com a comunidade científica.

Análise Heurística

= novas metodologias para avaliar recursos informacionais

Inspiração: Stanislaw Skorka. Building the bridge : Librarian as Information Architect.

Page 66: Projetando experiencias

Lista de Discussãohttp://lists.ibiblio.org/mailman/listinfo/aifia-pt

Grupo no Facebookhttps://www.facebook.com/groups/uxjobs/

Blog de Aihttp://arquiteturadeinformacao.com/

Meu Bloghttp://intuicaocriativa.wordpress.com/

Meu Twitterhttps://twitter.com/paulinhah

Links no Delicioushttp://www.delicious.com/paulinhah

Para seguir https://twitter.com/i/#!/paulinhah/ai

Para encontrar trabalhohttps://twitter.com/i/#!/paulinhah/jobshttps://twitter.com/uxjobsbr

CAMINHO DAS PEDRAS

Page 67: Projetando experiencias

Obrigada ;)

@paulinhah