Clarence Neil Meneses

Daydream — Emotional Regulation Research App

A research prototype for a Senior High School study on daydreaming, with server-side scoring, a peer forum, and a support chatbot.

ReactTypeScriptViteSupabasePostgreSQLEdge FunctionsRechartsTailwind CSS
daydream-mu.vercel.app

A Senior High School research team was studying how students use daydreaming to regulate emotion, and where that tips over into something harmful. Paper questionnaires would have given them one snapshot per participant and nothing to demonstrate. I built them a working prototype instead. The participants are minors and the subject is mental health, which meant the constraints mattered a great deal more than the feature list.

Not a diagnostic tool

The first decision was what the app must never claim. It is a research prototype, and it says so on every assessment and results screen; a result is shown as a band with guidance, never as a diagnosis. The second decision followed from the timeline — the validated instrument does not arrive until next school year, so the questions, the likert options, their weights, and the severity bands are all rows in the database rather than values in the code. When the real questionnaire lands, the team swaps the data. Nobody has to touch the frontend.

Scoring on the server

Scoring runs entirely in a Postgres function, so the browser never computes or submits a score — it submits answers and asks the database what they came to. Each answer is upserted against the attempt as the participant goes, which means someone can close the tab and pick the assessment back up rather than starting over. Results render as a semicircle gauge built in Recharts, with the severity bands drawn in their own colours and past attempts listed underneath, so repeat measurement over the study period is visible at a glance.

A forum and a chatbot

Around the assessment sit two things the study wanted for engagement. The forum runs on Supabase Realtime, so threads and comments appear without a refresh, with row-level security ensuring people can only edit their own posts and a pinned guidelines banner setting the tone. The chatbot, Haraya, runs inside a Supabase Edge Function so the API key stays server-side, and it falls back to rule-based replies when no key is configured — which means the team can demo it at zero cost and switch on the model only when they need to. Its footer says plainly that it is not a counselor, and lists the national crisis line.

Ethics as an architecture problem

Because participants are minors, I enabled anonymous sign-in so nobody has to hand over an email address to take part in a school study, and put a consent notice before the assessment stating that participation is voluntary and can be stopped at any time. Every table is behind row-level security and the app ships only the publishable key. None of that is visible in the interface, which is rather the point.

The part I am most pleased with is how little of the actual study is written in code. When the validated instrument arrives, updating this app is a data change — and that was the whole design goal, on a build with a genuinely short runway.