Commerce Site Navigation Theme Questions

NEW PROCESS:

Step 1. Identify Resort. Capture URL for marketing site that we can use for reference. Gather current theme for populating mockup .

Step 2. Ask Mike SnowSki to mock up based on existing theme choices, to prepare sample theme, and assess for any obvious accessibility issues.

Step 3. Present to customer - limit changes to applying second option - no opportunity to introduce new colors, fonts, etc.

Step 4. What is needed ( resources, detail, instructions, samples) to write up JIRA card for a dev to be able to create the theme based on Mike’s mockup?

ACTION ITEMS

Trish follow up with Snoski

Trish Follow up with MK on #4 ( done)

DannyK followup with Jenni on timeline/who get’s this

HEADER 2.0 acceptable name?

Header

• Which hex color should the header background be?

(Set background. White is default setting, unless doesn't work with links, logo color, etc.)

(primary or secondary, would be mapped from commerce)

• Which logo should be placed in the header?

(images (hero, logo) hopefully included in theme designer)

Top Categories

• Default State

  • Should text be upper case, lower case, title case or kept as entered in admin?

(Mirror brand site - check main brand site.)

• Which hex color should the text be? (generally pull from brand site)

  • Open

    

• Hover State - when a user hovers over the category. (brand site again, but if significant usability issue do not repeat them on our site)

  • Which at hex color should the text background be?

  • (primary or secondary, would be mapped from commerce)

  • Open

    

• Focus State - when a user navigates to the category link via keyboard

  • Which hex color should the text background be?

  • (primary or secondary, would be mapped from commerce)

• Active State - when a category is selected and user is on the category page for that category

  • Which hex color should the text be?

  • (primary or secondary, would be mapped from commerce)

Subcategories

• Which hex color should the subcategory drawer background be?

• (primary or secondary, would be mapped from commerce)

• Should the category drawer have a box shadow (option A) or be flat (option B)?

• (primary or secondary, would be mapped from commerce)

   

• Default

  • Which hex color should the text be?

• Focus

  • Which hex color should the text background be?

• Hover

  • Which hex color should the text background be?

• Active State - when a category is selected and user is on the category page for that category

  • Text color is same as active state of top categories

Cart and Menu Buttons - we use the color of links from navigation will be primary color in your header.

• Which hex color should the cart count badge be?

• Which hex color should the cart icon be?

• Which hex color should the cart icon background be hover and focus?

• Which hex color should hamburger menu button be?

• Which hex color should the menu button background be on hover and focus?

Navigation Sidebar

Top Banner

• Which hex color should the background be?

• Which hex color should the links and close button be?

• Which hex color should the background of the links and close button be on hover?

• Should text be upper case, lower case, title case or kept as entered in admin?

• Which logo should be placed on the left here or should there be no logo?

•  

Categories + Login/Logout Links

• Note: Background below the banner is always white

• Default State

  • Should text be upper case, lower case, title case or kept as entered in admin?

  • Which hex color should the text be?

  •  

• Active State is shared with top nav categories

• Hover State

  • Which hex color should the text background be?

  •  

• Focus State

  • Which hex color should the text background be?

  •