Padrões de comando

Você pode colocar comandos e controles em várias superfícies do seu aplicativo da Windows Store, incluindo a tela do aplicativo, pop-ups, caixas de diálogo e barras do aplicativo. Escolher a superfície certa no momento certo pode fazer a diferença entre um aplicativo fácil ou difícil de usar.

Nos aplicativos da Windows Store, os comandos são os elementos interativos da interface que o usuário pode utilizar para executar ações. Os comandos são diferentes dos elementos de navegação no sentido de que os elementos de navegação levam o usuário para outra página, enquanto o comando permite que o usuário realize uma ação na página atual. Os elementos de navegação tornam o aplicativo utilizável. Os comandos tornam o aplicativo útil.

Para saber mais sobre as diferentes superfícies de comando nos aplicativos, consulte Estabelecendo o layout da sua interface do usuário.

Tipos de comando

Filtro

Os comandos de filtro removem ou ocultam conteúdo em um conjunto de dados, com base em alguns critérios. Por exemplo, o usuário pode optar por exibir apenas os jogos da Windows Store que estejam classificados como "Aventura".

 

 

Pivô

Os comandos de pivô reorganizam o conteúdo em um conjunto de dados e proporcionam uma exibição diferente dos dados com base no pivô. Por exemplo, o usuário pode optar por organizar as músicas por álbum, artista ou música.

 

 

Classificação

Os comandos de classificação alteram a ordem em que o conteúdo é exibido em um conjunto de dados. Por exemplo, o usuário pode escolher destinos em um aplicativo de viagem por popularidade.

 

 

Exibição

Os comandos de exibição alteram o estilo ou método no qual o conteúdo é exibido. Por exemplo, em um aplicativo que localiza hotéis, o usuário pode escolher exibir os hotéis em um mapa em vez de em uma lista.

 

 

Dica

Você pode colocar comandos de dicas na tela, se achar que elas beneficiarão os usuários. Por exemplo, no aplicativo Email do Windows 8.1, existe o comando "reticências" que sugere opções adicionais. Ao clicar nele, é exibida uma barra de aplicativos, além dos métodos convencionais do Windows que exibem uma barra de aplicativos.

 

 

Você pode criar essas dicas para atender ao estilo de seu aplicativo. Esse aplicativo de notícias usa a mesma dica de barra de aplicativos, mais um sinalizador com um ícone de menu que exibe uma página de opções de menu.

 

 

Outros

Qualquer elemento interativo da interface que permita ao usuário executar uma ação na exibição atual é um comando. Veja alguns exemplos.

 

 

Posicionamento de comandos

Na tela

Se um comando (ou um menu de comando) for essencial e constantemente necessário para que o usuário complete os principais cenários, coloque-o na tela. Por exemplo, no aplicativo Email do Windows 8.1, os comandos principais como responder, novo e excluir aparecem na tela quando um email é selecionado.

 

 

Barra de aplicativos inferior

Às vezes, você não quer comandos atravancando a tela e afetando a capacidade do usuário de consumir o conteúdo do aplicativo. Use a barra de aplicativos inferior para exibir comandos aos usuários por demanda. A barra de aplicativos inferior mostra os comandos relevantes ao contexto do usuário, normalmente a página ou a seleção atual.

A barra de aplicativos inferior funciona bem com comandos de seleção simples e múltipla. Você pode programar seu aplicativo de forma que a barra de aplicativos apareça quando o usuário selecionar objetos.

 

 

Diretrizes de posicionamento de comandos

Você pode variar o posicionamento dos comandos na barra de aplicativos, mas deve considerar o seguinte:

• Previsibilidade Até onde for possível, use interação e posicionamento de comandos consistentes em todos os modos de exibição de seu aplicativo.
• Ergonomia Considere como o posicionamento de comandos específicos pode aumentar a velocidade ou facilidade com que um comando pode ser acionado.
• Estética Limite o número de comandos para evitar que a barra de aplicativos pareça complicada. Escolha ícones fáceis de entender ou prever. Mantenha rótulos de texto curtos.

Recomendamos as seguintes diretrizes de posicionamento de comandos:

Coloque os comandos persistentes ou padrão à direita da barra de aplicativos. Se houver apenas alguns comandos, a barra de aplicativos pode terminar com comandos apenas à direita. Neste exemplo, para os comandos de pesquisa, o conjunto de comandos de exibição e o conjunto de filtro/classificação são persistentes.

 

Use as bordas. Se houver um grande número de comandos, separe conjuntos de comandos diferentes à esquerda ou à direita para equilibrar a barra de aplicativos e para que os comandos tenham um acesso mais ergonômico. Neste exemplo, decidimos mover o conjunto de comandos de exibição para a esquerda e manter o conjunto de filtragem/classificação à direita. Quando a exibição de mapa está ativa, os comandos de exibição de mapa aparecem à direita do conjunto de comandos de exibição.

 

Mostre/oculte comandos desabilitados. Esses são os comandos que não são relevantes dem determinadas situações. Quando aparecerem, eles não devem perturbar a ordem de comandos persistentes. Neste exemplo, a exibição de mapa está ativa e os comandos de exibição de mapa aparecem à direita do conjunto de comandos de exibição.

 

Insira comandos de seleção. Comandos que aparecem como resultado da seleção do usuário ficam na extrema esquerda, deslizando sobre quaisquer comandos que possam existir. Isso torna os comandos de seleção mais notáveis e mais fáceis de acessar. Neste exemplo, o conjunto de comandos de exibição desliza para a direita para dar espaço para o conjunto de comandos de seleção.

 

Posicionamento de comandos comuns

Alguns comandos são comuns e aparecem em muitos aplicativos. Para gerar consistência e instilar confiança, recomendamos seguir estas diretrizes ao decidir onde colocar comandos comuns na barra de aplicativos.

Coloque comandos de seleção na extrema esquerda, quer eles sejam comandos contextuais que aparecem ao selecionar ou comandos que afetam a seleção. Neste exemplo, antes que os usuários selecionem qualquer coisa, um comando "Selecionar tudo" aparece à esquerda. Depois que os usuários selecionam alguma coisa, os outros comandos de seleção aparecem à esquerda.

 

Coloque comandos de novo item na borda direita da barra. Os comandos de novo item podem incluir a adição, criação, redação ou qualquer comando que crie uma nova entidade. Os comandos de novo item devem ser facilmente acessíveis usando os polegares. Neste exemplo, o comando "Nova revisão" permite que os usuários criem uma nova revisão do restaurante. Outros comandos, relacionados à "Nova revisão", são colocados ao lado dele à esquerda. O glifo + só deve ser usado para representar o comando "Novo" e não deve aparecer em nenhum outro lugar em uma barra de aplicativos.

 

Coloque comandos de exclusão à esquerda dos comandos de novo item. Use Excluir/Novo se o aplicativo gerenciar entidades individuais que podem persistir fora de seu aplicativo específico, como em um aplicativo de email ou câmera. Excluir/Novo sempre devem aparecer nesta ordem.

 

Coloque comandos de remoção à esquerda dos comandos de adição. Use Remover/Adicionar se o aplicativo gerenciar uma lista, como uma lista de tarefas, uma lista de cidades em um aplicativo de previsão do tempo ou uma lista de restaurantes marcados com indicador. Remover/Adicionar sempre devem aparecer nesta ordem.

 

Coloque comandos de limpeza à esquerda dos comandos de novo item. Use limpar se você estiver executando uma ação destrutiva em todos os itens possíveis. Use o rótulo do comando para ser explícito sobre o que o comando fará, como "Limpar seleção".

 

Para exemplos de posicionamento de comandos na barra de aplicativos inferior, consulte a galeria de aplicativos da Windows Store.

Agrupando comandos em menus

Às vezes, é mais eficiente agrupar vários comandos em um menu de comando. Os menus permitem apresentar mais opções em menos espaço. Eles podem incluir controles interativos.

Neste exemplo, o comando de classificação exibe um menu simples que facilita a escolha de uma opção de classificação pelos usuários. O comando de filtro exibe um conjunto de controles em um menu que permite que os usuários filtrem itens por critérios mais complexos.

 

Menus de contexto

Muitas vezes, os menus de contexto contêm ações da área de transferência, como recortar, copiar e colar. Os menus de contexto também podem conter comandos que se aplicam a conteúdo que não pode ser selecionado, como uma imagem em uma página da Web. O sistema fornece aplicativos com menus de contexto padrão para texto e hiperlinks. Para texto, o menu de contexto padrão mostra os comandos da área de transferência. Para hiperlinks, o menu padrão mostra comandos para copiar e para abrir o link.

Os usuários invocam menus de contexto pressionando e segurando o conteúdo em dispositivos sensíveis ao toque ou clicando com o botão direito do mouse no conteúdo com um mouse.

 

 

Observação  

Utilize os botões

Ao criar um aplicativo da Windows Store, você tem quatro comandos bastante úteis nos botões: pesquisar, compartilhar, dispositivos e configurações. Os usuários invocam os botões passando o dedo da borda direita da tela ou apontando o cursor do mouse para o canto superior ou inferior direito da tela.

 

 

Pesquisar: permite que os usuários pesquisem rapidamente o conteúdo do aplicativo de qualquer lugar do sistema, inclusive de outros aplicativos.
Compartilhar: permite que os usuários compartilhem conteúdo do seu aplicativo com outras pessoas ou aplicativos, e recebam conteúdo compartilhado.
Iniciar: o botão Iniciar leva o usuário à tela inicial. Os aplicativos não interagem com esse botão. O comportamento é automático e é sempre o mesmo.
Dispositivos: permite que os usuários curtam áudio, vídeo ou imagens transmitidas do seu aplicativo para outros dispositivos da rede doméstica.
Configurações: consolida todas as suas configurações em um mesmo local e permite que os usuários configurem o seu aplicativo usando um mecanismo comum com o qual já estão familiarizados.

 

Evite duplicar a funcionalidade do contrato de aplicativos na tela ou barra de aplicativos.

Tópicos relacionados

Diretrizes de barras de aplicativos

Diretrizes de menus de contexto

Diretrizes de comandos da área de transferência

Botões e contratos