SSP 740 - Navigation

更多类似内容

Outdoor Education 2019

由Hirman Abdul Rahim

Trabajo Práctico N°2

由Fabrizio Carrizo

Types of Navigation

由Carlota Sola

Moonwalking With Einstein Ch 1-2

由Lydia Ong

Navigation

Compatibility

refer to "PC & Mobile Browsers.mm"

Mobile

Header height, logo size etc. scales down in mobile view

Member Navigation

Navigation should have 'logout' and 'contact us' menu items

Default view

After logging in on mobile view, mobile menu should be minimised

Taps anywhere outside navigation menu

Navigation menu collapses

Sub-menus should collapse when another sub-menu is expanded

Taps links in drop drop down menu

Currently active link drops down displaying sub-menu links

Taps menu icon

'MENU' text

Clickable

Menu drop down displaying links

Given: An advisor is viewing sub-menu items in the navigation bar dropdown When: They tap outside the dropdown list Then: Dropdown list should collapse

Given: An advisor in their manage portal and wants to navigate to a page When: They tap the menu icon in the navigation bar Then: A drop down list of sub-menu links should be displayed

Given: A member logs in to their manage portal When: Successfully logged in and landed on homepage Then: Menu icon should be presented to the right in the header

Given: An advisor in their manage portal and wants to navigate to a page When: They tap the menu icon in the navigation bar Then: A drop down list of sub-menu links should be displayed

Given: A member logs in to their manage portal When: Successfully logged in and landed on homepage Then: Menu icon should be presented to the right in the header

Given: An advisor is viewing sub-menu items in the navigation bar dropdown When: They tap outside the dropdown list Then: Dropdown list should collapse

Desktop

UI

Min width of drop-down menus is width of header

Member Manage Portal

Advisor Manage Portal

Current 'Active' menu item

Shaded grey

Hover over sub-menu items

Hovered link's text color does not change

Hovered link 's background highlighted to grey

Navigates Outside the menu item

Drop down list collapses

Hover over menu item

Drop down list of sub-menu items displayed

Scenarios

Member

Given: An advisor is viewing sub-menu items in the navigation bar dropdown When: They navigate outside the hovered menu item Then: Dropdown list should collapse

Given: A member in their manage portal and wants to navigate to a page When: They hover over a menu item in the navigation bar Then: A drop down list of sub-menu links should be displayed

Given: A member logs in to their manage portal When: Successfully logged in and landed on homepage Then: Navigation menu bar should be presented under the header

Advisor

Given: An advisor is viewing sub-menu items in the navigation bar dropdown When: They navigate outside the hovered menu item Then: Dropdown list should collapse

Given: An advisor in their manage portal and wants to navigate to a page When: They hover over a menu item in the navigation bar Then: A drop down list of sub-menu links should be displayed

Given: An adviser logs in to their manage portal When: Successfully logged in and enterred their portal Then: Navigation menu bar should be presented under the header