Google Auth Button Appearance > Blue
nelsonic opened this issue · 2 comments
According to the branding guidelines: https://developers.google.com/identity/branding-guidelines#color
There are two colors the "Sign in with Google" button is allowed to have:
white #FFFFFF and blue #4285F4
The White might look more "neutral" but we feel that the Blue has more contrast against the white background of our App and is a better call-to-action.
Proposed MVP wireframe:
Todo
- add the blue
#4285F4button to our Google Auth flow.
Note: Further down the line we will be A/B testing the copy of the button to determine which is most effective at encouraging people to use their Google Account to authenticate with the @dwyl App.
e.g: "Sign in with Google" vs. "Sign up with Google" etc.
But that will be a separate issue. For now let's just keep this a basic as possible for MVP. 👍
This question was originally posted in: #247 (comment)
Blue #4285F4 button added:
✅
Please note: that I have used an 8kb <img> for the button for the MVP.
It's definitely not a permanent/long-term solution; just an MVP "ship it fast!" implementation.
Image hosted on imgur for free+fast bandwidth: https://i.imgur.com/Kagbzkq.png
I would much rather construct the button out of tachyons classes and only source the Google Logo for the left-hand-side to save bandwidth and make it more "responsive".
If anyone wants to spend the pomodoro attempting to get this working, please do! ⏳
If you're feeling really adventurous, you can create the G-logo using SVG:
https://codegolf.stackexchange.com/questions/95972/draw-the-g-logo
