Lista de verificação de experiência do usuário para os aplicativos da Windows Store

Para facilitar a certificação de aplicativos, além de proporcionar uma boa experiência do usuário, use esta lista de verificação para confirmar se o seu aplicativo segue as diretrizes para a experiência do usuário.

Necessário

Veja a seguir a diretrizes para a experiência do usuário com maior prioridade para seu aplicativo. Você deve seguir todas as diretrizes desta seção para que o aplicativo seja certificado para a Windows Store.

VerificaçãoDescriçãoDiretrizes
[ ]Seu aplicativo deve agregar valor para o usuário, ser exclusivo e criativo. Planejando aplicativos da Windows Store
[ ]O aplicativo deve ser mais do que um site organizado como um aplicativo da Windows Store. Planejando aplicativos da Windows Store
[ ]Cada aplicativo deve exibir um bloco após a instalação. A imagem no bloco do aplicativo deve estar relacionada ao conteúdo do aplicativo de modo aceitável.Trabalhando com blocos, notificações e notificações do sistema (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O bloco do aplicativo deve usar um modelo de bloco padrão.Trabalhando com blocos, notificações e notificações do sistema (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo não deve usar a respectiva descrição, os blocos, as notificações, a barra de aplicativos ou as interações de passar o dedo desde a borda para mostrar anúncios. Diretrizes para publicidade
[ ]O aplicativo deve dar suporte total à entrada por toque e à entrada por teclado e mouseRespondendo à interação do usuário (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Ações e gestos de toque devem ser compatíveis com a linguagem de toque do Windows. O aplicativo não deve usar gestos de toque que não correspondam à linguagem de toque do Windows. Padrões de toque
[ ]O aplicativo deve usar a linguagem de mouse do Windows 8.Respondendo a interações por mouse (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Elementos interativos da interface do usuário devem fornecer comentários visuais. Elementos não interativos da interface do usuário não devem fornecer comentários visuais.Diretrizes para comentários visuais (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo deve permanecer funcional quando o cliente redimensioná-lo para qualquer tamanho, até o tamanho mínimo padrão. Diretrizes para redimensionar e Diretrizes para redimensionar em layouts estreitos
[ ]Na orientação de paisagem, as funções do aplicativo devem ser totalmente acessíveis quando o tamanho da resolução do vídeo do aplicativo for 1024 x 768. Diretrizes de dimensionamento em telas
[ ]O aplicativo não deve ser fechado programaticamente, nem oferecer possibilidades de interface do usuário para fechá-lo. O Gerenciamento do Tempo de Vida do Processo do Windows 8 fecha os aplicativos da Windows Store automaticamente. Diretrizes para suspender e retomar aplicativos
[ ]O aplicativo deve ser suspenso e retomado para um estado razoável. Diretrizes para suspender e retomar aplicativos
[ ]Se o aplicativo implementar uma barra de aplicativos, essa barra deverá aparecer com um passar de dedo de baixo para cima.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Se o aplicativo implementar uma barra de navegação, esta deverá aparecer com um movimento de passar o dedo de cima para baixo.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo deve respeitar as configurações do sistema para notificações e permanecer funcional quando elas são desabilitadas.Trabalhando com blocos, notificações e notificações do sistema (JavaScript e HTML ou C#/VB/C++ e XAML)

 

Altamente recomendável

Recomendamos expressamente que seu aplicativo siga as diretrizes nesta seção. Cada uma dessas diretrizes contribui para criar um aplicativo bem projetado.

VerificaçãoDescriçãoDiretrizes
Metas do aplicativo
[ ]O aplicativo deve ter metas claras para a experiência do usuário e uma instrução clara de ‘melhor em’. Planejando aplicativos da Windows Store
[ ]A página principal ou a página hub do aplicativo deve ser mais do que apenas um site inserido. Planejando aplicativos da Windows Store

Padrões de navegação
Layout e alinhamento
[ ]Para organizar o conteúdo, o aplicativo deve usar alinhamento, tipografia e espaço em branco de forma consistente em todas as páginas e exibições. Definindo o layout de uma página de aplicativo

Diretrizes para tipografia
[ ]O aplicativo não deve usa cromo (linhas, caixas e outros elementos da interface do usuário) como meio principal de organização do conteúdo. Definindo o layout de uma página de aplicativo

Estudo de caso de design: site para aplicativo da Windows Store
[ ]Se o aplicativo tiver uma página hub, essa página não deve ser essencialmente um menu para outras páginas do aplicativo. Ela deve conter conteúdo útil. Padrões de navegação
Grade
[ ]Os elementos da interface do usuário devem ser alinhados à grade. Definindo o layout de uma página de aplicativo
Silhueta
[ ]O bloco do aplicativo deve ser posicionado de forma consistente em todas as páginas. Definindo o layout de uma página de aplicativo
[ ]As margens devem ser consistentes em todas as páginas. Definindo o layout de uma página de aplicativo
[ ]Se o aplicativo tiver um layout fluido, a margem esquerda deve ser no mínimo 120px. Definindo o layout de uma página de aplicativo
[ ]A margem inferior deve ser no mínimo 50px. Definindo o layout de uma página de aplicativo
Movimento panorâmico e rolagem
[ ]Em uma página principal ou na página hub de movimento panorâmico na horizontal, uma lista de rolagem vertical deve usar pontos de ajuste.Diretrizes para comentários movimento panorâmico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Em uma página principal ou na página hub de movimento panorâmico na vertical, uma lista de rolagem horizontal deve usar pontos de ajuste.Diretrizes para comentários movimento panorâmico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Não deve ser aplicada panorâmica a uma página na vertical nem na horizontal, a menos que o conteúdo exija movimento panorâmico de forma livre.Diretrizes para comentários movimento panorâmico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Se uma página puder ser rolada, ela deve fornecer indicadores de movimento panorâmico.Diretrizes para comentários movimento panorâmico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Uma página com movimento panorâmico na horizontal não deve conter várias listas de movimento panorâmico na vertical.Diretrizes para comentários movimento panorâmico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Uma página com movimento panorâmico na vertical não deve conter várias listas de movimento panorâmico na horizontal.Diretrizes para comentários movimento panorâmico (JavaScript e HTML ou C#/VB/C++ e XAML)
Tipografia
[ ]O aplicativo deve usar um conjunto fixo de tamanhos de tipos e espessuras (rampa de tipos). Diretrizes para tipografia

Diretrizes para fontes
[ ]As fontes e a hierarquia de fontes devem ser consistentes em todas as páginas. Diretrizes para tipografia

Diretrizes para fontes
[ ]O uso de maiúsculas deve ser consistente. Diretrizes para tipografia
[ ]O aplicativo não deve conter erros de ortografia. Diretrizes para tipografia
[ ]O aplicativo não deve conter texto truncado. Diretrizes para tipografia
Conteúdo da Web hospedado
[ ]O aplicativo não deve conter conteúdo da Web hospedado em um <iframe> na página hub. Guia de início rápido: Usando navegação de página única
Se o aplicativo tiver conteúdo da Web hospedado em um <iframe>, ele deverá fornecer uma maneira de navegar de volta ao aplicativo. Guia de início rápido: Usando navegação de página única
[ ]As páginas da Web que não seja conteúdo direto do aplicativo devem ser abertas em um navegador externo. Diretrizes e lista de verificação de links
[ ]O conteúdo da Web hospedado deve ser alinhado à silhueta do aplicativo. Definindo o layout de uma página de aplicativo
Identidade visual
[ ]O aplicativo deve ter uma imagem da tela inicial (620x320 pixels). Diretrizes e lista de verificação para telas iniciais
[ ]A tela inicial não deve incluir anúncios. Diretrizes e lista de verificação para telas iniciais
[ ]A tela inicial não deve conter informações essenciais do aplicativo, como informações sobre o aplicativo e da ajuda. Diretrizes e lista de verificação para telas iniciais
[ ]A transição entre a tela inicial e a primeira exibição do aplicativo não deve exibir uma tela em branco. Diretrizes e lista de verificação para telas iniciais
[ ]Um logotipo não deve impedir o posicionamento ou alinhamento correto do título da página, nem deve interferir em outro conteúdo. Identidade visual
[ ]O aplicativo não deve fazer referência a plataformas que não sejam do Windows em nenhuma identidade visual nem em outros elementos do aplicativo. Identidade visual
[ ]As imagens da tela de fundo não devem distrair nem interferir na verificação e leitura de conteúdo. Identidade visual
Barras de aplicativos
[ ]A barra de aplicativos inferior não deve incluir navegação, somente comandos. Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]A barra de navegação não deve incluir comandos, somente navegação.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]As barras de aplicativos não devem duplicar ações que estão nos botões. A única exceção é imprimir, que pode estar na barra de aplicativos inferior.
[ ]As barras de aplicativos devem ser fechadas quando o usuário tocar na página ou passar o dedo desde a borda inferior ou superior.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Quando o usuário passar o dedo para selecionar um item, a barra de aplicativos deve ser aberta para mostrar ações disponíveis para o item selecionado.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo não deve ter mais do que uma barra de aplicativos inferior visível ao mesmo tempo.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Comandos contextuais devem ser posicionados à esquerda da barra de aplicativos inferior (ou à direita dos idiomas da direita para a esquerda).Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O texto nos botões da barra de aplicativos deve ser centralizado.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Os comandos não devem ser duplicados nas barras de aplicativos.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Os comandos que são compartilhados entre páginas devem ser posicionados no mesmo local na barra de aplicativos quando possível.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo não deve usar um glifo existente para uma nova finalidade. Se não existirem ícones para a ação ou comando, crie um. WinJS.UI.AppBarIcon

Imagens de estilos do botão AppBar
Submenus
[ ]Quando o usuário mudar algo em um submenu, o conteúdo deve ser atualizado instantaneamente para refletir as alterações. Diretrizes e lista de verificação de submenus
[ ]O aplicativo não deve usar caixas diálogo modais para interface do usuário informativa ou contextual. Use submenus para informações e use menus de contexto para interface do usuário contextual.Organizando sua interface do usuário (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Um submenu deverá ser fechado quando o usuário tocar na página ou deve ter um comando para fechar ou cancelar. Diretrizes e lista de verificação de submenus
[ ]Um submenu deve ser posicionado perto do botão da barra de aplicativos associada. Diretrizes e lista de verificação de submenus
[ ]Um submenu não deve obscurecer o comando que o abriu. Diretrizes e lista de verificação de submenus
[ ]Os submenus não devem ter sombras nem outros elementos que criam um efeito 3D ou aumentado. Os visuais no Windows são simples, não aumentados. Diretrizes e lista de verificação de submenus
[ ]Se um submenu incluir navegação, ele deve incuir um botão de votar. Por exemplo, o painel Configurações permite que o usuário navegue para os submenus Configurações, por exemplo, Sobre e Comentários. Esses submenus Configurações incluem um botão de voltar para navegar de volta ao painel Configurações. Diretrizes e lista de verificação de submenus
[ ]Um submenu posicionado ao longo da borda do dispositivo não deve interferir nos gestos de passar o dedo pela borda Diretrizes e lista de verificação de submenus
Menus contextuais
[ ]Os objetos nos quais você pode passar o dedo para selecionar diretamente não devem ter um menu de contexto. Diretrizes e lista de verificação de menus contextuais
[ ]Os comandos não devem ser duplicados na barra de aplicativos e nos menus de contexto. Diretrizes e lista de verificação de menus contextuais
Caixas de diálogo de mensagem
[ ]As mensagens de erro não devem conter rastreamentos de pilha nem informações de depuração. Diretrizes e lista de verificação de caixas de diálogo de mensagem
[ ]As mensagens de erro ou perguntas de confirmação exibidas em caixas de diálogo devem ser aplicadas no aplicativo inteiro. Diretrizes e lista de verificação de caixas de diálogo de mensagem

Organizando sua interface do usuário (JavaScript e HTML ou C#/VB/C++ e XAML)
Classificando e filtrando
[ ]Os filtros que abrem pela barra de aplicativos devem usar um submenu. Padrões de navegação
[ ]Os submenus de classificação e filtragem devem ser posicionados perto do botão da barra de aplicativos associada. Padrões de navegação

Diretrizes e lista de verificação de submenus
[ ]Os submenus de classificação e filtragem deverão ser fechados quando o usuário tocar na página. Diretrizes e lista de verificação de submenus
[ ]As opções de classificação e filtragem devem ser posicionadas em uma lista suspensa se a interface do usuário de classificação e filtragem estiver na tela e se o aplicativo classifica ou filtra por mais de um critério. Padrões de navegação

Diretrizes e lista de verificação de submenus
[ ]O aplicativo não deve usar classificação e filtragem para navegação, por exemplo, para imitar guias. Em vez disso, use classificação e filtragem para permitir aos usuários refinar rapidamente as exibições de dados. Padrões de navegação
Controles
[ ]O aplicativo deve permitir a manipulação direta, em vez de ter modos de edição ou reorganização separados. Comandando o projeto

Estudo de caso de design: iPad para aplicativo da Windows Store
[ ]O aplicativo não deve ter ações nem gestos personalizados para selecionar itens a serem editados ou reorganizados. Diretrizes de deslizamento transversal
[ ]A marca de seleção em um item deve ser usada apenas para indicar que o item foi selecionado. Diretrizes de deslizamento transversal
[ ]Se o usuário puder selecionar um item, deverá haver um ou mais comandos associados ao item selecionado. Diretrizes de deslizamento transversal

Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Os comandos necessários para o usuário avançar devem ser posicionados na tela.Organizando sua interface do usuário (JavaScript e HTML ou C#/VB/C++ e XAML)
Navegação
[ ]O aplicativo não deve ter controles de navegação na tela nem na área da página, nem na barra de aplicativos inferior. Os controles de navegação devem estar na barra de navegação.

Observação  O botão de voltar é uma exceção e pode estar na tela.

Padrões de navegação
[ ]O aplicativo não deve usar guias na tela para navegação. Estudo de caso de design: site para aplicativo da Windows Store
[ ]Os cabeçalhos de seções ou detalhes devem abrir a seção ou página de detalhes com suporte. Padrões de navegação
[ ]Os cabeçalhos de seção devem ter uma interface do usuário visível e acionável para mostrar mais conteúdo, como um indicador de divisa ou o texto "Exibir todos os <x>" Padrões de navegação
[ ]O botão Voltar deve ser posicionado no canto superior esquerdo da página ou à esquerda da barra de navegação. Em idiomas da direita para a esquerda, posicione o botão Voltar no canto superior direito da página ou à direita da barra de navegação. Padrões de navegação
[ ]O aplicativo não deve ter um botão Voltar desabilitado na página nem na barra de navegação. Padrões de navegação
Zoom semântico
[ ]O zoom semântico não deve ser usado para navegar para outra página no aplicativo. Use o zoom semântico para navegar para outra posição na mesma página.Diretrizes para zoom semântico (JavaScript e HTML ou C#/VB/C++ e XAML)

Diretrizes e lista de verificação para controles de zoom semântico (C#/VB/C++ e XAML)
[ ]Se a exibição atual contiver mais de oito páginas de conteúdo, use o zoom semântico.Diretrizes para zoom semântico (JavaScript e HTML ou C#/VB/C++ e XAML)
Gestos de toque
[ ]Os elementos da da interface do usuário, os controles e outras partes do aplicativo não devem interferir em gestos de borda do Windows, nem na interface do usuário associada aos gestos de borda do Windows.Diretrizes para interações do usuário comuns (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Se um item não tiver um estado selecionado, ele não deve implementar o gesto de passar o dedo para selecionar. Diretrizes de deslizamento transversal
[ ]Um elemento da interface do usuário não deve ter mais do que um comando associado a ele. Mais de um comando em um único elemento da interface do usuário causa ambiguidade para gestos de toque. Diretrizes para interações comuns do usuário
[ ]Os gestos de toque não devem se sobrepor. O aplicativo não deve ter controle de mapa rolável, opção de alternância, controle deslizante nem outro tipo de controle dentro de um visualizador rolável que interfira no movimento panorâmico ou na rolagem. Diretrizes para interações comuns do usuário
Seleções por área de toque
[ ]As interações por toque devem emitir comentários para o usuário. Padrões de toque
[ ]Se um item não for acionável, ele não deve fornecer comentários por toque ao usuário. Padrões de toque
[ ]O aplicativo não deve confirmar o toque. As interações devem ser reversíveis. Padrões de toque
[ ]Se o usuário arrastar um item para fora, a ação de toque deve ser cancelada. Padrões de toque
[ ]As seleções por área de toque devem ser de 5 mm ou mais.Diretrizes para direcionamento (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo deve ter, no mínimo, 2 subunidades (10 pixels) entre seleções por área de toque. Diretrizes de direcionamento
Entrada de texto
[ ]O aplicativo deve usar o teclado virtual do Windows ou um IME (editor de método de entrada) associado. Ele não deve usar um teclado virtual personalizado. Diretrizes e lista de verificação para desenvolvimento do IME

Diretrizes de teclado virtual e painel de manuscrito
[ ]O teclado virtual não deve cobrir os controles que são necessários para concluir o cenário de entrada de texto. Por exemplo, o teclado virtual para uma caixa de texto de nome de usuário ou senha não deve obscurecer o botão de entrada. Diretrizes de teclado virtual e painel de manuscrito
Animações
[ ]O aplicativo deve implementar animações onde necessário.Animando sua interface do usuário (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]As animações personalizadas não devem degradar o desempenho nem afetar negativamente a experiência do usuário. Animando
[ ]As animações e transições não devem ter um desempenho fraco. Por exemplo, o usuário não deve notar o redesenho de blocos. Animando

Torne as animações suaves
Tamanhos e orientações de ela
[ ]Os aplicativos com um layout fluido devem refluir para telas maiores. Diretrizes de layouts

Diretrizes de dimensionamento em telas
[ ]Os aplicativos não devem mostrar artefatos ou degradação perceptíveis na qualidade da imagem em vídeos grandes ou com alta densidade de pixels. Diretrizes de dimensionamento em telas

Diretrizes de dimensionamento de acordo com a densidade de pixels
[ ]Os aplicativos devem ser compatíveis com a orientação retrato de dispositivos e monitores. Os aplicativos devem ser compatíveis com o redimensionamento quando a altura do aplicativo é maior que sua largura. Diretrizes para redimensionamento
[ ]O aplicativo deve manter o conteúdo e o estado quando o usuário redimensionar o aplicativo. Diretrizes para redimensionamento
[ ]O aplicativo deve ser totalmente funcional quando reduzido para o tamanho mínimo padrão. Se o aplicativo for compatível com um tamanho mínimo que seja menor que o padrão, ele deve manter o máximo de funcionalidade possível no tamanho mínimo. Diretrizes para redimensionamento

Diretrizes para redimensionar em layouts estreitos
[ ]O layout e todos os controles do aplicativo devem ser dimensionados apropriadamente quando o usuário redimensionar o aplicativo. A interface do usuário e os controles devem poder ser utilizados em qualquer tamanho de janela. Diretrizes para redimensionamento
[ ]Se o aplicativo for compatível com larguras entre 320 e 499 pixels, ele deve alternar para uma exibição estreita e vertical para larguras estreitas. Alterne para o movimento panorâmico na vertical e use margens, cabeçalho, botão de voltar e deslocamentos de animação de transições menores. Diretrizes para redimensionar em layouts estreitos
[ ]O aplicativo não deve mudar programaticamente o tamanho. O usuário pode redimensionar o aplicativo quando quiser. Diretrizes para redimensionar em layouts estreitos
[ ]O aplicativo não deve alternar para outra parte do aplicativo quando o tamanho da janela é modificado. Diretrizes para redimensionar em layouts estreitos
Contratos e botões
[ ]O aplicativo não deve duplicar os botões Configurações, Compartilhar ou Dispositivos na tela do aplicativo nem na barra de aplicativos. Padrões de comando
[ ]O aplicativo deve dar suporte ao uso de botões quando estiver em qualquer tamanho, orientação ou posição na tela. Os botões se aplicam ao último aplicativo que o usuário acessou. Diretrizes para redimensionar em layouts estreitos
Contrato do Windows Search e botão Pesquisar
[ ]O aplicativo não deve usar o Contrato do Windows Search para localizar página. Posicione controles de localização de página na barra de aplicativos.Diretrizes e lista de verificação para localização de páginas (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Se o aplicativo tiver um controle de pesquisa na tela, ele deve abrir o Contrato do Windows Search. Diretrizes e lista de verificação para pesquisa
Contrato de Compartilhamento e botão Compartilhar
[ ]Se o compartilhamento for implementado, isso deve ser feito via botão Compartilhar. Diretrizes de compartilhamento de conteúdo
[ ]O aplicativo deve exibir a mensagem correta caso implemente o botão Compartilhar, mas não haja conteúdo compartilhável no contexto atual. Diretrizes de compartilhamento de conteúdo
Contrato de Configurações e botão Configurações
[ ]As configurações do aplicativo, incluindo a configuração, as opções e o gerenciamento de conta, devem ser implementadas com o uso do botão Configurações, não nas páginas do aplicativo nem em submenus personalizados. Diretrizes de configuração de aplicativos
[ ]As páginas Sobre, Política de Privacidade, Termos de Uso, Ajuda e Comentários devem ser implementadas por meio do botão Configurações. Diretrizes de configuração de aplicativos
[ ]O aplicativo deve usar controles de forma consistente no painel Configurações. Diretrizes de configuração de aplicativos
[ ]O painel Configurações deve ser fechado quando o usuário tocar no aplicativo. Diretrizes de configuração de aplicativos
[ ]O painel Configurações deve ter um botão de voltar. Diretrizes de configuração de aplicativos
[ ]O submenu Configurações deve caber na largura atual do aplicativo. Diretrizes para redimensionar em layouts estreitos
Seletor de arquivos
[ ]O aplicativo deve usar o seletor de arquivos para abrir, salvar ou acessar arquivos. Diretrizes de seletores de arquivos

Diretrizes e lista de verificação de contratos de seletor de arquivos
[ ]O aplicativo não deve usar o seletor de arquivos para explorar nem consumir conteúdo. Diretrizes de seletores de arquivos
Blocos
[ ]Se o aplicativo usar um bloco largo, ele deve ter conteúdo dinâmico para o bloco. Diretrizes e lista de verificação de blocos e notificações
[ ]As cores, fontes e ícones de blocos de aplicativos devem ser consistentes com aquelas do aplicativo. Diretrizes e lista de verificação de blocos e notificações
[ ]O ícone ou logotipo do aplicativo no bloco deve ter alta qualidade e não deve mostrar artefatos perceptíveis. Diretrizes e lista de verificação de blocos e notificações
[ ]O texto no bloco deve ser escrito corretamente. Diretrizes e lista de verificação de blocos e notificações
[ ]Um bloco secundário não deve vincular a conteúdo estático. Diretrizes e lista de verificação para blocos secundários
[ ]Um bloco secundário não deve ser um botão de comando que permite ao usuário interagir com o aplicativo. Diretrizes e lista de verificação para blocos secundários
[ ]Um bloco secundário deve navegar diretamente para o conteúdo relacionado. Ele não deve abrir a home page do aplicativo. Diretrizes e lista de verificação para blocos secundários
[ ]O aplicativo não deve usar blocos secundários para exibir anúncios. Diretrizes e lista de verificação para blocos secundários
Notificações do sistema
[ ]O aplicativo não deve usar notificações do sistema para mensagens de erro. Diretrizes e lista de verificação para notificações do sistema
[ ]As notificações do sistema devem ser acionáveis e navegar para o aplicativo quando o usuário tocar nelas. Diretrizes e lista de verificação para notificações do sistema
[ ]O aplicativo não deve usar notificações do sistema para anúncios. Diretrizes e lista de verificação para notificações do sistema
[ ]O aplicativo não deve usar notificações do sistema para pequenas alterações. Diretrizes e lista de verificação para notificações do sistema
Roaming
[ ]Os dados em roaming devem estar em roaming de forma consistente e precisa. Por exemplo, os dados não devem entrar em roaming em um dispositivo, mas não no outro. Diretrizes para dados de aplicativo em roaming
Gerenciamento da conta
[ ]Os recursos de gerenciamento de conta devem ser implementados via botão Configurações.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O usuário deve ser capaz de fazer logoff pelo botão Configurações. Diretrizes e lista de verificação de controles de logon
[ ]Um ponto de entrada para fazer logon pelo aplicativo deve abrir o botão Configurações. (Exceção: autenticação via Web) Diretrizes e lista de verificação de controles de logon
[ ]Se o aplicativo não exigir autenticação, ele não deve exibir controles de logon. Diretrizes e lista de verificação de controles de logon
[ ]Uma caixa de diálogo de autenticação via Web padrão deve ser usada onde apropriado. Agente de autenticação da Web

 

Recomendado

As diretrizes nesta seção melhoram a experiência do usuário do aplicativo.

VerificaçãoDescriçãoDiretrizes
Layout e alinhamento
[ ]O conteúdo deve ser alinhado à esquerda (alinhado à direita para idiomas da direita para a esquerda) em todas as páginas e em todos os modos de exibição do aplicativo. Diretrizes para tipografia
[ ]A página principal ou hub do aplicativo deve incluir variação visual. Padrões de navegação
Silhueta
[ ]As colunas devem ter, no mínimo, 560 pixels (28 unidades). Definindo o layout de uma página de aplicativo
[ ]Se o aplicativo usar a silhueta padrão, ele deve aderir às seguintes diretrizes:
  • O cabeçalho da página deve ter 100 pixels (5 unidades) desde o topo.
  • A margem esquerda do cabeçalho da página deve ter 120 pixels (6 unidades).
  • O cabeçalho da página deve ser do conjunto de estilos SegoeUI 20, leve.
  • A margem superior da região de conteúdo deve ter 140 pixels (7 unidades).
  • A margem esquerda da região de conteúdo deve ter 120 pixels (6 unidades).
  • Se o conteúdo tiver movimento panorâmico na horizontal, a margem inferior da região de conteúdo deve ter, no máximo, 130 pixels (6,5 unidades) e, no mínimo, 50 pixels (2,5 unidades).
  • Itens com bordas fixas, como imagens e blocos, têm 10 pixels (2 subunidades) de preenchimento horizontal entre o item e texto que o acompanha.
  • Itens com bordas fixas, como imagens e blocos, têm 10 pixels (2 subunidades) de preenchimento horizontal entre colunas.
  • As listas têm 40 pixels (2 unidades) de preenchimento horizontal entre colunas.
  • Itens com bordas fixas, como imagens e blocos, têm 10 pixels (2 subunidades) de preenchimento vertical em uma linha.
  • As listas de blocos e texto têm 20 pixels (1 unidade) de preenchimento vertical entre itens em uma linha.
  • Os grupos de itens têm 80 pixels (4 unidades) de preenchimento horizontal entre si.
Definindo o layout de uma página de aplicativo

Diretrizes para tipografia

Diretrizes para fontes

Movimento panorâmico e rolagem
[ ]Em uma página com movimento panorâmico na horizontal, o conteúdo deve rolar para a borda esquerda. O conteúdo não deve parar de rolar na margem esquerda.Diretrizes para comentários movimento panorâmico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Todas as áreas de uma página devem responder ao movimento panorâmico e à rolagem. Diretrizes de movimento panorâmico
Tipografia
[ ]A rampa de tipos do aplicativo deve ter, no máximo, cinco tamanhos de tipos. Diretrizes para tipografia
[ ]O aplicativo deve colocar em maiúscula a primeira letra de uma frase. Diretrizes para tipografia
Identidade visual
[ ]Se o aplicativo tiver uma tela inicial estendida, ela deve ser similar à tela inicial. Diretrizes e lista de verificação para telas iniciais
[ ]O aplicativo deve incluir ativos de tela inicial para dar suporte à escala de 1,4x (868x420 pixels) e 1,8x (1116x540 pixels). Diretrizes e lista de verificação para telas iniciais
[ ]Se tela inicial ficar visível por mais de 7 segundos, ela deve fornecer uma dica visual de que o usuário deve aguardar o carregamento do aplicativo. Diretrizes e lista de verificação para telas iniciais
[ ]O aplicativo deve ter um logotipo na página hub. Identidade visual
Barras de aplicativos
[ ]A barra de aplicativos não deve incluir os comandos Voltar e Avançar. Em vez disso, o aplicativo deve incluir um controle de virar a página na tela.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)

Adicionando controles FlipView (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo não deve ter uma barra de aplicativos vazia.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]As barras de aplicativos não devem duplicar ações que estão nos botões. Padrões de comando
Menus contextuais
[ ]Os menus de contexto devem ser colocados perto do objeto de destino Diretrizes e lista de verificação de menus contextuais
Classificando e filtrando
[ ]Os comandos de classificação e filtragem que sejam essenciais ao cenário do aplicativo devem ser posicionados na tela. Os comandos de classificação e filtragem não essenciais ao cenário do aplicativo devem ser posicionados na barra de aplicativos. Padrões de navegação
[ ]O aplicativo deve ter, no máximo, um botão de classificação e um botão de filtragem por barra de aplicativos.Diretrizes e lista de verificação para barras de aplicativos (JavaScript e HTML ou C#/VB/C++ e XAML)
Navegação
[ ]Se o aplicativo tiver mais de quatro níveis de hierarquia, ele deverá usar uma lista suspensa de cabeçalho ou a barra de navegação para navegar até seções diferentes. Padrões de navegação
[ ]Você deve implementar o botão de voltar como uma pilha Voltar, para que ele se comporte como um botão de histórico de navegador. Padrões de navegação
[ ]O botão Voltar não deve ser exibido em vídeo de tela inteira. Ele deve ser esmaecido ou posicionado na barra de navegação. Desempenho de áudio e vídeo

Otimizar recursos de mídia
Zoom semântico
[ ]Se a exibição atual contiver mais de cinco páginas de conteúdo, use o zoom semântico.Diretrizes para zoom semântico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]A exibição de zoom semântico deve incluir informações relevantes adicionais.Diretrizes para zoom semântico (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Quando o usuário reduz, o aplicativo deve ter uma margem esquerda padrão.Diretrizes para zoom semântico (JavaScript e HTML ou C#/VB/C++ e XAML)
Toque
[ ]As seleções por área de toque para ações em que a precisão é importante, como excluir ou fechar, devem ser de 9 mm ou maiores. Padrões de toque
[ ]Todas as seleções por área de toque devem ser de 7 mm ou mais. Padrões de toque
Teclado e mouse
[ ]O aplicativo deve dar suporte à navegação e à seleção com o uso do teclado.Diretrizes para interações do usuário comuns (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]Os contêineres de conteúdo no aplicativo, como listas e grades, devem ser compatíveis com a rolagem do mouse.Interações por mouse (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]O aplicativo deve dar suporte a comentários via passagem do mouse.Interações por mouse (JavaScript e HTML ou C#/VB/C++ e XAML)
Animações
[ ]As animações não devem inibir o progresso natural através do aplicativo. Usando animações em seu aplicativo (JavaScript e HTML ou C#/VB/C++ e XAML)
[ ]As animações não devem distrair o usuário.Usando animações em seu aplicativo (JavaScript e HTML ou C#/VB/C++ e XAML)
Tamanhos e orientações de ela
[ ]Os aplicativos que possuam um layout fixo devem ser centralizados em todos os tamanhos de tela e densidades de pixel. Diretrizes de dimensionamento em telas
[ ]As transições entre orientações devem ser fluidas. Elas não devem mostrar operações de redesenho. Diretrizes para redimensionamento
[ ]As transições durante o redimensionamento devem ser fluidas. Elas não devem mostrar operações de redesenho. Diretrizes para redimensionamento
Contrato do Windows Search e botão Pesquisar
[ ]Se o aplicativo tiver conteúdo pesquisável, ele deve implementar o Contrato do Windows Search. Diretrizes e lista de verificação para pesquisa
[ ]Se não forem retornados resultados da pesquisa, o aplicativo deverá fornecer uma mensagem significativa ao usuário. Diretrizes e lista de verificação para pesquisa
[ ]O aplicativo deve exibir critérios de pesquisa com os resultados da pesquisa. Diretrizes e lista de verificação para pesquisa
[ ]Se o aplicativo implementar o Contrato do Windows Search, ele deve habilitar a digitação para pesquisar. Diretrizes e lista de verificação para pesquisa
Contrato de Compartilhamento e botão Compartilhar
[ ]Um aplicativo com conteúdo compartilhável deve implementar o contrato de Compartilhamento de Fonte. Diretrizes de compartilhamento de conteúdo
[ ]Um aplicativo que permite a publicação, o armazenamento ou a criação de conteúdo deve implementar o contrato de Compartilhamento de Destino. Diretrizes de compartilhamento de conteúdo
Contrato de Configurações e botão Configurações
[ ]As alterações que o usuário faz no painel Configurações devem ser confirmadas imediatamente. Diretrizes de configuração de aplicativos
[ ]Qualquer controle desabilitado no painel Configurações deve ter uma mensagem descritiva que explique por que está desabilitado. Diretrizes de configuração de aplicativos
[ ]O submenu Configurações deve ser estreito (346 pixels) ou largo (646 pixels). Diretrizes de configuração de aplicativos
Seletor de arquivos
[ ]Se o aplicativo fornecer um local para salvamento, ele deve implementar o contrato do Seletor de Abertura de Arquivos. Diretrizes e lista de verificação de contratos de seletor de arquivos
Blocos
[ ]Se o aplicativo tiver conteúdo dinâmico, ele deve implementar um bloco dinâmico. Diretrizes e lista de verificação de blocos e notificações
[ ]O bloco não deve duplicar o nome nem o logotipo. Diretrizes e lista de verificação de blocos e notificações
[ ]Blocos secundários largos devem ter conteúdo dinâmico. Diretrizes e lista de verificação para blocos secundários
Notificações do sistema
[ ]Quando o aplicativo está visível na tela, as notificações do sistema não devem ser exibidas. Diretrizes e lista de verificação para notificações do sistema
[ ]As notificações do sistema não devem ter um ícone 'x' para fechar a notificação. Diretrizes e lista de verificação para notificações do sistema
Roaming
[ ]O aplicativo deve colocar em roaming dados adequados, como as configurações e preferências do aplicativo, o histórico de atividades, os favoritos e as listas definidas pelo usuário. Diretrizes para dados de aplicativo em roaming

 

Tópicos relacionados

Casos de teste de experiência do usuário para aplicativos da Windows Store

 

 

Mostrar:
© 2015 Microsoft