projectlearn-project-based-learning icon indicating copy to clipboard operation
projectlearn-project-based-learning copied to clipboard

Navbar

Open psankhe28 opened this issue 4 years ago • 14 comments

I would like to redesign navbar.Please assign this issue to me

psankhe28 avatar Dec 15 '21 08:12 psankhe28

Hey, @psankhe28 thanks for your interest in contributing to ProjectLearn.

As a starting step, please share mockup designs of your ideas regarding the Navbar. We can discuss revisions if needed, and then the development of the same can be started.

Xtremilicious avatar Dec 21 '21 16:12 Xtremilicious

So,I would Like to make a navbar in the left side.Initially only the icons will be displayed and on hovering the circles,we will get to see Home,Blog as a whole word like in the below picture:

image

The design will be as follows...also i would like to add animation to the image in that pink box and style the get started button.

image

Please suggest any revision if you want.Thanks!

psankhe28 avatar Dec 27 '21 11:12 psankhe28

Hey, @psankhe28 looks a bit cramped - also have you considered the mobile view?

A navbar redesign like the one below would be ideal. The current navbar elements - Home, blog and Github star count can be centred(you need to keep the GitHub star live count feature as it is) while leaving space for a potential Login button at the right.

2021-12-27 19_39_22-Nav Polish by Alejandro Vizio for Pachama on Dribbble

Here's the full design idea, including mobile view - a hamburger icon to expand menu elements: 2021-12-27 19_42_22-Nav Polish by Alejandro Vizio for Pachama on Dribbble

Xtremilicious avatar Dec 27 '21 14:12 Xtremilicious

The design you have suggested looks great!

If we consider my design,for the mobile view,I think we can have a hamburger icon and a side bar can appear..like the one in below picture

navbar

Also,the navbar can be done for mobile view as it is mentioned above by you.Do consider my design too and please let me know.Thanks!

psankhe28 avatar Dec 27 '21 17:12 psankhe28

@psankhe28 mobile view looks good, however - the desktop view in your design looks a bit cramped, it's better to keep the nav elements as a horizontal bar rather than taking up vertical screen space.

The GitHub star count functionality and styling should be intact, as well.

Xtremilicious avatar Dec 28 '21 05:12 Xtremilicious

Ok fine.I would start working on the design suggested by you

psankhe28 avatar Dec 28 '21 10:12 psankhe28

@psankhe28 any updates till now how much work is done.

heet-kumar avatar Jan 08 '22 07:01 heet-kumar

@psankhe28 any updates till now how much work is done.

I have almost completed it.By tomorrow,i will make a pull request.

psankhe28 avatar Jan 09 '22 16:01 psankhe28

@Xtremilicious Please find the attached screenshot of the navbar and suggest any changes if needed. Thanks!

For desktop: image

For mobile: image

psankhe28 avatar Jan 09 '22 20:01 psankhe28

Hey @psankhe28. I don't feel this is similar to the mockup that was decided upon, as above?

Also a few questions:

  1. How is the UX subjectively better than the original UI that we have in production? For comparison: Untitled-1

The new Navbar looks uneven (dark on light) - not in accordance with the rest of the website's feel.

  1. The GitHub star UI looks much better on the original. image

I hope that you learned something and appreciate the work that you did, but unless your contributions enhance the user experience, it cannot be pushed to production.

What I can suggest right now - is to follow this design solution and try to incorporate it: 147479432-15312b76-bbc6-4069-a0f2-3f7beb03ccd3

Xtremilicious avatar Jan 10 '22 12:01 Xtremilicious

Sry for the inconvenience caused. I will redesign it.

psankhe28 avatar Jan 11 '22 08:01 psankhe28

image image

Please find the attached screenshot of the navbar and suggest any changes if needed. Thanks!

psankhe28 avatar Jan 12 '22 16:01 psankhe28

Hey, @psankhe28 Some elements look misaligned, but let's discuss those over on the PR thread.

Looks good. Please create a PR to the SWOC branch of this project. We can discuss the changes there 👍

Xtremilicious avatar Jan 12 '22 17:01 Xtremilicious

Hi! If this issue is open, I would like to work on it!

nawed2611 avatar Jan 17 '22 13:01 nawed2611