Scaling the Store Experience
I led the strategic redesign of the FBN Online Store Category Page, shifting the business from a service model to a scalable e-commerce platform by establishing a mobile-first information hierarchy and robust filtering logic. This high-leverage initiative successfully drove customer self-service behavior, resulting in a 192% surge in store orders submitted post-launch.
Project Overview
Role: Lead Product Designer
Duration: 6 Months
Team: 1 PM, 2 Engineers, 1 Marketing Lead, Sales Leadership
Project Goal: Redesign the Store Category/List Page to drive self-service orders and scale the e-commerce platform.
Scope: Category/List Page Redesign, Information Architecture, Product Card System, Filtering Logic
Outcome: 192% Surge in store orders submitted
Context & Strategic Mandate
The Business Challenge
FBN’s Store had outgrown its legacy interface. Although product offerings had expanded dramatically, the site still relied heavily on sales representatives to guide farmers through SKU selection, pricing, promotional content, and product comparisons.
Business mandate:
Shift from “sales-assisted transactions” to scalable, self-service e-commerce.
What this required:
• Dramatically reducing cognitive load on the Category Page
• Creating a mobile-first browsing experience
• Providing transparent comparison data to build trust
• Improving discoverability for hundreds of SKUs across diverse categories
This was not a UI cleanup—it was a strategic move to unlock operational leverage.
Key limitations identified:
Inadequate product showcasing hindering customer engagement
Lack of strategic focus despite excessive content
Difficult product discoverability
Inconsistencies across store pages
Limited scalability for additional product categories
Mobile design not optimized despite significant mobile traffic
Dependence on sales and customer reps for order assistance
My Role
As the design owner for the Store architecture, I led the end-to-end redesign of the Category/List Page—the highest-impact surface for driving self-service behavior.
I defined the design strategy and MVP scope, partnered closely with the PM on prioritization and trade-offs, and drove cross-functional alignment across engineering, marketing, and sales leadership. I owned research synthesis, core interaction design (information architecture, product card system, filtering logic), usability testing, and design validation through launch.
Throughout the project, I balanced business constraints, technical feasibility, and farmer needs to deliver a scalable, mobile-first foundation under a tight six-month timeline.
Key Constraints & Trade-offs
• Legacy SKU catalog and filtering logic limited back-end flexibility
• Six-month deadline to meet seasonal shopping windows
• Legal and agronomic data requirements added complexity
• Cross-functional pressure to include marketing content and promos
These constraints forced disciplined prioritization.
Success Metrics (Goals)
Increase self-service orders submitted by 20% (primary business target).
Reduce abandonment rate on Category/List pages.
Establish a mobile-first, modular design foundation for future growth.
Design Process
Research Synthesis & Alignment
We conducted a 5-week foundational research phase (user interviews, competitive audit) to identify strategic opportunities for behavioral change.
Top 3 Strategic Insights
Complexity Paralysis:
Farmers faced hundreds of similar SKUs with technical terminology and dense data. The result: drop-offs and reliance on sales reps.
Design implication:We needed a progressive-disclosure filtering system and a product card that communicates the minimum viable data for fast decision-making.
Trust & Comparison:
Purchasing agricultural inputs is high-risk. Farmers rely on ingredient comparisons, performance data, and social proof.
Design implication:
The Category Page—not just the PDP—must support quick, trustworthy comparisons.
Real Mobile Constraints:
Farmers shop in the field, with limited connectivity and limited time.
Design implication:
We adopted a mobile-first hierarchy, increasing scan-ability, stabilizing layout, and prioritizing load performance.
Driving Cross-Functional Alignment
I used research findings on mobile friction to successfully advocate for a dedicated engineering sprint to optimize list page load times, pushing back on a higher-priority marketing request. This ensured the core experience was performant before layering on features.
Defining the Strategy and Scope
MVP Definition
In scope:
• Category/List Page redesign
• New product card system
• Mobile-first filtering architecture
• Core information hierarchy
Out of scope (by design):
• Search overhaul
• PDP redesign (handle by another designer)
• Planning tools
• Checkout and order history
This focus ensured we tackled the highest-risk surfaces first—the ones blocking self-service behavior.
Design Decisions & Rationale
I focused my efforts on the two highest-leverage components—the Product Card and the Filtering System—documenting clear trade-offs to justify the final architecture.
Information Architecture & Layout Strategy
I began by defining the modular information architecture needed to support six distinct categories while maintaining consistency. This included:
• A scalable content taxonomy
• A flexible card layout accommodating long product names
• Ingredient and comparison data surfaced at the list page level
• A filtering logic system that adapts to the category’s complexity
1. Product Card System
The product card is the cornerstone of the store experience. I explored three variants that balanced:
• Information density
• Scan-ability
• Compliance requirements
• Component reusability
• Mobile constraints
Final Choice: Option C
We selected this option because it:
• Supported the widest SKU name lengths
• Allowed for required disclaimers
• Highlighted the most important comparison data
• Scaled across all categories without refactoring
2. Filtering System
Filtering was the highest-risk assumption in the experience.
Two primary variants were tested:
Option A - Accordion: Minimalist, collapsible filters
Option B - Button: Persistent filter summary with higher contrast
Final Choice: Option B
Usability testing showed Option B delivered a 15% faster task completion, particularly on mobile, reinforcing that clarity > minimalism for this audience.
Validation
I led two rounds of remote user testing and also stress-tested the final designs with the longest product names and most complex filtering combinations to ensure platform scalability and resilience before engineering handoff.
The Final Design
The final interface delivered a modern, mobile-first category experience:
• Highly scannable layout optimized for field use
• Modular product card system with comparison data
• Persistent filter summary for quick context
• A scalable foundation enabling future expansion into more categories
Impact & Strategic Reflection
The launch achieved a significant, positive outcome that validated our strategic, mobile-first approach and shifted core customer behavior.
Business Impact Summary
The data extracted from Amplitude graphically portrays a striking 192% surge in store orders submitted by all users within six months of the successful launch of the new store design. This accomplishment is further underscored by a significant total order increase of 890 compared to the same period last year. These insights gleaned from Amplitude reinforce the resounding success and impact of the redesigned platform.
This successful shift in customer behavior is projected to significantly reduce the need for high-touch sales assistance, allowing sales reps to focus on high-value accounts.
Reflections
This project reinforced the importance of designing around highest-risk assumptions, not the broadest feature set. By focusing on filtering logic, information hierarchy, and mobile friction, we were able to deliver a high-leverage foundation within tight constraints.
It also demonstrated the value of design leadership that balances:
• Systems thinking
• Cross-functional alignment
• Clear decision rationale
• Executional depth
• Advocacy for user needs, even under competing priorities