Capturas de tela em modo escuro: quando ajudam e quando atrapalham

Capturas de tela em modo escuro ajudam quando o escuro é o jeito como o seu app é usado de verdade: apps de mídia e streaming, jogos, ferramentas profissionais e para desenvolvedores, e apps de uso noturno. Elas também podem ajudar a sua página a se destacar numa lista de resultados de busca cheia de fundos brancos. Atrapalham quando perdem contraste em tamanho de miniatura, ficam pesadas ao lado de concorrentes claros ou mostram uma aparência que não é a padrão do app, porque aí a captura de tela não representa o que um usuário novo vai ver.

Um fato define tudo isso: você não pode enviar um conjunto escuro separado. Cada loja mostra a todo mundo um único conjunto de capturas de tela por dispositivo e idioma, na aparência que o aparelho da pessoa estiver usando. Então a pergunta real é qual conjunto único funciona tanto numa página da loja clara quanto numa escura.

Como o modo escuro afeta a forma como as suas capturas de tela são vistas

Desde o iOS 13, o app App Store segue a aparência Clara ou Escura do aparelho. No Escuro, a página em volta das suas capturas de tela (a lista de resultados de busca, o fundo da página do produto, os textos) fica quase preta. Suas capturas de tela são imagens, então elas não mudam. O Google Play no Android também pode aparecer em tema escuro, com o mesmo efeito.

Isso te dá quatro combinações para levar em conta:

A consequência prática: nem fundo branco puro nem fundo quase preto são seguros nos dois casos. Um fundo colorido ou em tom médio (uma cor da marca, um gradiente, um escuro com um toque de cor) mantém uma borda visível nos dois temas da loja. A interface dentro da moldura de dispositivo ainda pode ser totalmente escura ou totalmente clara.

Quando capturas de tela em modo escuro ajudam

• Apps de mídia, streaming e fotos. Artes, pôsteres e fotos ficam mais ricos sobre o escuro, e é assim que esses apps costumam ser feitos.
• Jogos. Muitos jogos são escuros por natureza. Mostre o jogo como ele é; veja a seção de jogos do nosso guia de estratégia de capturas de tela por categoria.
• Ferramentas profissionais e para desenvolvedores. Editores de código, terminais, ferramentas de áudio e vídeo: a interface escura diz “feito para profissionais” para quem usa essas ferramentas todo dia.
• Apps de uso noturno. Sono, astronomia, direção à noite, leitura de madrugada. Capturas de tela escuras mostram o app no contexto em que ele é usado.
• Se destacar numa lista de resultados clara. Se todos os concorrentes da sua palavra-chave principal usam capturas de tela brancas ou em tons pastel, um conjunto escuro se diferencia visualmente na busca para os muitos usuários que navegam na aparência clara. Olhe primeiro os seus resultados de busca reais.

Quando capturas de tela escuras atrapalham

• Contraste em miniatura. Nos resultados de busca, as capturas de tela são pequenas. Uma interface escura com texto cinza fino, divisores sutis e gráficos de baixo contraste vira um retângulo escuro. Confira a legibilidade no tamanho real dos resultados de busca antes de decidir.
• Peso visual. Um conjunto inteiro de telas quase pretas pode ficar pesado, principalmente em categorias mais acolhedoras, como infantil, educação, comida ou bem-estar, em que os usuários esperam algo caloroso.
• Não é a aparência padrão do app. Se o seu app abre no claro e a maioria dos usuários nunca muda, um conjunto só escuro mostra algo que eles não vão ver no primeiro uso. A diretriz 2.3.3 da Apple diz que as capturas de tela devem mostrar o app em uso, e a política de metadados do Google Play diz que elas devem refletir a experiência real do app. Um conjunto escuro não tem problema se o app tem mesmo esse modo, mas abrir com um visual que os usuários novos não vão encontrar costuma decepcionar.
• App sem modo escuro. Mostrar uma interface escura que o app não tem é deturpar o produto, e ponto.

Conjuntos mistos: mostrando os dois temas

Se o seu app tem as duas aparências, você não precisa escolher. Alguns padrões comuns:

1. Padrão primeiro, escuro como recurso. Abra com a aparência padrão e dê ao modo escuro uma captura de tela própria mais adiante na sequência, com uma legenda como “Mais confortável para os olhos à noite”. É a opção mais segura para a maioria dos apps.
2. Tela dividida. Uma captura de tela mostra a mesma tela no claro e no escuro, lado a lado ou divididas na diagonal. Ela diz “dois temas” numa só imagem, mas confira se as duas metades continuam legíveis em tamanho de miniatura.
3. Interface escura sobre um fundo colorido. Mantenha a interface do app escura, mas coloque o dispositivo sobre um fundo na cor da marca, com o texto da legenda claro. Isso costuma funcionar bem nas duas aparências da loja.

O que costuma não funcionar é alternar telas claras e escuras aleatoriamente. Isso faz o conjunto parecer improvisado, que é um dos sinais de um conjunto de capturas de tela feito às pressas.

Detalhes de design para capturas de tela escuras

• Use fundos quase pretos ou escuros com um toque de cor em vez de preto puro, para que a borda da imagem continue visível na página escura da loja.
• Deixe o texto da legenda grande e com bastante contraste; pesos finos em cinza-claro somem no escuro.
• Escolha uma cor de moldura de dispositivo que se destaque do fundo; um celular preto sobre um fundo preto perde o contorno.
• Use uma única cor de destaque para dar ênfase e mantenha ela igual em toda a sequência.
• Capture as telas do app na aparência escura de verdade, não numa captura clara com filtro ou cores invertidas.

E o ícone do app?

Desde o iOS 18, as pessoas podem deixar os ícones da Tela de Início com visual escuro ou colorido, e você pode fornecer uma variante escura do seu ícone no Xcode. Essa variante é para a Tela de Início; a sua página na loja continua abrindo com o ícone padrão e o seu único conjunto de capturas de tela. Ainda assim, vale olhar os dois juntos: um ícone claro e vibrante ao lado de um conjunto de capturas de tela escuro, ou o contrário, pode fazer a página parecer de dois produtos diferentes. Se você mudar o tom geral das capturas de tela, confira se o ícone, a primeira captura de tela e o título da primeira captura de tela ainda parecem uma única marca na linha do resultado de busca.

Como capturar telas em modo escuro

Mude o simulador ou o emulador para o escuro antes de capturar, em vez de editar capturas claras:

# iOS Simulator
xcrun simctl ui booted appearance dark

# Android emulator
adb shell cmd uimode night yes

Ajuste a barra de status do mesmo jeito nos dois temas para que a hora, a bateria e o sinal fiquem iguais em todo o conjunto. Nosso guia de capturas de tela limpas no simulador e no emulador tem os comandos completos.

Como testar capturas de tela escuras vs. claras

Não dá para saber de antemão qual converte melhor no seu app, e a gente não viu dados públicos confiáveis que resolvam isso de forma geral. Teste:

• App Store: a Otimização da página de produto permite testar até três versões contra a sua página original, com capturas de tela alternativas, por até 90 dias. Rode uma versão escura contra a sua original clara (ou o contrário).
• Google Play: os experimentos da página de detalhes do app no Play Console permitem testar variantes de capturas de tela contra a sua página atual.
• Páginas segmentadas: se o escuro agrada a um público (desenvolvedores, gamers) mas não ao público geral, considere uma página de produto personalizada ou uma página de detalhes personalizada no Google Play para esse público em vez de mudar a página padrão.

Nosso guia de testes A/B de capturas de tela mostra quanto tempo deixar um teste rodando e como ler o resultado, e taxa de conversão na App Store explica a métrica que você está tentando mover.

Se você cria suas capturas de tela no Launch Shots, fazer uma variante escura é questão de trocar as cores do fundo e das legendas numa cópia do seu conjunto, e o console de ASO pode mostrar a conversão antes e depois de uma mudança, a partir das suas próprias análises da App Store e do Google Play.

Resumindo

• Existe um conjunto de capturas de tela por dispositivo e idioma; ele precisa funcionar tanto em páginas claras quanto escuras da loja.
• Abra com a aparência padrão do seu app, a menos que o escuro seja o jeito como ele é usado de verdade.
• Conjuntos escuros combinam com apps de mídia, jogos, ferramentas profissionais e apps de uso noturno; também podem se destacar numa lista de resultados cheia de telas claras.
• Evite fundos branco puro e preto puro; fundos em tons médios ou na cor da marca funcionam nos dois temas.
• Confira a legibilidade no tamanho dos resultados de busca, num aparelho em cada aparência.
• Resolva a dúvida entre escuro e claro com um teste de Otimização da página de produto ou um experimento da página de detalhes do app no Google Play, não no chute.