The American Medical Association
Single-Sign-On Portal for the AMA
To access digital products such as the Journal of the American Medical Association the American Medical Association offers free accounts to its users. Users create and access their accounts through the single-sign-on portal.
Scope
Visual Design, UX Design
Audience
Physicians, Residents and Medical Students
Duration
2 weeks
My role
Visual & UX Designer II
Team
Other UX designers: M. Ivy, J. Pencak; Product Manager: S. Raza; Developers: E. Horne, J. Contreas
Background
The AMA created the single-sign-on portal to help users access all the AMA’s digital products. AMA’s digital products are all built on different platforms. Before I started working at the AMA, users had separate logins for each product. To remove the burden of the user having to store that much information, the product and IT teams came together to create a unified single-sign-on experience. This made it easier for members to access all their benefits on separate products.
The Challenge
I live on the enterprise product team. One of the main goals of our team is to unite all AMA digital products under the AMA umbrella through product and design consistency. To achieve that goal, we created a unified design system with the help of a consulting designer. The single-sign-on product team came to our team with a request to add new functionality. They wanted to help doctors recover their accounts that they had originally set up with emails they had lost access to.
The Opportunity
With this project, we were hoping to land two small wins. First, we complete their request by helping doctors who had lost access to an old email address reach their accounts. Second, we meet our team's goals by bringing the SSO designs up to date with the rest of the website. At the AMA, we have an "update as we go" approach to our work. So this seemed like a good opportunity to redesign screens related to this flow. The product manager’s excitement for the work prompted us to proceed.
The Approach
For this project, I conducted a comparative analysis. I looked at websites where I held an account, such as Self, The Economist, ActBlue and MIT Tech Review. On each site I created a second account with the same email on them. Finding a exact similar experience proved difficult. So while I did something different, I felt the process was comparable.
Since the original sign-in screen needed a toast, I went ahead and reviewed the data we had on that screen. I also looked at heatmaps and user journeys in Quantum Metrics. Heatmaps showed username/email logins exceeded social logins, prompting a layout switch. To be safe in switching the layout, we conducted an A/B test, which is still ongoing.
Direct Path
To think out all the steps, I created a wireflow. A wire flow helped me verify the path the user was taking made sense. This way I could communicate which screens were necessary and why. The password reset screen was on the user’s path to combining their two accounts, so I improved it. To help users navigate this complex task, I advocated for guiding them down one path rather than overwhelming them with options.
Well Lit Exit Signs
To create a frictionless experience every screen has an easy way to opt out of the flow and easy access to help.
Information on how to access help and support is displayed on every screen.
A white close icon in the top right-hand corner gives users the option to leave at any time.
Accessibility Features
In these designs, like every design I work on, I followed best accessibility practices. Some of the accessibility features are highlighted in the image below. When the development of this project is complete, I plan to check the designs with a screen reader while conducting user acceptance testing.
The American Medical Association
Single-Sign-On Portal for the AMA
To access digital products such as the Journal of the American Medical Association the American Medical Association offers free accounts to its users. Users create and access their accounts through the single-sign-on portal.
Scope
Visual Design, UX Design
Audience
Physicians, Residents and Medical Students
Duration
2 weeks
My role
Visual & UX Designer II
Team
Other UX designers: M. Ivy, J. Pencak; Product Manager: S. Raza; Developers: E. Horne, J. Contreas
Background
The AMA created the single-sign-on portal to help users access all the AMA’s digital products. AMA’s digital products are all built on different platforms. Before I started working at the AMA, users had separate logins for each product. To remove the burden of the user having to store that much information, the product and IT teams came together to create a unified single-sign-on experience. This made it easier for members to access all their benefits on separate products.
The Challenge
I live on the enterprise product team. One of the main goals of our team is to unite all AMA digital products under the AMA umbrella through product and design consistency. To achieve that goal, we created a unified design system with the help of a consulting designer. The single-sign-on product team came to our team with a request to add new functionality. They wanted to help doctors recover their accounts that they had originally set up with emails they had lost access to.
The Opportunity
With this project, we were hoping to land two small wins. First, we complete their request by helping doctors who had lost access to an old email address reach their accounts. Second, we meet our team's goals by bringing the SSO designs up to date with the rest of the website. At the AMA, we have an "update as we go" approach to our work. So this seemed like a good opportunity to redesign screens related to this flow. The product manager’s excitement for the work prompted us to proceed.
The Approach
For this project, I conducted a comparative analysis. I looked at websites where I held an account, such as Self, The Economist, ActBlue and MIT Tech Review. On each site I created a second account with the same email on them. Finding a exact similar experience proved difficult. So while I did something different, I felt the process was comparable.
Since the original sign-in screen needed a toast, I went ahead and reviewed the data we had on that screen. I also looked at heatmaps and user journeys in Quantum Metrics. Heatmaps showed username/email logins exceeded social logins, prompting a layout switch. To be safe in switching the layout, we conducted an A/B test, which is still ongoing.
Direct Path
To think out all the steps, I created a wireflow. A wire flow helped me verify the path the user was taking made sense. This way I could communicate which screens were necessary and why. The password reset screen was on the user’s path to combining their two accounts, so I improved it. To help users navigate this complex task, I advocated for guiding them down one path rather than overwhelming them with options.
Well Lit Exit Signs
To create a frictionless experience every screen has an easy way to opt out of the flow and easy access to help.
Information on how to access help and support is displayed on every screen.
A white close icon in the top right-hand corner gives users the option to leave at any time.
Accessibility Features
In these designs, like every design I work on, I followed best accessibility practices. Some of the accessibility features are highlighted in the image below. When the development of this project is complete, I plan to check the designs with a screen reader while conducting user acceptance testing.
The American Medical Association
Single-Sign-On Portal for the AMA
To access digital products such as the Journal of the American Medical Association the American Medical Association offers free accounts to its users. Users create and access their accounts through the single-sign-on portal.
Scope
Visual Design, UX Design
Audience
Physicians, Residents and Medical Students
Duration
2 weeks
My role
Visual & UX Designer II
Team
Other UX designers: M. Ivy, J. Pencak; Product Manager: S. Raza; Developers: E. Horne, J. Contreas
Background
The AMA created the single-sign-on portal to help users access all the AMA’s digital products. AMA’s digital products are all built on different platforms. Before I started working at the AMA, users had separate logins for each product. To remove the burden of the user having to store that much information, the product and IT teams came together to create a unified single-sign-on experience. This made it easier for members to access all their benefits on separate products.
The Challenge
I live on the enterprise product team. One of the main goals of our team is to unite all AMA digital products under the AMA umbrella through product and design consistency. To achieve that goal, we created a unified design system with the help of a consulting designer. The single-sign-on product team came to our team with a request to add new functionality. They wanted to help doctors recover their accounts that they had originally set up with emails they had lost access to.
The Opportunity
With this project, we were hoping to land two small wins. First, we complete their request by helping doctors who had lost access to an old email address reach their accounts. Second, we meet our team's goals by bringing the SSO designs up to date with the rest of the website. At the AMA, we have an "update as we go" approach to our work. So this seemed like a good opportunity to redesign screens related to this flow. The product manager’s excitement for the work prompted us to proceed.
The Approach
For this project, I conducted a comparative analysis. I looked at websites where I held an account, such as Self, The Economist, ActBlue and MIT Tech Review. On each site I created a second account with the same email on them. Finding a exact similar experience proved difficult. So while I did something different, I felt the process was comparable.
Since the original sign-in screen needed a toast, I went ahead and reviewed the data we had on that screen. I also looked at heatmaps and user journeys in Quantum Metrics. Heatmaps showed username/email logins exceeded social logins, prompting a layout switch. To be safe in switching the layout, we conducted an A/B test, which is still ongoing.
Direct Path
To think out all the steps, I created a wireflow. A wire flow helped me verify the path the user was taking made sense. This way I could communicate which screens were necessary and why. The password reset screen was on the user’s path to combining their two accounts, so I improved it. To help users navigate this complex task, I advocated for guiding them down one path rather than overwhelming them with options.
Well Lit Exit Signs
To create a frictionless experience every screen has an easy way to opt out of the flow and easy access to help.
Information on how to access help and support is displayed on every screen.
A white close icon in the top right-hand corner gives users the option to leave at any time.
Accessibility Features
In these designs, like every design I work on, I followed best accessibility practices. Some of the accessibility features are highlighted in the image below. When the development of this project is complete, I plan to check the designs with a screen reader while conducting user acceptance testing.
The Metrics
One of the main issues we were trying to solve is when users created their accounts with an email they lost access to, for instance, a school-issued email address. Below I've listed some of the metrics I'll watch once the development on this project is complete.
How many users successfully update their email address
How many people reset their password instead of creating a new account
Whether login completion rates improve after launch
How many users are contacting support for this specific issue after launch
