search

carbon-design-system / carbon-for-ibm-dotcom

Carbon for IBM.com is based on the Carbon Design System for IBM
https://www.ibm.com/standards/carbon/
Apache License 2.0
269 stars 156 forks source link

Masthead L0 mega-menu UX pattern 1—Left column categories, right column related assets #494

Closed jeffchew closed 5 years ago

jeffchew commented 5 years ago

spbokma created the following on Oct 01:

User story

As a user of IBM.com I need a way to quickly see the type of content and information I’ll find within a specific section of navigation. Informing me to feel confident that I am going to the correct area to find the information I am looking for.

Deliverables

Notes

Exploring different mega-menu options to support different offerings, topics, content types and structural models

IBM.com homepage team has offered support to build/update the masthead navigation and mega-menus for the homepage for user testing and deployment on the live EN-US site. (pattern 1)

IBM Q is collaborating with DDS on a mega-menu pattern, which they will build and collect user data to help improve the user experience for using that menu pattern for all of ibm.com (pattern 3)

IBM Cloud (Bryan Casey) is wanting to explore mega-menus within the Cloud offering which is leveraging a version of the future masthead. (pattern 1, 2 and/or 4)

Tasks

define:

Original issue: https://github.ibm.com/webstandards/digital-design/issues/1791

jeffchew commented 5 years ago

On Oct 01, spbokma commented: User data I received/got walked through from William Tang & Rajeshwari J Nagaraj on 9/20/19, showing clicks/visit within ibm.com homepage mega-menus. As well as a recommendation for future mega-menus, which align towards a version currently in exploration…but needs dev evaluation for rendering time and making sure it doesn't slow down the display of menus.

IBM Mega Menu - Dropdown Enhancement - V3 - 092019.pptx

jeffchew commented 5 years ago

On Oct 01, spbokma commented: A/B user testing on ibm.com homepage mega-menu. A is the current mega-menu treatment and B is a content/layout pattern we are exploring. Users were 50/50 on which one they liked/worked best. Masthead-MegaMenu-testingQ3_2019.docx

Next steps: Peter Barros would like to try an option C to test against option A. C being the best received parts of A and B, while looking at user data from IBM Mega Menu - Dropdown Enhancement - V3 - 092019.pptx

jeffchew commented 5 years ago

On Oct 07, spbokma commented: Looking at the click data on the current mega-menu and user A/B testing, exploring this pattern for the IBM homepage mega-menu and if it scales to within offerings.

mega-menu_pattern1

As well as entertaining the idea of relabeling Watson=Artificial Intelligence and IT Infrastructure=Servers & Storage in the left column list. As testing showed they are labels/wording users were asked to find AI or servers.

AI: mega-menu_pattern1-ai

Servers & Storage: mega-menu_pattern1-servers

jeffchew commented 5 years ago

On Oct 07, linda-carotenuto commented: Can you please set up 30 min review of this with me and Wonil? I'd like to have direction on mega menu soon.

jeffchew commented 5 years ago

On Oct 08, spbokma commented: An option for the mega-menu that I'm going to work with the IBM homepage team to test. mega-menu_pattern1