Design For Simplicity Rio Info 2007

48
par a Design Simplicida de Horácio Soares Acesso Digital 22 de agosto de 2007 Lápis em doze cores diferentes

description

Uma análise sobre a importância de criar interfaces simples, acessíveis e fáceis de usar.

Transcript of Design For Simplicity Rio Info 2007

Page 1: Design For Simplicity Rio Info 2007

para

Design

Simplicidade

Horácio Soares Acesso Digital

22 de agosto de 2007

Lápis em doze cores diferentes

Page 2: Design For Simplicity Rio Info 2007

Pesquisa do Nielsen Group, entre 2001 e 2003, as Intranets tinham em média 200 mil páginas e nos últimos anos, esse número subiu para 6 milhões.

Como tratar o excesso de informação?

Um burro com excesso de carga impedido de andar.

Page 3: Design For Simplicity Rio Info 2007

Complexo: “que abrange ou encerra muitos elementos ou partes. Confuso, complicado, intrigado”.

Um homem com medo

Simples: “formado de poucos

elementos, e, portanto, de fácil utilização e

compreensão”.

Um homem feliz

Page 4: Design For Simplicity Rio Info 2007

Como simples é sinonimo de

poucos elementos, o

primeiro passo é reduzir o número

de itens na interface.

Page 5: Design For Simplicity Rio Info 2007

Pergunte aos clientes de um restaurante o que eles

preferem:- um cardápio repleto de opções- ou um com poucas alternativas

Page 6: Design For Simplicity Rio Info 2007

Exemplo de um cardápio com muitas opções

Page 7: Design For Simplicity Rio Info 2007

Qual caminh

o escolhe

r?Um homem indecisoUm poste com dezenas Um poste com dezenas

de setas para todos lados de setas para todos lados

Page 8: Design For Simplicity Rio Info 2007

Aprender a se perguntar “isso realmente precisa estar aqui?” é o primeiro passo para iniciar a criar simplicidade.

Pär Almqvist in Keep it simples, stupid!

http://www.digital-web.com/articles/keep_it_simple_stupid/

Um poste com dezenas Um poste com dezenas de setas para todos lados de setas para todos lados

Page 9: Design For Simplicity Rio Info 2007

Simplicidade não é sinonimo de simploriedade, pelo contrario, é sinonimo de sofisticação.  

“Simplicidade é o supra-sumo da sofisticação. Simplicidade é saber o que manter e o que jogar fora... isso acontece como mágica quando funciona, porque nenhuma complexidade é transferida aos usuários.” (5º Princípio de Joshua Porter)

http://bokardo.com/about/

Page 10: Design For Simplicity Rio Info 2007

“Os melhores designs são simples, isto porque eles não contém nenhum

elemento desnecessário ao

contexto”.

Pär Almqvist in KISS – Keep it simples, stupid!

http://www.digital-web.com/articles/keep_it_simple_stupid/

Page 11: Design For Simplicity Rio Info 2007

Google"How did they get that way?

Page 12: Design For Simplicity Rio Info 2007

Google"How did they get that way? They kept it simple and focused on user experience.“ Dave Winner (CEO of UserLand Software, a leading Web technology and publishing company based in Millbrae, CA.)

Page 13: Design For Simplicity Rio Info 2007

Imagem do Google Beta em 1998

Fonte: http://www.archive.org

Page 14: Design For Simplicity Rio Info 2007

Imagem do Google em 2007

Page 15: Design For Simplicity Rio Info 2007

Como era a interface da

concorrência?

Para efeito de comparação,

escolhi o Altavista

Page 16: Design For Simplicity Rio Info 2007

Imagem do Altavista em 1996

http://www.archive.org

Page 17: Design For Simplicity Rio Info 2007

Imagem do Altavista em 2000

Page 18: Design For Simplicity Rio Info 2007

Imagem do Altavista em 2007

Page 19: Design For Simplicity Rio Info 2007

GoogleSerá que o

Google é acessível? É fácil

de usar?

Page 20: Design For Simplicity Rio Info 2007

“A modern paradox is that it’s simpler to

create complex interfaces because it’s so complex to simplify

them”.

Pär Almqvist in Keep it simples, stupid!http://www.digital-web.com/articles/keep_it_simple_stupid/

Page 21: Design For Simplicity Rio Info 2007

Menos é mais…

Almqvist criou uma fórmula da simplicidade: A = simplicidade, então A = x + y + z. Onde x é uma boa pesquisa e prototipação, y é brincar, se divertir e z e reduzir os elementos desnecessários

Homem surpreso

Page 22: Design For Simplicity Rio Info 2007

IPOD x

Outros MP3

playersImagens de IPODS

Page 23: Design For Simplicity Rio Info 2007

Como encontrar

e acertar o alvo?

Mulher com arco e flexa

Page 24: Design For Simplicity Rio Info 2007

Sony x Nintendo

Imagem da nova versão do console da Nintendo e de algumas pessoas interagindo com o Wii

Page 25: Design For Simplicity Rio Info 2007

Foco no usuário…

Um desenho estilizado com pessoas de mãos dadas ao redor do globo terrestre.

Page 26: Design For Simplicity Rio Info 2007

Padrões e Convenções“A experiência pertence ao

usuário.Os designers não criam

experiências, eles criam artefatos para a experiência. Esta simples

distinção faz toda a diferença, ela coloca o designer a serviço do

usuário, e não o usuário a serviço do designer.”

(3º Princípio de Joshua Porter).

Page 27: Design For Simplicity Rio Info 2007

Você é capaz de dirigir qualquer um

dos modelos de carros disponíveis

no mercado?

Homem em dúvida

Page 28: Design For Simplicity Rio Info 2007

“A tecnologia deve servir aos homens e não os homens que

devem servir as tecnologias.”

(1º Princípio de Joshua Porter).

Page 29: Design For Simplicity Rio Info 2007

É loucura negar o potencial de

novas tecnologias e

inovações, mas vale lembrar

que todo benefício

implica necessariament

e em sacrifício da mesma

envergadura.

Foto do EcoSport com câmbio automático

Page 30: Design For Simplicity Rio Info 2007

Mas por que não

conseguimos fazer

portais

fáceis de usar, assim

como os carros?

Page 31: Design For Simplicity Rio Info 2007

“Os tecnólogos adoram a complexidade ...

Complexidade é o que acontece quando a indústria

empurra as vendas acrescentando ‘excitantes’;

‘novos recursos’...”

Revista InfoExame, artigo: Em Busca da Simplicidadehttp://www.urisan.tche.br/~paludo/IHM/Artigo/Em%20busca%20da

%20simplicidade.doc

Page 32: Design For Simplicity Rio Info 2007

Microsoft Office 2007 + Vista

1.Powerpoint - Formato incompatível com versões anteriores;2.Onde está o Wally?, digo, onde está o “save as” ou “salvar como”?

Page 33: Design For Simplicity Rio Info 2007

Tela dessa apresentação em power point 2007

Page 34: Design For Simplicity Rio Info 2007

A nova versão colocou o atalho para o Slide Show

na direita.

Mesma tela do slide anterior, mas agora com o atalho para o slide show com uma moldura em volta. Na versão anterior do office, ficava na esquerda e agora no office 2007, na direita.

Page 35: Design For Simplicity Rio Info 2007

Onde está o

“salvar como”

ou “save as”?

Quando iniciei a procura do comando “save as” ou “salvar como”...

Page 36: Design For Simplicity Rio Info 2007

Eu abrindo diversas opções, mas nada de achar o “salvar como”

Page 37: Design For Simplicity Rio Info 2007

Ainda buscando o “save as”, mas nada ainda.

Page 38: Design For Simplicity Rio Info 2007

Depois de quase desistir de procurar, consegui a ajuda de um amigo que havia passado pelo mesmo problema.

Page 39: Design For Simplicity Rio Info 2007

Apesar de usar o Power Point a mais de 15 anos,

eu me senti um idiota por não entender o

“obvio” e clicar no botão com as opções do

ultrapassado menu “file” ou “arquivo”.

No office 2007, a opção de “salvar como” encontra-se cuidadosamente escondida dentro de um botão, que mais se parece com um logotipo, localizado no canto superior esquerdo da interface.

Page 40: Design For Simplicity Rio Info 2007

Menu com diversas opções, inclusive o “save as” no menu aberto após clicar sobre o botão “logomarca” no canto superior esquerdo.

Page 41: Design For Simplicity Rio Info 2007

Aparência é importante?

Foto de um animal, que de tão feio, não sei dizer ao certo se é um cachorro ou gato.

Page 42: Design For Simplicity Rio Info 2007

Qual dos dois Bigmacs você escolheria?

Foto de um sanduíche comprado em uma loja qualquer.

Foto do mesmo sanduíche e para fins de marketing.

Page 43: Design For Simplicity Rio Info 2007

Sim, mas design não é arte!

A arte é um expressão pessoal, um ponto de vista. É sobre a vida, as emoções, os pensamentos e idéias de

um determinado artista.

Page 44: Design For Simplicity Rio Info 2007

Tira do Dilbert citada nessa apresentação na Rio Info 2007. Encontra-se em áudio (MP3) disponível para download no meu blog: http://horaciosoares.blogspot.com

Page 45: Design For Simplicity Rio Info 2007

Contexto X

Consistência

Page 46: Design For Simplicity Rio Info 2007

Cada página no processo dá ao usuário precisamente o que eles precisam naquele ponto do processo.Adicionar elementos navegacionais só por consistência vai atrapalhar mais do que ajudar.

Metodologia de desenvolvimento da 37 Signals – Geting Real

Inconsistência Inteligente

Page 47: Design For Simplicity Rio Info 2007

Acesso Digital: http://acessodigital.net blog: horaciosoares.blogspot.com

e-mail: [email protected]

Foto da equipe da Acesso Digital – Horácio, Lêda, MAQ e Bruno Torres

Page 48: Design For Simplicity Rio Info 2007

Vídeo - Acessibilidade na Web: Custo ou Benefício?

Link para download do vídeo em diferentes formatos:http://acessodigital.net/video.htmlDuração de 11m40s

Google Videohttp://video.google.com/videoplay?docid=-2864638973122712263&q=acessibilidade&total=61&start=0&num=10&so=0&type=search&plindex=1

Uol Videohttp://videos.uol.com.br/showMedia.html?media.id=2568