Usabilidade visual de um novo website

Trabalhar para fora o design de interação para uma tarefa é um senso comum parte e uma lógica parte quando se trata de descobrir os widgets para uso e o fluxo para organizá-los. O resto é tudo design visual. A própria colocação, agrupamento, arranjo relativo, e design de seus componentes interativos podem percorrer um longo caminho para fazer uma tarefa de fluxo bem ou parar em suas faixas.

Video: Teste Usabilidade Interface Website - P3 - IPCA

Dar feedback rollover

Uma maneira de deixar as pessoas sabem que as coisas são interativos é fazê-los mudar sua aparência ou provocar alguma ação quando o cursor entra em contato com eles. Quando o cursor entra em contato com algo na tela, ele é chamado de rolar. Uma série de coisas pode ocorrer quando o ponteiro do mouse rola sobre um componente interativo. Se o elemento tem um link, o cursor em si muda de uma seta para um dedo indicador. Isso é uma simples built-in maneira, para fornecer feedback visual para que você possa deixar as pessoas sabem que um elemento é interativo. No entanto, você pode fornecer feedback adicional sobre rollover - feedback que pode até mesmo treinar alguém em como usar a navegação. Aqui estão algumas maneiras de fazer isso:

• Alterar a aparência do gráfico.

  Muitas vezes, os designers não se incomodam com o fornecimento de um estado clicado. Lembre-se, cada estado é um gráfico original que você tem que produzir - e que o navegador tem que carregar.

• Expandir ou animar o elemento.

  
  Um rollover muda de aparência quando um usuário rola ou clica nele.

Projetando botões site que parecem clicável

Se você simplesmente confiar no feedback rollover (digamos, o cursor se transformar em uma mão-com-apontando-dedo sobre rollover), você está fazendo o matagal usuário o cursor por toda a tela à procura de coisas interactiva. Portanto, é importante fazer elementos interativos Veja clickable para começar.

Em geral, você pode fazer elementos da interface gráfica olhar mais clicável em uma de três maneiras:

• botões de etiquetas com frases de ação. É uma melhor prática de design para colocar curto, para-a-ponto de etiquetas em botões e levar o usuário com verbos de ação no-nonsense, como Impressão ou Ver mapa. etiquetas passivas como Excursão virtual ou nebulosa marketing falar rótulos como viagem mágica são menos eficazes.

• Adicionar dimensão. Faça elementos de botão fisicamente se destacam na página, dando-lhes uma qualidade tridimensional.

Tomando pistas da vida cotidiana

O design visual e textura de seus componentes interativos ajudar as pessoas a saber como interagir com eles. Objetos que interagem com você em uma base diária, como botões, gavetas e mostradores, são grandes inspirações para o projeto de elementos interativos em sua página web. As pessoas já estão bem treinados para usá-los todos os dias Objects- todo mundo sabe como apertar botões, puxadores de gavetas, e transformá-mostradores.

Dê uma olhada tanto a interface de marcação eo esquema de gaveta no QuickTime player da Apple. Descobrir como usar esses pequenos widgets para controlar o volume e acessar um menu de opções é fácil. Para o volume, você clique e arraste o botão para ligar o áudio cima ou para baixo. Para a gaveta de opções, você pega a área alça-like e arraste para baixo.

Agrupamento e elementos de encaixe em um site

A localização relativa e de agrupamento de componentes interactivos é tão forte uma pista para a sua natureza interactiva como qualquer outro tratamento visual. Por exemplo, apenas agrupar uma série de elementos de interface de aparência semelhante juntos em uma unidade gráfica pode dar-lhes uma aparência clicável - mesmo se os próprios gráficos individuais não olhe clicável.

Se você grupo e contêm uma série de elementos de texto simples que têm o mesmo tratamento da fonte, você cria um elemento gráfico forte que se destaca das outras coisas na página e implica interatividade. Vendo elementos como concebido juntos em um grupo realiza duas coisas:

• Um grupo implica interatividade. Um conjunto de texto ou elementos gráficos agrupados cria uma unidade visual que chama a atenção das pessoas.

• Um grupo implica uma função semelhante. Ao associar visualmente um conjunto de links, você implica que todos eles desempenham funções semelhantes e têm a mesma prioridade relativa no site.

Você também pode implicar uma relação dentro de itens agrupados por nidificação certos elementos sob outros.

Fornecendo “Você está aqui” Feedback

Quando os usuários navegar através de sites, eles gostam de ter uma noção de onde eles estão no esquema das coisas e, se eles estão trabalhando através de tarefas, quanto tempo antes que será feito. Para ajudar a responder a estas perguntas, a sua interface pode fornecer “você está aqui” feedback como segue:

• Realce opções de navegação selecionados. Quando um usuário clica em um item de navegação, mesmo que eles selecionaram algo dentro de um menu drop-down, é melhor para manter essa seção destacada para que eles saibam que a secção em que estão.

• Mostrar o progresso. Se alguém está trabalhando através de uma tarefa de várias etapas, é uma boa idéia para mostrar uma barra de progresso deixando que eles sabem onde estão e quanto mais eles precisam fazer.

  Video: Video10 Usabilidade de design em conteudos didaticos mediacionais ponto de vista do webdesigner.flv

  
  Este site coloca a sua navegação global verticalmente pelo lado esquerdo, mas ainda é claro, para ver qual seção você está dentro.
  
  passos numerados ajudar a pista de usuário sustento de onde eles estão em um processo.