픽셀 아트로 시뮬레이션한 가상의 스포츠, 24시간 라이브 채널을 만들었습니다

Scorchball TV는 가상의 스포츠를 24시간 내내 틀어주는 채널이야. 8개 클럽이 있고, 일주일에 한 시즌씩 돌아가. 대략 2시간 40분마다 라이브 매치가 열리고, 나머지 시간은 실제 방송국처럼 재방송, 스튜디오 데스크, 경기 후 인터뷰, 가짜 스폰서 광고, 저녁 팟캐스트 같은 걸로 채워져 있지. 리그 기록도 다 남아있어. 드래프트, 계약, 은퇴, 기록, 전설까지 전부 다. 브라우저 전체 화면으로 보는 게 제일 좋고, 모바일에서도 잘 돌아가!

내가 디렉팅하고 Claude Code가 코드 한 줄 한 줄 다 짰어. 작업하면서 효과 봤던 방식들 공유할게:

• 비전 문서를 먼저 만들고, 파트나 단계별로 디자인 문서를 따로 작성했어.

• 만들기 전에 목업부터: 시각적인 요소는 무조건 Claude한테 A, B, C안을 나란히 띄워놓고 실제 코드랑 데이터로 대충 그려보게 했어.

• 코드가 아니라 데이터 중심: 타이밍, 규칙, 해설 대사 전부 데이터 파일에 박아놨어. 그래서 "광고 좀 줄여" 같은 요청도 코드 수정할 필요 없이 숫자 하나만 바꾸면 끝이야.

게임 서버는 따로 없어. 브라우저마다 스냅샷이랑 비밀 시드에서 나온 일일 키를 가지고 리그를 똑같이 재구성하는 방식이라, 다들 똑같은 경기를 볼 수 있어. 목소리는 ElevenLabs를 썼고(미리 11,000개 정도 클립을 만들어둠), 모든 소리는 합성된 거야.

시청하기: https://scorchball.tv/?from=cai

제작기: https://scorchball.tv/how-it-was-built

코드 (MIT 라이선스, CLAUDE.md 및 문서 포함): https://github.com/savenor14/scorchball-tv

일일 결과 (모든 라이브 매치 종료 후 자동 게시):