This article explains how Conditional UI for sign-up processes could look like. In particular, the new WebAuthn Conditional Registration Explainer is discussed.
Vincent
Created: September 9, 2023
Updated: June 26, 2024
Our mission is to make the Internet a safer place, and the new login standard passkeys provides a superior solution to achieve that. That's why we want to help you understand passkeys and its characteristics better.
1. Introduction: Conditional UI is the Booster for Passkeys
2. The Current State: Conditional UI in Logins
3. A Shift in Perspective: Conditional UI for Registrations
3.1 Existing, Authenticated User Creates New Passkey
3.2 Existing, Non-Authenticated User Creates New Passkey
3.3 New User Signs Up Via Passkey
4. Architectural Considerations for WebAuthnConditional Registration Extension
5. Update: iOS 18 Introduces Conditional Passkey Creation
6. What the Future Holds: Passkey Registration andConditional UI
In the digital age, the concept of 'ease of access' has become important in shaping user experiences. Passkeys have been at the forefront of this revolution, offering a seamless authentication process. This process is not only passwordless but can also be extended to being usernameless or, to put it more aptly, account-less. However, this convenience, made possible by Conditional UI / Conditional Mediation / Passkey Autofill is currently only possible for login processes, with sign-up processes still requiring the provision of a user handle and manual user interaction to start the process. Could the principles of Conditional UI transform the sign-up processes as profoundly as they have logins? Let's delve into the potential of Conditional UI for sign-ups.
Recent Articles
📖
WebAuthn Conditional UI (Passkeys Autofill) Technical Explanation
📖
WebAuthn Resident Key: Discoverable Credentials as Passkeys
📖
WebAuthn Relying Party ID (rpID) & Passkeys: Domains & Native Apps
📖
WebAuthn Passkey QR Codes & Bluetooth: Hybrid Transport
♟️
Conditional UI Optimizes the User Transition to Passkeys
Conditional UI, a cutting-edge passkey feature that simplifies logins by eliminating unnecessary steps, has significantly bolstered passkey adoption. The idea of extending this to sign-ups seems like a logical next step, doesn't it?
The arguments for an introduction of such a feature can be quickly outlined:
Yet, the introduction of this feature hasnt happened and is not even specified yet, as there were quickly found some contra arguments:
Recent real-life implementations have reopened the discussion which culminated in a new explainer for a WebAuthn Conditional Registration Extension. With no best practices for promoting passkey creation among existing user bases, two approaches are gaining traction: encouraging passkey setup post-login or integrating passkey creation options within account settings. For new users, some avant-garde players have even begun offering 100% passwordless / passkey, pointing to an industry on the cusp of change.
Lets take a look what at these three potential scenarios for creating a passkey via Conditional UI and how they could look like in practice:
When a user who is already authenticated (perhaps via traditional authentication method, e.g. passwords) engages with a web application, they could encounter a new interface inviting them to create a passkey. This interface could materialize as an HTML element (e.g. input field) that upon interaction, triggers the operating system's passkey creation dialog. Imagine a discrete pop-up window, possibly appearing at the center of the screen or sliding in like Google's One Tap, that is context-aware and adapts to the OS's design language. This would look a small further improvement compared to the current best demonstrated practice by companies like Google or GitHub who offer users, who authenticated via a traditional authentication method, to create a new passkey. Its also what we offer at Corbado.
Google:
GitHub:
Corbado:
Technical Consideration:
For this to function smoothly, the web application must recognize the users device as Conditional UI compatible and start the passkey creation ceremony. This will typically involve leveraging the WebAuthn API to generate public- private key pairs that constitute the passkey, which will be stored securely on the users device. The users identity is then verified via biometrics or another secure method, after which the passkey is bound to their account for future login attempts.
Pros:
Cons:
Google's passkey explainer:
KAYAK's straight-forward passkey creation:
Consider a user who has an account but isnt logged in. Upon visiting the login page, a conditional UI popup detects a passkey-compatible device and suggests creating a passkey. Technically, this requires a bit more nuance. The website would need to execute a robust yet user-friendly mechanism to link the newly created passkey with the existing user account. This necessitates a two- step process: a legacy authentication method to verify the users identity followed by the passkey binding to the users account.
Technical Consideration:
This process hinges on the successful execution of a legacy login (perhaps via legacy password, an OTP or email magic link) to ensure that the user creating the passkey is the legitimate owner of the account. Subsequently, the service provider must seamlessly transition the user from the legacy authentication method to passkey-based authentication, storing the new credentials securely. This is also what the recent Explainer for Conditional Registration Extension proposes.
The flow in the proposed extension looks like this:
Pros:
Cons:
Following discussions of the FIDO working group, apparently, many members actually favor this use case. In particular, Apple often quite silent in public FIDO discussions is very bullish on this scenario (also shown that the Conditional Registration Extension explainer was created by an Apple employee). For a better understanding of the reasoning behind the extension, see this GitHub discussion.
This scenario simplifies the sign-up process to a considerable extent. A new user, upon visiting a website, encounters a passkey creation prompt that could be activated by simply browsing or during engagement with cookie and privacy consents. The user authenticates biometrically, and an account is created behind the scenes. This initial interaction does not necessitate the provision of an email address, deferring that step until the user opts into features that require email communication.
Technical Consideration:
From a technical standpoint, the website would generate a unique identifier for the user (it could also use the credential ID of a passkey) upon successful biometric authentication and tie this to the passkey. This sets up a minimalistic, yet secure, account that can later be expanded with additional user information as needed. This would be particularly advantageous for e-commerce websites looking to streamline the checkout process.
Pros:
Cons:
The tone of FIDO working group discussions regarding this use case is rather negative, as its actually almost possible today without a new introduction of this mode, see this GitHub discussion for more background information.
The path to integrating Conditional UI in sign-up processes requires thoughtful design decisions, from potential dual-purpose API calls to managing user interaction without friction. Here are the architectural aspects that need to be considered:
Passkeys Registration and Conditional UI represent new challenges, but also new opportunities to help passkeys become more widely adopted. As we look to the horizon, it's clear that these advances are not a matter of 'if' but 'when'. The scenarios we've explored today could very well define the next wave of passkey adoption among more users, shaping a future where security, convenience, and user experience converge seamlessly from the very first interaction.
Table of Contents
Enjoyed this read?
🤝 Join our Passkeys Community
Share passkeys implementation tips and get support to free the world from passwords.
🚀 Subscribe to Substack
Get the latest news, strategies, and insights about passkeys sent straight to your inbox.
We provide UI components, SDKs and guides to help you add passkeys to your app in <1 hour
Start for free
Recent Articles
WebAuthn Conditional UI (Passkeys Autofill) Technical Explanation
Vincent - October 20, 2023
WebAuthn Relying Party ID (rpID) & Passkeys: Domains & Native Apps
Vincent - September 21, 2023