단톡방 밸런스게임을 그냥 웹으로 만들어버렸습니다 ⚖️

단톡방에서 밸런스게임 한 번씩 돌잖아요. "평생 치킨만 vs 평생 피자만" 이런 거. 근데 카톡으로 하면 투표 집계가 안 되니까 누가 이겼는지 흐지부지 끝납니다. 그게 아쉬워서 웹으로 만들었어요.

화면에 카드 두 장이 뜨고, 끌리는 쪽을 누르면 그 순간 투표 비율이 막대로 차오르면서 공개됩니다. 내가 다수인지 소수인지 바로 나와요. 밸런스게임의 재미가 결국 이거더라고요. "이건 무조건 A지" 하고 눌렀는데 34%가 나올 때의 그 기분.

질문은 연애/직장/일상/음식 쪽으로 20개 넘게 넣어놨고, 직접 만들 수도 있습니다. 좌우 텍스트만 입력하면 내 질문이 큐에 추가돼서 바로 플레이돼요. 친구들 반응이 궁금한 질문 하나 만들어서 링크 던져보세요. 정치나 혐오성 주제는 일부러 안 넣었습니다. 웃자고 하는 게임에 싸움 나면 안 되니까요.

만들면서 제일 고민한 건 의외로 "기초 표"였습니다. 서버가 없는 앱이라 실제 집계를 모을 수가 없거든요. 근데 들어왔는데 0표 vs 0표면 재미가 없잖아요. 그래서 질문 ID로 해시를 만들어서 그럴듯한 기초 비율을 깔고, 거기에 내 투표를 localStorage로 얹는 방식으로 풀었습니다. Math.random을 안 쓰고 해시로 한 이유는 새로고침할 때마다 비율이 널뛰지 않게 하려고요. 서버 없이 어디까지 되나 실험해본 셈인데 생각보다 그럴듯합니다.

결과 공개 애니메이션 타이밍도 몇 번을 고쳤는지 모릅니다. 너무 빠르면 김새고 너무 느리면 답답해서, 지금은 누르고 살짝 뜸 들였다가 차오르게 해놨어요.

Next.js(App Router) + React 19 + TypeScript + Tailwind v4 조합이고, 차트 라이브러리 없이 막대 애니메이션까지 직접 만들어서 가볍습니다. 데스크톱은 좌우 스플릿, 모바일은 위아래 스플릿으로 바뀌어요.

친구들한테 돌렸을 때 제일 웃겼던 건 "헐 나 소수였어?" 하고 진심으로 충격받던 애였습니다. 여러분도 본인이 다수파인지 한번 확인해보세요. 링크는 여기입니다: https://balance-vote.vercel.app

질문 아이디어가 은근 빨리 고갈되던데, 밸런스게임은 역시 양쪽 다 싫은 선택지가 제일 반응이 좋습니다. '평생 여름만 vs 평생 겨울만' 같은 거요. 둘 다 좋은 건 고민이 안 되니까 재미가 없더라고요. 여러분이 만든 역대급 악질 질문이 있다면 댓글로 공유해주세요. 다음 업데이트 때 기본 질문 세트에 넣어드리겠습니다. 출제자 익명은 보장합니다.

덧. 지켜보니 60:40 언저리로 갈리는 질문이 제일 많이 재플레이되더라고요. 51:49처럼 팽팽하면 오히려 싱겁고, 적당히 기울어야 소수파가 항변을 시작합니다. 질문 만들 때 참고하세요.