Navigation Redesign

Description

Emphasize your store's most important sections within the navigation menu.

Hypothesis

The arrangement of visual elements guides the viewers’ eyes and emphasizes key points through strategic use of principles like content, position, contrast, size, color, and alignment.

Prediction

By applying a clear hierarchy, we nudge shoppers to dive into the more profitable categories, improve discoverability, engagement, and their understanding of the store, which in turn improves conversion rate and revenue. 

Potential uplift of 3% to 7% in Revenue.

Setting up the experience on Visually:

BUILD TIME: 4 MINUTES

Step 1 - Set the scope

Start by defining the conditions required for the experience to activate. 

Please keep in mind that the reports will gather data based on the defined scope, so accuracy is key. Setting a scope larger than required can dilute the data by including sessions which weren’t actually impacted by the changes.

Audience → make sure that this parameter is set to ‘All Visitors‘.

Pages → make sure that this parameter is set to ‘All Pages‘.

Devices → set to ' Mobile Only '.

Trigger → make sure that this parameter is set to 'Page Load'.

If you’re familiar with HTML, you can set the experience to activate when the navigation panel opens or the menu button is clicked, in order to filter out sessions that avoided the navigation from the experience report.

To do this, click on ‘Element Appearing’ or ‘Element Clicked’ → set the appropriate selector.

Step 2 - Set the changes

Add a ‘Columns’ content block → open the navigation → click on ‘Content Blocks’ → set a position at the top of the navigation panel → select ‘Columns’

Configure the columns → set the titles, links, and images for the selected menu items you want to emphasize.

Please note that each column has two links to configure, one for the text, and another for the image.

Tailor the design → align the changes’ design to fit your brand identity.

We recommend saving your stylings for future use. For more information on reusing styles, refer to this article.

Remove the replaced links → if these links already exist in the navigation, remove them to avoid duplicate content.

Apply changes to all pages → ensure that all the changes are set to display on 'Mobile All Pages' so that the experience appears sitewide.

Save the experience → click on 'Save' → name the experience → provide a description (optional) → click 'Next' to confirm.

Step 3 - Preview & QA

To ensure that the experience functions correctly before publishing, we strongly recommend conducting a quality assurance (QA) session using our ‘Preview’ feature.

1. Click on ‘Preview’ → ‘Share’ → ‘Copy Link’
   
   
2. Use this link on the target device(s) for more accurate insights.
   For optimal results, we suggest running this QA in incognito mode to eliminate any cookies that may influence the testing process.
   
   
3. For additional guidance on performing quality assurance with Visually, please refer to this article.

Step 4 - Finalize & Publish

We highly recommend conducting an A/B validation to evaluate the impact of this experience on your store's performance.

To begin → click on ‘Next’.

Initiate an A/B test → navigate to section 3 and select ‘Yes, sure’.

Name the variation(s) → we suggest naming variations based on the hypothesis you’re testing on this iteration, and how they differ from each others, such as:

• Original / Best Sellers
• Original / BS+NA
• 1 link / 2 links / 3 links
• Product IMG / Lifestyle IMG
  
  

Set the allocation → we suggest starting with a 50/50 split to obtain results quickly and reliably. 

• If you prefer to conduct a preliminary sanity check, consider a 80/20 allocation for initial validation, then transition to 50/50 for comprehensive testing.
  
  
• Keep in mind that achieving statistical significance may take several days, especially with lower allocations. For guidance on analyzing and monitoring your A/B tests, refer to this article.
  
  

Set the metric goals → click on ‘+’ to select goals → for this experience, we recommend the following KPIs:

• Conversion Rate
• Average Order Value
• Per Session Value
• Product Details Views Rate (PDV)
• Click-Through-Rate (CTR)
  
  

Set the primary metric → we recommend setting ‘Conversion Rate’.

Send metrics to GA4 (optional) → check the box for ‘Send events to Google Analytics’.

Publish the experience → click on ‘Publish’ and confirm when ready.