Specify
Turn a research task into explicit screens, events, trial rules, and saved fields.
Individual practice · Open to everyone
Build a reaction-time experiment with AI
Use an AI coding assistant to plan, build, debug, and deploy a complete browser-based task. This practice gives everyone the technical workflow needed for the final project; no prior coding experience is required.
Why this comes first
A small rehearsal for the final project
The scientific task is intentionally simple so you can focus on the development cycle: specify behavior precisely, prompt the model, test what it produces, diagnose failures, protect participant data, and deploy a working site.
Test
Verify trial counts, timing, random placement, network behavior, and visualization.
Deploy
Publish a live experiment and learn what changes when code leaves your own computer.
Target product
The reaction-time task
Build one index.html page with a welcome screen, ten reaction-time trials, a results screen, and a histogram that compares the current session with an anonymous aggregate.
Your role is lead investigator. Gemini—or another instructor-approved AI coding assistant—may generate and revise code, but you must give precise requirements, test every behavior, protect the data, and be able to explain the finished system.
Build sequence
Five phases
Prepare private data storage
Create a Google Sheet named RT_Experiment_Data with the headers Timestamp, Random_Participant_Code, Trial_Number, and Reaction_Time. Keep the sheet private and share its view-only link only through the course portal.
Build the Apps Script endpoint
Ask the coding assistant for a validated doPost(e) that accepts only the random code, trial number, and reaction time, adds a server timestamp, and appends one row per trial. The public doGet(e) response should contain aggregate histogram bins and counts—not rows, identifiers, or raw trial records.
Build the browser task
Generate a random session code automatically. Present a circle at a random valid screen location; record the click latency; hide it; wait about 500 ms; and repeat until exactly ten trials are complete. Submit the ten records only after successful completion.
Visualize feedback
Calculate the current user's average reaction time. Use Chart.js or an equivalent library to plot the aggregate histogram returned by the endpoint and add a clear marker for the current average.
Test and publish
Test blank and repeated starts, all ten trials, small screens, failed requests, and chart loading. Publish the task with GitHub Pages and retest the live URL before submitting it in Canvas.
Prompting pattern
Tell the assistant what success means
Build one phase at a time. Paste error messages back exactly and ask for the smallest targeted correction.
Include in every build prompt
- The current phase and desired output
- Exact field names and trial count
- Screen-by-screen behavior
- Privacy and access constraints
- Failure and retry behavior
- A checklist of acceptance tests
Ask during review
- Can the task submit twice?
- Can the circle appear partly off-screen?
- Does timing begin only when the circle appears?
- What happens when the network fails?
- Can any public request reveal raw records?
- Does the live deployment pass all ten trials?
Required safeguard
Practice privacy from the first prototype
Do not collect names, emails, student IDs, free text, or browser fingerprints. Generate a new random code in the task, keep the Google Sheet private, submit its link only through Canvas, and expose only aggregated comparison data from the public endpoint. Never place the sheet or Apps Script management link on this website or in a public README.
What to submit
Four deliverables
Live experiment
A public GitHub Pages URL where the ten-trial task and histogram work.
Codebase
The GitHub repository containing the frontend and documentation, without secrets or private data links.
Private database link
A view-only Google Sheet link submitted privately in Canvas so the instructor can verify the ten trial rows.
AI reflection
At most two paragraphs describing the hardest instruction, a specific bug, and how your prompts changed during debugging.
Evaluation
100-point rubric
Task mechanics · 35 points
- Automatic random participant code: 10
- Random, fully visible circle placement: 10
- Accurate timing and exactly ten trials: 15
Data handling · 30 points
- Reliable deployed endpoint: 10
- Ten accurate, validated rows: 20
Visualization · 20 points
- Fetch aggregate comparison data: 10
- Histogram with current-average marker: 10
Deployment and reflection · 15 points
- Live, functional GitHub Pages site: 5
- Specific, thoughtful AI reflection: 10
Use Canvas for submission and current logistics. Submit private links, confirm the due date, and follow any instructor announcements there. This public page contains no roster, group assignment, student submission, or database link.