Search Menu Rearchitecting
The FBN Search Menu Rearchitecting was a strategic, data-driven initiative to transform the most critical conversion tool on the B2B E-commerce platform. I led the effort to solve friction points identified in user complaints and analytics, focusing on technical constraints (real-time data) and delivering a high-impact mobile-first solution that manages user expectations and guides them toward purchase.
Quick Project Snapshot
Impact at a glance
Addressed friction affecting 65% of shopping sessions
Improved clarity for searches tied to ~40% of annual store revenue
Reduced dead-end searches for unavailable and branded products
Delivered a phased MVP that balanced speed, technical debt, and long-term scalability
Industry: B2B E-commerce (AgTech)
Timeline: 1 month
Scope: Search suggestion menu only
Tools: Figma, Lyssna, internal analytics
Project Context & Challenge
FBN operates a complex B2B E-commerce platform serving farmers, agronomists, and sales teams. Unlike traditional retail, the catalog includes products that may be visible but not purchasable due to regulatory, inventory, or regional constraints.
Search analytics and qualitative feedback revealed a clear signal:
Search initiated 65% of new shopping sessions
Confusion in the search dropdown led users to unavailable product pages
Sales teams reported increased manual support to redirect users
Mobile users experienced disproportionate friction due to spatial constraints
Core problem:
The search menu failed to set clear expectations about where a click would lead and whether a product could be purchased, resulting in abandonment, frustration, and lost trust.
This was not a visual polish problem—it was a systems and expectation-management problem.
My Role
I was the sole owner of the end-to-end user experience, from research strategy to final high-fidelity design specifications and QA support. I partnered directly with the Product Manager to define MVP scope and business goals, and the Engineering Lead to map out technical feasibility and the multi-phase implementation roadmap.
Business Objectives & Design Goals
Increase Conversion: Reduce cognitive load and improve product discoverability.
Improve Retention & Trust: Clearly communicate product availability/status upfront
Foster Brand Loyalty: Guide users to helpful alternative products
Expected Metric Impact (Post-Launch)
Design Process
Data-Driven Opportunity
Analysis revealed four high-impact problems driving abandonment and sales team dependence:
Indicator Clarity: Initial testing suggested 4 in 10 users reported difficulty distinguishing between destination types (Search result pages V.S. Individual product detail pages).
Mobile Friction: Usability tests showed a 35% increase in time-on-task for mobile search compared to desktop. Limited vertical space above the keyboard constrained scannability.
Availability Frustration: Lack of indicators resulted in users repeatedly landing on unavailable product pages. Analysis showed a 15-20% higher search session failure rate related to searches for unavailable products.
Branded Dead Ends: Users searching for branded products we don't carry were being inefficiently redirected. Our goal was to surface our functional alternatives directly in the search menu to accelerate conversion. Search logs showed >25% session abandonment on these queries.
Strategic Constraints & Trade-Offs
Real-Time Availability: This project required deliberate trade-offs to deliver value quickly.
No real-time availability data
Real-time inventory indicators were technically infeasible within the timeline.Limited scope
Only the search suggestion menu could be updated; backend search logic remained unchanged.Mobile-first mandate
Any solution had to materially improve the mobile experience, not just desktop parity.
Key Decision:
I negotiated a phased MVP, focusing on the clear distinction of "Sold on FBN" in Phase 1 to defer high-cost technical debt and deliver 80% of the clarity benefit immediately.
This allowed us to ship within one month while aligning engineering, product, and design around a longer-term roadmap.
Core Design Solutions
Two-Section Segmentation: Visually separated "Search Terms" from "Product Links" (side-by-side desktop; stacked mobile).
Contextual Solution: To align with the farming context and UX, I successfully advocated for using Category Icons as link indicators, rejecting standard icons that lacked domain fit.
Full-Page Mobile Search: Replaced the cramped dropdown with a full-page, scrollable experience for improved usability above the keyboard.
Guidance to Alternatives: Surfaced the primary FBN alternative product with a clear relational label ("as compared to...") directly in the search menu.
Design Process Highlights
Discovery & Audit: Started with a competitive audit and analysis of search logs/funnel data.
Rapid Validation: Utilized guerrilla testing and continuous stakeholder feedback to iterate quickly on high-fidelity concepts.
Delivery & QA: Stress-tested the design (e.g., long product names) and provided detailed support during implementation.
Strategic Learnings & Roadmap
Key Learnings
Expectation-setting is as critical as discoverability in B2B commerce
Phased MVPs are essential for navigating high-cost technical debt
Domain-specific indicators outperform generic UX patterns in specialized industries
Phase 2 - Technical Maturity: Integrate back-end logic to display real-time product availability status.
Phase 3 - Personalization: Introduce logic to surface personalized suggestions based on purchasing history.