Skip to content

Temas do modo escuro

O modo escuro oferece aos usuários a oportunidade de definir uma preferência de cor em todo o sistema (introduzido no Android 10 e no iOS 13). Os temas “escuros” têm o objetivo de economizar a vida útil da bateria e reduzir a tensão nos olhos dos usuários, ao mesmo tempo em que oferecem aos desenvolvedores de apps uma maneira de implementar temas de cores escuras.

As mensagens no app do Braze suportam a adição de um tema escuro alternativo para fornecer a mensagem da cor certa aos seus usuários com base na preferência deles e manter a consistência com o design do seu app.

Como funciona o modo escuro

Os usuários com versões de pelo menos Android 10 ou iOS 13 e posteriores podem ativar ou desativar o modo escuro nas configurações do dispositivo.

Quando o Modo escuro é ativado, os menus e as telas nativas do dispositivo (notificações por push, configurações do dispositivo, etc.) mudam para um cinza escuro. Os aplicativos também podem optar por oferecer suporte ao modo escuro especificando os temas alternativos no código do aplicativo.

Configuração de um tema do modo escuro

O Modo escuro, localizado na guia Design ao criar uma mensagem no app, permite adicionar um tema de cores alternativo para usuários que estão no Modo escuro em seus dispositivos.

Envio de mensagens no app para o usuário alternar entre os estilos Modo claro e Modo escuro na guia Estilo.

Quando essa opção está ativada, você pode escolher cores de tema escuro para sua mensagem no app usando o seletor de cores ou selecionando Perfis de cores existentes para reutilizar temas escuros ou claros existentes.

Usando o modo escuro de forma consistente

Para usar o modo escuro em todas as mensagens no app, acesse Modelos > Modelos de mensagens no app.

A partir daí, selecione Create Color Profile (Criar perfil de cores ) no menu suspenso. Crie um perfil de cores que se alinhe ao tema do modo escuro. Então, sempre que criar uma versão em modo escuro de uma mensagem no app, você poderá selecionar esse perfil de cor e manter a aparência das mensagens no app consistente.

Compatibilidade

  • Seus usuários devem estar em dispositivos iOS versão 13 ou superior, ou Android versão 10 ou superior.
  • Braze iOS SDK v3.21.0+ Braze Android SDK v3.8.0+ é necessário.

Uso de mensagens no app em HTML

Para criar um tema escuro e claro para mensagens HTML no app, você pode usar o recurso de mídia prefers-color-scheme recurso de mídia CSS para detectar a preferência do usuário.

Por exemplo:

1
2
3
4
5
6
7
8
9
10
11
12
13
@media (prefers-color-scheme: dark) {
  body {
    background: #333;
    color: white;
  }
}

@media (prefers-color-scheme: light) {
  body {
    background: white;
    color: #555;
  }
}
New Stuff!