PlaySpec

Inspiration

Business rules usually start as short messages: “VIP customers get a discount” or “the total discount must not exceed 50%.” Engineers then have to interpret missing edge cases, while managers cannot easily verify what will actually be implemented.

We built PlaySpec to make business logic visible, interactive, and testable before production code is written.

What it does

PlaySpec turns a business requirement into a formal state-machine specification, an interactive visual playground, and TypeScript logic with property-based tests.

A manager can change inputs such as base price, VIP status, and campaign discount, then immediately see the calculated result and rule invariants. After approval, PlaySpec provides implementation code and Jest property tests that verify important safety properties.

The public deployment includes a fully working offline demo. It requires no login, API key, server, or payment, so judges can test it reliably.

How we built it

The frontend is a React and Vite single-page application written in TypeScript. It displays a formal JSON specification next to a sandboxed self-contained HTML widget running in an iframe.

The optional live mode uses an Express TypeScript API. It sends a natural-language requirement to OpenAI GPT-5.6 Luna through the OpenRouter gateway, then produces a formal specification and code artifacts.

Generated TypeScript is verified with Jest and fast-check property-based tests in a restricted Docker sandbox. The sandbox runs without network access, with a non-root user, read-only files, CPU, memory, and process limits.

Challenges we ran into

The main challenge was making AI-generated output reliable enough for a manager-facing workflow. Models can return incomplete JSON or unsafe widget code. We solved this by validating specification contracts, using a trusted self-contained widget renderer, providing clear fallback states, and making test verification the approval gate.

We also wanted the project to remain easy for judges to test without paid API access. That is why the public GitHub Pages deployment contains a stable offline demo with a realistic pricing rule and verified test output.

Accomplishments that we're proud of

We created a complete manager-to-engineering workflow rather than only a text-to-code prototype.

The demo visualizes a non-trivial pricing policy: VIP customers receive 35%, campaign discounts range from 0% to 40%, and the effective discount is capped at 50%. The interface makes this cap visible in real time.

The generated implementation is accompanied by property-based tests that verify randomized inputs and critical invariants, including non-negative final prices and a maximum 50% total discount.

What we learned

We learned that reliable AI products need explicit contracts around model output. A useful manager experience requires more than generating code: it needs understandable rules, safe interaction, deterministic fallbacks, and proof that the implementation respects the specification.

Codex accelerated the implementation of the React and Express application, Docker isolation, test workflow, security review, error handling, and the polished offline demo. GPT-5.6 supports the optional live requirement-to-specification and code-generation flow.

What's next for PlaySpec

Next, we plan to support more business-rule templates, versioned approvals, exportable specifications, collaboration between managers and engineers, and deeper traceability from requirement to generated tests and production pull requests.

Built With

• codex
• docker
• express.js
• fast-check
• github
• gpt-5.6
• jest
• openai
• openrouter
• react
• typescript
• vite