Enhanced Button Design for Improved User Experience #891
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
This PR is stale because it has been open 45 days with no activity. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Proper spacing added to buttons to minimze chances of misclicking wrong button, Signup button rearragned to center point to minimize user's cursor's travel area. I also added a simple hover effect to the buttons to make the website more feedback-oriented
Motivation
In order to enhance user experience, several improvements have been made to the buttons on the interface. Proper spacing has been added between buttons to reduce the likelihood of accidental clicks on the wrong button, thus minimizing user frustration. Additionally, the Signup button has been strategically repositioned to the center point, reducing the distance the user's cursor needs to travel and aligning with Fitts' law principles for efficient interaction. Furthermore, hover effects have been incorporated to make the buttons more responsive, providing visual feedback to users and improving overall usability. These enhancements collectively aim to optimize user interaction and ensure a seamless and enjoyable experience on the platform.
Testing
Done manually
Screenshot
**Hover effect **
2024-03-28.01-57-42.mp4
Button Spacing
Before
After
Button Centered
Before
After
2024-03-28.01-59-59.mp4