Inspiration

The inspiration for Blueprint Compliance Engine struck us while observing a fundamental paradox in modern Fintech. On the one hand, Generative AI (LLMs) can draft complex financial instruments, such as bonds or derivatives, in milliseconds. On the other hand, the financial world is governed by rigid, binary rules.

We realized that while AI is creative, it is not compliant.

  • An AI might write a maturity date as "Dec 1st, 2025" instead of 2025-12-01.
  • It might incorrectly format a currency as a string ("5M USD") instead of a structured float.

In a regulated environment, "close enough" is a compliance failure. We built this engine to solve the "Last Mile" problem of Generative AI: bridging the gap between stochastic AI outputs and deterministic regulatory standards.

What it does

Blueprint Compliance Engine is a frontend-first validation suite that acts as an automated "Compliance Officer" for AI data. It provides an immediate, visual feedback loop for verifying asset data.

The workflow operates in three distinct phases:

  1. Smart Ingestion & Conversion: The engine accepts raw, messy text (like key-value pairs generated by a chatbot) and intelligently converts it into structured, valid JSON. It handles the "dirty work" of formatting before validation even begins.
  2. Dual-Layer Validation:
    • Schema Check: Enforces strict structural rules (e.g., Asset IDs must be uppercase and 5+ chars).
    • Semantic Check: Enforces business logic (e.g., flagging suspicious Bond prices or generic issuer names).
  3. Immutable History Ledger: Every validation attempt generates a unique Trace ID. These results are locked into a local session ledger, allowing users to audit their history, replay past validations, and export the log for compliance reporting.

How we built it

We moved away from a purely CLI-based approach to build a responsive, user-centric web application using a modern frontend stack:

  • React 18 & TypeScript: We used TypeScript to mirror the strictness of financial regulations directly in our code. By defining assets as typed interfaces, we ensure that the "Schema" is baked into the application's very DNA.
  • Client-Side Logic: Unlike traditional validators that wait for a server response, we implemented the validation logic (both Schema and Semantic) entirely in the browser. This provides instantaneous, zero-latency feedback to the user.
  • Tailwind CSS: We designed a "Dark Mode" financial terminal interface that feels professional and trustworthy, using Tailwind for rapid UI development and consistent styling.
  • State Management: We built a custom history management system that treats every validation result as an immutable record, enabling the "Time Travel/Replay" features without database complexity.

Challenges we ran into

The biggest challenge was "Smart Conversion." Users (and AI) often paste data in unpredictable formats, sometimes YAML-like, sometimes raw text, sometimes broken JSON. Writing a robust parser in JavaScript that could extract meaningful key-value pairs from this "noise" without crashing required handling dozens of edge cases and regex patterns.

Another challenge was "Visualizing the Invisible." Compliance is usually a backend process (a log file somewhere). We had to figure out how to make validation exciting and visible. We iterated several times on the UI to create the "Badge System" (✅ Valid / ⚠️ Semantic Fail / 🚫 Schema Fail), finding the right balance between detailed technical logs and at-a-glance status indicators.

Accomplishments that we're proud of

  • The "Smart Convert" Button: We successfully built a feature that takes a messy block of text and instantly snaps it into perfectly indented JSON. It feels like magic.
  • The Interface: We turned what could have been a boring form into a beautiful, dashboard-style experience. Watching the status indicators pulse and update in real-time makes the mundane task of compliance feel engaging.
  • The Replay System: We enabled users to click "▶ Replay" on any historical record to instantly reload that specific data state and see why it failed or passed, effectively creating a time machine for data debugging.

What we learned

We learned that UX is a compliance tool. If a system is hard to use, people will bypass it. By making the validation tool fast, visual, and forgiving of input errors (thanks to the converter), we encourage users to validate their data more often. We also gained a deep appreciation for TypeScript's type system, which saved us from introducing our own bugs while trying to catch others'.

What's next for Blueprint Compliance Engine

We see this evolving into the universal "Frontend for AI Compliance."

  • API Integration: Connecting this frontend to a Python/Pydantic backend to handle even heavier validation workloads.
  • FIBO Expansion: Mapping the entire Financial Industry Business Ontology (FIBO) into our TypeScript interfaces.
  • PDF Generation: Allowing users to download a signed "Compliance Certificate" PDF for assets that pass all checks.

Built With

  • api
  • clsx
  • css3
  • date-fns
  • eslint
  • fibo
  • hashlib-(sha-256-hashing)
  • html5
  • json
  • lucide-react
  • pydantic
  • pydantic-(v2)
  • python
  • python-3.9+
  • re
  • react-18
  • rich
  • tailwind-css
  • tailwind-merge
  • typer
  • typescript-5.0+
Share this project:

Updates