Reaction Speed Test Project

โปรเจ็กต์วัดเวลาตอบสนอง (Reaction Time) ด้วย Arduino + จอ 4 หลัก TM1637 และหน้าเว็บ (Web Serial) แสดงผลเป็นตาราง/กราฟ พร้อมบันทึก CSV

Start Test View Abstract View Test Guide

Abstract

โครงการนี้นำเสนอระบบวัดเวลาการตอบสนอง (Reaction Time) ที่ใช้งานง่ายและต้นทุนต่ำ ใช้บอร์ด Arduino UNO R4 ร่วมกับจอ TM1637 เพื่อแสดงผลรูปแบบ s.mmm และส่งผลลัพธ์ผ่าน Serial ให้หน้าเว็บที่พัฒนาโดย Bootstrap + Chart.js และ Web Serial API. ผู้ใช้สามารถบันทึกผลเป็น CSV ดูสถิติ Count/Avg/Best/Worst และกราฟแบบเส้น/ฮิสโตแกรมแบบเรียลไทม์ โดยไม่ต้องมีเซิร์ฟเวอร์ เหมาะสำหรับสาธิตเชิงการศึกษาและงานวิจัยพฤติกรรมการตอบสนอง

Overview

How it works

  1. กดปุ่มเริ่ม → ไฟแดงติด, ระบบรอแบบสุ่ม 1–10 วินาที
  2. ครบเวลา → ไฟเขียวติด (READY)
  3. ผู้เล่นกดปุ่ม → หยุดเวลา, แสดงผล s.mmm บนจอ และส่งบรรทัด [RT] Reaction = <ms> ms ทาง Serial
  4. หน้าเว็บอ่าน Serial ผ่าน Web Serial แล้วบันทึก/คำนวณสถิติ + วาดกราฟ
ใช้เว็บเบราว์เซอร์: Chrome/Edge (Desktop) และเปิดผ่าน HTTPS (เช่น GitHub Pages) หรือ localhost

Test Procedure

1) เตรียมฮาร์ดแวร์
  • TM1637 → VCC=5V, GND=GND, CLK=D3, DIO=D6
  • ปุ่ม → D2 ↔ GND และตั้ง INPUT_PULLUP
  • LED แดง D4 → R 220–330Ω → LED → GND
  • LED เขียว D5 → R 220–330Ω → LED → GND
  • เสียบ Arduino UNO R4 ด้วยสาย USB
2) อัปโหลดสเก็ตช์
  • เลือกบอร์ด/พอร์ต UNO R4 ใน Arduino IDE
  • ติดตั้งไลบรารี TM1637Display
  • พิมพ์ผลลัพธ์รูปแบบ [RT] Reaction = <ms> ms ที่ 9600 bps
  • หลังบูต จอควรแสดง 0 และไฟทดสอบติดดับสั้น ๆ
3) เปิดหน้าเว็บทดสอบ
  • เปิด Reflex Test หรือไฟล์ reflex.html
  • กด Connect เลือกพอร์ตของบอร์ด แล้วเชื่อมต่อ
  • สถานะเป็น Connected และมี Live Log
  • ใช้ Chrome/Edge (Desktop) และ HTTPS หรือ localhost
4) วิธีเล่น/ทดสอบ
  1. กดปุ่ม 1 ครั้งเพื่อเริ่มรอ (ไฟแดงติด)
  2. รอจนไฟเขียว (READY) ติด—ห้ามกดก่อนเวลา
  3. ไฟเขียวติดแล้วกดทันที เพื่อหยุดเวลาและบันทึกผล
  4. ระบบเพิ่มผลลงตาราง/กราฟอัตโนมัติ
  5. กดอีกครั้งเพื่อเริ่มรอบถัดไป
5) บันทึก/ดูสถิติ
  • ปุ่ม Download CSV เพื่อบันทึกผลทั้งหมด
  • KPI: Count / Average / Best / Worst แบบเรียลไทม์
  • กราฟเส้น = ลำดับการกด, ฮิสโตแกรม = การกระจายค่า (ปรับ Bin ได้)
Troubleshooting
  • “Failed to open serial port” → ปิด Serial Monitor ใน IDE แล้ว Connect ใหม่
  • ไม่เห็นพอร์ต → ตรวจสาย/ไดรเวอร์ และเสียบใหม่
  • ไม่มี Live Log → ตรวจบรรทัด [RT] Reaction = <ms> ms
  • ยัง Connect ไม่ได้ → เปิดผ่าน HTTPS หรือ localhost

Wiring (Quick Ref)

TM1637
  • VCC → 5V
  • GND → GND
  • CLK → D3
  • DIO → D6
ปุ่ม & LED
  • ปุ่ม D2 ↔ GND (ใช้ INPUT_PULLUP)
  • LED แดง D4 → R → LED → GND
  • LED เขียว D5 → R → LED → GND

All Details & Source Code

หน้าทดสอบ (เว็บ)

เปิดหน้าเว็บเพื่อเชื่อมต่อบอร์ดและดูตาราง/กราฟแบบเรียลไทม์

Open Reflex Test
ต้องใช้ Chrome/Edge (Desktop) และ HTTPS
โค้ดและไฟล์ที่เกี่ยวข้อง
  • Repository บน GitHub
  • reflex.html – หน้าเว็บ (Bootstrap + Chart.js + Web Serial)
  • index.html – หน้ารายละเอียดโปรเจกต์ (หน้านี้)
  • reaction-speed-test-arduino/ – สเก็ตช์ Arduino (ใช้ไลบรารี TM1637Display)
Start Test