Headspace sign-up page accessibility optimization

Overview:

This project focused on optimizing the accessibility and user experience of the Headspace sign-up page for a free trial. The original design had several accessibility issues and usability flaws that hindered user experience and potentially impacted users with disabilities.

Key Issues:

• Accessibility errors: The page did not meet WCAG standards, with issues such as missing labels, insufficient color contrast, and poor focus and error states.
• Excessive newsletter section: A large portion of the form was dedicated to convincing users to subscribe to the newsletter, pushing the primary CTA and social sign-in buttons below the fold.
• Potentially anxiety-inducing messaging: Declining the newsletter subscription triggered an orange-colored message asking users if they were sure they didn't want to receive updates, potentially creating FOMO (fear of missing out) anxiety.
• Unclear password requirements: The initial password field only displays a minimum character length requirement. Detailed requirements (e.g., lowercase letter, uppercase letter, number, special character) are only displayed as error messages after the user has entered their password, and these requirements are presented in a single-line text format, making them difficult to read and understand.

Implemented Solutions:

Improved accessibility:

• Replaced floating labels with fixed labels outside of the fields for better visibility.
• Increased contrast of labels and field borders to meet WCAG AA requirements.
• Combined "first name" and "last name" fields into a single "full name" field.

Enhanced user experience:

• Replaced the newsletter subscription with a checkbox, providing more control and reducing form length.
• Improved focus and error states by increasing color contrast, adding warning icons, and widening field borders.
• Implemented a real-time, updatable list for password requirements.

Additional Considerations:

• Mental health impact: The original design's newsletter subscription section could potentially generate feelings of guilt or shame, especially for users seeking mental health support.
• Unexpected credit card requirement: After completing the registration, users were directed to a page requiring a credit card to start the free trial, which was not disclosed upfront. Requiring a credit card upfront may be off-putting for users, particularly those in crisis or seeking a low-commitment trial. Offering a credit card-free trial could allow users to appreciate the platform's value and verify if it suits their needs.

Conclusion:

This project demonstrates the importance of considering accessibility and user experience in all aspects of design. By implementing simple yet effective changes, the sign-up page was made more accessible, user-friendly, and respectful of users' mental well-being.