Os widgets são um componente essencial para personalizar a tela inicial de um usuário. Elas podem ajudar os usuários a concluir uma jornada de usuário crítica de um app com um único toque ou fornecer um resumo rápido dos dados mais importantes de um app. Eles também podem ser personalizados para atender às necessidades do usuário e adaptados às preferências individuais.
A qualidade de um widget pode afetar o engajamento do usuário com o conteúdo e os recursos do seu app. Há três níveis principais de qualidade de widget:
- Nível 3: baixa qualidade: não atendem aos requisitos mínimos de qualidade e não oferecem uma ótima experiência do usuário.
- Nível 2: padrão de qualidade: é útil, utilizável e oferece uma experiência de qualidade.
- Nível 1: diferenciados: são widgets exemplares que oferecem experiências principais personalizadas e ajudam os usuários a criar telas iniciais únicas e produtivas.
Nível 3: baixa qualidade
Um widget é considerado de baixa qualidade se não atender aos critérios padrão de layout, cor, descoberta e conteúdo. Para mais informações sobre como criar um widget de prática recomendada e de alta qualidade, consulte as diretrizes a seguir.
Nível 2: padrão de qualidade
Para ser considerado de boa qualidade, o widget precisa atender a todos os seguintes critérios de layout, cor, descoberta e conteúdo:
Layout
- O widget precisa preencher os limites
definidos pela grade do iniciador quando for colocado na tela inicial. Ele pode ser redimensionado
para pelo menos um dos seguintes tamanhos : 2 x 2, 4 x 2 (células de grade da tela de início).
Para mais informações, consulte as
diretrizes de dimensionamento.
- O widget precisa estar alinhado corretamente a outros elementos da tela inicial no eixo vertical ou horizontal e não ocupar espaço desnecessário.
- O widget deve tocar em pelo menos duas bordas opostas da grade. Em outras palavras, os widgets não precisam ser retangulares. Eles podem ter formas personalizadas, desde que as bordas da forma toquem pelo menos duas bordas da grade.
- Se redimensionáveis, os widgets precisam ter um tamanho mínimo ou máximo adequado, que pode ser
definido com
minWidth
,minHeight
,maxResizeWidth
emaxResizeHeight
no AppWidgetProviderInfo XML- O tamanho máximo precisa ser definido se o redimensionamento do widget apenas adicionar espaço em branco.
- O tamanho mínimo precisa ser definido com base no tamanho mínimo que o widget ainda oferece valor e atende aos requisitos de área de toque (48 x 48).
Cor
- Os botões de texto e ícone do widget precisam ter índices de contraste suficientes para atender aos requisitos de acessibilidade (exceto miniaturas e imagens).
Descoberta
O widget precisa ter visualizações precisas no seletor de widgets. Isso pode ser definido com
previewImage
epreviewLayout
no XML AppWidgetProviderInfo ou com visualizações geradas.- A visualização do widget parece consistente com a funcionalidade oferecida quando adicionada à tela inicial.
Vídeo 1: widget com visualização imprecisa.
Conteúdo
- O conteúdo do widget não pode ficar desatualizado ou ser inoportuno de maneira consistente.
- O widget precisa ser atualizado depois que o usuário conclui uma ação nele.
- O widget precisa ser atualizado depois que o usuário concluir uma ação relacionada no app.
- O widget precisa permitir que os usuários atualizem o conteúdo manualmente, se houver uma expectativa de que os dados sejam atualizados com mais frequência do que a interface.
- A interface do widget precisa ser funcional ou o conteúdo será cortado.
- Os estados vazios e zero do widget precisam ser intencionais e mostrar o valor do widget ou fornecer uma call-to-action quando o widget estiver instalado, mas o usuário ainda não tiver feito login.
Nível 1: diferenciado
Os melhores widgets atendem a todos os critérios do Nível 2 e de layout, cor, descoberta e coerência do sistema.
Layout
- O widget preenche os limites e se alinha corretamente a outros elementos da tela inicial no
eixo vertical ou horizontal e não ocupa espaço desnecessário
- Todas as formas precisam atingir as quatro bordas dos limites da grade
O widget oferece suporte a um tamanho preferencial
- O widget pode ser redimensionado para pelo menos um dos seguintes tamanhos : 2x2, 4x2
O cabeçalho do widget é usado e aplicado de forma consistente
- Recomendar o uso do cabeçalho se:
- Você quer fornecer links diretos para determinadas funções do app, como a pesquisa.
- Você quer aplicar um ícone de marca do app que funcione como um link consistente ao tocar nele.
- O widget contém conteúdo rolável (lista, grade etc.)
- O conteúdo do cabeçalho fornece um contexto útil (nome da lista de tarefas)
- O cabeçalho é opcional quando:
- O widget é uma imagem sem margens (Fotos)
- O espaço é limitado (< 2 linhas de altura)
- Quando o conteúdo do cabeçalho é redundante.
- Se você estiver usando um cabeçalho, siga nossas especificações:
- Ícone, título, ações.
- O ícone está sempre presente
- O título aparece quando há espaço suficiente
- Ações com base no contexto do widget.
- Altura 48 dp, enchimento, 14 dp
- Ícone, título, ações.
- Recomendar o uso do cabeçalho se:
Cor
- O widget oferece suporte à paleta de cores com base nos temas do sistema, na cor do conteúdo ou
na cor da marca.
- O widget oferece suporte a paletas nos modos claro e escuro.
- A cor dinâmica é um exemplo de aplicação de temas no contexto do dispositivo.
- A extração de cores local é um exemplo de criação de temas com base no conteúdo do app.
- A cor semântica é um exemplo de tema baseado no conteúdo do app.
Descoberta
- A visualização inclui conteúdo do usuário ou aplica um tema do sistema (API Generated
Previews ou
previewLayout
no AppWidgetProviderInfo XML).
- O widget tem um nome ou uma descrição que ajuda os usuários a entender o valor
do widget.
- O nome tem menos de 50 caracteres.
- O nome e a descrição são exclusivos no app. Por exemplo, o app não pode ter vários widgets com o mesmo nome.
Coerência do sistema
- Os widgets retangulares precisam usar o raio de canto fornecido pelo sistema (específico do OEM)
- Mostra um estado de carregamento com um indicador
de progresso
(em uma
initialLayout
com cor temática ou equivalente de marca).
- Usa a configuração do sistema em vez de um ponto de entrada de configurações de widget personalizado
- Usa a transição de inicialização do sistema ao entrar/sair do app para o widget
Lembre-se das dicas oferecidas neste guia ao criar seu widget. Você quer oferecer a melhor qualidade e uma ótima experiência do usuário. Muitas barras de qualidade podem ser atingidas com layouts canônicos. Para saber mais sobre as barras de qualidade, os designers podem consultar os modelos de widgets do Android, e os desenvolvedores podem consultar os exemplos de código de layout nos nossos exemplos de plataforma e no guia para desenvolvedores de layouts.