Navigation doesn’t need to be redesigned every time you add a product. But it does need to evolve at certain thresholds — and recognizing those thresholds before the navigation breaks is the key to smooth scaling.
Stage 1: Launch (1–50 products)
Navigation structure: A flat menu with three to five items. “Shop,” “About,” “Contact.” Maybe a “Collections” page that shows all products grouped by type.
What works: Simplicity. The shopper can see the entire catalog in a few scrolls. The menu is more about branding and information pages than product navigation.
On mobile: A minimal tabbar (Home, Shop, Cart) or just the theme’s default header navigation. The catalog is small enough that the shopper can browse everything from one page.
When to evolve: When adding a product to the “Shop” page starts feeling crowded — typically around 40–50 products or when a single collection page requires more than three full scrolls.
Stage 2: Growth (50–200 products)
Navigation structure: Top-level categories with one level of subcategories. “Women” → “Tops, Bottoms, Dresses.” Five to eight top-level items, each with three to six subcategories.
What works: The two-level structure gives shoppers a clear path. They choose a broad category, then narrow to a subcategory. Each subcollection holds 15–40 products — scannable with light filtering.
On mobile: A slide menu with expandable categories. A tabbar with Categories, Search, Cart. Search starts becoming useful for shoppers with specific intent.
When to evolve: When subcategories start containing 50+ products. When shoppers complain about not finding products. When search usage increases significantly.
Stage 3: Established (200–500 products)
Navigation structure: A full category hierarchy with robust filtering. Mega menu on desktop showing subcategories with images. Slide menu on mobile with search at the top.
What works: Filters on collection pages do the heavy lifting. The menu gets shoppers to the right department; filters get them to the right product. Search handles 20–30% of sessions.
On mobile: The tabbar becomes essential — Categories for browsing, Search for finding, Cart for buying. The theme’s default hamburger menu is no longer sufficient.
When to evolve: When any collection page exceeds 100 products even with subcategories. When the mega menu has more than 40 subcategories. When mobile bounce rate starts climbing.
Stage 4: Scale (500+ products)
Navigation structure: Mega menu as a gateway, search as primary navigation, deep filtering as the refinement layer. Possibly intent-based navigation (Shop by Occasion, Shop by Price) alongside attribute-based categories.
What works: The search bar is the most important navigation element. Autocomplete with product previews handles the majority of navigation for intent-driven shoppers. The menu serves explorers and first-time visitors. Filters are comprehensive (5–8 dimensions per collection).
On mobile: Full-screen search experience on tap. Slide menu with search integration. Tabbar with Search as the most prominent button (or equal to Categories). Cart persistence across sessions.
Signals to restructure
How to know it’s time to change:
- Bounce rate on collections increasing. Shoppers land on a collection and leave without viewing a product. The collection is too long or not well-organized.
- Search usage growing as a percentage of sessions. More shoppers are bypassing the menu for search. Either the menu is failing them or the catalog is beyond what menus can handle.
- Mobile pages-per-session declining. Mobile shoppers are viewing fewer pages, suggesting navigation friction on phones.
- Customer support questions about finding products. “Where do I find X?” emails are a direct signal that navigation isn’t obvious.
- New products don’t fit existing categories. When you create a one-off collection for a product type that doesn’t fit anywhere, the category structure has gaps.
The restructure doesn’t have to be dramatic. Adding subcategories to an existing category, adding filters to collection pages, making the search bar more prominent — these are incremental changes that can be made one at a time without redesigning the entire store.
This article is part of the larger guide on How navigation needs change as your catalog grows from 100 to 1000+ products.