Interação
Nota
Este guia de design foi criado para o 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 nossa 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
Em primeiro lugar, projete seu aplicativo com a expectativa de que o toque seja 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 o Windows fornece isso gratuitamente.
No entanto, tenha em mente 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 o 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 no 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.
Comparar 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, caneta/caneta | Touchpad |
|---|---|---|---|
|
de precisão |
A área de contato de uma ponta de dedo é maior que uma única coordenada x-y, o que aumenta as chances de ativações de comando não intencionais. |
O mouse e a caneta/caneta fornecem uma coordenada x-y precisa. |
O mesmo que o mouse. |
| A forma da área de contato muda ao longo do movimento. |
Movimentos do mouse e traços de caneta/caneta fornecem coordenadas x-y precisas. O foco do teclado é explícito. |
O mesmo que o mouse. |
|
| Não há nenhum cursor do mouse para ajudar no direcionamento. |
O cursor do mouse, o cursor de caneta/caneta e o foco do teclado auxiliam no direcionamento. |
O mesmo que o mouse. |
|
|
de anatomia humana |
Os movimentos da ponta do dedo são imprecisos, porque um movimento de linha reta com um ou mais dedos é difícil. Isso ocorre devido à curvatura das articulações das mãos e ao número de articulações envolvidas no movimento. |
É mais fácil executar um movimento de linha reta com o mouse ou caneta/caneta porque a mão que os controla percorre uma distância física menor do que o cursor na tela. |
O mesmo que o mouse. |
| Algumas áreas na superfície de toque de um dispositivo de exibição podem ser difíceis de alcançar devido à postura do dedo e à aderência do usuário no dispositivo. |
O mouse e a caneta/caneta podem alcançar qualquer parte da tela enquanto qualquer controle deve ser acessível pelo teclado por meio da ordem de tabulação. |
A postura e a aderência do dedo podem ser um problema. |
|
| Os objetos podem ser obscurecidos por uma ou mais pontas de dedo ou pela mão do usuário. Isso é conhecido como oclusão. |
Dispositivos de entrada indiretos não causam oclusão. |
O mesmo que o mouse. |
|
|
de estado do objeto |
O touch usa um modelo de dois estados: a superfície sensível ao toque de um dispositivo de exibição é tocada (ativada) ou não (desativada). Não há nenhum estado de foco que possa disparar comentários visuais adicionais. |
Um mouse, uma caneta/caneta e um teclado expõem um modelo de três estados: para cima (desativado), para baixo (ativado) e focalizar (foco). O Hover permite que os usuários explorem e aprendam por meio de dicas de ferramentas associadas aos elementos da interface do usuário. Os efeitos de foco e foco podem retransmitir quais objetos são interativos e também ajudar no direcionamento. |
O mesmo que o mouse. |
|
de interação avançada |
Dá suporte a vários toques: vários pontos de entrada (pontas dos dedos) em uma superfície de toque. |
Dá suporte a um único ponto de entrada. |
O mesmo que toque. |
| Dá suporte à manipulação direta de objetos por meio de gestos como tocar, arrastar, deslizar, pinçar e girar. |
Nenhum suporte para manipulação direta como mouse, caneta/caneta e teclado são dispositivos de entrada indiretos. |
O mesmo que o mouse. |
de Observação
A entrada indireta teve o benefício de mais de 25 anos de refinamento. Recursos como dicas de ferramenta disparadas por foco foram projetados para resolver a exploração da interface do usuário especificamente para touchpad, mouse, caneta/caneta e entrada de teclado. Recursos de interface do usuário como este foram recriados para a experiência avançada fornecida pela entrada por toque, sem comprometer a experiência do usuário para esses outros dispositivos.
Fornecemos algumas diretrizes gerais de interação do usuário aqui e abordamos diretrizes específicas do dispositivo nestes tópicos.
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 os comentários visuais do Windows podem indicar interações bem-sucedidas, retransmitir o status do sistema, melhorar o senso de controle, reduzir erros, ajudar os usuários a entender o sistema e o dispositivo de entrada e incentivar a interação.
Os comentários visuais são críticos quando o usuário depende da entrada por toque para atividades que exigem precisão e precisão com base na localização. Exiba comentários sempre que e onde quer que a entrada por toque seja detectada, para ajudar o usuário a entender as regras de direcionamento personalizadas definidas pelo seu aplicativo e seus 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.
Tamanho, espaço e posição de seus controles para ajudar a eliminar a oclusão de dedos e mãos, 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.
- Os pontos de ajuste podem facilitar a parada em locais desejados. Os pontos de ajuste 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 cronometrada
As interações não devem ser distinguidas pelo tempo. A mesma interação deve ter o mesmo resultado, independentemente do tempo necessário para executá-lo. As ativações baseadas em tempo introduzem atrasos obrigatórios para os usuários e prejudicam tanto a natureza imersiva da manipulação direta quanto a percepção da capacidade de resposta do sistema.
As interações cronometrada normalmente dependem de limites invisíveis, como tempo, distância ou velocidade, para determinar qual comando executar. Interações cronometrada 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. Comentários visuais instantâneos durante as interações fazem com que os usuários se sintam mais engajados, confiantes e no controle.
Interações que afetam diretamente objetos e imitam interações do mundo real são mais intuitivas, detectáveis e memoráveis. Eles não dependem de interações obscuras ou abstratas.
Observação: Uma exceção é onde você usa interações temporais específicas para ajudar na aprendizagem e exploração (por exemplo, pressionar e segurar). Usar descrições apropriadas e indicações visuais tem um grande efeito sobre o uso de interações avançadas.