UI bugs on Homepage

[vvvk-gh]

Bad UX , UI Bugs in Coding Blocks Part -1

Home Page

Url : Link

1. Banner

   • Upon opening the homepage, we observe a banner showcasing the current offers running in the coding blocks followd by a navigation bar in expand mode. Well, when we try to close the banner the navbar is still in collapsed state (but banner working fine in Online Coding Blocks , Hackerblocks pages).

        Intial state : Fig 1  , End state : Fig 2 

   • Nav links are also not visible as it overlapping with carousel Images, compare Fig 1 and Fig 2 the nav links are visible in Fig 2 but not in Fig 1

     Fig 1 :

     

     Fig 2 :

     

   Why to fix :

   • This is a very good example for a bad UX.
   • Homepage is the very first page that the user interacts with and this should be perfectly designed and developed or else this creates a very bad experience to the user.

   Suggestion :

   • Fix the banner or use modals, popups
   • Use images with better backgrounds in carousel that makes the nav links visible

2. NavBar

   • The Navbar is holding too much information and too many dropdowns menus

     Fig 3 :

     

   Why to fix :

   • We are actually forcing the user to go through a lot information and this misguides his main purpose on visting our website.

   • All links mentioned in dropdown menus of Live courses , Classroom courses are already represented in the form of cards in the same page and also in the footer so its gives a clumsy experience to the user.

   Suggestion :

   • Remove Dropdown menus of Live Courses , Classroom Courses etc
   • Use simple navigation bar with the section names
   • Use Smooth Scroll Navbar : As the data in the links is already represented in the form of cards below , have a navbar with the section names and upon clicking on section names it should scroll to those section showing all the courses

3. Team

   • Text is not properly wrapped in founder's description and also in few other cards.

     Fig 4 :

     

   Why to fix :

   • Everybody is interested in reading the story of founders, co-founders of the company.
   • Facing readability issues in these cases need to be fixed (First card)

   Suggestion :

   • Add proper word spacing and justification
   • Try to have a lightbox or modals to display the description or try to tell a short story in one paragraph

4. Maps

   • Google Maps is not working

     Fig 5 :

     

   Why to Fix :

   • Working contact details like user forms and google maps locations makes the company trustworthy and it creates reassurance relif to the user.

   Suggestion :

   • If something is on our webpage that should be working properly or else remove it.
   • Simple buttons which redirects to the campus location also works fine as it's fulfilling the user needs.

5. Footer

   • Too much information , Not properly aligned social icons , data repetation

   Fig 6 :

   

   Why to fix :

   • I personally hate it as a daily visitor / user .
   • I feel like all data in the footer is repeated i know footer gives the quick links to access data faster but you have those links or data all over the page or also in navigation.

   Suggestions :

   • If your are planning to provide same links in the navbar please replace this rich footer with a simple one
   • We can totally remove the twitter feed in
   • Properly align the social icons
   • Plan for one that looks like a footer in Online Coding Blocks page.

6. Section Headings Alignment

   • I have observed all the section headings like Live Courses , Classroom Courses ,Team are aligned to center of the page but not for Numbers speak louder and What our students say sections

   Why to Fix :

   • Inconsistency is a very bad pratice in the UX , always title Typefaces , Fontsizes , Alignments should be same
   • This can see seemed as minor bug but it will have huge impact on user experience.

   Suggestion :

   • Maintain consistency in Typefaces , Margins , Aligments , Sizes , Fontstyles atleast for the same kind of elements on the page

[boss-contributions-bot[bot]]

Thanks @vvvk-gh, for raising the issue! 🙌

One of our mentors will revert on this soon. ✅

Star ⭐ this project and tweet 🐦 about BOSS 2020.