Newton Paiva - DI - Aula 01

146
Design, usabilidade e arquitetura de informação / Marcello Cardoso Apresentação do curso, aquecimento e situamento teórico Pós Graduação em Marketing Digital Design, usabilidade e arquitetura de informação Marcello de Campos Cardoso | www.mcardoso.com.br | [email protected] aula 01/06 Friday, October 28, 2011

description

Apresentação realizada por Marcello de Campos Cardoso em Outubro de 2011 para a disciplina Design, usabilidade e arquitetura de informação, ministrada no curso de especialização em Pós Graduação em Marketing Digital no Centro Universitário Newton Paiva.

Transcript of Newton Paiva - DI - Aula 01

Page 1: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Apresentação do curso, aquecimentoe situamento teórico

Pós Graduação em Marketing Digital

Design, usabilidade e arquitetura de informaçãoMarcello de Campos Cardoso | www.mcardoso.com.br | [email protected]

aula 01/06

Friday, October 28, 2011

Page 2: Newton Paiva - DI - Aula 01

ProfessorMarcello de Campos Cardoso‣ 6 anos como gerente de produtos na Studio Sol‣ Especialista em Design de Interação pela PUC MG‣ Professor na PUC e UNA e Faculdade Cotemig‣ Sócio/consultor na Latitude14‣ Mentor de Usabilidade na Aceleradora‣ 10 anos de mercado web (2001 - atual)‣ Coordenador regional da Interaction Design Association (IxDA)‣ Organizador do Interaction South America 2011 (ISA’11)

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Friday, October 28, 2011

Page 3: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Ementa

Definições e aplicação de Usabilidade, Design Centrado no Usuário e Design de Interação.

Metodologia de design baseado no ciclo de vida do produto, com técnicas para o

desenvolvimento de produtos digitais interativos.

Objetivos

Introduzir conceitos e processos essenciais para integração de equipes de criação e

desenvolvimento na elaboração de produtos interativos complexos, através da abordagem

do Design Centrado no Usuário (DCU) e da metodologia do Design de Interação (DI).

Carga horária: 24h/a (6 encontros)

Friday, October 28, 2011

Page 4: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Plano de curso

Introdução a Usabilidade: conceitos, origem (DCU, IHC), aplicação (IxD), tipos de design, metas de usabilidade, princípios de design.

Conversando com usuários: Questionários e entrevistas

Técnica de Modelagem: Personas ágeis (workshop)

Projetando a interface: Task Flow + Prototipação rápida (workshop)

Perguntando a especialistas: As 10 heurísticas de Nielsen (workshop)

Percurso cognitivo: Avaliando tarefas

20pts

20pts

20pts

20pts

20pts

Friday, October 28, 2011

Page 5: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

SAFFER, Dan; Designing for interaction. Berkeley, New Riders, 2010.

PREECE, Jennifer; ROGERS, Yvone; SHARP, Helen. Design de interação: além da interação homem-computador. Porto Alegre: Bookman, 2005.

Kuniavsky, Mike. Observing the User Experience. San Francisco, MKP, 2003.

COOPER, Alan. About face 3.0 - the essentials of Interaction Design. Indianapolis: Wiley Publishing, 2009

MEMÓRIA, Felipe. Design para Internet – projetando a experiência perfeita, Rio de Janeiro: Campus/Elsevier, 2005.

NORMAN, Donald. The design of everyday things, New York: Basic Books, 1988.

Bibliografia

Friday, October 28, 2011

Page 6: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

www.useit.com

www.acm.org

www.interactions.acm.org

www.upassoc.org

www.cooper.com

www.slideshare.net/dansaffer

www.slideshare.net/LaneHalley

Referências online

Friday, October 28, 2011

Page 7: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

A vida é permeada deproblemas e desafios.

Friday, October 28, 2011

Page 8: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

A família se preocupa, pois o velhinho tem pressão alta, e gostaria que o Seu Nicolau usasse um celular.

Como este celular poderia ser?

Seu Nicolau tem 76 anos, mas é muito ativo. Gosta de fazer suas coisas sozinho, retirar a pensão no banco, visitar vizinhos... Mas nem sempre dá satisfação pra família, e não gosta de usar celular, pois acha “Muito difícil”.

Friday, October 28, 2011

Page 9: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Que tal um iPhone pro Nicolau?

Friday, October 28, 2011

Page 10: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

melhor ≠ mais sofisticadosolução simples = solução elegante

Friday, October 28, 2011

Page 11: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

FOCO na demanda REAL.

Friday, October 28, 2011

Page 12: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

“É pesada meu filho, e machuca minha mão. Quase não consigo virá-la na xícara, fico com medo de me queimar.”

Vamos pensar uma chaleira pra ela?

Dona Lucinha adora um cházinho com bolo de fubá, quando recebe as amigas em casa pra falar de novela. Mas a senhorinha tem artrite e ultimamente reclama muito de usar a chaleira.

Friday, October 28, 2011

Page 13: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

OXO - Good Grips

Friday, October 28, 2011

Page 14: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

OXO - Good Grips

Friday, October 28, 2011

Page 15: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

maior acessibilidade pode ser melhor para TODOS

Friday, October 28, 2011

Page 16: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

“Eu queria que a menina cortasse os rabanetes, batatas, cenouras, mas é perigoso”

Vamos pensar um cortador de

legumes seguro e interessante?

Mariana tem 5 anos, e queria aprender a cozinhar com a mãe. Sua mãe gostaria que a filha comesse mais legumes, mas não quer ver a filha usando facas. Quase tudo na cozinha é perigoso!

Friday, October 28, 2011

Page 17: Newton Paiva - DI - Aula 01

boa solução resolve mais de um problema.

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Mushroom Chopper

Friday, October 28, 2011

Page 18: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Friday, October 28, 2011

Page 19: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

maior acessibilidade pode ser melhor para TODOS

Friday, October 28, 2011

Page 20: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

“Os fios do fone embolam porque são muito separados. Mas se fossem menos separados, também não ia dar pra dividir com a Aninha.”

Vamos ajudar o Mário.

Mário tem 32 anos, trabalha em Betim, mas mora em Belo Horizonte. Todos os dias pega o transporte da empresa às 7 da manhã na Praça da Liberdade e escuta músicas no trajeto. Às vezes divide o fone com sua paquera, Ana Luiza.

Friday, October 28, 2011

Page 21: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

YI | Sound Invention

A solução pode existir em outro lugar!

Friday, October 28, 2011

Page 22: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Existem várias soluções para um problema.

Friday, October 28, 2011

Page 23: Newton Paiva - DI - Aula 01

Algumas são “robustas”.

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Evolution Pillow

Friday, October 28, 2011

Page 24: Newton Paiva - DI - Aula 01

Algumas são mais simples.

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Music Branch Headphone Splitter

Friday, October 28, 2011

Page 25: Newton Paiva - DI - Aula 01

Algumas são mais simples.

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Music Branch Headphone Splitter

Friday, October 28, 2011

Page 26: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

“Precisava, na verdade, de um quarto e um escritório, pois trabalho em casa. E meus filhos também precisam de um lugar pra estudar.”

Como resolver o problema do Luíz?

Luíz mudou há pouco para Belo Horizonte, e achou os preços de imóveis muito caros. Veio com mulher e dois filhos, e teve condições de financiar um pequeno imóvel de 2 quartos com 80 m2.

Friday, October 28, 2011

Page 27: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Resource Furniture(ver vídeo)

Friday, October 28, 2011

Page 28: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

A solução para espaço pequeno não precisa ser mais espaço.

Temos de identificar o problemae usar os recursos que temos.

Friday, October 28, 2011

Page 29: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 30: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 31: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 32: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 33: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 34: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 35: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 36: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 37: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma solução inserida no projeto é uma

Solução de design

Friday, October 28, 2011

Page 38: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

mesmo o que funcionapode melhorar.

Friday, October 28, 2011

Page 39: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

mesmo o que funcionapode melhorar.

Friday, October 28, 2011

Page 40: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

mesmo o que funcionapode melhorar.

Friday, October 28, 2011

Page 41: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

mesmo o que funcionapode melhorar.

Friday, October 28, 2011

Page 42: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

mesmo o que funcionapode melhorar.

Friday, October 28, 2011

Page 43: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

mesmo o que funcionapode melhorar.

Friday, October 28, 2011

Page 44: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

mesmo o que funcionapode melhorar.

Friday, October 28, 2011

Page 45: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 46: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 47: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 48: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 49: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 50: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 51: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 52: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 53: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 54: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 55: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

Friday, October 28, 2011

Page 56: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Para resolver bem,

precisamos entender o problema...

“Se eu perguntasse para as pessoas o que queriam,

me diriam cavalos mais rápidos.” -Henry Ford

...pensar simples...... e pensar sem limites.

Friday, October 28, 2011

Page 57: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Pensar simples a princípio

regra de Paretto, MVP

Friday, October 28, 2011

Page 58: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

concentrar onde há maior valor de USO

começar pela espinha e ITERAR

Friday, October 28, 2011

Page 59: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

não focar em tecnologia...

...mas em comportamento

Friday, October 28, 2011

Page 60: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

O que eles têm em comum?

Friday, October 28, 2011

Page 61: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

desig

n!

Friday, October 28, 2011

Page 62: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

todo mundo é designer!

Friday, October 28, 2011

Page 63: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Design = Projeto

Friday, October 28, 2011

Page 64: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

negócio

pessoas tecnologia

Friday, October 28, 2011

Page 65: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Qual é o melhor

caminho para criar

soluções?Friday, October 28, 2011

Page 66: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

sorte...

Friday, October 28, 2011

Page 67: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

sorte...

Friday, October 28, 2011

Page 68: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

...ou tática/metodologia

Friday, October 28, 2011

Page 69: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

...ou tática/metodologia

Friday, October 28, 2011

Page 70: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

metodologia

sorte

...15%, 25%, 40%, 70%...

0,00001% ... 50%

Friday, October 28, 2011

Page 71: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

pesqu

isa

protot

ipação

valida

ção

METODOLOGIA DE DESIGN

Friday, October 28, 2011

Page 72: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Segundo Jeffrey Rubin (Handbook of Usability Testing):

Um conjunto de quatro fatores reunidos em um dispositivo:

1.Capacidade de ser usado com sucesso (utilidade, eficácia);

2.Facilidade de ser usado (objetividade, eficiência);

3.Capacidade de o usuário aprender a usar o dispositivo de forma simples e rápida (fácil compreensão e aprendizado);

4.Provocar satisfação visual ao usuário (experiência);

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 73: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Segundo Jakob Nielsen (Usability Engineering):

Um conjunto de proporiedades de uma interface que reúne os seguintes componentes:

1.Fácil aprendizado;

2.Eficiência;

3.Capacidade de memorização;

4.Baixo índice de erros;

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 74: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Segundo Jakob Nielsen (Usability Engineering):

Um conjunto de proporiedades de uma interface que reúne os seguintes componentes:

1.Fácil aprendizado;

2.Eficiência;

3.Capacidade de memorização;

4.Baixo índice de erros;

5.Satisfação e prazer ao uso.

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 75: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

“Facilidade de uso e facilidade de aprendizado” -Albert Badre (Shaping Web Usability)

“Capacidade, em termos funcionais humanos, de um sistema ser usado com facilidade e de forma eficiente” -Brian Shackel (Usability)

“Princípios de design que, quando seguidos, dão respostas aos usuários tornando o uso dos dispositivos mais fácil” -Don Norman (O Design do dia-a-dia)

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 76: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

“Pensar em usabilidade é pensar em produtos fáceis de usar” – Jesse James Garrett (The Elements of User Experience)

“Fator que assegura que os produtos sejam fáceis de usar, eficientes e agradáveis” - Preece, Rogers e Sharp (Design de Interação)

“A ciência de aplicação de metodologias ao design para a criação de dispositivos fáceis de usar, de fácil aprendizado e que sejam úteis com o menor índice de desconforto possível” - Mark Pearrow (Web Site Usability Handbook)

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 77: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

ISO 9126 - 1991“Esforço necessário para seu uso e para o julgamento individual de tal uso.”

ISO 9241, 11 - 1998“Capacidade de um produto ser usado por usuários específicos para atingir objetivos específicos com eficácia, eficiência e satisfação em um contexto específico de uso.”

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 78: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

10 definições, vezes aparecem as palavras “facilidade” ou “fácil”.

em

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 79: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

É o atributo que define afacilidade de uso de algo.

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 80: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Quem define o que é “fácil” de ser usado?

O que é usabilidade mesmo?

Friday, October 28, 2011

Page 81: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

UM POUCO DE HISTÓRIA

Friday, October 28, 2011

Page 82: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Voltado à qualidade do código: encontrar e corrigir bugs.

Modelo wartefall: processos ao final do trabalho realizado.

Estudos do tipo tempo/erro: caros e pouco informativos.

1960 - 1970 | Inspeção de software

Friday, October 28, 2011

Page 83: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Gradualmente o hardware evoluiu permitindo softwares robustos e interfaces complexas e o uso em novos nichos. Surge o computador pessoal.

Para produzir produtos com funcionalidades e interfaces adequadas, nascem dois campos de estudo: Interface Humano-Computador e Design Centrado no usuário.

1980 | IHC e DCU

Friday, October 28, 2011

Page 84: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Campo de estudos que surgiu em 1982 no congresso “Human Factors in Computing Systems”, realizado por psicólogos cognitivos principalmente.

Características: ciência da computação com foco nos aspectos sociais, cognitivos e comportamentais.

1982 | Interface Humano-Computador (IHC)

Friday, October 28, 2011

Page 85: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

1986 | Design Centrado no Usuário (DCU)

Design Centrado no Usuário (DCU) é o campo de estudo que reúne metodologias de design nos quais o público-alvo de um produto ou serviço influencia as diretrizes e requisitos do sistema.

Termo cunhado por Norman enquanto trabalhava como pesquisador na Universidade California San Diego (UCSD), no artigo User-Centered System Design: New Perspectives on Human-Computer Interaction (Norman & Draper, 1986) e popularizado em 1988 no popular Psychology of everyday things (mais tarde rebatizado como The design of everyday things).

Friday, October 28, 2011

Page 86: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Design Centrado no Usuário (DCU)“…é uma filosofia baseada nas necessidades e interesses do usuário, com ênfase em fazer produtos usáveis e inteligíveis.” – Donald Norman

“A filosofia por trás do Design Centrado no Usuário é simplesmente esta: O usuário sabe mais. Pessoas que utilizarão um produto ou serviço sabem de suas necessidades, metas e preferências, e é papel do designer descobrir isto e projetar para eles.” – Dan Saffer

“...é uma abordagem ao design que fundamenta o processo em informações sobre as pessoas que usarão o produto. Processos de UCD focam em usuários através de planejamento, design e desenvolvimento do produto.” – Usability Professionals Association (UPA)

“...é um estabelecido processo usado pela IBM e muitas outras organizações para prover produtos que atendam as expectativas dos usuários.” – IBM

“...é focar o design no usuário, simples assim.” – Peter J. Bogaards

Friday, October 28, 2011

Page 87: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

USUÁRIOSdevemos perguntá-los como fazer nosso trabalho?

Design Centrado no Usuário (DCU)

Friday, October 28, 2011

Page 88: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

a princípio, NÃO

Design Centrado no Usuário (DCU)

Friday, October 28, 2011

Page 89: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Design Centrado no Usuário (DCU)

Devemos identificar seus padrões de comportamento e projetarmos soluções adequadas.

Friday, October 28, 2011

Page 90: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

O termo foi cunhado por John Bennett (IBM) e John Whiteside (Digital Equipment Corporation) em alguns artigos em 1988. A princípio era chamado de “Engenharia de Usabilidade”.

Abordagem qualitativa e prática de desenvolvimento de produtos, orientada para a qualidade e focada em: definição de tarefas, prototipação e avaliação iterativa (Whiteside, Bennett, & Holtzblatt,1988).

1988 | Engenharia de Usabilidade

Friday, October 28, 2011

Page 91: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Bill Morgride, diretor da IDEO, sintetizou no livro Designing for Interactions uma série de metodologias de design + comunicação usadas e aprimoradas na empresa para a elaboração de produtos úteis e usáveis.

1990 | Design de Interação

Friday, October 28, 2011

Page 92: Newton Paiva - DI - Aula 01

Este campo multidisciplinar centraliza e integra as diversas áreas de conhecimento relacionadas a interação entre artefato / usuários

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Espaço do Design de Interação

Friday, October 28, 2011

Page 93: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Projetar dispositivos e interfaces usáveis vai além de evitar erros: um projeto bem pesquisado, planejado, desenvolvido e testado pode agregar valor ao uso, negócio ou mesmo mudar totalmente a natureza do produto/sistema para outra melhor e mais adequada.

“...Design de Interação não é apenas sobre corrigir problemas; diz respeito a facilitar interações entre pessoas de uma maneira mais rica,

profunda e melhor - ou seja, encontrar novas formas de melhor conectar as pessoas e tornar o mundo um lugar melhor.”

-Dan Saffer

Por que Design de Interação?

Friday, October 28, 2011

Page 94: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Uma interface bem projetada deve ser guiada por

METAS DE USABILIDADE

METAS DE EXPERIÊNCIA DO USUÁRIO+

Friday, October 28, 2011

Page 95: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Servem para guiar o desenvolvimento de !produtos fáceis de usar, eficientes e agradáveis. São elas (Preece, Rogers, Sharp):

1.Utilidade2.Eficácia3.Eficiência4.Segurança5.Facilidade de aprendizado6.Facilidade de lembrar como se usa

Eficácia: O quanto um produto é bom em se fazer o que se espera deleEficiência: Como um produto auxilia a execução de suas tarefas com o mínimo de recursos

Metas de Usabilidade

Friday, October 28, 2011

Page 96: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Utilidade

A medida que o sistema propicia a funcionalidade adequada para o objetivo específico do usuário.

Friday, October 28, 2011

Page 97: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Utilidade

Ferramenta de nicho

Friday, October 28, 2011

Page 98: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Ferramenta sem focoPra que serve?Elevator pitch,Twitter pitch!

Metas de Usabilidade | Utilidade

Friday, October 28, 2011

Page 99: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficácia

Eficácia se refere a quão bem uma ferramenta auxilia na realização de uma atividade proposta, em um contexto de uso.

É uma característica analógica, em escala.

Friday, October 28, 2011

Page 100: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficácia

Qual é mais eficaz?

Friday, October 28, 2011

Page 101: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficácia

Depende, pra que, para quem?

Friday, October 28, 2011

Page 102: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficiência

Quanto uma ferramenta auxilia na economia de recursos para a realização de uma atividade proposta, em um contexto de uso.

Friday, October 28, 2011

Page 103: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficiência

Eficiência

=economia de recursos

Friday, October 28, 2011

Page 104: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficiência

recursos podem ser medidos em tempo, cliques...se traduzem em trabalho/custo

Friday, October 28, 2011

Page 105: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficiência

O dilema do AJAX.

Friday, October 28, 2011

Page 106: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Eficácia x Eficiência

eficácia - fazer melhoreficiência - produtividade

Friday, October 28, 2011

Page 107: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Segurança

Segurança se refere a prevenção e recuperação de erros.

Deve ser perceptível, transparente.

Friday, October 28, 2011

Page 108: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Segurança

Física

Friday, October 28, 2011

Page 109: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Segurança

Interface

Friday, October 28, 2011

Page 110: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Segurança

Prevenção de erros

Friday, October 28, 2011

Page 111: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Segurança

Prevenção de erros, transparente.

Friday, October 28, 2011

Page 112: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Segurança

Segurança percebida

Friday, October 28, 2011

Page 113: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Facilidade de aprendizado

Clareza na interface, compreensão das funcionalidades

metáforas e modelos mentais

Friday, October 28, 2011

Page 114: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Metas de Usabilidade | Facilidade de lembrar como se usa

Interface profissional, especialista

Friday, October 28, 2011

Page 115: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

O que são os princípios de design?

“...são derivados de uma mistura de conhecimento baseado em teoria, experiência e senso comum [...] conjunto de items que devem ser assegurados” (PREECE, 2005)

Friday, October 28, 2011

Page 116: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Quais são os princípios que norteiam o design de interação?

1. Visibilidade2. Feedback3. Restrições4. Mapeamento5. Consistência6. Affordance

(PREECE) Desgin de Interação Cap. 1 - pag 42 a 53(NORMAN) Design do dia-a-dia Cap.7 - pag 221 a 255

Friday, October 28, 2011

Page 117: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Visibilidade

“...O sistema deve fornecer indicações do estado do sistema, que sejam prontamente perceptíveis e interpretáveis e correspondam às intenções e às expectativas.” (NORMAN, 2006)

(PREECE) Desgin de Interação Cap. 1 - pag 42 a 53(NORMAN) Design do dia-a-dia Cap.7 - pag 221 a 255

Friday, October 28, 2011

Page 118: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

VisibilidadeQuanto mais visíveis forem as funções, mais os usuários saberão como proceder.

Friday, October 28, 2011

Page 119: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

VisibilidadeQuanto mais visíveis forem as funções, mais os usuários saberão como proceder.

Friday, October 28, 2011

Page 120: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Feedback

“O feedback se refere ao retorno de informações a respeito da ação que foi feita e do que foi realizado, permitindo a pessoa continuar a atividade.” (PREECE, 2005)

(PREECE) Desgin de Interação Cap. 1 - pag 42 a 53(NORMAN) Design do dia-a-dia Cap.7 - pag 221 a 255

Friday, October 28, 2011

Page 121: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

FeedbackFornecer ao usuário informações sobre a ação realizada

Friday, October 28, 2011

Page 122: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Feedback pode serVisualTátilVerbalAuditivoCombinado

Friday, October 28, 2011

Page 123: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Restrições

“... refere-se às formas de delimitar o tipo de interação que pode ocorrer [...] para impedir o usuário de selecionar a opção incorreta e reduzir as chances de erro...” (PREECE, 2005)

Friday, October 28, 2011

Page 124: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Restrições lógicasExploram o bom senso das pessoas a respeito de como o mundo funciona.

Friday, October 28, 2011

Page 125: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Restrições físicasSe referem à maneira como os objetos restringem mecanicamente.

Friday, October 28, 2011

Page 126: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Restrições culturaisConvenções aprendidas – universais ou específicas de culturas diferentes.

Friday, October 28, 2011

Page 127: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Mapeamento

“... refere-se a relação entre controles e seus efeitos no artefato” (PREECE, 2005)

Friday, October 28, 2011

Page 128: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Mapeamento

“... refere-se a relação entre controles e seus efeitos no artefato” (PREECE, 2005)

Friday, October 28, 2011

Page 129: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Mapeamento

“... refere-se a relação entre controles e seus efeitos no artefato” (PREECE, 2005)

Friday, October 28, 2011

Page 130: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Mapeamento

“... refere-se a relação entre controles e seus efeitos no artefato” (PREECE, 2005)

Friday, October 28, 2011

Page 131: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Consistência

“Refere-se a projetar interfaces de modo que tenham operações semelhantes e que utilizem elementos semelhantes para a realização de tarefas similares” (PREECE, 2005)

Friday, October 28, 2011

Page 132: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Consistência

No mesmo dispositivo

Friday, October 28, 2011

Page 133: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Consistência

Entre dispositivos diferentes

Friday, October 28, 2011

Page 134: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Affordance

“É um atributo do objeto que permite ao usuário saber como utilizá-lo” (PREECE, 2005)

“É uma ‘dica’ de como devemos interagir com o objeto.”(Karine e Leandro, 2010)

Friday, October 28, 2011

Page 135: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Affordance“É um atributo do objeto que permite ao usuário saber como utilizá-lo” (PREECE, 2005)

Friday, October 28, 2011

Page 136: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Affordance

“É um atributo do objeto que permite ao usuário saber como utilizá-lo” (PREECE, 2005)

Princípios de Design

Friday, October 28, 2011

Page 137: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Aparência

Friday, October 28, 2011

Page 138: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Aparência

Friday, October 28, 2011

Page 139: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Princípios de Design

Aparência

Friday, October 28, 2011

Page 140: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Aparência

Princípios de Design

Friday, October 28, 2011

Page 141: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Lei de FittsO tempo gasto para se mover de um ponto inicial para outro é proporcional ao tamanho do alvo e sua distância.

Significa que...Elementos de uma interface devem possuir um tamanho adequado a sua importância.

Elementos relacionados devem se posicionar em um contexto de uso coerente.

Paul Fitts, psicólogo - 1954

Leis do Design de Interação

Friday, October 28, 2011

Page 142: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Lei de HicksO tempo que leva para uma pessoa tomar uma decisão é proporcional ao número das escolhas possíveis.

Significa que...Usuários encontram a informação separando-as em blocos e eliminando a metade a cada etapa do processo.

Desconsiderando outras decisões de design, seria mais simples encontrar um atalho em um grupo de 10 do que em dois de 5.

Devemos ser criteriosos na categorização de conteúdos.

Leis do Design de Interação

William Edmund Hick, psicólogo - 1983

Friday, October 28, 2011

Page 143: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Lei de Miller (complementar à lei de Hicks)A memória de curta duração humana registra 7 informações em média, variando em torno de 2 para cima ou para baixo.

Significa que...Não é uma regra rígida, mas uma orientação. Interfaces devem ser projetadas no intuito de minimizar a sobrecarga cognitiva.

Por exemplo, não devemos criar interações que forcem usuários a memorizar elementos estranhos em telas diferentes.

George Miller, psicólogo - 1956

Leis do Design de Interação

Friday, October 28, 2011

Page 144: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Leis do Design de Interação

Lei de MooreO tempo gasto por usuários para tomarem decisões é proporcional ao número de opções.

Significa que...Devemos nos adequar a mudança de paradigmas tecnológicos. Novos dispositivos, novas formas de interagir, novas possibilidades!

Gordon Moore, co-fundador da Intel - 1965

Friday, October 28, 2011

Page 145: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

EM GRUPO!

Discutir com

os colegas

e trazer n

a

próxima aula

:

1) O que é

o site (aplic

ativo, etc)

2) Que prob

lema ele resolve

3) Qual o p

úblico-alvo

4) Quem são o

s concorrent

es

TO DO DONE

Friday, October 28, 2011

Page 146: Newton Paiva - DI - Aula 01

Design, usabilidade e arquitetura de informação / Marcello Cardoso

Este arquivo contém a apresentação realizada por Marcello de Campos Cardoso, em Outubro de 2011, para a disciplina Design, usabilidade e arquitetura de informação, ministrada no curso de Pós Graduação em Marketing Digital no Centro Universitário Newton Paiva.

obrigad

o!

Friday, October 28, 2011