변경 내역
배포된 기능과 내부 변경 사항
룰렛 기능 구현
pre-1.0 · 2026-08-2912개의 전용 페이지, 직접 드래그할 수 있는 룰렛, 사운드, 공유 링크, 불필요한 다시 그리기를 제거한 렌더러를 추가했습니다.
추첨 방식
- 회전 전 사전 추첨. 회전 시 기각 샘플링(rejection sampling)을 적용한
crypto.getRandomValues를 통해 당첨자를 먼저 선정한 뒤, 애니메이션이 해당 항목을 가리키도록 조준합니다. 세게 튕기더라도 회전 시간이 길어질 뿐 당첨 결과는 달라지지 않습니다. - 공정성 페이지. 해당 페이지의 설명 자체가 알고리즘입니다. 화면에 보이는 코드가 실제로 실행되는 코드입니다.
- 가중치 및 중복 처리. 항목의 가중치는 추첨에서의 지분을 의미하며, 실제 확률 백분율로 표시됩니다. 동일한 텍스트의 항목이 2개 입력되어도 2개로 유지되며, 임의로 통합하지 않고 중복 항목 수를 명확히 표시합니다.
룰렛 기능
- 12개의 전용 페이지. 각 페이지는 항목이 미리 채워진 룰렛으로 열리며, 숫자 범위, 알파벳, 팀 나누기, 학급 명렬표, 추첨 기록 등 각 페이지 고유의 전용 컨트롤을 갖추고 있습니다.
- 드래그하여 돌리기. 손을 뗄 때의 속도가 추가 회전수가 됩니다. 회전 중에 화면을 누르면 즉시 멈추며, 스페이스바나 엔터 키를 누르면 버튼을 찾을 필요 없이 바로 회전합니다.
- 사운드 효과. 포인터가 구분선을 지날 때마다 발생하는 눈금 소리, 도착 효과음, 취소 가능한 카운트다운, 모바일 진동 기능이 지원됩니다. 각 기능은 켜고 끌 수 있으며 현재 켜짐/꺼짐 상태가 표시됩니다.
- 발표 모드. 보조 컨트롤이 숨겨지고 룰렛 크기가 화면 짧은 쪽의 70% 이상으로 확대되며, 결과는 넓은 공간에서도 한눈에 볼 수 있도록 고대비 패널로 큼직하게 표시됩니다.
- 두 가지 추가 추첨 모드. 원형 룰렛이 적합하지 않은 상황을 위해 슬롯 스트립과 카드 스트립 방식을 제공합니다.
저장 및 공유
- 스냅샷 방식의 공유 링크. 룰렛 데이터가 URL 자체에 인코딩되므로 링크가 만료되지 않으며, 공유 후 룰렛을 수정해도 상대방이 열어보는 내용에는 영향을 주지 않습니다.
- 저장된 룰렛, 회전 기록 및 가중치 프리셋. 모든 데이터는 현재 브라우저에 저장되며, 다른 기기로 옮길 수 있도록 파일 내보내기를 지원합니다. 별도의 계정 시스템이 없으므로 기기 간 데이터 이동은 이 파일 내보내기/가져오기를 통해서만 가능합니다.
내부 구현
- 캔버스(Canvas) 기반 렌더러 전환. 룰렛 화면은 내용이 변경될 때 한 번만 그려지며, 회전은 엘리먼트의 transform 속성으로 처리되어 회전 중 프레임별 연산 부담이 전혀 없습니다. 항목 텍스트는 캔버스 옆에 숨겨진 실제 리스트로 유지됩니다. 캔버스는 단순 픽셀이므로 스크린 리더가 읽을 텍스트가 별도로 필요하기 때문입니다.
- 동작 줄이기(Reduced Motion) 지원.
prefers-reduced-motion: reduce설정 시 회전 과정을 건너뛰고 결과를 즉시 안내합니다. 테스트한 3곳의 타사 서비스는 모두 이 기능을 전혀 지원하지 않았습니다. - 결과 읽기 지원. 결과는 캔버스 위에 그려진 픽셀이 아닌, 선택 가능한 텍스트 형태로 라이브 영역(live region)에 전달됩니다.
도구 중심 사이트로의 전환
pre-1.0 · 2026-08-27초기 SaaS 템플릿의 불필요한 구조를 비활성화하는 대신 완전히 제거했습니다.
TossWheel은 SaaS 스타터 템플릿에서 출발했으며, 이날 진행된 대부분의 작업은 덜어내는 일이었습니다.
제거된 항목
- 계정, 대시보드, 관리자 및 설정 화면. 로그인할 필요도, 로그인 뒤에 숨겨진 기능도 없으므로 단순 비활성화가 아닌 화면 자체를 완전히 제거했습니다. 비활성화된 기능 플래그라도 뒤편의 코드는 그대로 배포되기 때문입니다.
- 데이터베이스, 오브젝트 스토리지 및 키-값 캐시. 이제 Worker에는 어떠한 바인딩도 포함되지 않습니다. 목록은 브라우저에 저장되며, 공유된 룰렛은 링크 안에 담겨 전달됩니다.
- 결제, 뉴스레터 및 AI 관련 기능. 이 사이트에는 불필요한 요소들입니다.
결정된 사항
- 방향 A, "도구 본연의 형태". 3개의 고화질 프로토타입을 제작한 뒤 하나를 선택했습니다. 왼쪽에 룰렛, 그 옆에 목록, 룰렛 아래에 실행 버튼을 배치하고 룰렛을 페이지 내 유일한 유채색 요소로 구성했습니다.
- 출시 전 인덱싱 차단. 출시 체크리스트가 완료될 때까지 모든 응답에
noindex를 적용하여 미완성 상태의 페이지가 검색 엔진에 색인된 후 다시 색인을 취소해야 하는 번거로움을 방지했습니다.
기록으로 남기는 이유
나중에 데이터베이스나 로그인 기능을 다시 도입한다면 이는 단순한 구현 방식의 변경이 아니라 제품의 근본적인 변화가 됩니다. 이러한 제약 조건 덕분에 TossWheel에서는 계정 없이도 룰렛을 이용할 수 있으며 사이트에 목록 사본이 저장되지 않습니다.