Aumento de 100% no registro de chaves de acesso da Amedia usando a WebOTP

Henning Haaland Kulander

Yu Tsuno

Publicado em: 30 de junho de 2026

A Amedia é a maior editora de mídia editorial local da Noruega, gerenciando mais de 100 títulos de jornais e alcançando mais de 2 milhões de leitores por dia. Para oferecer uma experiência unificada e sem interrupções, a Amedia usa o aID, a solução de identidade digital interna da empresa. Esse sistema de contas federadas baseado em padrões não apenas concede aos usuários acesso a toda a rede da Amedia, mas também foi adotado por outros jornais noruegueses e dinamarqueses.

O desafio: apresentar chaves de acesso a uma base de usuários diversificada

Para a Amedia, o processo de login é a porta de entrada para o conteúdo. Cada segundo de atrito afeta diretamente a leitura. Embora as senhas comuns e a autenticação de dois fatores (2FA) baseada em SMS sejam notoriamente complicadas para usuários em trânsito, ir direto para as chaves de acesso introduziu um obstáculo inesperado: o desconhecimento.

Como o aID costuma ser o primeiro contato de um usuário com uma chave de acesso, forçar uma mudança abrupta para uma solicitação biométrica desconhecida causou hesitação. A Amedia percebeu que não podia apenas implantar a tecnologia: precisava ajudar os usuários a entender como usar as chaves de acesso.

A solução: um fluxo combinado de WebOTP e chaves de acesso

Em vez de forçar os usuários a escolher entre um hábito antigo (SMS) e um conceito completamente estranho (chaves de acesso), a Amedia combinou os dois em uma única experiência de integração fluida. Eles usaram a API WebOTP para simplificar o processo de verificação por SMS e configurar silenciosamente a infraestrutura para logins sem senha no back-end.

1. Inscrição simples em várias plataformas

Quando um usuário se inscreve no aID, ele informa o nome, o número de telefone e o e-mail. Em seguida, a Amedia envia uma senha única (OTP) por SMS. A Amedia usa o OTP por SMS em vez de e-mail porque é raro ter mais de um número de telefone na Escandinávia, e os números são portados sem problemas ao trocar de operadora de celular. Essa estabilidade torna os números de telefone um identificador principal confiável para logins e um ponto de dados consistente para criar perfis de usuários estendidos. Em vez de forçar o usuário a sair do navegador, abrir o app de mensagens, memorizar o código e digitá-lo, a Amedia usa a API WebOTP. Em navegadores para dispositivos móveis compatíveis, isso aciona uma página inferior que permite ao usuário tocar em Verificar. O navegador recupera automaticamente o OTP do SMS e envia o formulário.

Além disso, a Amedia atualizou a entrega de SMS para usar o formato de mensagem padrão vinculado à origem (por exemplo, @www.aid.no #123456) , permitindo logins sem problemas em todo o ecossistema. Esse padrão não apenas alimenta a API WebOTP em navegadores como Chrome, Opera e Vivaldi no Android e computador, mas também ativa perfeitamente o recurso autocomplete="one-time-code" do Safari. Como resultado, os usuários em plataformas móveis e de computador têm um fluxo de OTP seguro e automatizado sem precisar de uma lógica de back-end específica da plataforma. Consulte as práticas recomendadas de formulário de OTP por SMS para saber mais.

// Detect feature support using OTPCredential availability
if ('OTPCredential' in window) {
  window.addEventListener('DOMContentLoaded', e => {
    const input = document.querySelector('input[autocomplete="one-time-code"]');
    if (!input) return;

    const ac = new AbortController();
    const form = input.closest('form');
    if (form) {
      form.addEventListener('submit', (e) => {
         ac.abort();
      });
    }

    navigator.credentials.get({
      otp: { transport: ['sms'] },
      signal: ac.signal
    }).then(otp => {
      // Automatically fill the input and submit the form
      input.value = otp.code;
      if (form) form.submit();
    }).catch(err => {
      console.error('WebOTP error:', err);
    });
  });
}

2. Registro imediato da chave de acesso

Antes, depois que um usuário concluía a verificação do WebOTP, a Amedia apresentava uma escolha: criar uma senha normal ou configurar uma chave de acesso. Como esperado, quando se depararam com um termo técnico desconhecido, a maioria dos usuários seguiu o caminho de menor resistência: pular a etapa completamente ou usar uma senha padrão.

Em meados de fevereiro, a equipe da Amedia mudou a abordagem. Eles integraram a solicitação de registro de chave de acesso imediatamente ao fluxo pós-verificação, antes mesmo de apresentar opções. Para obedecer aos requisitos estritos de gestos do usuário em navegadores como Chrome e Safari, a Amedia encadeou a interação de maneira integrada. Como o usuário confirma o OTP primeiro, esse toque inicial serve como o gesto necessário para invocar diretamente o comando navigator.credentials.create(). Ao tornar as chaves de acesso a experiência padrão em vez de uma configuração opcional, a Amedia dobrou instantaneamente a taxa de registro bem-sucedido.

Embora essa solicitação imediata tenha se mostrado altamente eficaz, a equipe tentou simplificar ainda mais a experiência usando "criação condicional", um mecanismo que gera uma chave de acesso totalmente em segundo plano sem exigir ação direta do usuário. No entanto, eles encontraram um obstáculo técnico: a criação condicional exige um login anterior usando uma senha válida salva em um gerenciador de senhas. Como o fluxo WebOTP da Amedia é totalmente sem senha, ele não atende a esse critério de segurança. Para contornar essa restrição, a Amedia agora reserva a criação condicional apenas para fluxos regulares de login de dois fatores (senha e código de uso único), usando o gesto do usuário encadeado para integração sem senha.

Para garantir uma experiência confiável, o sistema usa um fluxo de registro padrão. Isso aciona uma caixa de diálogo da interface do navegador em que o sistema solicita com segurança a interface de registro de chaves de acesso do navegador. O usuário cria uma chave de acesso usando o bloqueio de tela do dispositivo (biometria ou PIN). Ao encadear esse direito logo após a WebOTP, o usuário conclui a configuração sem precisar descobrir uma senha.

// Triggered immediately after successful WebOTP verification
async function registerPasskey(creationOptionsFromServer) {
  try {
    const credential = await navigator.credentials.create({
      publicKey: {
        ...creationOptionsFromServer,
        authenticatorSelection: {
          residentKey: "required",
          userVerification: "required"
        }
      }
    });

    // Send the new credential to the server for registration
    await sendCredentialToServer(credential);
  } catch (error) {
    console.error("Passkey registration failed", error);
  }
}

3. Logins subsequentes rápidos

Na próxima visita do usuário a uma publicação da Amedia no mesmo dispositivo, o aID aciona automaticamente um login com chave de acesso. Se o usuário interagir com a página antes que a solicitação automática apareça ou se ela for dispensada, o sistema usará o preenchimento automático do formulário de chaves de acesso.

Isso torna o processo de login rápido, já que o usuário só precisa interagir com o prompt do navegador/SO ou com as sugestões de preenchimento automático do teclado para selecionar a chave de acesso, ignorando completamente a entrada manual de formulários.

// Triggering conditional UI for autofill suggestions
async function authenticateWithPasskey(requestOptionsFromServer) {
  try {
    const credential = await navigator.credentials.get({
      publicKey: requestOptionsFromServer,
      mediation: "conditional" // Enables autofill integration
    });

    // Authenticate the user on the server
    await verifyAssertionWithServer(credential);
  } catch (error) {
    console.error("Passkey authentication failed", error);
  }
}

O impacto: encadeamento para adoção simples

Ao inovar o fluxo de integração, a Amedia reduziu significativamente as dificuldades para leitores novos e recorrentes. A combinação de WebOTP e chaves de acesso gerou melhorias operacionais e de experiência claras:

• Inscrições muito mais rápidas: o tempo total necessário para criar uma nova conta aID diminuiu significativamente devido à entrada automática de WebOTP e à remoção completa da criação manual de senhas.
• 48% dos novos usuários criam chaves de acesso: ao solicitar a criação de chaves de acesso imediatamente após a verificação do WebOTP, a Amedia alcançou uma taxa de conversão excepcionalmente alta para o registro de chaves de acesso, representando um aumento de 100% em relação ao fluxo de integração anterior baseado em escolha.
• Login 82% mais rápido: os usuários recorrentes fazem a autenticação mais de cinco vezes mais rápido usando chaves de acesso em comparação com métodos alternativos, como senhas ou entrada manual de OTP.

Em última análise, enquanto o ecossistema digital mais amplo continua enfrentando desafios em relação à terminologia de chaves de acesso e à educação do usuário, a abordagem proativa da Amedia fornece um modelo de sucesso. A integração de chaves de acesso a um serviço de alta frequência usado por milhões de pessoas todos os dias estabelece um novo padrão de acesso perfeito no setor de mídia, oferecendo uma atualização de segurança permanente sem sacrificar a retenção de usuários.