Login Experience Design

Note: Fictional content has been added to all visuals for presentation purposes.

My Role & Process

As a UX designer at a SaaS network creation platform company, I led the design of the login experience for the new platform’s desktop and mobile application. My work on this project included the creation/execution of the following:

• Application requirement reviews

• Functional specifications

• User interface designs

• Prototyping

• Quality assurance

My designs were built using our existing design system componentry and patterns. Throughout this project, I conducted frequent design reviews with program management, design operations, technical communications, and development to ensure that my designs were meeting all requirements and functional specifications. Collaboration between all parties was done in-person, via Slack messages, over email as well as through the Comments feature within Adobe XD prototypes. Once designs were approved, I made the appropriate updates to the functional specifications, and the designs were handed off to development / QA for implementation. With this project, I did work closely with development and QA to resolve a few bugs that arose during implementation.

User Journeys & Workflows

Within this project, I had to consider user journeys for the following workflows:

• Account registration

• Login with multi-factor authentication

• Login without multi-factor authentication

• Forgot / reset password

• Password expired / reset password

I created designs for these workflows which also included error conditions for the following:

• Session expired

• Invalid code

• Invalid format

• Activation link expired

In addition, work on this project also included email template design for the following use cases:

• Reset password

• Account already exists

• Email verification for account registration

User Interface Designs

Reflections & Learnings

This was my first time designing a login experience and I must say that it was a project that seemed simple and straightforward at the beginning, but then turned out to be quite complex. In designing these experiences, I really had to keep focused on the non-happy path, thinking about what could go wrong. There were many nuances and situations that had to be considered. Security was at the heart of this project; some of the most interesting conversations and learnings I had on this project surrounded that topic. I learned about all the moving parts on the back end that have to work together to provide the visually simple and secure experience of logging into the application. This project required a close collaborative relationship with program management, technical communications, security, development, and QA to ensure the designs were correct and within compliance.