Slot Math & GDD

Slot Math Dashboard Design

Goal

Create a reusable, autonomous HTML dashboard for reviewing, editing and handing off slot mathematics without npm, a web server or backend connectivity.

Audience and job

Math designers, reviewers and developers use the page to answer one question: is this exact math version understood, evidenced and ready for its next approval gate?

Architecture

templates/slot-math-dashboard.html contains semantic HTML, CSS and vanilla JavaScript. It loads embedded demo data by default and accepts a JSON file matching the documented data contract. Edits remain local to the browser, persist in localStorage, and export as a new JSON snapshot. A Final snapshot is read-only; editing it requires “Create new Draft,” which changes lifecycle state without overwriting the imported Final.

templates/examples/classic-fruits-3x3-dashboard.json demonstrates the contract with existing Classic Fruits values. The HTML does not silently claim missing metrics: absent evidence renders as “Not provided.”

Information architecture

  • Header: game/math identity, Draft or Final state, current approval gate and import/export/print actions.
  • RTP balance rail: target marker, exact value, simulated value and confidence interval on one scale.
  • Primary metrics: total/base/feature RTP, hit frequency, standard deviation, volatility, trigger frequency, average feature award and max win.
  • Evidence views: RTP decomposition, win distribution, mechanics, exact-versus-simulation comparison, backend identity, verification gates and evidence links.
  • Governance views: locked/open parameters, changelog, approval history and handoff readiness.
  • Editor: form fields for key metrics and lifecycle metadata; changes update the dashboard and mark the snapshot dirty.

Visual direction

The interface resembles a probability lab instrument, not a casino lobby. Use cool paper white, graphite, blueprint blue, measured amber and pass/fail colors. Use a compact technical sans for data, a restrained slab/display face for identity and monospace for hashes. The signature element is the RTP balance rail. Cards remain square-to-soft with disciplined rules and limited shadow.

Interaction contract

  • Import validates top-level identity, lifecycle and metric shapes, then reports actionable errors.
  • Export downloads the current snapshot with no secret seed material.
  • Reset restores bundled demo data after confirmation.
  • Print produces a clean review/PDF layout.
  • Navigation and controls work by keyboard; focus is visible; reduced-motion preference is respected.
  • Browser storage is namespaced by gameId and mathVersion.

Acceptance criteria

  • Opens directly from disk in current Chrome/Safari without network or build tools.
  • Responsive at 360 px and desktop widths.
  • Renders Classic Fruits demo values accurately.
  • Imports, edits, persists and exports JSON.
  • Prevents direct editing of Final and creates a new Draft on request.
  • Shows exact and simulation values separately, including CI and missing-data states.
  • Computes reconciliation and readiness statuses without presenting internal checks as certification.
  • Prints without interactive controls or clipped content.