VendorScout

AI-powered logistics vendor evaluation

Comment

Inspiration

Procurement teams at mid-size e-commerce companies spend 3--6 weeks comparing logistics vendors. The process: receive 2--3 dense PDF proposals from third-party logistics (3PL) providers, manually read through pages of contract language, build comparison spreadsheets, try to catch hidden risks buried in legal clauses, and eventually produce a recommendation memo for leadership.

The hard part isn't the comparison itself. It's that vendor proposals are designed to be hard to compare. Pricing structures differ, SLA language is intentionally vague, auto-renewal clauses are buried on page 12, and liability caps don't cover actual cargo value. Even experienced ops managers miss these traps.

Claude can read PDFs natively, reason about contract language, and compare documents side-by-side. That's the entire job description of a procurement analyst. We built VendorScout to do it in 30 seconds.

What it does

Upload 2--3 vendor proposal PDFs. In 30 seconds, VendorScout delivers:

  • Scored comparison with visual bars — each vendor rated $1$--$10$ on delivery speed, pricing, SLA coverage, tech integrations, and scalability
  • Hidden risk detection — auto-renewal traps, vague SLAs, liability gaps, and fuel surcharge ambiguity flagged automatically with severity levels (critical/warning/info)
  • Ranked recommendation — a clear winner with a visual comparison chart and structured rationale
  • Negotiation brief — actionable talking points per vendor with specific contract asks
  • Executive memo PDF — branded, formatted, and downloadable in one click. Ready to send to a VP of Operations.

How we built it

Architecture: Next.js 16 with App Router, React 19, Tailwind CSS v4, and the Anthropic Claude API. No database, no auth — a single-page tool that does one thing well.

Two-stage Claude pipeline: We split the evaluation into two separate Claude calls connected by Server-Sent Events (SSE):

  1. Stage 1 (Scoring): Claude reads all PDF proposals using its native document API (base64 PDF blocks — no OCR, no text extraction) and scores each vendor across $5$ weighted criteria. Vendor cards with score bars and risk badges appear immediately on the client.
  2. Stage 2 (Brief): Claude takes the scoring data and generates a recommendation, negotiation brief, and executive memo. These render below the cards as they complete.

This streaming architecture means users see progress in real time instead of staring at a spinner for 60 seconds.

PDF Export: We built a branded PDF memo generator using jsPDF with a colored header bar, score comparison table with inline score bars, severity-coded risk badges, and numbered negotiation points.

Design System: We researched competitors in the procurement space (Coupa, Fairmarkit, Spendflo, Zip) and built a custom design system with Fraunces serif for display text, Plus Jakarta Sans for body, warm paper-white backgrounds, and a deep sage green accent — intentionally distinct from the blue/purple that every other procurement tool uses.

Challenges we ran into

  • Claude output consistency: Getting Claude to return consistently structured JSON with the right level of detail took several prompt iterations. Too verbose and the UI became a wall of text. Too terse and the recommendations lacked substance. We landed on structured formats with word count targets per section.
  • PDF reading at scale: We needed to pass raw PDF files to Claude, not extracted text. We used the Anthropic SDK's native document blocks with base64-encoded PDFs, which preserves formatting and table structure that text extraction would lose. Processing $3$ PDFs simultaneously pushes the context window and response time.
  • Streaming UX: A single Claude call with $3$ PDFs takes $30$--$60$ seconds. That's too long for a blank loading screen. We split the pipeline into two stages with SSE streaming so vendor cards appear after ${\sim}20$ seconds while the brief generates in the background.
  • Risk flag severity crashes: Claude sometimes returned severity values outside our expected set, crashing the UI. We hardened both the prompt (explicit allowed values with strict instructions) and the component (fallback styling) to handle edge cases gracefully.

Accomplishments that we're proud of

  • The risk detection is genuinely useful. Claude catches contract traps that experienced procurement managers miss — auto-renewal windows with $90$-day notice requirements, liability caps at $\$100$/shipment for high-value goods, fuel surcharges with no ceiling. This isn't a toy demo, it's a tool people would actually use.
  • The two-stage streaming architecture. Vendor cards appearing in real time while the brief generates in the background makes the app feel fast and responsive, even though Claude is doing heavy analytical work behind the scenes.
  • The PDF export looks like a consulting deliverable. Branded header, color-coded score table with inline bars, risk severity badges, structured negotiation points. A procurement manager could forward this PDF to their VP today.
  • Zero unnecessary infrastructure. No database, no auth, no state management library. Next.js API routes, the Anthropic SDK, and jsPDF. The entire app is $8$ source files that do exactly what they need to do.

What we learned

The biggest insight: the real value isn't the scoring (that's table stakes). It's the risk detection. Claude catches contract traps that humans miss because it reads every clause with equal attention. That's the "wow moment."

We also learned that prompt engineering for structured output is a design problem, not just an engineering one. The format of Claude's response directly determines the UX quality. We iterated through three versions of the prompt — from verbose paragraphs to overly terse bullets to the structured headline-detail format we landed on. Short structured outputs with visual rendering beat long paragraphs every time.

Finally, streaming isn't just a performance optimization. It fundamentally changes how the product feels. Showing partial results as they arrive turns a $60$-second wait into a progressive reveal that keeps the user engaged.

What's next for VendorScout

  • Configurable criteria and weights — let users define their own evaluation dimensions and importance weights instead of using our logistics defaults. A healthcare procurement team has different priorities than an e-commerce team.
  • Side-by-side clause comparison — highlight the exact contract language from each vendor on the same topic (e.g., SLA penalties) so users can see the differences at a glance.
  • Saved evaluations and history — add a database layer so procurement teams can revisit past evaluations, track how vendor proposals evolve over negotiation rounds, and share results with colleagues.
  • Multi-industry support — expand beyond logistics to SaaS, cloud infrastructure, HR platforms, and other vendor categories with industry-specific criteria and risk patterns.
  • Integration with procurement platforms — export results directly to Coupa, SAP Ariba, or other procurement systems that teams already use.

Built With

  • anthropic-claude-api
  • claude-sonnet-4.6
  • jspdf
  • next.js
  • react
  • tailwind-css
  • typescript
Share this project:

Updates