Noções básicas de comando
Em um aplicativo do Windows, elementos de comando são os elementos interativos da interface do usuário que permitem aos usuários executar ações como enviar um email, excluir um item ou enviar um formulário. As interfaces de comando são formadas por elementos de comando comuns, as superfícies de comando que as hospedam, as interações compatíveis com elas e as experiências que elas oferecem.
Proporcionar a melhor experiência de comando
O aspecto mais importante de uma interface de comando é o que você está tentando permitir que o usuário realize. Ao planejar a funcionalidade de um aplicativo, considere seguir as etapas necessárias para realizar essas tarefas e as experiências de usuário que você quer oferecer. Após concluir um rascunho inicial dessas experiências, tome decisões sobre as ferramentas e as interações para implementá-las.
Veja algumas experiências de comando comuns:
- Envio ou envio de informações
- Selecionar configurações e opções
- Conteúdo de filtro e pesquisa
- Abrir, salvar e excluir arquivos
- Editar ou criar conteúdo
Seja criativo ao projetar experiências de comando. Escolha quais dispositivos de entrada serão compatíveis e como o aplicativo responderá a cada um deles. Ao oferecer compatibilidade com a mais ampla variedade de funcionalidades e preferências, você torna o aplicativo o mais utilizável, portátil e acessível possível (confira mais detalhes em Design de comandos para aplicativos do Windows).
Escolher os elementos de comando certos
Usar os elementos certos em uma interface de comando pode fazer a diferença entre um aplicativo que parece intuitivo e fácil de usar e um que parece difícil ou confuso. Um conjunto abrangente de elementos de comando está disponível no aplicativo do Windows. Veja uma lista de alguns dos elementos de comando mais comuns da UWP.
Buttons
Os Botões disparam uma ação imediata. Dentre os exemplos estão: enviar um email, enviar dados de formulários ou confirmar uma ação em uma caixa de diálogo.
Listas
As listas apresentam itens em uma lista interativa ou em uma grade. Geralmente usado para muitas opções ou itens de exibição. Dentre os exemplos estão: lista suspensa, caixa de listagem, exibição de lista e exibição de grade.
Controles de seleção
Permite que os usuários escolham entre algumas opções, por exemplo, ao concluir uma pesquisa ou definir as configurações do aplicativo. Os exemplos incluem CheckBox, RadioButton e Toggle switch.
Seletores de calendário, data e hora
Os Seletores de calendário, data e hora permitem que os usuários exibam e modifiquem informações de data e hora, por exemplo, ao criar um evento ou definir um alarme. Dentre os exemplos estão: seletor de data do calendário, exibição de calendário, seletor de data e seletor de hora.
Entrada de texto preditiva
Fornece sugestões à medida que os usuários digitam, por exemplo, ao inserir dados ou realizar consultas. Os exemplos incluem AutoSuggestBox.
Para obter uma lista completa, consulte Controles e elementos da interface do usuário
Colocar comandos na superfície direita
É possível colocar elementos de comando em várias superfícies no aplicativo, inclusive na tela do aplicativo ou em contêineres de comando especial, como uma barra de comando, o submenu de uma barra de comando, a barra de menus e as caixas de diálogo.
Sempre tente permitir que os usuários manipulem o conteúdo diretamente em vez de por meio de comandos que atuam no conteúdo, como arrastar e soltar para reorganizar itens de lista em vez de botões de comando para cima e para baixo.
No entanto, talvez isso não seja possível com determinados dispositivos de entrada ou ao acomodar as preferências e as habilidades de um usuário específico. Nesses casos, oferecer o maior número possível de funcionalidades e colocar esses elementos de comando em uma superfície de comando no aplicativo.
Veja uma lista das superfícies de comando mais comuns.
Tela do aplicativo (área de conteúdo)
Se um comando for constantemente necessário para que os usuários concluam os principais cenários, coloque-o na tela. Como você pode colocar comandos próximos (ou sobre) os objetos que eles afetam, colocar comandos na tela os torna fáceis e óbvios de usar. No entanto, escolha os comandos que você coloca na tela com cuidado. O excesso de comandos na tela do aplicativo ocupa espaço valioso e pode sobrecarregar o usuário. Se o comando não for usado com frequência, considere a possibilidade de colocá-lo em outra superfície de comando.
Barras de comandos e barras de menus
As Barras de comandos ajudam a organizar os comandos e facilitam o acesso a eles. As barras de comandos podem ser colocadas na parte superior da tela, na parte inferior da tela ou em ambas ao mesmo tempo (uma MenuBar também pode ser usada quando a funcionalidade do seu aplicativo é complexa demais para uma barra de comandos).
Menus e menus de contexto
Menus e menus de contexto economizam espaço organizando comandos e ocultando-os até que o usuário precise deles. Normalmente, os usuários acessam um menu ou um menu de contexto clicando em um botão ou clicando com o botão direito do mouse em um controle.
O CommandBarFlyout é um tipo de menu contextual que combina os benefícios de uma barra de comandos e um menu de contexto em um único controle. Eles podem fornecer atalhos para ações usadas com frequência e fornecer acesso a comandos secundários que são relevantes somente em determinados contextos, como na área de transferência ou em comandos personalizados.
A UWP também fornece um conjunto de menus tradicionais e menus de contexto; para obter mais informações, consulte Menus e menus de contexto.
Fazer comentários sobre o comando
Os comentários sobre o comando comunicam aos usuários que uma interação ou comando foi detectado, como o comando foi interpretado e manipulado e se o comando foi bem-sucedido ou não. Isso ajuda os usuários a entender o que fizeram e o que pode ser feito. Idealmente, os comentários devem ser integrados naturalmente em sua interface do usuário para que os usuários não precisem ser interrompidos ou executar nenhuma ação adicional, a menos que absolutamente necessário.
Observação
Faça comentários somente quando necessário e se não estiver disponível em outro local. Mantenha a interface do usuário do aplicativo limpa e organizada, a menos que você esteja agregando valor.
Aqui estão algumas maneiras de fazer comentários em seu aplicativo.
Barra de comandos
A área de conteúdo do CommandBar é um local intuitivo para comunicar o status aos usuários se eles quiserem ver comentários.
Submenus
Submenus são pop-ups contextuais leves que podem ser ignorados tocando ou clicando em algum lugar fora deles.
Controles de caixa de diálogo
Os Controles de caixa de diálogo são sobreposições de interface do usuário modais que fornecem informações contextuais de aplicativo. Na maioria dos casos, as caixas de diálogo bloqueiam as interações com a janela do aplicativo até serem explicitamente descartadas e geralmente solicitam algum tipo de ação do usuário. Os diálogos podem ser perturbadores e devem ser usados apenas em determinadas situações. Para obter mais informações, consulte a seção Quando confirmar ou desfazer ações .
Dica
Tenha cuidado com o quanto seu aplicativo usa caixas de diálogo de confirmação; Eles podem ser muito úteis quando o usuário comete um erro, mas são um obstáculo sempre que o usuário está tentando executar uma ação intencionalmente.
Quando confirmar ou desfazer ações
Não importa se a interface do usuário do aplicativo foi bem projetada, todos os usuários podem executar as ações indesejadas. O aplicativo pode ajudar nessas situações ao exigir que a confirmação de uma ação ou ao fornecer uma forma de desfazer ações recentes.
Para ações que não podem ser desfeitas e têm grandes consequências, recomendamos usar uma caixa de diálogo de confirmação. Exemplos de tais ações incluem:
- Substituindo um arquivo
- Não salvar um arquivo antes de fechar
- Confirmando a exclusão permanente de um arquivo ou dados
- Fazer uma compra (a menos que o usuário opte por não exigir uma confirmação)
- Enviar um formulário, como se inscrever em algo
Para ações que podem ser desfeitas, oferecer um simples comando de desfazer geralmente é suficiente. Exemplos de tais ações incluem:
- Excluir um arquivo
- Excluindo um e-mail (não permanentemente)
- Modificando conteúdo ou editando texto
- Renomear um arquivo
Otimize para tipos de entrada específicos
Consulte a cartilha de interação para obter mais detalhes sobre como otimizar as experiências do usuário em torno de um tipo de entrada ou dispositivo específico.
Windows developer