Designing pre-purchase shopping flows for KODIF, the AI platform powering customer support for ecommerce brands
KODIF's AI chatbot resolved 65% of support tickets for subscription ecommerce brands - returns, refunds, order tracking. But when users asked "which product should I buy?" they abandoned. 40% drop-off at comparison questions.
I designed the pre-purchase shopping experience - guided discovery, product comparison, and in-chat checkout - that transformed KODIF from a support automation tool into a full-funnel commerce platform. 50% faster product selection. 9/10 users completed checkout without leaving the chat.
Role
Product Designer
Worked with: PM, Engineering, CX Leaders
Project Timeline
October - December 2025
Tasks
AI Chatbot UX
Interaction Design
User Flows
User Research
Usability Testing
Tools
Figma
Maze
Context
Imagine a store associate who knows everything about returns but freezes when you ask "which one should I buy?" That was KODIF's AI.
KODIF automates customer support for ecommerce brands like Dollar Shave Club. 100+ integrations (Shopify, Stripe, Klaviyo). Up to 75% ticket automation. 93% CSAT.
Post-purchase, the AI was brilliant. Pre-purchase? It didn't exist.
Problem
Users trusted KODIF to answer questions. They didn't trust it to help them decide.
Text responses felt like guesses. No images. No way to compare. When users asked "which running shoe is better for trails?" - the AI generated paragraphs. Users left to browse the website instead.
For KODIF's clients, every abandoned conversation was lost revenue. For KODIF, it was a positioning problem: they were stuck in "support automation" while the market moved toward full-funnel commerce.
Research
I started with questions: Why are users abandoning? Where does trust break down?
I analyzed 200+ support transcripts, interviewed 6 CX leaders and 3 ecommerce managers, and tested prototypes with 10 shoppers.
The insight: Comparison questions were the #1 abandonment trigger. 6/6 CX leaders validated this as the critical gap.
Users needed to see, not read. AI-generated prose couldn't compete with a product image and a price tag.
Goal
Design flows that take users from "I'm looking for running shoes" to "Order confirmed" - entirely inside the chat. I stress-tested against Nike's 10K+ SKU catalog to design for enterprise scale, not demo conditions.
Design Process
I led the full design process: research synthesis, user flows, wireframes, prototypes, and usability testing. I worked directly with engineering on technical constraints and presented findings to CX leaders to validate prioritization.
The core challenge: knowing when AI should guide vs. when the interface should take over.
My instinct was to let AI do more. But every time AI generated prose for purchase decisions, users hesitated. They didn't trust paragraphs. They trusted product images and price tags.
Open search on 10K products meant irrelevant results, slow response, frustrated users. I designed tiered navigation - guide users through category → subcategory → products. Each step narrows intent and improves relevance. Now AI processes 8-12 relevant items instead of searching 10,000.
Users requested "show me all options" but couldn't process them. Mobile testing with 10 users showed 5+ products caused decision paralysis - users lost context scrolling and restarted from scratch. I set a hard cap at 4 products. Better to constrain and convert than overwhelm and lose.
Result: 9/10 users completed comparison task without restarting.
AI can hallucinate product details. Wrong price or feature means broken trust and potential returns. I pulled structured attributes directly from the product catalog - AI understands intent, UI displays facts. Zero hallucination risk on purchase-critical information.
Ecommerce serves everyone - KODIF's clients range from Gen-Z to seniors. I baked accessibility in from the start: 44px touch targets, 4.5:1 contrast ratio (WCAG AA), ARIA labels on all interactive elements, support for 200% text scaling, and respects reduced-motion preferences. Inclusive design means larger addressable market for KODIF's clients.
Design Solution
Each feature addresses a specific gap in the shopping journey: discovery, comparison, and purchase. Together, they transform KODIF from a support tool into a commerce platform.
Replaces open prompts with structured entry points - visual categories, image upload for "find similar," and keyword search as fallback.
Result: 60% reduction in ambiguous queries, so AI can process clear intent faster.
Tradeoff: voice input deprioritized in V1 due to 30% lower accuracy than structured input.
Side-by-side comparison using structured product attributes - directly addressing the #1 abandonment trigger from research. I capped comparisons at 4 products based on mobile testing, pulled data from the catalog instead of AI-generated text, and maintained high contrast (4.5:1) for accessibility.
In-chat checkout with native payment - no redirect, no login wall. Apple Pay and Google Pay for one-tap purchase, same conversation thread continues for post-purchase support, trust signals visible at the decision point.
Result: 9/10 users completed full flow without leaving chat.
Results
Directional data from prototype testing - but strong enough to shift KODIF's product strategy.
faster (45s → 22s) Time to product selection
users completed checkout in chat
CX leaders rated comparison as "critical"
Impact
This wasn't just a feature. It shifted how KODIF talks about itself.
The framework now anchors KODIF's ecommerce roadmap. It's been presented to 3 major retail prospects in Q4 2025 sales cycles. My research findings directly influenced what the product team prioritized next.
This project never shipped to production. But it changed company direction. Impact isn't always measured in live users.
Learnings
My instinct was to let AI do more. But structured data beats generated text for high-stakes decisions. I learned: AI for intent, UI for trust.
I didn't just solve a UX problem. I helped KODIF compete in a new market category. Design can reposition a company.
Large touch targets and screen reader support weren't extras. They were requirements. When you design for everyone, you design better for everyone.