Ativar logins rápidos: padrões de UX do modo de interface imediata

Eiji Kitamura

Publicado em: 30 de setembro de 2026. Última atualização: 7 de outubro de 2026

Visão geral

O modo de UI imediato resolve a perda de contexto e a desistência do usuário causadas pela navegação até uma página de login dedicada. Ele permite logins rápidos, permitindo que os usuários concluam o login usando chaves de acesso ou senhas salvas diretamente na página que estão visualizando ou trabalhando sem sair do contexto.

Ao contrário da interface condicional, que mostra sugestões de preenchimento automático quando um usuário foca em um campo de entrada de texto, o modo de interface imediata invoca imediatamente a caixa de diálogo de autenticação do navegador em resposta a um clique em botão ou link. No momento, o uiMode aceita apenas "immediate", mas isso pode mudar no futuro.

Três características principais tornam o modo de UI imediata excepcionalmente eficaz para fazer login rapidamente:

  • Ignorar QR codes entre dispositivos: se houver chaves de acesso ou senhas salvas disponíveis imediatamente no dispositivo, o navegador vai mostrar a caixa de diálogo de autenticação. Se não houver, ele sai imediatamente sem mostrar uma tela de QR code entre dispositivos para smartphones. Isso permite que seu site faça a transição naturalmente para a navegação normal de substituição (como ir para a página de login).
  • Interface intuitiva de seleção centrada na conta: em vez de listar individualmente tipos mistos de credenciais, ela oculta as diferenças entre chaves de acesso e senhas para apresentar um seletor de contas intuitivo focado em qual conta o usuário quer fazer login.
  • Aprimoramento progressivo seguro: embora seja compatível apenas com os navegadores Google Chrome e Chromium, o uso da detecção de recursos permite oferecer logins rápidos aos usuários em ambientes compatíveis sem interromper os fluxos de login atuais para usuários em navegadores não compatíveis (como Safari ou Firefox) ou no modo de navegação anônima.

Para detalhes sobre como a API funciona nos bastidores e como implementar a detecção de recursos, consulte Modo de interface imediata para logins. Neste documento, vamos explorar padrões de UX recomendados que aumentam a conversão com o modo de interface imediata, além de antipadrões de design a serem evitados.

O lugar mais eficaz para usar o modo de UI imediata é a interceptação logo antes da navegação nas páginas. Sempre que um usuário não autenticado (ou com sessão expirada) clica em um link ou botão de ação que normalmente o levaria a uma página de login, invocar o modo de interface imediata naquele momento exato cria uma UX perfeita que nunca interrompe o fluxo de trabalho.

A maioria dos sites coloca um link "Fazer login" no cabeçalho global na parte de cima da tela, que navega até a página de login dedicada. Quando um usuário clica nesse link na página que está navegando, pausar a navegação e invocar o modo de interface imediata permite que o navegador apresente uma caixa de diálogo de seleção de conta diretamente sobre a página atual se houver credenciais no dispositivo.

Depois que o usuário seleciona a conta e conclui a autenticação, o cabeçalho é atualizado para o estado conectado sem navegação na página, permitindo que ele continue navegando sem sair da página que estava visualizando. Por outro lado, se não houver credenciais no dispositivo, nenhuma interface do navegador será mostrada, e o usuário vai navegar sem problemas até a página de login exatamente como pretendia originalmente.

Login dinâmico no carrinho (e-commerce)

Em sites de e-commerce, a transição do carrinho de compras para a finalização da compra é um dos pontos mais comuns de abandono do carrinho causado por atrito na navegação nas páginas. Ao invocar o modo de interface imediata no momento em que um comprador não autenticado clica no botão para finalizar a compra na tela do carrinho, uma caixa de diálogo de seleção de conta aparece exatamente onde o botão foi clicado, concluindo a autenticação com um único toque.

Quando a autenticação é bem-sucedida, o comprador ignora completamente a página de login e acessa diretamente a tela final de confirmação de frete e pagamento (página de finalização da compra), reduzindo drasticamente as etapas necessárias para concluir uma compra. Se não houver credenciais, o comprador fará a transição normalmente para a tela de seleção de login convencional ou finalização da compra como visitante. Você pode projetar seu site para permitir o pagamento como visitante ou exigir login de acordo com os requisitos da sua empresa. O modo de interface imediato serve para eliminar o atrito na finalização da compra para clientes recorrentes.

Login inline para microações (marcar como "Gostei", adicionar aos favoritos, salvar)

Quando os visitantes navegam por feeds de redes sociais, sites da comunidade ou catálogos de produtos de e-commerce, forçar um redirecionamento de página inteira para a página de login sempre que tentam "Curtir" uma postagem ou "Adicionar aos favoritos" um item pode fazer com que alguns usuários abandonem a ação.

Quando um visitante desconectado clica em um botão de ação, como "Gostei", "Adicionar aos favoritos" ou "Salvar", apresentar uma caixa de diálogo do modo de interface imediata no lugar permite que a verificação de identidade seja concluída e acione imediatamente o registro da ação e a animação da interface (como o ícone de coração ficando vermelho). A posição de rolagem não se move em um único pixel, preservando completamente a imersão na navegação. Se não houver credenciais, em vez de navegar imediatamente, mostre um modal de login inline leve sobre a tela atual ou guie o usuário até a página de login de forma que ele retorne ao local original depois de fazer login.

Desbloqueio de paywall do site do publisher

A mídia de notícias e as plataformas de conteúdo adotam amplamente um modelo em que os parágrafos iniciais de um artigo são acessíveis sem custo financeiro, enquanto um paywall flexível ou um desfoque exclusivo para membros é apresentado na metade da página à medida que o leitor rola a tela.

Quando um leitor rola um artigo para baixo, chega ao paywall e clica no botão "Continuar lendo com sua conta", a invocação do modo de UI imediata mostra a caixa de diálogo de autenticação exatamente sobre a posição de rolagem em que o leitor parou. Assim que a autenticação é concluída, o desfoque do artigo desaparece sem recarregar a página, permitindo que o leitor continue lendo sem perder a linha de texto que estava olhando. Se não houver credenciais, abra um formulário de registro ou login inline na seção de paywall.

Antipadrões a serem evitados

Embora o modo de interface imediata ofereça um valor enorme quando usado antes da navegação de página, colocá-lo no local errado ou aplicá-lo a fluxos sem suporte prejudica ativamente a experiência de login do usuário.

Evitar o modo de interface imediato em botões de login em páginas de login dedicadas

Como o modo de interface imediata processa chaves de acesso e senhas em uma única caixa de diálogo refinada, pode ser tentador usá-lo no botão "Fazer login" colocado na página de login dedicada. No entanto, evite usar esse recurso aqui. Primeiro, o modo de interface imediata exige estritamente a ativação do usuário (como um clique ou toque), o que o torna inadequado em uma página de login em que os usuários podem esperar que as opções de login estejam disponíveis no tempo de carregamento da página. Em segundo lugar, a página de login é o destino final em que os usuários chegam quando não têm credenciais locais no dispositivo ou quando querem fazer login com uma chave de acesso no dispositivo móvel (autenticação entre dispositivos) ou uma chave de segurança de hardware clicando em "Fazer login com uma chave de acesso". Se você usar o modo de interface imediata aqui, o navegador vai suprimir o QR code entre dispositivos e os substitutos de chave de segurança, além de encerrar imediatamente assim que não encontrar credenciais locais no dispositivo, prendendo o usuário em um beco sem saída em que clicar no botão não faz nada em uma página sem destino.

Em uma página de login em que todos os métodos de autenticação precisam funcionar de maneira confiável, a prática recomendada é configurar a interface condicional (integração de preenchimento automático) nos campos de entrada para garantir a conveniência das chaves de acesso locais, além de parear botões explícitos de "Fazer login com uma chave de acesso" com métodos de invocação padrão que mostram de maneira confiável o QR code entre dispositivos e as opções de chave de segurança.

Evitar o modo de UI imediato para reautenticação gradual

Quando um usuário conectado realiza uma operação sensível, como mudar uma senha, atualizar um endereço de entrega, editar formas de pagamento salvas ou adicionar uma nova chave de acesso, os sites geralmente exigem uma reautenticação gradual para verificar a identidade do usuário. Como o usuário já fez login, os fluxos de reautenticação normalmente transmitem uma lista allowCredentials não vazia para restringir a autenticação a credenciais pertencentes a esse usuário específico.

No entanto, não use o modo de UI imediata para reautenticação. O modo de interface imediata foi criado exclusivamente para fluxos de login não autenticados em que a identidade do usuário ainda não é conhecida. Se uma parte confiável pudesse consultar uma lista específica de IDs de credenciais no modo de interface imediata e observar se uma credencial existe, ela poderia inferir se o usuário interagiu anteriormente com o site e rastrear o usuário em várias sessões. Para evitar esse risco de rastreamento entre sessões, os navegadores rejeitam imediatamente qualquer solicitação do modo de interface imediata que inclua uma lista allowCredentials não vazia ao gerar um NotAllowedError. Por outro lado, omitir allowCredentials durante a reautenticação também é problemático, já que o navegador apresenta todas as credenciais salvas no dispositivo para seu site, permitindo que o usuário selecione inadvertidamente uma conta diferente daquela em que fez login no momento.

Para a reautenticação gradual em que a identidade do usuário já é conhecida, use uma solicitação modal padrão do WebAuthn (navigator.credentials.get() sem uiMode: 'immediate') com allowCredentials preenchido com as credenciais registradas do usuário conectado ou direcione o usuário para a tela de desafio de reautenticação padrão.

Conclusão

O modo de interface imediata é uma ferramenta de UX eficiente para eliminar desvios desnecessários para páginas de login e fazer logins rápidos que completam o processo preservando o contexto. Ao interceptar momentos de intenção clara do usuário, como links de login no cabeçalho, botões de finalização da compra, microações e paywalls de artigos, logo antes da navegação na página, é possível evitar o abandono e oferecer uma experiência do usuário perfeita.

Ao mesmo tempo, lembre-se de que o modo de interface imediata é estritamente um aprimoramento progressivo para usuários não autenticados antes da navegação na página. Evite aplicar em botões na página de destino final para que o design permaneça aberto e acessível a usuários entre dispositivos (QR code). Além disso, evite usar em fluxos de autenticação que exigem allowCredentials.

Para mais detalhes sobre como implementar chaves de acesso e os recursos mais recentes da Web Identity, consulte os seguintes recursos: