search

camicroscope / caMicroscope

Digital pathology image viewer with support for human/machine generated annotations and markups.
BSD 3-Clause "New" or "Revised" License
247 stars 286 forks source link

Redesign Navbar for Improved User Experience and Brand Recognition #720

Open SisiVero opened 5 months ago

SisiVero commented 5 months ago

I propose a redesigned navbar for the caMicroscope platform to enhance user experience and brand recognition. Here are the details of the proposal:

Background: Current navbar design lacks a logo and relies solely on icons and text for navigation. Text labels can enhance clarity, especially for new users encountering the platform. Additionally, the current light mode navbar color might not be optimal for a future dark mode implementation.

Use Cases:

Improved User Experience: Text labels provide clear navigation cues, especially for users unfamiliar with the platform's functionalities.

Enhanced Brand Recognition: A prominent logo reinforces brand identity and memorability.

Accessibility: Text labels cater to users who might have difficulty interpreting icons alone.

Cohesive Dark Mode Support: A light navbar background color would provide better contrast in a future dark mode implementation.

Implementation:

Integrate a logo next to the current navbar text on the left side.

Remove icons from the navbar menu and rely solely on clear and concise text labels for navigation options.

Update the navbar background color to a light shade that offers good contrast in both light and dark modes (consider color palette tools for guidance). Expected Impact:

Increased User Friendliness: Clear navigation with text labels simplifies user journeys and reduces confusion.

Stronger Brand Identity: A logo fosters brand recognition and memorability.

Improved Accessibility: Text labels ensure inclusivity for users who rely on them for navigation.

Seamless Dark Mode Transition: A light navbar background color lays the groundwork for a future dark mode with good contrast.

The provided CodePen link (https://codepen.io/SisiVero/pen/XWQdJdm) can be referenced for a potential visual representation of the proposed navbar design

Arnav2824 commented 5 months ago

Hey @SisiVero, I would like to be assigned with this issue.

SisiVero commented 5 months ago

Hi @Arnav2824 , read this, it's about working on an issue: https://github.com/orgs/camicroscope/discussions/710#discussion-6344451