Chapter 3:
Taxonomy-Driven Navigation Prototype
Introduction
To showcase the navigation taxonomy in action, I built a low-fidelity prototype that brings my Slow-Fashion Product Catalog categories to life. This skeleton demo isn’t about visual polish—it’s a working proof that the six top-level categories defined in Chapter 2 guide real clicks and refine results instantly.
1. Objective
Show how my controlled vocabularies drive desktop navigation—hovering a top-level category to drill down—and support interactive faceting, so shoppers move from browsing to finding in one seamless flow.
2. Prototype Overview
Note: This prototype deliberately omits UI styling—just enough structure to validate category labels and facet logic.
Global Nav Drill-Down
Hover any top-level label to reveal its child categories (e.g., hover Footwear → Sandals, Loafers).
Facet Refinement
Sidebar filters (Color, Material, Print, Sleeve Type) map one-to-one to my taxonomy terms.
Clear All & Breadcrumb Chips
Selections appear as chips (“Color: Beige ×”) and can all be reset in one click using the “Clear All filters” button.
3. Validation Results
| Task | Expected Path | Result |
|---|---|---|
| Browse T-Shirts | Tops & Bottoms → T-Shirts | ✔ Success |
| Find Crossbody Bags | Bags → Crossbody Bags | ✔ Success |
| Select Sun Hats | Hats & Headwear → Sun Hats | ✔ Success |
All expected paths succeeded on first try—proof that my taxonomy aligns with shopper expectations.
4. Impact & Next Steps
This prototype confirmed that my category hierarchy and facet labels work under real-world interactions.