ContractLens is an Independent Showcase Project built with synthetic data to demonstrate a realistic client-ready workflow. A full-stack contract operations workspace that turns agreement queues, clause risks, review status, and human approvals into one clear workflow.

Contract review becomes difficult to manage when risk findings, owners, deadlines, and approval decisions live across disconnected documents and messages.

Product Designer & Full-Stack Developer — product framing, UX, frontend, API workflow, responsive behavior, QA, and portfolio presentation.

I built a focused review workspace that prioritizes agreements, explains clause-level risk, preserves human approval, and routes approved work toward signature readiness.

The application uses Next.js, React, TypeScript, Tailwind CSS, shadcn/ui, REST-style API route, WebMCP, Playwright. The interface is backed by a local API route for validated state changes, while browser-exposed structured tools demonstrate how an agent can inspect or update the workflow within explicit safety boundaries.

Searchable agreement queue with status filters

Clause-level severity findings and executive brief

Human approval checkpoint with visible state change

Structured add-contract intake flow

Responsive layouts, empty states, and API validation

WebMCP tools for safe queue reading and reviewed approval actions

The core challenge was making high-density legal operations understandable without implying that automation replaces legal judgment. The interface therefore separates recommendations from approval and keeps evidence, risk, and next actions visible together.

The finished showcase passes production build, lint, and browser acceptance checks for search, selection, intake dialog, approval state, empty state, responsive layout, and console errors. It demonstrates the ability to build trustworthy internal workflows for document-heavy teams.

Next.js, React, TypeScript, Tailwind CSS, shadcn/ui, REST-style API route, WebMCP, Playwright.