Page MenuHomePhabricator
Create Task
Maniphest T353009

The TOC v/s Main menu buttons are too similar
Open, Stalled, LowPublicBUG REPORT
Actions

Description

Steps to replicate the issue (include links if applicable):

  • Open a main namespace page in Vector 22 with both the main menu and TOC collapsed
  • Scroll down

What happens?:
Currently, the main menu icon and TOC icon in V_22 look really really similar. This makes it really easy for one icon to be mistaken for the other and allows for misclicks in someone is not paying attention.

Screenshot from 2023-12-07 19-04-05.png (149×365 px, 14 KB)

Additionally, when a person scrolls down, a floating header appears in this configuration

Screenshot from 2023-12-07 19-07-48.png (224×362 px, 29 KB)

Unless you have some prior familiarity with the interface (and are paying super good attention), it is easy to mix up whether this specific button is the main menu button or the TOC button (again due to their similarity)

What should have happened instead?:
Something/anything else (Maybe the icon could be different)

Software version (skip for WMF-hosted wikis like Wikipedia):

Other information (browser name/version, screenshots, etc.):

Event Timeline

Soda created this task.Dec 7 2023, 6:12 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptDec 7 2023, 6:12 PM
Soda renamed this task from Rethink/Redesign the TOC v/s Main menu buttons to The TOC v/s Main menu buttons are too similar.Dec 7 2023, 6:12 PM
Soda attached a referenced file: F41570928: Screenshot from 2023-12-07 19-04-05.png. (Show Details)Dec 7 2023, 9:59 PM
Novem_Linguae subscribed.Dec 7 2023, 10:16 PM
Mabualruz added a project: Web-Team-Backlog.Dec 8 2023, 2:21 PM
Sukriti-m subscribed.Dec 15 2023, 7:33 AM

Hey @Soda

I'd like to work on this issue. Can you please assign it to me? I have a few design ideas in mind to differentiate between the main menu icon and the TOC icon.

Restricted Application added a comment. · View Herald TranscriptDec 15 2023, 7:33 AM

Hi and thank you for your interest! Please check thoroughly https://www.mediawiki.org/wiki/New_Developers (and all of its communication section!). The page covers how to get started, assigning tasks, task status, how to find a codebase, how to create patches, where to ask general development questions and where to get help with setup problems, and how to ask good questions. Thanks a lot! :)

ovasileva changed the task status from Open to Stalled.Dec 15 2023, 8:47 AM
ovasileva added subscribers: JScherer-WMF, ovasileva.
In T353009#9408545, @Sukriti-m wrote:

Hey @Soda

I'd like to work on this issue. Can you please assign it to me? I have a few design ideas in mind to differentiate between the main menu icon and the TOC icon.

Hi @Sukriti-m, @Soda - thank you for raising this! Before we take any action on this, we'd like to have a review from our designer @JScherer-WMF who can provide some thoughts and potential suggestions.

Restricted Application added a comment. · View Herald TranscriptDec 15 2023, 8:47 AM

Hi and thank you for your interest! Please check thoroughly https://www.mediawiki.org/wiki/New_Developers (and all of its communication section!). The page covers how to get started, assigning tasks, task status, how to find a codebase, how to create patches, where to ask general development questions and where to get help with setup problems, and how to ask good questions. Thanks a lot! :)

Sukriti-m added a comment.Dec 15 2023, 8:09 PM

@ovasileva Sure, no problem

Jdlrobson moved this task from Incoming to FY2023-24 Q3 Sprint 1 on the Web-Team-Backlog board.Dec 18 2023, 6:48 PM
Jdlrobson edited projects, added Web-Team-Backlog (FY2023-24 Q3 Sprint 1); removed Web-Team-Backlog.
ovasileva assigned this task to JScherer-WMF.Jan 4 2024, 1:48 PM
ovasileva moved this task from Incoming to Design Review on the Web-Team-Backlog (FY2023-24 Q3 Sprint 1) board.Jan 4 2024, 4:47 PM
Jdlrobson triaged this task as Medium priority.Jan 8 2024, 7:07 PM
Jdlrobson moved this task from Design Review to Ready for Development on the Web-Team-Backlog (FY2023-24 Q3 Sprint 1) board.
Jdlrobson edited projects, added Web-Team-Backlog (FY2023-24 Q3 Sprint 2); removed Web-Team-Backlog (FY2023-24 Q3 Sprint 1), Desktop Improvements (Vector 2022).Jan 18 2024, 7:16 PM
Jdlrobson moved this task from Incoming to Design Review on the Web-Team-Backlog (FY2023-24 Q3 Sprint 2) board.Jan 29 2024, 4:15 PM
JScherer-WMF added a comment.Jan 29 2024, 5:44 PM

Hi @Sukriti-m, @Soda - thanks again for taking this on. Could you document your ideas for this on this ticket? Normally our design process involves trying out multiple versions of a solution, getting feedback from other designers, and then working iteratively to the best possible solution. I'd love to see what you have in mind.

Jdlrobson moved this task from Design Review to Ready for Development on the Web-Team-Backlog (FY2023-24 Q3 Sprint 2) board.Jan 30 2024, 5:41 PM
JScherer-WMF moved this task from Ready for Development to Blocked on Others on the Web-Team-Backlog (FY2023-24 Q3 Sprint 2) board.Feb 5 2024, 5:46 PM

Waiting for designs to review with rationale.

JScherer-WMF reassigned this task from JScherer-WMF to Soda.Feb 5 2024, 5:46 PM
Jdlrobson lowered the priority of this task from Medium to Low.Feb 5 2024, 6:43 PM
Jdlrobson edited projects, added Web-Team-Backlog; removed Web-Team-Backlog (FY2023-24 Q3 Sprint 2).Feb 7 2024, 10:43 PM
Jdlrobson moved this task from Incoming to Not ready to estimate on the Web-Team-Backlog board.
Jdlrobson moved this task from Not ready to estimate to Groomed on the Web-Team-Backlog board.Mar 19 2024, 5:19 PM
Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL