Methodician / guytime

2 stars 0 forks source link

Registration/Login Changes #96

Open bsteinbeigle opened 2 years ago

bsteinbeigle commented 2 years ago

@kaxline attached are some new sketches for the registration pages. You'll notice I labeled one sketch for changes to be made 'near' term and another sketch for long term. Right now the registration pages background is a green to blue fade which I'm suggesting we make all white/off-white. We can delete the bulleted description below the logo/text now that exists. I figured we could use a solid color fill for either the registration or sign-in buttons. The remaining button would just have a color outline around it. I'm not a huge fan of the 'back' button that exists now when selecting either the register or sign-in options. Also, the big change here would be to give a user an account help link should they need to reset their password or username.

unnamed

unnamed (1)

kaxline commented 2 years ago

@bsteinbeigle What do you think of simplifying it like I have below? That way it saves the user a few taps and is in line with what you see on other apps. I've applied an opacity of 50% to the primary action button when the button is disabled. It doesn't look quite right to me with the gradient, but I thought I'd show you what I have so far.

Screen Shot 2021-09-23 at 1 20 50 PM Screen Shot 2021-09-23 at 1 21 13 PM Screen Shot 2021-09-23 at 1 21 31 PM
bsteinbeigle commented 2 years ago

@kaxline I like the simplification done. I agree with your thoughts concerning opacity. If someone was to put in their user name and forgot to put in their password and then hit sign-up It may make sense to highlight the field missing (email or password) in red with a note underneath similar to what is shown now. For example the word 'Email* would turn red signifying a field is missing. IN this scenario I believe the opacity on the sign-up button will work just fine for now. Also, the existing password requirements should also work. I believe he required at least 6 characters if I'm not mistaken. I took a snap shot below of the current login screen and I believe the highlighted text would go well with the semi-opaque sign-up button. I'm not sure if red is the color we should go with but I would argue it probably is the universal color for trouble or error. We can worry about these details down the road. Nice work! Do you believe this new look will look a lot better than the faded background we have now? Also, are you viewing via iOS or android? The reason why I ask is I know with an android phone, Jacob created a launch window with the logo and the word 'guytime' above/below. This will ultimately need to change down the road.

i![image](https://user-images.githubusercontent.com/89544670/134580938-be7c5473-8f2e-4736-ac2c-bfe94fce53e7.png)age

kaxline commented 2 years ago

@bsteinbeigle Ah yeah, those error messages still appear on the form, just like they do in the current app.

I'm taking these from macOS / Firefox, so I haven't seen that launch screen. Want to create a separate task/issue for that so that we don't forget?

I'll move ahead with what I have so far and then we'll see how you like it once you've played with it live.

bsteinbeigle commented 2 years ago

@kaxline you got it. I'll add it to the task/issue list. Sounds good on moving forward.

bsteinbeigle commented 2 years ago

@kaxline Both the top and bottom menus appear in the login page. See snapshot below. Sign-In Top and Bottom Menu Issue

bsteinbeigle commented 2 years ago

@kaxline if it helps with future messaging push notifications lets give the guys the option to include phone number or email when registering a new account.