interfaces i - aula 05 (16/06/2010)

DAVID K. EVERYEngenheiro de Software da CA (1964 - )

MacKido (1999) e iGeek* (2002)

01INTERFACES 1 • turma 2010, trimestre 2010/2 – 15/06/2010

Aula 05: ELEMENTOS-CHAVE DAS INTERFACES

http://www.mackido.com/Interface/ui_basics.html

http://www.mackido.com/Interface/ui_basics.html

ELEMENTOS-CHAVE DAS INTERFACES

• Previsibilidade

• Informação

• Simplicidade

02


INTERFACES 1 • turma 2010, trimestre 2010/2 – 15/06/2010

PREVISIBILIDADE

03



PREVISIBILIDADE

• Definição de uma metáfora facilmente compreensível em função da cultura do usuário em questão;

• Manter o uso dessa metáfora consistente a todo custo.



PREVISIBILIDADE

• A metáfora proporciona ao usuário alguma relação entre:

• O programa e aquilo que o usuário espera que o programa execute.

• O usuário deverá poder utilizar a metáfora virtual do objeto de maneira similar à que utiliza o objeto real.



PREVISIBILIDADE

• Elimina tempo necessário ao treinamento do uso da interface;

• Permite ao usuário fazer associações e queimar etapas em sua auto-aprendizagem.



PREVISIBILIDADE

• Em que parte do objeto/texto e como ele se comporta quando passamos o mouse sobre ele / o clicamos / o arrastamos / o soltamos / soltamos sobre ele…?

• Tipo de traço/estilo (ilustração, imagem) + posição padrão (default, da configuração original) de botões / janelas / bordas / campos de texto / menus / atalhos de teclado…



PREVISIBILIDADE

• PARA AÇÕES IDÊNTICAS E FREQUENTES,O COMPORTAMENTO E A APARÊNCIA DA INTERFACE PRECISAM SER SEMPRE IGUAIS.



INFORMAÇÃO

09



INFORMAÇÃO

• Avaliar a quantidade de informação disponibilizada para o usuário

• Manter a previsibilidade no layout e na interatividade

• Harmonizar ao máximo os espaços clicáveis, informativos e vazios por toda a área útil da tela (evitar perda de tempo, seleções e cliques no momento errado e no lugar errado)



INFORMAÇÃO

• Eficiência e relevância da apresentação dos dados mais importantes.

• Evitar confusão e complexidade



INFORMAÇÃO

• Informações inúteis;

• Superabundância de informações;

• Desordem.



DEFINIR PRIORIDADES

14



DEFINIR PRIORIDADES

• Ordem de importância para as informações a serem exibidas

• Sentido da leitura ocidental: da esquerda para a direita, de cima para baixo;

• Avisos e ações prioritárias: janelas pop-up e caixas de diálogo no centro da tela;

• Vários botões em uma mesma janela:destacar graficamente botão com a ação a que se pretende priorizar e posicioná-lo embaixo do texto à direita;



DEFINIR PRIORIDADES

• Facilitar o acesso às ações que precisam ser repetidas mais frequentemente

• Definir como prioridade mínima ações de uso menos frequente

• Aumentar a distância, reduzir o tamanho e a força visual de elementos cujas ações sejam irreversíveis ou alterem a natureza do trabalho (salvar como, deletar, descadastrar, anular, fechar, etc.)



DEFINIR PRIORIDADES

• Hierarquia

• Ordem lógica



DEFINIR PRIORIDADES

• Hierarquia

• Ordem lógica


PREVISIBILIDADE

INFORMAÇÃO


SIMPLICIDADE

19



SIMPLICIDADE

• Nunca fazer o usuário ter que realizar mais de uma etapa para poder executar uma única ação.

• Nunca perguntar ao usuário coisas com as quais ele não deve ter que se preocupar

• Evitar a adição de funções sobre as quais o usuário não lembrará facilmente como executá-las



SIMPLICIDADE

• Evitar surpresas

• Evitar ações ocultas ou escondidas



SIMPLICIDADE

• Evitar surpresas

• Evitar ações ocultas ou escondidas


INFORMAÇÃO


ATÉ A PRÓXIMA!prof. @heliopaz

[email protected]

Aula 02: HISTÓRIA DOS SISTEMAS HIPERTEXTUAIS

HIPERTEXTO • turma 2009, trimestre 2010/1 – 12/03/2010 23

http://twitter.com/heliopaz

http://twitter.com/heliopaz

mailto:[email protected]

mailto:[email protected]

interfaces i - aula 05 (16/06/2010)

Education