Single HTML 기반 State Machine 설계로 구현한 튜링 테스트 퍼즐 게임

IMITATION: The Turing Test, From the Inside

Himanshu Kumar2026년 6월 9일4분beginner

AI 요약

Context

런타임 서버와 외부 프레임워크 없이 브라우저 환경에서 즉시 구동되는 고효율 게임 아키텍처 필요. 단순한 퀴즈 형식을 넘어 사용자 선택에 따라 다면적인 신뢰도 점수가 변동하는 동적 시스템 구축을 목표로 함.

Vanilla JS 기반의 State Machine을 도입하여 TITLE부터 WIN/LOSE까지의 게임 흐름을 상태별로 제어하는 구조 설계
logic, emotion, certainty라는 3가지 수치형 차원을 정의하고 각 답변마다 독립적인 가중치를 부여한 데이터 모델링
심사원별로 서로 다른 가중치 산출 공식(Formula)을 적용하여 동일한 답변이 심사원에 따라 상반된 결과로 이어지는 다차원 스코어링 로직 구현
Web Audio API를 통한 실시간 사운드 생성으로 외부 리소스 의존성을 제거한 Zero-dependency 오디오 시스템 구축
Trust Score와 연동된 CSS 변수를 활용하여 화면의 flicker 및 CRT 효과를 동적으로 제어하는 시각적 피드백 루프 설계
답변 순서를 런타임에 Shuffle 하여 단순 암기 패턴을 방지하고 게임의 재플레이 가치를 높인 무작위성 로직 적용

실천 포인트

1. 외부 API 호출 없는 Client-side 전용 앱 설계 시 상태 전이도(State Transition Diagram)를 먼저 정의했는가

2. 다면적인 평가 시스템 구축 시 단순 합산이 아닌 속성별 가중치 행렬(Weight Matrix)을 적용했는가

3. 리소스 로딩 시간을 줄이기 위해 Web Audio API나 CSS-only 효과 등 브라우저 내장 기능을 최대한 활용했는가

태그