XLabs / wormscan-ui

5 stars 3 forks source link

Optimize Mobile Menu Organization for Enhanced User Experience #599

Open SamantaCasal opened 6 months ago

SamantaCasal commented 6 months ago

Description

This task focuses on reorganizing the mobile menu of our explorer to significantly improve the user experience by offering a more organized and straightforward navigation structure.

Currently, the menu presents mixed information, leading to a less intuitive user interface:

Image

Goals

We aim to address this by clearly categorizing and ordering menu items, ensuring users can easily access and understand the different sections of the explorer. The reorganization will include specific changes to display menu items in a logical order and introduce submenus for a cleaner, more accessible layout.

Acceptance Criteria

  1. Menu Order Adjustment: Update the mobile menu to display items in the following order: Home, Transactions, Dev Tools (with a dropdown icon), Terms of Use, Chain Network (dropdown), and Join Us (with current icons).
  2. Dev Tools Dropdown Menu: Implement a dropdown submenu under Dev Tools that includes the sections: VAA-PARSER, Wormhole Docs, and API Docs. Ensure the dropdown functionality is intuitive and touch-friendly.
  3. Visual Consistency and Icons: Maintain visual consistency throughout the menu, especially for dropdowns and icons. Use clear and recognizable icons for the Dev Tools dropdown and Join Us sections.

Resources

Figma Drodpdown design: https://www.figma.com/file/kVuUyVjFFcRP55xHxHoKtH/WormholeScan?type=design&node-id=745-18228&mode=design&t=YmARZGahiJyGeAR7-4

SamantaCasal commented 6 months ago

ok !

Image