
Gordan Food service (B2B eCommerce)
Improving autocomplete logic, UX behaviors, and design-system components across the Gordon Ordering platform.
Search is one of the highest-traffic features in Gordon Food Service’s B2B ordering platform. However, the original experience lacked intelligence, consistency, and flexibility, resulting in missed opportunities, slower ordering, and user frustration.
As the End-to-End Designer and Implementation Engineer, I redesigned search across web and app with a focus on smarter autocomplete, improved filtering, and reusable search components integrated into the GFS Design Library.
The legacy search experience suffered from:
• Low relevance and slow discovery
• High abandonment rates
• No support for typos, synonyms, or SKU variations
• Inconsistent UI and behaviors across devices
• Poor grouping logic and unclear hierarchy
Analytics, Baymard audit findings, and user interviews confirmed that power users — high-volume buyers — needed a much more efficient search experience to support repeat ordering.
• Reviewed support tickets and session recordings
• Conducted Baymard-based heuristic evaluation
• Analyzed competitor flows (Sysco, Amazon Business, Grainger)
Mapped real ordering behaviors to ensure search could handle:
• Suggestive queries
• Exact matches
• No-results scenarios
• SKU-only inputs
• Explored new approaches to: autocomplete, fallback states, and recovery patterns, with a special emphasis on improving the “No Results Found” experience.
Designed for users who rely on common or repeat orders.
Behavior: smart suggestions, predictive typing, and personalized ranking.
Prioritizes fast navigation to a known SKU or product title.
Behavior: direct PDP navigation and grouped variations.
Redesigned to prevent dead ends.
Behavior: fallback suggestions, typo handling, category pivots, and clear recovery paths.
For power users who memorize SKUs.
Behavior: immediate ID recognition and keyboard-first interaction.
Basic tips and category links.
Feedback: Informational but not helpful — still felt like a dead end.

Contextual suggestions, related categories, smart recovery, and typo handling.
Feedback: Felt proactive, reduced frustration, increased engagement.

Tasks included misspelled queries, filtering, SKU searches, and empty-state recovery.
Key Takeaways
• Search speed improved
• Suggestions felt more relevant
• Users recovered from “no results” faster
• Autocomplete hierarchy reduced cognitive load
Improved Autocomplete
Clear grouping, headers, spacing tokens, focus states, and visual separation..
Smarter Query Handling
Supports typos, synonyms, exact matches, SKU logic, and intent detection.
No Results Recovery
Avoids dead ends, promotes discovery, and strengthens user trust.

Updated Layout + Hierarchy
Visually organizes suggestions by type for faster scanning.

The redesigned experience dramatically improves visual clarity, speed, and accuracy — especially for SKU-heavy workflows.

↑ 15 percent
↓ 12 percent
↑ 13 percent
These enhancements significantly reduced friction and improved ordering efficiency for high-volume users.


%20(1).png)

Pilo (Marketplace)
A mobile marketplace connecting licensed barbers with shops that need last-minute staffing.

Publix (Grocery eCommerce)
A mobile-first cart redesign that increased engagement and simplified the checkout flow.