← 포트폴리오 목록
웹사이트&웹앱2023
경품 추첨 미니게임
대형 오프라인 행사용 슬롯머신 경품 추첨 웹 애플리케이션. 대형 스크린 송출 최적화, 관리자 실시간 제어 패널 탑재.
ReactTypeScriptCSS AnimationWebSocket
Background
대규모 오프라인 행사에서 프로젝터나 LED 월에 송출할 시각적으로 임팩트 있는 경품 추첨 연출이 필요했습니다. 기존 단순 번호 추첨 방식은 참가자의 몰입감을 끌어내지 못했고, 행사 운영자가 현장에서 경품과 추첨 진행을 유연하게 제어할 수단도 없었습니다.
Solution
슬롯머신 릴 애니메이션 기반의 경품 추첨 웹앱을 개발했습니다. 당첨 순간의 시각 효과, 사운드 연출, 화면 전환 애니메이션을 적용하여 현장 몰입감을 극대화했습니다. 별도의 관리자 패널에서 경품 목록, 당첨 확률, 추첨 진행/일시정지를 실시간으로 제어할 수 있어 행사 흐름에 유연하게 대응합니다.
Key Features
01
슬롯머신 연출 엔진
CSS 하드웨어 가속 + requestAnimationFrame 기반 슬롯 릴 애니메이션. 당첨 확정 시 파티클 효과와 사운드 연출
02
관리자 실시간 제어
경품 목록 편집, 등급별 당첨 확률 설정, 추첨 시작/일시정지/재개를 별도 디바이스에서 실시간 제어
03
대형 디스플레이 최적화
프로젝터, LED 월 등 대형 스크린 환경에 최적화된 풀스크린 레이아웃. 원거리 가시성을 고려한 대형 타이포그래피
04
당첨 이력 관리
추첨 결과를 실시간 기록하여 중복 당첨 방지. 행사 종료 후 당첨 내역 CSV 내보내기 지원
Result
대규모 오프라인 행사에 성공적으로 적용. 관리자 실시간 제어로 행사 진행 유연성 확보. 기존 번호 추첨 대비 참가자 몰입도 대폭 향상.