Interação

Observação

Este guia de design foi criado para Windows 7 e não foi atualizado para versões mais recentes do Windows. Grande parte das diretrizes ainda se aplica em princípio, mas a apresentação e os exemplos não refletem nossas diretrizes de design atuais.

A interação é a variedade de maneiras pelas quais os usuários interagem com seu aplicativo, incluindo toque, teclado, mouse e assim por diante. Use essas diretrizes para criar experiências intuitivas e distintas otimizadas para toque, mas que funcionam consistentemente entre dispositivos de entrada.

Design para uma experiência touch-first

Primeiro e mais importante, projete o seu aplicativo com a expectativa de que o toque será o método de entrada principal dos usuários. Se você usar os controles de plataforma, o suporte para touchpad, mouse e caneta/caneta não exigirá programação adicional, pois Windows fornece isso gratuitamente.

Tenha em mente, porém, que uma interface do usuário otimizada para toque nem sempre é superior a uma interface do usuário tradicional. Ambos fornecem vantagens e desvantagens exclusivas para a tecnologia e o aplicativo. Na mudança para uma interface do usuário touch-first, é importante entender as principais diferenças entre toque (incluindo touchpad), caneta/caneta, mouse e entrada de teclado. Não use propriedades e comportamentos de dispositivo de entrada familiares como garantidos, pois o toque em Windows 8 faz mais do que simplesmente emular essa funcionalidade.

Como você descobrirá em breve, a entrada por toque requer uma abordagem diferente para o design da interface do usuário.

Compare os requisitos de interação por toque

Esta tabela mostra algumas das diferenças entre os dispositivos de entrada que você deve considerar ao criar aplicativos da Windows Store com otimização de toque.

Fator	Interações por toque	Interações de mouse, teclado e caneta/stylus	Touchpad
Precisão	A área de contato da ponta do dedo é maior do que uma coordenada x-y única, o que aumenta a probabilidade de ativações de comando acidentais.	O mouse e a caneta/stylus fornecem uma coordenada x-y precisa.	Igual ao mouse.
	O formato da área de contato altera ao longo do movimento.	Os movimentos do mouse e traços da caneta/stylus fornecem uma coordenada x-y precisa. O foco do teclado é explícito.	Igual ao mouse.
	Não há cursor do mouse para ajudar no direcionamento.	O cursor do mouse, o cursor da caneta/stylus e o foco do teclado, todos ajudarão no direcionamento.	Igual ao mouse.
Anatomia humana	Movimentos com as pontas dos dedos são imprecisos porque dificultam um movimento em linha reta usando um ou mais dedos. Isso se deve à curvatura das articulações das mãos e ao número de articulações envolvidas no movimento.	É fácil realizar um movimento em linha reta com o mouse ou caneta/stylus porque a mão que os controla percorre uma distância física menor do que o cursor na tela.	Igual ao mouse.
	Algumas áreas na superfície de toque de um dispositivo de vídeo podem ser inacessíveis devido à postura do dedo e à posição do punho do usuário sobre o dispositivo.	O mouse e a caneta podem atingir qualquer parte da tela, embora qualquer controle deva ser acessado pelo teclado por meio da ordem de tabulação.	A postura do dedo e a alça podem ser um problema.
	Os objetos podem ser obscurecidos por uma ou mais pontas de dedos ou pela mão do usuário. Isso é conhecido como oclusão.	Os dispositivos de entrada indireta não causam oclusão.	Igual ao mouse.
Estado de objeto	O touch usa um modelo de dois estados: a superfície de toque de um dispositivo de exibição é tocada (ativada) ou não (desativada). Não há estado de foco que possa disparar feedback visual adicional.	Um mouse, caneta/stylus e teclado, todos expõem um modelo de três estados: acima (off), abaixo (on) (ativado), e focalizar (foco). A focalização permite que os usuários explorem e aprendam usando as dicas de ferramentas associadas aos elementos da interface do usuário. Os efeitos de focalização e de foco podem retransmitir os objetos que são interativos e também ajudar no direcionamento.	Igual ao mouse.
Interação sofisticada	Suporta multitoque, pontos de entrada múltiplos (pontas dos dedos) em uma superfície de toque.	Suporta um ponto de entrada único.	Igual ao toque.
	Suporta a manipulação direta de objetos através de gestos como tocar, arrastar, deslizar, apertar e girar.	Sem suporte para manipulação direta quando o mouse, caneta e teclado são dispositivos de entrada indiretos.	Igual ao mouse.

Observação

A entrada indireta conta com os benefícios de mais de 25 anos de refinamento. Recursos como dicas de ferramentas disparadas por focalização foram projetadas para solucionar a exploração da interface do usuário especificamente para entradas por touchpad, mouse, caneta e teclado. Elementos da interface do usuário como esses foram reprojetados para uma experiência avançada fornecida pela entrada de toque, sem comprometer a experiência do usuário para outros dispositivos.

Fornecemos algumas diretrizes gerais de interação do usuário aqui e abordamos diretrizes específicas do dispositivo nestes tópicos.

• Tocar
• Mouse
• Caneta
• Teclado
• Acessibilidade

Visuais para comentários

Os comentários visuais apropriados durante as interações com seu aplicativo ajudam os usuários a reconhecer, aprender e adaptar-se à maneira como suas interações são interpretadas pelo aplicativo e Windows comentários visuais podem indicar interações bem-sucedidas, retransmitir o status do sistema, melhorar a sensação de controle, reduzir erros, ajudar os usuários a entender o sistema e o dispositivo de entrada e incentivar a interação.

A resposta visual é importante quando o usuário recorre à entrada por toque em atividades que exigem exatidão e precisão com base no local. A exibição do feedback sempre que a entrada por toque for detectada ajudará o usuário a entender as regras de direcionamento personalizadas definidas pelo aplicativo e seus respectivos controles.

Otimizar para precisão

A entrada por toque envolve toda a área de contato do dedo. Essa geometria de contato é usada para determinar o objeto de destino mais provável. Dimensione seus controles para garantir uma interface do usuário confortável com objetos e controles fáceis e seguros de serem direcionados.

Dimensione, espaço e posicione seus controles para ajudar a eliminar a oclusão de dedo e mão, em que a interface do usuário é obscurecida pela própria interação do usuário.

Posicione menus, pop-ups e dicas de ferramenta acima da área de contato sempre que possível.

Restringir para confiança

Evite ou minimize interações desleixadas usando restrições de interface do usuário.

• Ajustar pontos podem facilitar a parada em locais desejados. Pontos de alinhamento especificam paradas lógicas no conteúdo do aplicativo. Cognitivamente, os pontos de ajuste atuam como um mecanismo de paginação para o usuário e minimizam a fadiga de deslizar, deslizar ou girar excessivamente. Com eles, você pode lidar com a entrada imprecisa do usuário e garantir que um subconjunto específico de conteúdo ou informações de chave seja exibido.
• "Trilhos" direcionais que enfatizam o eixo de movimento (vertical ou horizontal).

Evitar interações temporais

As interações não devem ser diferenciadas por tempo. A mesma interação deve ter o mesmo resultado, independentemente do tempo que leva para realizá-la. Ativações baseadas em tempo geram atrasos obrigatórios para os usuários e fogem de sua natureza imersiva de manipulação direta e percepção da capacidade de resposta do sistema.

As interações em tempo limite dependem normalmente de limites invisíveis como tempo, distância ou velocidade para determinar o comando a ser realizado. As interações com tempo não têm comentários visuais até que o sistema execute a ação e os usuários devem atingir limites arbitrários e invisíveis para obter um resultado. A resposta visual instantânea durante as interações faz com que os usuários se sintam conectados, confiantes e no controle.

As interações que afetam diretamente os objetos e imitam as interações reais são mais intuitivas, passíveis de descoberta e memorizáveis. Elas não dependem de interações obscuras ou abstratas.

Nota: Uma exceção a isso é onde você usa interações temporais específicas para auxiliar no aprendizado e exploração (por exemplo, pressione e segure). O uso de descrições apropriadas e indicações visuais tem um grande efeito sobre o uso de interações avançadas.