Show register and sign in buttons (bug 1072619)

[mstriemer]

https://bugzilla.mozilla.org/show_bug.cgi?id=1072619

1140px wide

768px wide

320px wide

[mstriemer]

As much as I liked this...

[ngokevin]

Do the elements still shift over? The spinner should keep the same width.

[mstriemer]

No, they stay put now.

[cvan]

you missed a page:

https://github.com/mozilla/fireplace/blob/master/src/templates/user/purchases.html#L50

[ngokevin]

Unless it was requested by UX, I don't think we need the between border/hr in between the Register and Sign In buttons on mobile. Not a big deal.

[cvan]

is there a way for Fireplace to detect if the user has previously signed in to FxA before? because if so, we could make the "Sign In" button more prominent than the "Register" button. and if we think the user hasn't logged in/registered before, then we can show the "Register" button more prominently. (this is what I've done when I used Persona for a personal project.)

and this is kind of what https://accounts.firefox.com/ does behind the scenes.

[cvan]

I haven't been watching the bugs – and I'm saying we shouldn't do this – but what does this achieve over what we have today?

[ngokevin]

r+wc+testfix from me

[cvan]

r- from me – pending mocks, header adjustments, changes to My Purchases page (and test fixes)

[mstriemer]

is there a way for Fireplace to detect if the user has previously signed in to FxA before? because if so, we could make the "Sign In" button more prominent than the "Register" button. and if we think the user hasn't logged in/registered before, then we can show the "Register" button more prominently. (this is what I've done when I used Persona for a personal project.)

We currently do this detection to decide whether or not to show the migration banner. How are you envisioning we make one more prominent? Swap "Sign In" for "Register" if we've never seen them before? Or just make one a button and one not?

[mstriemer]

I haven't been watching the bugs – and I'm saying we shouldn't do this – but what does this achieve over what we have today?

With Persona I don't think it sign in or sign up makes a difference but with Firefox Accounts they are two separate pages. This is just moving the decision to the start of the authentication flow instead of dropping the user at sign in and making them hunt for the "Create an account" link.

That being said, perhaps we could have one button with our best guess of what the user needs to do. That would be a little weird though if you get "Register" and you know you have an account.

[mstriemer]

I can't make these buttons look like account settings at desktop width. I give up.

[mstriemer]

Updated 320px wide settings page.

[mstriemer]

@cvan How's it look now?

[cvan]

I still don't see mocks or an explanation of why we're doing this.

[mstriemer]

With Persona I don't think it sign in or sign up makes a difference but with Firefox Accounts they are two separate pages. This is just moving the decision to the start of the authentication flow instead of dropping the user at sign in and making them hunt for the "Create an account" link.

Mock: https://bug1072619.bugzilla.mozilla.org/attachment.cgi?id=8502489

[cvan]

the button looks better - closer to the button in the mocks. your button seems to have 1px or 2px more padding on the bottom than the top, but it overall looks better.

[cvan]

the buttons on the My Apps page in the island could use some padding, bro

[mstriemer]

I tried to make those each 50% width like the settings page but couldn't make it work for the life of me.

[cvan]

just add like 10px or 15px padding

[mstriemer]

[mstriemer]

I forgot to waffle the changes. They're waffled now. I left "Sign In" as a button in the header.

[cvan]

so no "Register" button?

[mstriemer]

We'll only show it when we're going to do the fxa oauth flow.

[mstriemer]

Since the other flows don't have separate sign in and register pages.

[pwalm]

Was just going to ask the same thing! Register can be a text link, though. Actually, lemme find out which is the priority. Usually, "Register" is the CTA, with "Sign in" being a text link. Scratch that, I'm making the call: Register in a button, Sign in is a text link.

[cvan]

Was just going to ask the same thing! Register can be a text link, though. Actually, lemme find out which is the priority. Usually, "Register" is the CTA, with "Sign in" being a text link. Scratch that, I'm making the call: Register in a button, Sign in is a text link.

That makes sense for first-time users. But what about returning users who are logged out? Why would the Register button be more prominent? This seems to make sense only in the first case.