Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

GENERAL INFO

MOBILE (PSD + quick snapshots)

PSD to download: fas-navigation-mobile.psd

Note: Designs are overscaled to make the graphics more visible on the desktop. Relate the sizes to tablet's ones.

1/ Default

After initial load, with viewport aligned to a top of the page.

2/ Default - compact bars

When user starts to scroll down (and viewport is no longer at the top of the page!). All 3 bars will snap to top + button 'go to top' appears.

3/ Expanded breadcrumbs

When user expands the breadcrumbs panel.

4/ Main menu opened

When user opens main menu by tapping the 'hamburger menu' icon.

 

DESKTOP (PSD + quick snapshots)

PSD to download: fas-navigation-desktop.psd

1/ Default

After initial load.

2/ Search

When user clicks on the search icon.

 

TABLET (PSD + quick snapshots)

PSD to download: fas-navigation-tablet.psd

Note: Designs target lower tablet's threshold (~ 760px).

1/ Default

After initial load, with viewport aligned to a top of the page.

 

2/ Compact + Search

Shows combination of collapsed menu, collapsed header (happens when a user's viewport is no longer at the top of the page) and activated search bar.

HOMESITE (PSD + quick snapshots)

PSD to download: fas-navigation-desktop.psd

...