coding-blocks / coding-blocks/codingblocks.com1

UI bugs in Login page

Open
#911 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
HTML
Stars
58
Forks
168
PR merge metrics
No merged PRs in 30d

Description

# Bad UX , UI Bugs in Coding Blocks part - 3

## Login Page

#### Url : [Link](https://account.codingblocks.com/login)

1. Navbar Logo

* Logo is too small compared to remaining pages in coding blocks

Why to fix :

* As logo represents the brand entity it should be maintain same size in all pages

Suggestion :

* Make it similar to [Home page](https://codingblocks.com/) , [Online Coding blocks](https://online.codingblocks.com/) navbar logos.

2. Login Form

* Line Height / Padding issues while filling the form
* Use better a sentence like try our easy login , Quick login instead saying You may also try login with:
* Hover effects on social icons
* Login with email section provide you an option to login with otp but login with otp page doesn't provide you an option to switch back to login with email(Observe Fig 1 and Fig 2 for better understanding).
* Typo in the Title (Fig 3)

Fig 1 :

![Login_Email_Img](https://i.ibb.co/qk7vXK5/Screenshot-2020-09-20-Login-Coding-Blocks-Account-1.png)

Fig 2 :

![Login_otp_Img](https://i.ibb.co/5RXK2fm/Screenshot-2020-09-20-Login-with-OTP.png)

Fig 3 :

![TitleName_img](https://i.ibb.co/S0r6Zbx/Screenshot-35.png)

Suggestions :

* The text in the input fields are not aligned to center of the text box proper padding or line height can fix this issue
* Words , Sentences really create a large impact on the user so use words like Easy Login . Quick Login instead of You may also try login sentences
* Hover effects on social icons really catches user attention(change backround ground color on hover)
* We can never predict user actions, if a user is facing issues with otp he may switch back login via email approach so please provide an button to redirect to login via email in login via otp page.
* Instead of a text displaying "OTP works only for 10 min" replace with an actual timer
* Fix the Title Name in the title bar (Fig 3)

3. Register Form

* Inconsistency in input text color and dropdowns text color

Fig 4 :

![Register_Form_Img](https://i.ibb.co/DrSwGz1/Screenshot-2020-09-21-Signup-Coding-Blocks-Account.png)

Suggestions :

* Maintain same text color all over the form.
* If possible maintain an vertical form instead of a horizontal form because most of the users gets confused with their progress in horizontal forms.
* Phone number dropdown down arrow is overlapping with the text/options.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.