Survey Simulation: Two-File Survey Dashboard and Analytics Workbench

Survey Simulation is a two-file browser application. survey-realtime.html runs a live survey simulation with animated respondent progress, per-question timing, and real-time completion tracking. survey-analyzer.html is a standalone analytics workbench for exploring completed results through cross-tabulations, distribution charts, and data export.

Both files are self-contained HTML documents. They pull React 18, Chart.js, and Recharts from CDN and use Dexie.js as a typed wrapper around the browser's IndexedDB API. There is no build step, no package manager, and no local server requirement. Opening either file in a browser is the entire installation process.

The two files share a single IndexedDB database. The simulation file writes to it. The analyzer file reads from it. They do not need to be open at the same time.

Why is it useful?

The two-file split is the design decision that makes this tool practical for its intended context. Separating simulation from analysis separates two very different workflows.

During simulation, the relevant information is temporal: how many respondents have completed, how long each question takes, whether the completion rate is holding steady or falling off. The survey-realtime.html file surfaces that information with animated progress bars and a live completion counter. The researcher watches it the way a field supervisor watches a call center floor.

During analysis, the relevant information is structural: how answers distribute across persona types, which questions show cross-tab variance, which items cluster together. The survey-analyzer.html file is built for that retrospective mode — static, navigable, and exportable. A researcher can open it hours after the simulation finished, or share it with a colleague who was not present for the simulation run.

Because each file is a single HTML document, sharing either one requires sharing one file. No credentials, no access controls, no account creation. That distribution model fits the use case of showing preliminary results to a stakeholder who should see the data but does not have access to backend systems.

How and where does it apply?

The primary application is standalone research prototyping. A researcher drops both files in a folder, configures a simulation in survey-realtime.html, runs it, then opens survey-analyzer.html to explore the results.

graph LR
    A[survey-realtime.html] -->|writes| B[IndexedDB<br/>Dexie.js]
    B -->|reads| C[survey-analyzer.html]
    A --> D[Live Progress<br/>Chart.js]
    C --> E[Cross-tabs<br/>Recharts]
    C --> F[CSV Export]

Survey Simulation also serves as a lightweight demo layer for the broader Panterra toolchain. When a stakeholder needs to understand what a simulated research panel produces, we can hand them these two files. They run a simulation themselves in five minutes and open the analyzer without waiting for a system walkthrough.

The Dexie schema defines two object stores. responses records one row per respondent per question, with a personaType field that the analyzer uses as the primary grouping dimension for cross-tabs. sessions records session-level metadata including start time, completion time, and total respondent count.

const db = new Dexie('SurveySimDB');
db.version(1).stores({
  responses: '++id, sessionId, questionId, personaType, answer, timestamp',
  sessions: '++id, startedAt, completedAt, totalRespondents'
});

The compound index on sessionId and questionId in the responses store means the analyzer can retrieve all answers to a specific question in a specific session with a single indexed query rather than a full table scan. For simulations approaching 100 respondents across 20+ questions, that indexing strategy keeps the analyzer responsive.

The CSV export from the analyzer produces a flat file with one row per response record and column headers derived from the schema field names. That format is directly ingestible by the Panterra Analyzer and by any standard statistical package.