Share via


Aplicativos de produtividade

O Windows 8.1 é uma plataforma fantástica para aplicativos de produtividade. Além do ambiente de área de trabalho tradicional, que permite aos aplicativos de produtividade existentes funcionarem bem, o novo ambiente para aplicativos da Windows Store possibilita criar novos e modernos tipos de aplicativos de produtividade. A seguir, mostraremos várias maneiras de melhorar os aplicativos de produtividade quando eles tiram proveito do estilo de design da Microsoft e dos recursos do Windows 8.1.

Visão geral

O Windows 8.1 proporciona uma cobertura inigualável de dispositivos, desde tablets sensíveis ao toque e de entrada por caneta até laptops e computadores desktop de alta resolução. Para aplicativos de produtividade, isso significa uma oportunidade única de usar diferentes métodos de entrada para permitir que os usuários sejam produtivos em vários cenários e situações de uso.

A Windows Store também oferece oportunidades para você distribuir, promover e vender seus aplicativos. Cenários como compras e avaliações no aplicativo têm suporte com codificação mínima para que você possa começar a ganhar dinheiro rapidamente.  

Este tópico destaca os recursos do Windows 8.1 que são de particular importância para os aplicativos de produtividade, como:

  • Aplicativos da Windows Store: uma nova linguagem de design para aplicativos, enfatizando a criação de conteúdo em tela inteira e cenários de produtividade imersivos. O Windows sai de cena, permitindo que o conteúdo seja o destaque.
  • Blocos: maximize o envolvimento e mantenha os usuários voltando para o seu aplicativo com a criação de blocos que mostram o conteúdo recente em que o usuário estava trabalhando. Os blocos secundários também facilitam a vinculação profunda com o conteúdo e permitem que os usuários fixem conteúdo usado com frequência em seu aplicativo.
  • Contrato de Compartilhamento: o Windows 8.1 facilita o compartilhamento e a colaboração entre aplicativos, para que o seu aplicativo possa funcionar com outros, ajudando os usuários a realizar todas as tarefas de maneira produtiva.
  • Contrato de Pesquisa: a nova funcionalidade de nível superior do sistema operacional ajuda os usuários a localizar e organizar o conteúdo de maneira mais fácil do que nunca. Seu aplicativo é incluído nos resultados de pesquisa para aumentar o reconhecimento pelos usuários ao pesquisarem conteúdo.
  • Caixa de pesquisa: permita que as pessoas pesquisem o conteúdo do aplicativo dentro do próprio aplicativo e forneça uma exibição personalizada dos resultados.
  • Seletor de arquivos: o seletor de arquivos facilita para os usuários do seu aplicativo de produtividade o uso de arquivos, documentos e fotos do sistema de arquivos e também de outros aplicativos e serviços que participam dos contratos do seletor de arquivos.
  • Zoom semântico: este recurso nativo do Windows 8.1 permite que os usuários pincem e reduzam o detalhe de um aplicativo e tenham uma vista panorâmica do conteúdo em que estão trabalhando. Experimente usá-lo na tela inicial para vê-lo em ação.
  • Janelas redimensionáveis: os usuários podem redimensionar os aplicativos para executar vários aplicativos simultaneamente lado a lado. Os usuários podem realmente realizar várias tarefas e continuar produtivos com o seu aplicativo aberto o tempo todo.

Tela Inteira

Uma das vantagens mais evidentes dos aplicativos da Windows Store para produtividade é que eles não ficam competindo por espaço com outros aplicativos ou com a interface do usuário do Windows. Um aplicativo usa cada pixel único visível na tela para apresentar o conteúdo. Toda parte da interface do usuário não essencial ou dispersora pode ficar oculta e ser revelada com um simples gesto, significando que o aplicativo sempre tem amplo espaço para exibir as informações mais importantes para a tarefa em questão. A filosofia de design no estilo “conteúdo antes do cromado”, que é tão revigorante e agradável em um aplicativo de revista ou de vídeo, também se aplica aos aplicativos de produtividade. Quando as dispersões são eliminadas, fica fácil se concentrar em trabalhar com o conteúdo que o aplicativo apresenta.

Ao criar um aplicativo de produtividade, primeiro identifique a tarefa principal do usuário. Use cada pixel da tela para deixar seu aplicativo excelente em realizar essa tarefa. Pense em como a disponibilidade de espaço pode deixar essa tarefa mais fácil, mais rápida ou mais agradável. Pense em visualizações sofisticadas de informações interessantes e práticas, e não em representações estáticas de dados. Pense em como o aplicativo pode usar o espaço e posicionamento para transmitir mensagens. Muitas das convenções e dos controles em uso hoje foram desenvolvidos quando os monitores dos computadores desktop tinham resolução menor do que os atuais smartphones. Os aplicativos da Windows Store oferecem a chance de redefinir como os usuários interagem, analisam e manipulam as informações para realizar o trabalho.

Os aplicativos de produtividade normalmente envolvem uma combinação interessante de cenários de criação e de consumo de conteúdo. Por exemplo, os aplicativos de produtividade podem ser usados para criar e ler documentos, ou para criar e gerenciar listas de tarefas pendentes. Os aplicativos de produtividade também variam bastante em termos de complexidade na maneira como tratam a navegação e a exposição de comandos e experiências — de aplicativos de tarefas pendentes simples e leves a aplicativos de criação de conteúdo altamente complexos, com menus em camadas contendo inúmeras opções. Um excelente aplicativo de produtividade do Windows 8.1 permite a navegação entre essas experiências de maneira rápida, fluida e agradável.

Layout e navegação em aplicativos de produtividade

O padrão de navegação que você escolher será informado pelos tipos de cenários que têm suporte no seu aplicativo. Se você tiver ricas experiências em seu aplicativo (apresentação de vários documentos, por exemplo), com organização e estrutura entre elas, um padrão hierárquico poderá ajudar a trazer todo o conteúdo para o nível superior em vez de escondê-lo por atrás dos menus ou guias. Entretanto, se o aplicativo não tiver muita densidade de informação ou cenários que precisem de hierarquia e estrutura, avalie a adoção de um padrão simples que permita ao usuário navegar rapidamente entre as experiências em seu aplicativo. Os aplicativos com modos de exibição "mestre/detalhes" (por exemplo, aplicativos de email e mensagens) podem usar um modo de exibição de lista para demonstrar melhor o conteúdo. Para alguns aplicativos de produtividade, determinados cenários podem exigir diferentes tipos de entrada de dados, como formulários, e estes podem usar o layout de formulário sugerido mais adiante neste artigo. Escolha o padrão mais adequado para que os usuários localizem de maneira rápida e confiável o conteúdo desejado.

Para saber mais sobre padrões de navegação para o seu aplicativo, veja Padrões de navegação.

Acesse o Padrão de navegador simples atualmente em uso na seção Características para Aplicativos, da série do início ao fim.

Padrão hierárquico

Os aplicativos de produtividade que têm uma estrutura hierárquica e um extenso conjunto de dados, como um aplicativo de anotações com inúmeros blocos e anotações, podem usar um padrão hierárquico que apresenta todo o conteúdo do usuário no nível superior. Esse modelo agrada aos usuários colocando todo o conteúdo disposto bem na frente.

A página de hub do seu aplicativo

Sua página de hub consiste em várias seções, sendo que cada uma mapeia para as diferentes seções em seu aplicativo. Cada seção pode expor conteúdo ou funcionalidade. O hub deve oferecer ampla variedade visual para envolver os usuários e atraí-los para diferentes partes do aplicativo. Por exemplo, o aplicativo de anotações a seguir mostra algumas das mais recentes anotações para cada bloco de anotações exatamente no nível superior. A imagem a seguir mostra um exemplo de página de hub.

Um exemplo de página de hub

Tocar em cada uma das anotações leva o usuário diretamente para essa anotação. Tocar no cabeçalho ("Travel - NYC", por exemplo) mostra a página de seção referente a esse bloco de anotações, se houver mais conteúdo associado ao bloco de anotações do que o exibido na home page.

Avalie permitir que os usuários escolham a maneira de classificar o conteúdo. Por exemplo, eles podem optar por classificá-lo em ordem alfabética, por data, por tipo de conteúdo ou pelo status de compartilhado ou não. As maneiras certas de classificação dependem do conteúdo que seu aplicativo apresenta e do padrão de uso típico do usuário. A imagem a seguir mostra um exemplo de classificação de anotações.

Um exemplo de aplicativo com classificação de anotações

Barra de aplicativos superior

Você pode usar a barra de aplicativos superior para permitir que os usuários saltem lateralmente entre as seções do seu aplicativo de forma rápida. Por exemplo, um usuário que está lendo uma anotação de um bloco de anotações pode se mover de maneira fácil e rápida para uma anotação em um bloco de anotações diferente usando a barra superior do aplicativo. A imagem a seguir mostra uma barra de aplicativos superior que aparece em um aplicativo de anotações quando o usuário passa o dedo da borda superior ou inferior.

Um aplicativo de bloco de anotações com cabeçalho suspenso¾

Zoom semântico

O zoom semântico permite que os usuários naveguem rapidamente em uma única exibição mostrando visualmente o conteúdo com "mais zoom" ou "menos zoom". Por exemplo, em um aplicativo de anotações, os usuários podem pinçar e fazer movimento panorâmico rapidamente para se mover de um bloco de anotações para outro. Como alternativa, se os usuários optarem por exibir suas anotações por data, poderão se mover rapidamente das mais recentes para as mais antigas.

Esta imagem mostra o agrupamento de conteúdo com menos zoom.

Conteúdo agrupado por título no zoom semântico.

Você também pode usar o zoom semântico na página de uma seção específica para navegar pelo conteúdo dessa seção ou categoria. Por exemplo, no aplicativo de anotações, os usuários podem usar o zoom semântico para saltar rapidamente entre anotações diferentes no mesmo bloco de anotações.

Para saber mais sobre o zoom semântico, veja Diretrizes para zoom semântico.

Padrão de layout simples

Se o seu aplicativo tem a maior parte do conteúdo no mesmo nível, com pouca hierarquia, pense em usar um sistema de navegação simples. Esse padrão permite que os usuários se movam entre documentos, páginas, guias ou modos que residem no mesmo nível hierárquico de maneira rápida e fluida. Você pode saber mais sobre o padrão simples lendo Design de navegação para aplicativos da Windows Store.

Além disso, se seu aplicativo tiver cenários que se beneficiam de uma interface de vários documentos, será ótimo usar o padrão simples. A barra de aplicativos superior é ótima para alternar entre vários contextos. Por exemplo, em um aplicativo de criação de planilhas, o padrão simples pode oferecer rápida troca entre as diferentes planilhas com que um usuário está trabalhando.

Alguns aplicativos podem incluir outras funcionalidades na barra de aplicativos superior, como adicionar um botão de mais ("+") para criar uma nova planilha exatamente na barra de aplicativos superior. Um exemplo disso é visto no navegador (um aplicativo da Windows Store) mostrado aqui.

O navegador com funcionalidade de navegação adicional.

Padrão de layout de lista

Se seu aplicativo de produtividade tiver cenários que envolvem a noção de um modo de exibição "mestre/detalhes", em que a seleção de um item determina o que é exibido em um painel de detalhes, avalie o uso de um layout de lista para o painel mestre. Por exemplo, um aplicativo de gerenciamento de projetos poderia mostrar os marcos e prazos em um painel mestre e, após a seleção de um item nesse painel, exibir detalhes relevantes na seção de detalhes. Um aplicativo de email pode colocar a caixa de entrada à esquerda e o painel de leitura no lado direito da tela, conforme mostrado aqui.

Um aplicativo de email com layout de lista

Padrões de layout de formulário

Os cenários nos aplicativos de produtividade geralmente exigem um layout de formulário, em que os usuários precisam inserir informações específicas. Por exemplo, ao criar um convite de reunião em um aplicativo de calendário, os usuários precisam inserir o local, a hora inicial, a hora final, a data, os participantes e outras informações semelhantes. Esse tipo de layout normalmente usa uma combinação de diferentes tipos de controle e trabalha melhor com um design baseado em colunas.

Ao decidir qual layout usar, avalie o fluxo da tarefa que você quer que o usuário realize e em que local a rolagem será necessária nesse fluxo. A rolagem aumentará consideravelmente quando o teclado sensível ao toque estiver visível, porque o teclado consome cerca de 50% do espaço de tela disponível em orientação de paisagem. Quando aparecem notificações de erro embutidas, elas também aumentam a extensão do conteúdo e a necessidade de rolagem.

Em vez de tentar ajustar todos os controles em um único formulário bem extenso, avalie a divisão da tarefa em uma sequência de vários formulários.

Um layout de uma única coluna pode funcionar para formulários curtos ou longos de rolagem vertical. No seguinte exemplo de layout de uma única coluna, a ordem de leitura e das guias é de cima para baixo e da esquerda para a direita.

Um exemplo de layout de formulário

Um layout de formulário de duas colunas faz melhor uso do espaço horizontal visível em orientação paisagem. Para minimizar a necessidade de rolagem do usuário, faça com que a ordem de leitura e das guias seja da esquerda para a direita e então de cima para baixo.

A seguinte imagem demonstra um layout de duas colunas.

A maneira correta de distribuir o conteúdo em um layout de duas colunas.

Não use uma ordem de leitura e de guias de cima para baixo e da esquerda para a direita para um longo layout de duas colunas com rolagem. Isso é muito complicado porque o usuário precisa rolar até o final da primeira coluna e rolar de volta para o início da segunda coluna e ainda rolar para baixo outra vez para preencher o formulário inteiro. Além disso, um layout de duas colunas não funciona bem em orientação retrato porque ele força as colunas a ficarem muito estreitas.

Os exemplos a seguir mostram o que evitar em um longo layout de duas colunas com rolagem.

A maneira incorreta de distribuir o conteúdo em um layout de duas colunas.

Os aplicativos de produtividade geralmente envolvem multitarefa, com usuários que alternam entre diferentes tipos de conteúdo em seu aplicativo. Por exemplo, um usuário pode alternar entre vários documentos, como trabalhos de pesquisa e conjuntos de lições de casa ao executar uma tarefa. Permitir que os usuários acessem rapidamente todo esse conteúdo de maneira rápida e fluida maximiza sua produtividade no aplicativo. Considere a possibilidade de usar a barra de aplicativos superior descrita em Design de navegação para aplicativos da Windows Store para os documentos usados mais recentemente, os abertos atualmente e qualquer tipo de conteúdo no aplicativo que seja relevante para o conjunto de trabalho atual do usuário. Pense também no suporte a várias janelas para que os usuários possam realizar várias tarefas em partes diferentes do aplicativo. Para saber mais, veja Diretrizes para várias janelas.

Comandos

Os aplicativos de produtividade tendem a ter muito mais comandos do que outros tipos de aplicativos. Isso levanta questões interessantes sobre a melhor maneira de apresentar os comandos, de forma que seja fácil descobri-los, mas que o conteúdo do usuário ainda tenha prioridade. Os usuários devem conseguir trabalhar nos principais cenários do seu aplicativo — aqueles cenários que promovem a opinião de que seu aplicativo “é ótimo para” alguma coisa — simplesmente usando a tela do aplicativo. Sempre que possível, permita que os usuários manipulem diretamente o conteúdo na tela, em vez de adicionar comandos que atuem sobre o conteúdo. Por exemplo, quando os usuários leem um documento, permita que eles pincem e ampliem diretamente na tela para aumentar ou reduzir o tamanho da fonte de visualização, em vez de inserir um controle para fazer isso. Para saber mais sobre comandos, consulte Padrões de comando.

Alguns comandos e botões são tão inerentes ao seu aplicativo que seria ridículo eles não aparecerem sempre na tela. O botão Reproduzir em um aplicativo de vídeo pausado, por exemplo, provavelmente nunca ficaria oculto. No entanto, a maioria dos comandos não precisa estar o tempo todo na tela. Para ajudar os usuários a se concentrar em ser produtivos com o conteúdo, muitos comandos dispersores podem ser removidos da tela e trazidos de volta somente quando necessário, usando um gesto simples e comum.

A barra de aplicativos inferior é a barra de ferramentas comum que pode aparecer na borda inferior do seu aplicativo. Normalmente ela fica fora da tela e não atrapalha, mas pode ser revelada passando o dedo de cima para baixo, clicando com o botão direito do mouse ou pressionando a tecla do logotipo do Windows+Z em um teclado. Além disso, a barra de aplicativos inferior aparece automaticamente sempre que uma seleção é feita no conteúdo de um aplicativo. As ferramentas apresentadas na barra de aplicativos inferior são contextuais, por isso só os comandos relevantes são mostrados por vez. Por exemplo, quando uma palavra é selecionada, a barra de aplicativos inferior aparece automaticamente com comandos de formatação de texto. Se uma imagem for selecionada, a barra de aplicativos inferior mostrará comandos de edição de imagens. A natureza contextual da barra de aplicativos significa que comandos irrelevantes não concorram pela sua atenção. O resultado é que as ferramentas desejadas estão sempre próximas, mas sem atrapalhar até serem necessárias.

A barra de aplicativos superior também aparece quando você invoca manualmente a barra de aplicativos. Ela permite ao usuário saltar para vários locais dentro de um aplicativo. Por exemplo, um navegador pode usar essa barra para exibir miniaturas das guias abertas no momento. Um aplicativo processador de texto pode usar essa barra para saltar entre vários documentos abertos. Um aplicativo de compras pode usar esse espaço para saltar entre diferentes departamentos da loja.

Tanto a barra de aplicativos superior quanto a inferior podem conter botões e menus. Se você tiver muitos comandos relacionados, sendo todos eles relevantes ao contexto simultaneamente, fará sentido colocá-los em um menu aberto na barra.

Barra de aplicativos inferior

É importante organizar e apresentar comandos de maneira uniforme e ordenada para que os usuários não fiquem sobrecarregados pelo número excessivo de comandos. Por exemplo, em um aplicativo de anotações, os usuários podem criar novas anotações ou blocos de anotações, classificar em ordem alfabética ou de data, mudar as opções de formatação do texto das anotações, inserir anotações de áudio, especificar local e adicionar marcas e imagens. A barra de aplicativos ajuda a colocar todos os comandos do aplicativo em uma superfície uniforme previsível para os usuários, para que possam confiar na localização de todos os comandos em um único espaço.

Para o seu aplicativo, faça um inventário de todos os comandos do aplicativo e pense em cenários de uso. Um jeito de reduzir os comandos da barra de aplicativos é organizá-los em duas categorias: comandos globais no aplicativo e comandos úteis somente quando são selecionados. Para esses últimos, não mostre sempre comandos contextuais na barra de aplicativos; mostre-os só quando o usuário tiver escolhido um recurso ou só no contexto do aplicativo em que forem relevantes.

Coloque comandos globais que aparecem em qualquer local no aplicativo, como operações de sincronização e criação, à direita na barra de aplicativos. Especificamente, coloque o comando Novo—aquele que cria conteúdo novo como uma nova anotação ou bloco de anotações— na borda direita da barra. Isso permite a cada comando Novo, independentemente do aplicativo ou contexto específico, um posicionamento uniforme e fácil acesso ao tocar com os polegares.

Use os comandos Excluir e Novo se seu aplicativo servir para gerenciar entidades individuais que possam persistir fora de seu aplicativo específico—, como um aplicativo de email. Excluir e Novo sempre devem aparecer na ordem mostrada aqui.

botões Excluir e Adicionar; Excluir à esquerda, Novo à direita

Use os comandos Remover e Adicionar se seu aplicativo servir para gerenciar uma lista, como uma lista de tarefas pendentes. Remover e Adicionar sempre devem aparecer na ordem mostrada aqui.

botões Remover e Adicionar; Remover à esquerda, Adicionar à direita

Existem outros comandos que afetam as seleções. Eles sempre devem aparecer na extrema esquerda, sejam comandos contextuais que aparecem ao ser selecionados ou comandos que afetam uma seleção existente, como as opções de formatação, "Selecionar tudo" e "Limpar seleção".

Avalie quais comandos são funcionalmente relacionados e devem ser colocados próximos entre si. Verifique se você colocou os comandos de maneira uniforme sempre que possível. Além disso, crie conjuntos de comandos para gerenciar o número de comandos que aparecem na barra de aplicativos e, sempre que possível, avalie a criação de menus de comando para conjuntos de comandos. Por exemplo, em um aplicativo de anotações, a organização das anotações em ordem alfabética ou por data poderia ser feita por um único comando usando um menu de comando. Os menus de comando ajudam a organizar e reduzir bastante o número de comandos na barra de aplicativos, como mostrado aqui. Na primeira imagem, cada comando Novo é um comando separado na barra de aplicativos. Na segunda imagem, todos os comandos Novo são agrupados em um menu no único comando Novo.

Um exemplo em que os comandos aparecem na barra de comandos.

Comandos com submenu na barra de aplicativos

Verifique se as configurações são exibidas no contrato de Configurações e não na barra de aplicativos. Isso permite que os usuários configurem seu aplicativo por mecanismos comuns com os quais já têm familiaridade.

Estendendo a barras de aplicativos

Ambas as barra de aplicativos podem conter botões e menus. Se você tiver muitos comandos relacionados, sendo todos eles relevantes ao contexto simultaneamente, fará sentido colocá-los em um menu aberto na barra. As barras de aplicativos não estão limitadas a botões e menus — ambas permitem criar seus próprios controles exclusivos. Ao fazer isso, pense em como os usuários de toque, mouse e teclado podem interagir melhor com os novos controles que você criar.

Aplicativos com grande quantidade de comandos podem exigir a extensão da barra de aplicativos de várias maneiras. Para manter ao máximo a uniformidade com as funcionalidades do sistema, tente seguir estas diretrizes:

  • Mantenha o usuário concentrado no conteúdo—Suponha que a maioria das interações começa com a manipulação direta da tela. Espera-se que a maioria dos comandos (se não todos) normalmente estejam localizados fora da tela sem nenhuma indicação para que sejam exibidos. Confie nos gestos amplos do sistema para mostrar e ocultar a barra de aplicativos para mostrar e ocultar sua interface do usuário. A inclusão de sua própria interface do usuário alternada e oculta com diferentes métodos de invocação o leva a colocar mais botões, widgets e setas na tela para tentar treinar o usuário. Depender dos gestos do sistema ajuda a evitar a inclusão de dispersões de tela que desviam a atenção do usuário do conteúdo.
  • Mantenha os comandos na barra de aplicativos inferior nos aplicativos da —Windows Store, a localização natural e esperada dos comandos é na borda inferior do aplicativo (ou acima do teclado virtual). Essa localização permite que os usuários de toque interajam com os comandos sem impedir a visualização do conteúdo. Essa localização também está relacionada ao gesto de tocar usado para mostrar os comandos manualmente. Fazer com que os comandos apareçam em algum outro local é menos previsível e interfere possivelmente no conteúdo que o usuário está tentando exibir ou com que quer interagir.
  • Mantenha os controles de navegação na barra de aplicativos superior —Em aplicativos da Windows Store, a localização natural e esperada para a navegação é na borda superior da tela. Como essa barra serve para saltar do conteúdo que o usuário está exibindo no momento, não haverá problema se a mão do usuário atrapalhar a visualização da tela enquanto usa a barra. A barra de aplicativos superior exibe miniaturas, em vez de botões, para ajudar a distingui-la da barra de aplicativos inferior.
  • Mantenha todos os comandos ocultos na barra de aplicativos— Todos os comandos ocultos fora da tela devem ficar ocultos no mesmo local. Os gestos do sistema oferecem uma maneira simples e padronizada de trazer os comandos ocultos para a tela. Se os comandos estiverem ocultos em vários locais, você precisará de vários métodos para invocar essas superfícies ocultas. Isso rapidamente cria excessivo número de locais que o usuário precisa verificar para encontrar seus comandos. E o que é pior, cada superfície pode estar oculta atrás de um gesto secreto diferente ou de outro truque de interface e os usuários perderão muito tempo para saber se já os descobriram.

Comandos de área de transferência como Recortar, Copiar e Colar para o texto selecionado, e comandos para copiar e abrir links para URLs, podem usar menus contextuais, que são fornecidos por padrão pelo sistema. A seguir estão exemplos de comandos de área de transferência em um menu contextual.

Os comandos de área de transferência em um menu contextual.

Entrada de dados em aplicativos de produtividade

Os aplicativos de produtividade podem envolver inúmeros cenários de entrada de dados. Por exemplo, criar uma lista de tarefas pendentes ou outro novo documento, editar uma planilha existente ou criar um convite de calendário exigem a entrada de dados pelo usuário. Tornar a entrada de dados mais rápida e fluida possível ajuda os usuários a realizar o trabalho com mais velocidade e eficiência.

Pense nos cenários e, sempre que possível, reduza a quantidade de texto que os usuários precisam inserir no sistema. Estratégias para fazer isso:

  • Controles comuns— Para entradas com bastante formatação ou que precisam ser validadas (como datas, horários ou locais), use controles comuns, como o controle de seleção, as caixas de lista suspensa, os botões de opção e os seletores de data e hora.
  • Preenchimento Automático—Use Preenchimento Automático sempre que possível para oferecer uma facilidade instantânea aos usuários. Esse recurso aumenta a eficiência dos usuários na entrada de dados.

A imagem a seguir ilustra sugestões para um seletor de contatos.

As sugestões em um seletor de endereços de email.

Teclado virtual

Crie seu aplicativo para funcionar bem com teclados seguindo as diretrizes em Respondendo à entrada de dados pelo teclado. Crie seu aplicativo para funcionar bem com o teclado virtual seguindo estas diretrizes:

  • Coloque os controles de entrada de texto voltados para a parte superior da tela do aplicativo, se possível, para que o contexto ou a região visível ao usuário não mude quando o teclado virtual aparecer.
  • Se a entrada de texto for extensa de modo a impedir que seja colocada na parte superior da tela, quando o usuário tocar ou tabular no controle de entrada de texto, o aplicativo será rolado automaticamente para cima, no local onde o controle aparece, assim o usuário poderá ver o texto enquanto o digita. A janela deve rolar para que haja pelo menos 30 pixels entre o controle em foco, e a borda da tela e a parte superior do teclado virtual, para deixar espaço para vários gestos de borda, elementos de interface do usuário e a garra de seleção de texto. Para ler mais sobre seleção de texto, leia Diretrizes para selecionar texto e imagens.
  • Não mantenha o teclado simplesmente para mantê-lo na tela. Se não for esperada entrada de texto, dispense o teclado configurando o campo de entrada como somente leitura ou movendo o foco.

A seguir está uma visualização do teclado virtual.

O teclado virtual em um aplicativo

Se seu aplicativo tiver uma tela semelhante a um formulário em que normalmente há uma combinação de controles de edição (caixas de texto) e outros controles (como botões de opções e caixas de seleção), seria uma péssima experiência para o usuário ter o teclado virtual alternadamente ligando e desligando. O Windows 8 trata desse problema impedindo que o teclado virtual seja dispensado quando um usuário está em um formulário e navegando entre determinados controles comuns como botões de opções, caixas de texto, controles de seleção e a barra de aplicativos. O uso de controles padrão oferece aos seu aplicativo uma experiência tranquila gratuitamente. A seguir está uma ilustração de como o teclado virtual persiste enquanto o usuário se move de um controle para outro.

Um formulário com controles padrão.

Verificação ortográfica

Habilite a verificação ortográfica para o seu aplicativo. Ela ajuda os usuários a digitar texto com rapidez e confiança. (A verificação ortográfica pode ser habilitada pelo controle RichEdit). Quando o usuário digita uma palavra não encontrada no dicionário e pressiona a barra de espaço, uma sublinha vermelha ondulada aparece abaixo da palavra com erro ortográfico. Tocar na palavra com erro ortográfico invoca o menu de verificação ortográfica em que o usuário pode corrigir o erro ortográfico ou apenas ignorá-lo, como mostrado aqui.

Exemplo de experiência em verificação ortográfica

Reconhecimento de tinta e manuscrito

Como muitas vezes os usuários tendem a usar vários modos de entrada de texto em aplicativos de produtividade, considere o suporte a formas alternativas de inserir texto, como uma caneta. Permitir que os usuários escrevam o texto "à tinta" e rabisquem suas anotações e documentos no aplicativo lhes dá prazer e permite que insiram o texto de maneira rápida e natural com uma caneta. Veja Diretrizes de interações comuns do usuário para saber mais sobre os diversos métodos de entrada.

Seleção de texto

Em muitos cenários de produtividade, incluindo criação e consumo de documentos, os usuários precisam selecionar texto. Habilite a seleção para texto digitado por usuários para que eles possam editá-lo. Texto que vem de outros usuários inclui texto do corpo de emails ou outros tipos de texto que provavelmente serão copiados. A seguir está uma visualização da experiência em seleção de texto.

Exemplo de seleção de texto que mostra uma palavra selecionada entre duas regiões do seletor

Ao habilitar a seleção de texto, deixe uma margem de metade da largura da garra (4 milimetros) nas laterais do texto e uma altura da garra (8 milimetros) na parte inferior da área se o texto não for rolável. Isso garante que as garras poderão ser tocadas em todos os casos e não causarão interferência na experiência do usuário na borda da tela. A imagem a seguir mostra as margens corretas que serão preservadas ao habilitar a seleção de texto.

Exemplo de tamanhos de margem para seleção de texto de toque

Tipografia em aplicativos de produtividade

O uso da rampa de tamanhos e da grade de tipografia em aplicativos de produtividade cria uma hierarquia visual que permite aos usuários examinar e consumir muitas informações de maneira rápida e fácil. Apesar de o uso da fonte Segoe UI especificado na rampa de tipos ser apropriado para conteúdo em aplicativos de produtividade, convém avaliar o uso da Calibri, que é a fonte recomendada para “documentos modernos”, ou da Cambria, que é a fonte recomendada para “documentos tradicionais”. A Calibri é a fonte sem serifas padrão no Microsoft Office, enquanto a Cambria é a fonte com serifas padrão; portanto, ambas as fontes têm uma forte associação com aplicativos de produtividade. Para saber mais sobre tipografia, veja Diretrizes para fontes.

Se você decidir especificar fontes de sistema alternados, confirme se elas estão instaladas com o Windows 8 e não exigem a instalação de um aplicativo separado como o Microsoft Office. Se você usar suas próprias fontes personalizadas ou licenciadas, verifique se você tem direitos legais suficientes para incluí-las em seu aplicativo. Independentemente das fontes escolhidas, a tabela de tipos do Windows 8 oferece ótimas diretrizes sobre o número máximo de tamanhos e estilos que você deve usar.

A  personalidade de interface do usuário do Windows 8 exige o uso de capitalização ao estilo de frase em títulos, e esta é recomendável para aplicativos de produtividade. Entretanto, a capitalização de títulos também pode ser apropriada em alguns casos. O uso de texto totalmente em minúsculas pode parecer excessivamente informal em um aplicativo de produtividade, e texto totalmente em maiúsculas pode despercebidamente remeter às pessoas mensagens de email em tom irritado. Tenha ciência de que esses últimos tratamentos de tipografia não serão transferidos para muitos idiomas localizados. Além disso, verifique se usou os estilos de capitalização de maneira uniforme; use-os para diferenciar entre diferentes partes de conteúdo, e não apenas para aumentar o interesse visual da tipografia de seu aplicativo.

O uso de um pequeno conjunto de tamanhos de fontes em todo o aplicativo, como recomendado na diretriz da tabela de tipos, cria uma sensação de estrutura e ritmo no conteúdo. Se vários elementos em seu aplicativo usarem o mesmo tamanho de fonte da tabela de tipos e ainda assim transmitirem diferentes tipos de informações, avalie o uso de cores e espessura de fonte para estabelecer uma hierarquia das informações.

Contratos

Os contratos são os elementos que unem os aplicativos da Windows Store e estes à interface do usuário do sistema. Dois aplicativos com o mesmo contrato implementado podem trabalhar em conjunto para concluir um cenário amplo ou complexo. Para obter uma lista completa de contratos de aplicativo, veja Contratos e extensões de aplicativo.

Compartilhamento

Compartilhar conteúdo é um componente crucial dos atuais aplicativos de produtividade e há muitos cenários atraentes para compartilhar entre os aplicativos de produtividade. Se você quer permitir que os seus usuários compartilhem conteúdo do aplicativo, o aplicativo deve ser uma origem de Compartilhamento. Se você quer permitir que o seu aplicativo consuma dados de outros aplicativos, o aplicativo deve ser um destino de Compartilhamento.

Compartilhando a partir do seu aplicativo

Como a produtividade normalmente está relacionada à criação de conteúdo, os usuários geralmente compartilham conteúdo com outras pessoas. O Windows 8.1 proporciona uma experiência tranquila para compartilhamento entre aplicativos. À medida que o usuário obtém mais aplicativos, essa interoperabilidade aumenta o alcance do conteúdo do seu aplicativo para uma ampla variedade de possibilidades.

Por exemplo, talvez os usuários queiram compartilhar listas de tarefas pendentes e listas de supermercado com seu familiares usando um aplicativo de contatos, compartilhar documentos com colegas de trabalho usando um aplicativo de colaboração ou compartilhar suas criações em blogs usando um aplicativo de blog, para citar apenas alguns cenários de compartilhamento. Estes instantâneos mostram maneiras de compartilhar em aplicativos de produtividade.

Compartilhando em um aplicativo de produtividade

Compartilhando em um aplicativo de produtividade via email

Ser uma origem de Compartilhamento significa tornar o conteúdo do seu aplicativo, seja no formato de URIs, bitmaps, HTML, texto, itens de armazenamento ou tipos de dados personalizados, disponível para outros aplicativos capazes de consumir esses formatos. Como um aplicativo de origem, é importante que haja suporte para o maior número possível de tipos de dados que são significativos para o conteúdo que você gostaria que os seus usuários compartilhassem. Isso torna possível para os usuários compartilharem o conteúdo do seu aplicativo com um amplo conjunto de aplicativos de destino de Compartilhamento.

Ao dar suporte para o contrato de origem de Compartilhamento, você também permite que o seu aplicativo compartilhe diretamente com dispositivos nas proximidades habilitados pelo recurso Tocar e Enviar.

Compartilhando com o seu aplicativo

Os aplicativos de produtividade também servem como ótimo destino para compartilhar conteúdo de outros aplicativos porque a criação de conteúdo normalmente começa com o consumo de conteúdo. Se o seu aplicativo for um destino de compartilhamento, os usuários poderão importar conteúdo para ele de maneira tranquila, sem precisarem mudar de contexto e deixar a atividade com a qual estão envolvidos. Há muitos cenários atraentes para usar aplicativos de produtividade como destinos de compartilhamento. Por exemplo, URLs de compartilhamento, trechos de texto, fotos do navegador e o conteúdo de um livro poderiam ter como destino um aplicativo de criação de documentos como fontes de referência para lições de casa. Outro exemplo é que os usuários podem compartilhar cupons de um aplicativo de cupons de desconto com a lista de supermercado em seu aplicativo de tarefas pendentes. Estes instantâneos mostram exemplos de um aplicativo como destino de compartilhamento. Você também pode imaginar maior interoperabilidade entre um pacote de aplicativos de produtividade que dependem do compartilhamento de dados entre si usando o contrato de Compartilhamento.

Compartilhando uma página da Web como uma anotação com um aplicativo de anotações.

Compartilhando uma página da Web como uma anotação com um aplicativo de anotações

Pesquisa

A pesquisa é um importante cenário para aplicativos de produtividade, e seu aplicativo pode precisar exibir muitos dados como resultados de pesquisa. Você pode usar o controle de caixa de pesquisa do Windows 8.1 para fornecer a interface do usuário de pesquisa na tela. A caixa de pesquisa integra-se com o contrato de Pesquisa para incrementar a experiência e permitir uma personalização profunda, de modo que seu aplicativo ofereça experiências adaptadas às necessidades do usuário.

Ao criar a experiência de pesquisa do aplicativo, lembre-se destes fatores:

  • Forneça sugestões de consulta para ajudar os usuários a completar automaticamente suas consultas e agilizar a pesquisa sem necessariamente digitar toda a cadeia de caracteres de pesquisa.
  • Forneça filtros de pesquisa para o modo de exibição de resultados.
  • Mostre a consulta de pesquisa no modo de exibição de resultados.
  • Mostre o número total de resultados encontrados.
  • Mantenha o estado do aplicativo para que os usuários tenham uma maneira de voltar para as ações anteriores à pesquisa.
  • Indique o motivo pelo qual um resultado correspondeu à pesquisa.
  • Considere a possibilidade de mostrar sugestões de resultados para ajudar os usuários a chegar rapidamente ao resultado mais relevante. A seleção de uma sugestão de resultado deve levar os usuários aos detalhes do resultado. Limite o número de sugestões a cinco; uma lista resumida é mais fácil para os usuários analisarem.

Para saber mais sobre o novo controle de caixa de pesquisa, veja Atualizações na pesquisa.

Este instantâneo mostra o uso da pesquisa em um aplicativo de anotações.

Pesquisa em um aplicativo de anotações.

Localizar na página

Além da pesquisa, " Localizar na página" é um cenário comum nos aplicativos de produtividade. Por exemplo, avalie a localização de todas as instâncias de uma palavra em um documento específico. Não use o símbolo do evento de Pesquisa para implementar a funcionalidade de localização na página para seu aplicativo; implemente-o na barra de comandos do próprio aplicativo e não no painel de pesquisa. O recurso de localização na página ajuda o usuário a localizar todas as instâncias no modo de exibição atual. Destaque os resultados da localização no documento e mostre os botões "avançar" e "voltar" na barra de aplicativos para permitir que o usuário salte entre diferentes instâncias da palavra ou frase localizada. Em aplicativos de produtividade, a localização em geral é usada principalmente para complementar a experiência de substituição. A localização sempre tem o escopo no modo de exibição atual, como mostrado aqui.

Uma experiência em localização na página.

Configurações

Todas as configurações cabíveis para aplicativos de produtividade (como configurações de privacidade, configurações de notificação e preferências de exibição) devem residir no símbolo do evento de Configurações. O símbolo do evento de Configurações oferece um local único para os usuários ajustarem suas configurações e também impede que a interface do usuário do aplicativo fique poluída com configurações diferentes. Para saber mais sobre as configurações, veja Diretrizes para configurações de aplicativos.

Dispositivos

A impressão de documentos e anotações é um cenário comum nos aplicativos de produtividade. Ofereça aos usuários a funcionalidade de impressão com o símbolo do evento de Dispositivos para permitir uma experiência de impressão tranquila. A seguir está uma visualização da experiência dos Dispositivos para impressão.

A experiência dos Dispositivos para impressão.

Os Dispositivos podem ser um contrato interessante para o seu aplicativo de produtividade atuar como plug-in. Se seu aplicativo tiver inúmeros cenários de mídia e apresentação, os usuários talvez vão querer assistir a eles em televisores em experiências de mídia compartilhada. A integração com o contrato de Dispositivos permite que os usuários façam isso.

Seletor de arquivos

Aplicativos de produtividade podem envolver inúmeros cenários interessantes para usar conteúdo de outros aplicativos. O uso do seletor de arquivos permite que o seu aplicativo obtenha acesso a arquivos e pastas de um usuário no PC local, a dispositivos de armazenamento conectados, ao Grupo Doméstico e a outros aplicativos que implementam um contrato de seletor de arquivos. Isso permite que os usuários insiram conteúdo de outros aplicativos no seu aplicativo, enriquecendo a experiência para os usuários. Por exemplo, em um aplicativo de anotações, talvez o usuário queira inserir uma foto de um aplicativo de fotos ou anotações de áudio de um aplicativo gravador de sons.

Seu aplicativo também pode personalizar vários aspectos do seletor de arquivos. Especificamente:

  • Modo do seletor de arquivos: você pode definir o modo do seletor de arquivos para que corresponda à sua tarefa. Os recursos de selecionar arquivos, salvar arquivos e selecionar pastas têm suporte no seletor de arquivos. Um usuário que possa escolher uma pasta, por exemplo, também poderá escolher uma pasta inteira para ser carregada para um local de armazenamento em nuvem.
  • Modo de exibição: ao fazer o usuário escolher uma foto ou vídeo, você pode personalizar o seletor de arquivos para mostrar arquivos em modo de exibição de miniatura. Para todos os outros tipos de arquivo, use o modo de exibição de bloco.

Além disso, o conteúdo do aplicativo de produtividade pode ser significativo para os usuários em outros contextos, e o acesso a esse conteúdo de outros aplicativos proporciona cenários excepcionais para os usuários. O uso dos contratos de seletor de arquivos oferece uma oportunidade para disponibilizar o conteúdo do seu aplicativo em outros aplicativos do Windows 8. Isso permite que os usuários obtenham conteúdo do seu aplicativo sem precisarem passar por um processo intermediário, como salvar esses arquivos primeiro no computador local. Quando os aplicativos oferecerem essa experiência, os usuários podem selecionar o seu aplicativo na lista de localizações no seletor de arquivos. Quando selecionado, o conteúdo do seu aplicativo fica acessível aos usuários por meio de um modo de exibição do seletor de arquivos que é específico do seu aplicativo e que você controla.

A funcionalidade do seletor de arquivos permite alguns cenários atraentes. Por exemplo, se um usuário quiser enviar uma anotação criada em seu aplicativo de anotações por email para alguns amigos, poderá anexar o conteúdo do aplicativo de anotações diretamente, em vez de precisar salvá-lo primeiro localmente.

O seletor de arquivos também permite salvar diretamente no seu aplicativo. Isso também oferece cenários realmente interessantes. Por exemplo, um usuário pode salvar uma mensagem de email ou um rabisco criado em outro aplicativo diretamente no seu aplicativo como uma anotação. A seguir está uma visualização de como o seletor de arquivos pode ser personalizado.

Os componentes que podem ser personalizados

Conectados e dinâmicos

Os aplicativos executados no Windows 8.1 devem integrar experiências e ter uma personalidade que os façam se destacar. Usando blocos, notificações, mobilidade e contratos, seu aplicativo se encaixará tranquilamente no ecossistema do Windows 8.1.

Blocos e notificações

Mostrar conteúdo atualizado e adaptado no bloco do aplicativo restabelece o envolvimento dos usuários e continua a atraí-los para o seu aplicativo quando acabam percebendo conteúdo interessante no bloco. Cenários atraentes incluem mostrar notificações de bloco quando alguém atualizou um documento compartilhado, compartilhou uma nova anotação com o usuário ou editou a lista de supermercado e eliminou ou adicionou novos itens. Uma notificação também pode mostrar a posição de um ponto de interesse, como neste exemplo.

blocos mostrando notificações

Permitir que os usuários fixem blocos secundários para acesso rápido a anotações e conteúdo favoritos lhes possibilita ver notificações adaptadas sobre esse conteúdo e os atrai para o seu aplicativo.

Para aplicativos de produtividade com cenários de lembretes de prazo certo—por exemplo, um item de uma lista de tarefas pendentes para pagar uma conta no final do mês—convém os usuários associarem lembretes e datas de conclusão às tarefas. Avalie a exibição aos usuários de notificações de sistema agendadas para o horário em que o usuário queira ser lembrado. Uma ótima prática para notificações de sistema perdidas é mostrar esse lembrete no bloco também, como mostrado aqui.

blocos mostrando notificações perdidas

Diretrizes e lista de verificação para notificações de sistema contém mais informações sobre as práticas recomendadas para notificações de sistema. Diretrizes e lista de verificação para blocos contém mais informações sobre as práticas recomendadas para blocos.

Mobilidade

A maioria das pessoas tem mais de um computador com Microsoft Windows. Fazer com que seu aplicativo ofereça uma experiência uniforme em todos os computadores com Windows do usuário proporciona a experiência que ele espera. É possível oferecer mobilidade de configurações de aplicativo, informações sobre o que o usuário fez por último no aplicativo e quaisquer outras preferências em seu aplicativo que são úteis para os usuários em todos os seus computadores. Diretrizes para mobilidade de dados de aplicativo fornece mais informações sobre as práticas recomendadas para mobilidade.

Orientação e tamanho da janela

Como o Windows 8.1 é executado em vários tipos de dispositivos e tem um novo modelo multitarefa, seu aplicativo deve dar suporte a orientações de retrato e paisagem, além de funcionar bem em qualquer tamanho, até a largura mínima.

Ao criar seu aplicativo de produtividade para o Windows 8.1, considere todos os modos de exibição do aplicativo, como diferentes resoluções de tela e tamanhos de dispositivo. O Windows 8.1 facilita o dimensionamento do design, incluindo mais conteúdo no aplicativo para dispositivos maiores. Veja aqui um aplicativo de anotações redimensionado para um layout alto e estreito.

Modo de exibição retrato em um aplicativo de anotações

Os layouts altos e estreitos e a orientação de retrato são ótimos para ler e absorver grandes quantidades de conteúdo. Certifique-se de que o seu aplicativo reorganize o conteúdo para ajustá-lo ao tamanho da janela.

Quando o usuário redimensionar o aplicativo, não perca o contexto e o estado do usuário. Isso é especialmente importante em aplicativos de produtividade, nos quais os usuários se esforçaram para produzir o conteúdo. Quando o usuário redimensionar seu aplicativo, preserve a entrada de texto, a posição de rolagem e qualquer seleção que ele tenha feito.

Quando o aplicativo for mais estreito, o controle da barra de aplicativos deve remover automaticamente os rótulos e diminuir o preenchimento entre comandos. Se houver muitos comandos, você poderá usar sua criatividade na forma de exibi-los. Por exemplo, use duas linhas de comandos na barra de aplicativos ou use submenus nos comandos. Para saber mais, veja Diretrizes de barras de aplicativos.

Além disso, pense em como seu aplicativo pode agregar valor e tornar esses cenários excelentes. Mostre ao usuário por que seu aplicativo funciona muito bem com outros aplicativos. Por exemplo, é fácil imaginar um aplicativo para fazer anotações ou criar listas trabalhando em conjunto com algum outro aplicativo. Ao pesquisar ou escrever, é comum manter na tela um aplicativo de referência ou análise, ao lado do seu trabalho principal. Os aplicativos de leitura e escrita são bastante úteis em larguras estreitas, de forma que possam ser consultados enquanto você faz alguma outra coisa. Pense em quantas vezes seu aplicativo não seria maximizado na área de trabalho tradicional; esses são os cenários a que seu aplicativo deve dar suporte quando redimensionado em uma largura estreita.

A criação de seu aplicativo para funcionar bem com larguras estreitas é uma ótima forma de aumentar o tempo do aplicativo na tela e envolver os usuários por períodos maiores. Veja aqui um exemplo de um aplicativo de anotações lado a lado com o navegador.

aplicativo de anotações estreito

Tópicos relacionados

Conheça os aplicativos da Windows Store

Diretrizes de UX para aplicativos da Windows Store