UX Guidelines

Implementing Firefox Accounts into your service, product or feature

A Firefox Account enables a wide variety of experiences. It can be used to access websites (like Add-ons), connect devices (using Sync). Because the reasons users are authenticating vary widely, the calls to action require appropriate surrounding context; at the same time, you should aim to be present these calls to actions consistently.

Communicate accounts consistently

Sync Access your bookmarks, passwords and open tabs and more on any device connected to your Firefox Account.
Firefox Hello Call your favorite people directly and take your conversations with you on any device connected to your Firefox Account.
Find My Device Locate any phone connected to your Firefox Account — lock it or even erase it remotely.
Mozilla Stumbler Add your contributions to the leaderboard of any device connected to your Firefox Account.
Reading List Access your Reading List and more on any device connected to your Firefox Account.
Add-ons Access your add-ons connected to your Firefox Account.

Choose Appropriate Calls to Action
Context	Primary action	Secondary action
With ideal amount of space	Create a Firefox Account	Sign in
With less–than–ideal amount of space	Create account	Sign in
With only space for one call to action	Use a Firefox Account	N/A
When existing account is more likely to exist	Sign in	Create a Firefox Account
With less space	Sign in	Create account
When user is signed in to other service	Sign in as [email protected]	Use a different account
Without value proposition, i.e. low context	Sign in to Sync	Create account

Accommodate Additional States
Context	Primary action	Secondary action
User is unverified (has not yet verified their Sync account)	Resend verification	Remove account
User has a verified Sync account	Manage account	Sign out
User has Hello account, but not Sync	Sign in as [email protected]	Use a different account
User has an unauthorized account	Reconnect to Sync	Remove account
User was logged in, but signed out	Sign in as [email protected]	Use a different account

Suit contexts of a Firefox Account

Required → Optional
Some experiences, like a website, require authentication for entry, while others can be used without.
To enable features → To connect devices
Sometimes authentication unlocks a feature in a product, like contact import in Hello, while other times it is used for syncing with other devices.
Web-only → OS-specific
Sometimes you are just logging into a website, and other times you are enabling a feature on an Android app.
Low context → High context
Users sometimes need an explanation for exactly why they should log in (“What does Sign in to Firefox do?”), whereas other times they implicitly understand what signing in does.

UX Guidelines

Implementing Firefox Accounts into your service, product or feature

Communicate accounts consistently

Suit contexts of a Firefox Account

Document Tags and Contributors