Você está na página 1de 10

MÓDULO VIII – IHM

AULA 03
UNIDADE 2
Visual Design

Layout
• Um layout é uma interface.
• Uma interface é tudo que é apresentado ao usuário visualmente, pode ser
tangível ou intangível.
• Exemplo: Teclado de computador – Tangível
• Exemplo: Software de computador - Intangível
Visual Design

Layout
• Um layout deve proporcionar bem estar ao usuário;
• Deve ser atrativo;
• Deve ser simples;
• Fácil de utilizar;
• Deve ter um bom feedback.
Visual Design

Layout
• Um layout pode ser composto principalmente por cores, tipografia e ícones;
• Existem centros de pesquisa que estudam o comportamento do usuário ao
utilizar diferentes ambientes;
• A Gestalt é uma Escola de Psicologia Experimental, que possui estudos
relacionados com a forma como o ser humano percebe os elementos do seu
ambiente.
Visual Design

Layout
• Um layout pode ser composto principalmente por cores, tipografia e ícones;
• Existem centros de pesquisa que estudam o comportamento do usuário ao
utilizar diferentes ambientes;
• A Gestalt é uma Escola de Psicologia Experimental, que possui estudos
relacionados com a forma como o ser humano percebe os elementos do seu
ambiente.
Visual Design

Layout
• Nestes estudos são destacados alguns pontos de percepção humana:
• Segregação – O ser humano observa um todo em partes.

• Continuidade – O ser humano tem a noção de todas as partes serem apenas uma, pois por
exemplo em um sistema de smartphone, pode clicar, deslizar na tela que o sistema não
reinicia para trocar de tela, dando a impressão que é apenas uma única parte da interface.

• Pregnância da forma – Organização dos elementos visuais no design, de forma que o usuário
compreenda o que está observando ao olhar toda a interface.

• Contraste – Partes que chamam mais atenção do ser humano.


Visual Design

Layout - Cores
• As cores podem tornar suas interfaces atrativas ou “detonar” seu projeto.
• Segundo o autor Farina (1990), a cor tem 3 funções principais:
• Impressionar – Podem chamar a atenção do usuário
• Expressar – Expressar sentimento
• Construir – Padronizar cor, por exemplo, seu site pode ser associado a cor azul
(A cor azul lembra algum site?) A maioria lembrou do facebook ou Twitter...
Visual Design

Layout - Cores
• Cada cor também possui variações como tonalidade e iluminação;
• A combinação de cores e textos podem ser destrutiva, uma cor pode impedir
que o usuário leia um conteúdo.
• Exemplo: Fundo vermelho...que cor deve ser aplicada no texto?
• Exemplo: Fundo azul escuro...que cor deve ser aplicada no texto?
Visual Design

Layout - Cores
• As cores podem destacar elementos em uma interface;
• Status de um botão (ativado ou desativado);
• Destacar link, botão ou mensagem.
• Exemplos:
• Vermelho – Perigo
• Verde – Algo positivo, mostrar algo rapidamente
• Azul - Pode ser utilizada em fundo de elementos de interface, tomando
cuidado com os contornos

Você também pode gostar