Improve discovery of the quick account switcher

[mary-ext]

This pull request makes the following changes:

• Show a chevron beside the profile icon to show that you can indeed, quickly switch accounts.
• ~~Only allow quick account switcher open if there's multiple accounts~~

Light	Dim

The chevron only appears if there's multiple accounts signed in, if the switcher had the ability to add new accounts I'd probably have it always shown, thoughts? I'll put it in a separate pull request if that's the direction we want.

Additionally, should this be announced in accessibility label as well?

[mary-ext]

CI seems to be broken, unrelated to the PR changes.

[mary-ext]

Actually I might revert the second bullet point, I think the ability to quickly logout is useful too.

[mary-ext]

Heh, this pull request made someone aware of this feature's existence, so I think this is definitely worth pushing forward ^^

[pfrazee]

Hey mary! Not against this idea but not sure that icon is the move. I'd probably just do a chevron up. Even then I'm not sure -- is that enough for people to understand that it's a long press? (Could be just not sure)

[mary-ext]

I wanted to point towards Mastodon's Android app here but I can't seem to find anything that describes why it is.

ref: https://github.com/mastodon/mastodon-android/issues/106

[surfdude29]

Some form of visual indication of the quick account switcher would be great.

I don't know how feasible this is in the UI, but what about something like how GitHub shows co-authored contributions, with the pfp of another of your accounts behind the currently active one?

My thinking is that this would be a good visual indication for the user as to how they can access the quick account switcher and improve discoverability by encouraging them to try long-pressing the icon.

I'm not sure how it would handle more than two accounts though, would it add another pfp behind the second one (up to three max?) or would it only show two at most?

[mary-ext]

The alternative would be to have a onboarding/tour when you login into your second account, might be worth tackling alongside #2802

[mary-ext]

I don't know how feasible this is in the UI, but what about something like how GitHub shows co-authored contributions, with the pfp of another of your accounts behind the currently active one?

Might attempt doing this tomorrow, GitHub Mobile app does this as well when you have multiple accounts signed in. It should be doable.

[mary-ext]

Here's the alternative design as suggested by @surfdude29, this is basing off GitHub Mobile app's design where the secondary account has a slightly smaller avatar.

Theme	Unfocused	Focused
Dark
Light

The border for indicating you're at the profile is thicker at 2px now instead of 1px, this also fixes the weirdness I see around 1px borders where they look somewhat oddly positioned.

I forgot to adjust the relative positioning so it's around 2 pixels off vertically from where it should be.

WDYT?

[pdelfan]

I think the chevron would make more sense if there was an option to add another account on the account switcher modal.

[mary-ext]

Yeah, I might just add that in, I'd probably make the chevron always visible too.

[mary-ext]

It does seem like the avatar stack makes for a busy-looking bottom bar though, a slightly smaller avatar might work, but I do prefer the chevron for the most part.

[surfdude29]

The alternative design based off the GitHub Mobile app's design looks really good, very nicely done @mary-ext 👍

And I think it would make it more likely that a user who has added a second account would figure out how to access the quick account switcher on their own.

However, I think Mary is right that the chevron design looks better overall.

Perhaps going with the chevron design (both chevrons as Mary proposed or with just a chevron up as Paul suggested) and finding a good way to make users aware of the feature would be the best way forward?

And for doing that, what about showing a brief hint, something like: "You can quickly switch accounts by long-pressing your profile picture" immediately after the user adds a second account?

Basically, what Mary suggested previously, and a first step in implementing #2802 (which imo is a very good idea):

The alternative would be to have a onboarding/tour when you login into your second account, might be worth tackling alongside #2802

[pdelfan]

Yeah, I might just add that in, I'd probably make the chevron always visible too.

Yeah that would make sense. It would be good to look at other UI components in the app and see how they handle affordances, especially those designed for power-users which tend to be subtle or hidden away. In general, though, recognition is better than recall.