passkeys product design strategyPasskeys Strategy

Enterprise Passkeys Guide: Part 3 – Product, Design & Strategy Development

Read the enterprise guide on large-scale passkey integration approaches, design of user flows and interfaces, and technical implementation considerations.

Blog-Post-Author

Vincent

Created: October 16, 2024

Updated: December 9, 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 keep you up to date on the latest developments in the industry.

Overview: Enterprise Guide#

1. Introduction#

Implementing passkeys into your large-scale consumer deployment is a significant endeavor that requires careful planning and strategic design. After securing preliminary approval and aligning key stakeholders, the next crucial step is to develop a comprehensive design and development strategy for integrating passkeys into your authentication system.

In this article, we will:

  • Explore passkey integration options: Discuss different approaches to incorporating passkeys into your existing authentication flow, including their benefits and challenges.
  • Emphasize user experience (UX) design: Highlight the importance of designing intuitive user flows across all platforms, including web desktop, web mobile, and native mobile apps.
  • Technical feature considerations: We discuss how to cover all technical features and considerations that arise from your chosen integration strategy and the passkey integration in general.

By carefully designing your passkey integration strategy, you can enhance security, improve user experience, and maximize the benefits of passkeys for both your organization and your users.

2. Choosing the Right Passkey Integration Approach#

Selecting the appropriate integration approach is a critical decision that impacts both the technical implementation and the user experience. There are four major options to consider:

  • Option 1: Passkey Button (Manual approach)
  • Option 2: Identifier-First Approach (Automatic Login)
  • Option 3: Password + Passkey (Second Factor)
  • Option 4: Cross-Device Authentication First (CDA First)

Each option offers different benefits and challenges. Let's examine each approach in detail to help you decide which one aligns best with your organization's goals and your users' needs.

Slack Icon

Become part of our Passkeys Community for updates and support.

Join

2.1 Option 1: Passkey Button (No Identifier-First)#

This approach adds a separate "Continue with Passkey" button on the login screen, alongside existing authentication methods. Users can choose to log in directly with their passkey without first entering their identifier (e.g., email or username).

User Experience:

  • Login: Users click the "Continue with Passkey" button and are prompted to authenticate using their device's biometric or PIN authentication.
  • Passkey Creation: Users are encouraged to create a passkey after logging in with their existing credentials.

Benefits:

  • Simplicity: Easy to implement without significant changes to the existing login flow.
  • User Control: Users explicitly choose when to use passkeys.

Challenges:

  • Lower Passkey Usage: Users may overlook the passkey login option, leading to lower adoption and minimal SMS OTP cost savings.
  • Extra Step: Requires users to make an additional choice, which may add friction.

Example: Australia's myGov portal employs this approach, offering a separate button for passkey login.

Substack Icon

Subscribe to our Passkeys Substack for the latest news, insights and strategies.

Subscribe

2.2 Option 2: Identifier-First Approach (Automatic Login)#

This method asks users to enter their identifier (e.g., email or username) first. The system then determines whether a passkey is registered for that identifier, is accessible on this device via platform or cross-platform authentication and, if so, prompts the user to authenticate with their passkey.

User Experience:

  • Login: Users enter their email or username. If a passkey is available, they are prompted to authenticate using biometrics or PIN. If not, they proceed to enter their password and their second factor.
  • Passkey Creation: Users are prompted to create a passkey after successful login, often with automatic enrollment features.

Benefits:

  • Seamless Experience: Provides a smooth login process with minimal steps.
  • Higher Passkey Usage: Encourages passkey usage by integrating it into the primary login flow.
  • SMS OTP Cost Savings: Increases passkey usage, reducing reliance on SMS OTPs.

Challenges:

  • Account Enumeration Risk: May expose whether an email or username is registered, requiring mitigation strategies to protect user privacy like proactive bot management like Turnstile from Cloudflare.
  • Technical Complexity: Requires more sophisticated logic to handle different authentication scenarios and being able to detect if a passkey is really available at a specific client environment (operating system, operating sytem version, browser, browser version).

Google utilizes this approach, offering an automatic login experience when users enter their email and triggers a passkey authentication only on client environments where accessibility is very probable.

2.3 Option 3: Password + Passkey (Second Factor)#

In this approach, users first enter their password. After successful password entry, they are prompted to authenticate with a passkey as a second factor, replacing SMS OTPs or other MFA methods.

User Experience:

  • Login: Users enter their password. After successful password verification, if a passkey is available, they are prompted to authenticate using biometrics or PIN. If not, they fall back to existing MFA methods like SMS OTP.
  • Passkey Creation: Users are encouraged to create a passkey during the login process to streamline future authentications.

Benefits:

  • Enhanced Security: Maintains two-factor authentication with a phishing-resistant second factor.
  • Easuer transition & User Familiarity: Users continue to use their password, easing the transition including being able to use existing legacy application that cannot be updated on time.

Challenges:

  • Additional Steps: Requires users to enter both a password and a passkey, potentially adding friction.
  • Less passkey convenience & functionality: When using passkeys as second factor, automatic passkey login with One-Tap Passkey Login and Conditional UI / Passkey Autofill cannot be used, because the password needs to be entered first.

An example for this kind of set-up is the implementation of Amazon who requires another authentication step in addition to passkeys.

2.4 Option 4: Cross-Device Authentication First (CDA First)#

This approach focuses on supporting cross-device authentication (CDA) and security keys. It enables users to create and use passkeys on mobile devices or external hardware security keys (e.g., YubiKeys), even when accessing services on devices that do not support passkeys directly making sure no device-bound passkeys are created.

User Experience:

  • Login: Users are prompted to authenticate using a passkey from their mobile device or hardware security key, often by scanning a QR code displayed on the login screen or via paired device at the same time they can opt to use a security key.
  • Passkey Creation: Users are guided to create passkeys on their mobile devices or security keys, facilitating passkey use across devices, most likely during the signup.

Benefits:

  • Broad Device Support: Allows users on devices without passkey support (e.g., older browsers) to still use passkeys via their mobile devices.
  • Security Key Integration: Supports users who prefer physical security keys for authentication.
  • Increased Passkey Adoption: Encourages passkey use by overcoming device compatibility barriers.

Challenges:

  • Complexity: Implementation of cross-device authentication can be more technically complex for the average consumer user.
  • User Education: Requires clear instructions to guide users through the cross-device authentication process.
  • Potential Friction: Scanning QR codes or using external devices introduces additional steps on every authentication.

Finom is a great example that promotes the CDA first approach to register a passkey on a mobile device or on a security key.

Why Are Passkeys Important For Enterprises?

Passkeys for Enterprises

Enterprises worldwide face severe risks due to weak passwords and phishing. Passkeys are the only MFA method that meets enterprise security and UX needs. Our whitepaper shows how to implement passkeys efficiently and what the business impact is.

Passkeys for Enterprises

Download the whitepaper

If you have questions, feel free to  

contact us

2.5 Comparison of Integration Options#

When comparing integration methods, it's essential to consider the specific needs and objectives of your organization, as well as the context in which passkeys will be deployed. The most suitable approach will depend on a variety of factors, including the scale of deployment, security requirements, and technical feasibility. Additionally, the method you choose should align with the desired user experience and balance ease of use with robust security measures. The following table provides a comparative overview of each integration option, highlighting key characteristics and potential trade-offs.

CharacteristicsOption 1: Passkey ButtonOption 2: Identifier-FirstOption 3: Password + PasskeyOption 4: CDA First
DescriptionSeparate passkey login button; users choose passkey login directly.Users enter identifier first; automatic passkey login if available.Passkey used as second factor after password entry.Emphasizes cross-device authentication and security key support.
SMS OTP Savings🔴 Low savings due to low passkey usage.🟢 High savings by increasing passkey login.🟢 High savings by replacing SMS OTP.🟡 Moderate savings; depends on user adoption.
Passkey Adoption (Creation)🟢 High, with prompts to create passkeys.🟢 High, with automatic enrollment features.🟢 High, encourages passkey creation after login.🟢 High, facilitates passkey use across devices.
Passkey Usage (Login)🔴 Low, users may not select passkey option.🟢 High, passkey login is seamless.🟢 High, replaces second factor with passkey.🟡 Moderate, depends on user willingness to use CDA.
User Experience (Login)🔴 Extra step to select passkey login.🟢 Seamless automatic login after identifier entry.🟡 Requires password entry before passkey.🟡 Additional steps for cross-device authentication.
Supports Cross-Device Auth🔴 Limited support.🟡 Possible with additional implementation.🔴 Not focused on CDA.🟢 Yes, emphasizes CDA and security keys.
Security Key Support🟢 Yes, includes support for security keys.🟡 Not the primary focus.🟡 Not the primary focus.🟢 Yes, includes support for security keys.
Account Enumeration Risk🟢 No identifier validation risk.🟡 Possible risk; mitigation needed.🟢 No risk; password step protects account info.🟢 No additional risk; CDA process can be designed securely.

Factors to Consider When Choosing an Integration Approach

When deciding on the best integration method, consider the following factors:

  • Security Requirements: Assess your organization's security policies and potential regulatory requirements.
  • User Experience: Evaluate the impact on user experience, aiming for minimal friction and intuitive interactions.
  • Technical Feasibility: Consider the complexity of implementation and compatibility with your existing authentication system.
  • SMS OTP Cost Savings: If reducing SMS costs is a priority, favor options that maximize passkey usage.
  • Device Compatibility: Determine whether supporting cross-device authentication and hardware security keys is important for your user base (based on the device landscape defined earlier)
  • Account Enumeration Risks: Be mindful of potential privacy risks and implement necessary mitigations.

There are even more ways to integrate passkeys, often using combinations or different approaches depending on the device. Therefore, it is a unique decision for every organization, and there is no single right solution.

StateOfPasskeys Icon

Want to find out how many people can use passkeys?

View Adoption Data

2.6 How Corbado Can Help You#

Corbado brings extensive expertise in implementing all four integration approaches, ensuring that your passkey deployment aligns perfectly with your organization's objectives and technical environment. Corbado Connect can be adopted to suite your needs and all passkeys that have been created will be usable in all scenarios even if your deployment changes in the future.

Our Support Includes:

  • Expert Consultation: We work closely with your team to understand your specific needs and help you choose the integration method that best suits your security requirements, user experience goals, and technical capabilities.
  • Tailored Implementation Strategies: Whether you opt for the Passkey Button, Identifier-First Approach, Password + Passkey method, or CDA First, we provide customized solutions that seamlessly integrate with your existing authentication system and includes our Passkey Intelligence to smooth customer experience.
  • Cross-Device Authentication Expertise: Our components support CDA First approach and CDA in general out of the box, implement cross-device authentication and support for security keys, enhancing accessibility and security for your users.
  • Mitigation of Account Enumeration Risks: For approaches that may introduce account enumeration vulnerabilities, we offer proven strategies and technical solutions to mitigate these risks effectively.
  • Maximizing Passkey Adoption and Usage: Our expertise in user engagement ensures that passkey creation and usage are optimized, leading to higher SMS OTP cost savings and enhanced security.
  • Seamless User Experience: We prioritize creating intuitive and frictionless user flows, enhancing overall satisfaction and reducing barriers to adoption.
  • Technical Support and Resources: Our team provides comprehensive technical assistance, including SDKs, documentation, and best practices, to facilitate a smooth implementation process. More about our SLO/SLA Enterprise offerings can be found here.

By partnering with Corbado, you leverage our deep understanding of passkey technologies and large-scale deployments, ensuring a successful integration that delivers on your strategic objectives.

3. Designing User Flows and Interfaces#

A critical aspect of passkey integration is designing intuitive user flows and interfaces that guide users through the authentication process effortlessly. This requires careful consideration of the user experience across all platforms. The flows heavily depend on the integration support, but some basic considerations relate to all of them.

3.1 Cross-Platform and Browser Considerations#

It's essential to gain a comprehensive understanding of all target platforms, including the most relevant browsers, as they each handle onboarding and passkey creation differently. This includes evaluating web and mobile platforms, as well as different mobile operating systems (iOS and Android). Familiarizing yourself with these variations will help you anticipate how layouts and flows will appear across devices. Reviewing existing prototypes, such as those in Corbado blog reviews of existing implementations or FIDO Alliance materials, can provide valuable insights into user interactions and help inform design decisions.

3.2 Creating Visual Flows#

When creating user flows, build real-world visuals that reflect actual operating system interactions. This includes designing for specific OS input methods and device prompts. Use design tools like Figma or Adobe XD to craft screens that capture key steps in the passkey process, such as login screens, passkey creation flows, and cross-device authentication prompts. The goal is to create high-fidelity mockups that enable a clear understanding of the user journey and interface interactions.

passkeys product visual flows

3.3 Manual Testing and Iteration#

Manual testing is crucial to ensure that the implemented functionality works as expected. This includes testing fallback mechanisms, key passkey features, and cross-device functionality based on your system landscape. Create a thorough test scenario that outlines the scenarios to be tested, such as passkey creation, login, and fallback options like password or SMS OTP. Through this process, you'll identify any usability issues and refine the flows to enhance the overall experience. We are working on a separate article on this topic and will link it here once it is complete.

3.4 Extending Testing with Virtual Authenticators#

To automate tests and enhance coverage, you can use virtual authenticators with tools like Selenium 4 and Playwright. These tools allow you to simulate passkey interactions and test cross-device functionalities across various environments. This approach helps ensure the robustness of your authentication system by validating it against a wide range of potential use cases and device setups.

3.5 How Corbado Can Assist You#

Corbado offers comprehensive support in designing and optimizing user experiences for passkey integration, ensuring that your implementation is intuitive, accessible, and effective across all platforms.

Our Support Includes:

  • Expert UX Consultation: Our UX specialists collaborate with your design and product teams to develop user flows and interfaces that align with best practices and cater to your users' needs, including cross-device authentication and security key usage if nessasary.
  • Pre-Built UI Components: Leverage our library of customizable UI components designed specifically with passkey integration, saving development time, ensuring consistency and allowing for updates required. UI Components are available for Login, Append (Adding Passkeys to existing Accounts) and the Passkey List in account settings.
  • Localization and Internationalization: If your user base spans multiple regions and languages, we help adapt your user interfaces to accommodate cultural differences, language preferences, and support for right-to-left languages.
  • Cross-Platform Design Expertise: We provide guidance on adapting designs for web desktop, web mobile, and native mobile apps, ensuring a seamless experience regardless of the user's device.
  • User Testing Support: We assist in planning and conducting user testing sessions, analyzing results, and applying insights to refine the user experience.
  • Automated Test Implementations for Enterprise Deployments: We provide dedicated automated test implementations for large-scale deployments, ensuring thorough and consistent validation of your passkey functionality across environments.
  • Customization Options with Figma: We offer customization options that we can visualize using Figma, allowing us to tailor the visual design and interactive elements to meet your specific branding and UX requirements.

By partnering with Corbado, you ensure that your passkey integration is not only technically sound but also delivers a user experience that fosters adoption and satisfaction.

4. Technical Implementation Considerations#

The design decisions you make will have significant implications for the technical implementation of passkeys. It's important to collaborate closely with your development team to address these considerations, but next to those design specific things, there a are a lof of technical considerations that we can’t list here completely.

4.1 Components of Technical Implementation Consideration#

There are a lof of technical considerations and a lof of resources on the web that address those issues, we have listed the most important ones. We have written blog posts about most developer areas.

ComponentConsiderations and Actions
WebAuthn Server UpdatesWebAuthn Server Integration
- Incorporate a WebAuthn-compliant server component for passkey registration and authentication.
- Choose compatible server libraries or frameworks (e.g., Node.js, Java, .NET).

WebAuthn Ceremony Settings Configuration
- Define WebAuthn parameters like rpId, user verification requirements, and attestation preferences.
- Ensure settings align with security policies and compliance requirements.
Frontend Application ModificationsWebAuthn API Implementation
- Utilize the Web Authentication API in your frontend JavaScript for passkey creation and authentication ceremonies.
- Handle the public nature of this API carefully to maintain security while providing a smooth user experience.

User Interface Updates
- Update login and registration interfaces to include passkey options.
- Provide clear prompts and guidance to help users create and use passkeys effectively.
Backend Logic AdjustmentsAuthentication Flow Changes
- Modify existing authentication flows to accommodate passkey-based login alongside traditional methods.
- Implement logic to determine when to prompt for passkeys versus other authentication factors.

Credential Management
- Securely store passkey credentials (public keys, credential IDs) in your database.
- Ensure credential storage complies with best practices and data protection regulations.
Database Schema ModificationsData Model Updates
- Extend user profiles to include passkey-related information.
- Plan how existing user data will integrate with new passkey data without disrupting current operations.

Migration Strategy
- Develop a strategy for migrating or updating existing accounts to support passkeys.
- Ensure data integrity and continuity during the transition.
Library and Tooling DecisionsComponent Selection
- Choose appropriate frontend and backend libraries that support WebAuthn and are well-maintained.
- Evaluate options based on compatibility, community support, and compliance with standards.

Tool Integration
- Incorporate tools that assist with development, testing, and deployment of passkey functionalities.
Security EnhancementsSecure Data Handling
- Implement robust security measures for storing and transmitting passkey-related data to improve MFA functionality
- Protect against common threats like replay attacks and man-in-the-middle attacks.
User Experience ConsiderationsFlow Optimization
- Design intuitive user flows for passkey creation and login to minimize friction.
- Consider different user journeys based on device capabilities and user preferences.

Cross-Device Support
- Ensure consistent functionality across various devices and browsers.
- Plan for scenarios where users switch devices or use multiple devices.
Testing and Quality AssuranceComprehensive Testing
- Conduct thorough testing of passkey functionalities, including registration, authentication, and error handling.
- Test across different platforms, browsers, and devices to identify and fix compatibility issues.

Fallback Mechanisms
- Verify that fallback authentication methods work seamlessly when passkeys are not available.
- Ensure users can recover access without compromising security.
Deployment and MonitoringRollout Strategy
- Plan the deployment in phases, possibly starting with a pilot group.
- Monitor system performance and user feedback to make iterative improvements.

Analytics and Reporting
- Implement analytics to track passkey adoption rates and usage patterns.
- Use insights to optimize the system and address any barriers to adoption.

It is beyond this article to describe all parts of the technical implementation, also be sure to address most passkey misconceptions early on.

4.2 How Corbado Supports Technical Implementation#

Corbado provides comprehensive support for your technical teams, ensuring a smooth and secure integration of passkeys into your authentication system.

It Includes:

  • All of the above: By using Corbado, frontend (UI components), backend & deployment are covered by us. All technical complexities are covered by us.
  • Robust SDKs and Libraries: Access our well-documented SDKs and libraries compatible with various programming languages, frameworks and platforms, simplifying the integration process, including cross-device authentication features.
  • Detailed Documentation: Utilize our extensive documentation that covers implementation guides, API references, and best practices to support your development team.
  • Technical Expertise and Support: Our experienced engineers are available to assist with architectural decisions, code reviews, and troubleshooting throughout the implementation.
  • Security Best Practices: We provide guidance on secure credential storage, encryption, and adherence to FIDO2 and WebAuthn standards, ensuring your implementation is resilient against threats.
  • Scalability Solutions: Our infrastructure is designed to handle large-scale deployments, and we offer advice on optimizing performance and scalability for your specific needs.
  • Compliance and Certification: We ensure that our solutions comply with relevant regulations and industry certifications, aiding your organization's compliance efforts.
  • Regular Updates and Maintenance: Stay up-to-date with the latest advancements in passkey technology through our continuous updates and feature enhancements.

By leveraging Corbado's technical resources and expertise, your development team can implement passkeys efficiently and confidently, focusing on delivering a secure and high-performing authentication experience to your users.

5. Conclusion#

Integrating passkeys requires a strategic approach across design, user experience, and technical execution. This guide covered three key areas:

  • Passkey Integration Options: We explored four methods—Passkey Button, Identifier-First, Password + Passkey, and CDA First. Each offers unique benefits, from the simplicity of a Passkey Button to the seamless experience of Identifier-First and the flexibility of CDA First, allowing you to align the implementation with your security and user experience goals.
  • User Experience (UX) Design: A seamless UX is essential for adoption. We discussed cross-platform compatibility, wireframing, and thorough testing to refine interactions across devices. Focus on intuitive flows ensures users engage with passkeys easily, enhancing satisfaction and adoption rates.
  • Technical Feature Considerations: Implementing passkeys involves WebAuthn integration, frontend and backend updates, and strong security practices. Corbado’s solutions cover these complexities, offering a secure, compliant, and scalable deployment.

In sum, selecting the right approach, prioritizing UX, and addressing technical requirements will ensure a successful passkey integration, with Corbado as a partner to streamline this process and maximize benefits.

Share this article


LinkedInTwitterFacebook

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