본문 바로가기

블로그 / 개발일지

모르는 사람보다 친구방: 랜선포차 첫 화면을 뒤집고 판 벌칙을 붙인 날

9월 28일, 랜선포차의 주인공을 빠른 매칭에서 친구방으로 바꿨다. 홈 버튼 순서, 2~3명 판에서 뺀 게임, 방장이 거는 판 벌칙과 그 안전 규칙을 커밋과 결정 기록으로 정리했다.

Salmonholic ·· 7분 읽기

랜선포차 결과 화면의 "오늘의 벌칙" 카드. 꼴찌로 걸린 감자 캐릭터 옆에 "커피 쏘기"가 크게 적혀 있다

9월 28일 밤 11시 반쯤, 랜선포차의 첫 화면을 뒤집는 커밋 두 개를 넣었다. 하나는 “친구 중심 방향 전환 1단계”(06cb6da), 다른 하나는 “친구방 판 벌칙”(a75da20)이다. 그 직후 결정 기록을 한 줄 고친 커밋(96d586c)까지 합쳐 이날의 작업을 정리한다.

왜 방향을 바꿨나

랜선포차는 폰 브라우저로 여럿이 모여 미니게임을 하고, 진 사람이 흰 우유를 마시는 우유 벌칙 파티 게임이다. 처음에는 모르는 사람 여섯 명을 바로 묶어 주는 빠른 매칭이 첫 화면의 큰 버튼이었다.

결정 기록에 적은 배경은 두 줄이다. 홍보 글에 반응이 없었다. 그리고 모르는 사람과 무작위로 만나서는 이런 게임의 재미가 잘 살지 않는다. 아는 사람끼리 서로 놀리고, 진짜 벌칙을 걸고, 반응을 보는 맛이 빠진다.

다행히 필요한 부품은 이미 있었다. 4자리 코드로 들어가는 친구방, ?room= 링크 초대, 단골방, 방장이 고르는 방 설정이다. 그래서 새 기능을 만들기보다 이미 있는 친구방을 주인공으로 올리고, 빠른 매칭은 지우지 않고 보조로 내리기로 했다. 1단계는 첫 화면과 흐름만 바꾸는 범위로 잘랐다.

홈·대기실·결과 화면에서 바꾼 것

바뀐 자리를 화면별로 비교하면 이렇다.

화면 전 후
홈 출석·미션 카드 아래 큰 “빠른 매칭”, 그 아래 작은 친구방 만들기 골든타임 배너 바로 아래 큰 “친구랑 하기”, 맨 아래 보조 버튼 “모르는 사람이랑 한 판”
홈 (처음 온 기기) 안내 없음 “단톡방에 링크 하나 던지면 친구들이 바로 들어와요. 설치·가입 없음” 한 줄
대기실 코드가 크고 공유 버튼은 옆에 “단톡방에 친구 부르기”가 가장 크고 코드는 오른쪽에 작게
친구방 결과 명장면 카드 버튼 같은 버튼을 “단톡방에 결과 자랑”으로
빠른 매칭 결과 “친구 불러서 한 판 더” 버튼 “다음엔 친구랑 해 보기” 권유 한 줄 + 친구방 만들기

첫 방문 안내 한 줄은 그 기기에서 친구방을 한 번 만들면 다시 나오지 않는다. 브라우저 저장소에 표시 하나만 남긴다. 단골방이 있는 사람에게는 “우리 단골방 열기” 버튼이 친구랑 하기 바로 아래에 붙는다.

대기실에서 방장 혼자 있을 때는 공유 버튼이 살짝 두근거린다. 움직임 줄이기 설정을 켠 기기에서는 멈춘다. 공유 시트를 자동으로 띄우는 방법도 생각했지만, Web Share는 사용자가 직접 누른 동작 안에서만 열려서 버튼으로 남겼다.

빠른 매칭 결과 화면 아래쪽. 다시 하기, 자랑하기 버튼 아래에 “다음엔 친구랑 해 보기. 아는 사이라 더 놀리기 좋아요”와 친구방 만들기 버튼이 있다 빠른 매칭으로 한 판을 끝낸 결과 화면. 맨 아래 점선 상자가 이번에 넣은 친구방 권유다

전환이 효과가 있었는지 보려고 통계 항목도 같이 넣었다. 친구방에서 결과 뒤 같은 방으로 다시 시작한 판을 따로 세고, 통계 보고서에 “친구 한판더” 열을 만들었다. 홈과 결과 화면의 친구 버튼 누름도 따로 센다. 아직 이 숫자로 판단할 만큼 기간이 쌓이지 않아서, 이 글에는 결과를 적지 않는다.

2~3명 판에서 게임을 뺐다

친구방은 빠른 매칭과 달리 두세 명으로도 시작한다. 그런데 인원이 적으면 규칙상 성립은 해도 판이 뻔해지는 게임이 있었다. 하나씩 따져 보고 뺄 목록을 정했다.

export const FEW_PLAYER_SKIP = {
  2: ["nunchi", "gongsan", "dubu"],
  3: ["gongsan"],
};
  • 눈치게임: 두 명이면 “먼저 누른 사람이 이긴다, 겹치면 둘 다 진다”만 남는 반응 싸움이 된다.
  • 공산당 게임: 방금 나를 찍은 사람은 못 찍는다. 두 명이면 지목 대상이 늘 상대 한 명이고, 세 명이어도 지목이 늘 한 사람으로 정해져 고를 게 없다.
  • 두부 게임: 두 명이면 몇 칸을 건너뛸지 계산할 거리가 없다.

가중치를 낮추는 대신 아예 뺀 이유도 기록에 남겼다. 매 라운드 후보 세 개 중에서 고르는 구조라 가중치는 화면에서 체감되지 않는다. 빼면 규칙 설명이 한 줄로 끝난다. 다만 방장이 게임을 많이 꺼 둬서 후보 세 개와 최근 제외 두 개, 합쳐 다섯 종이 안 남으면 빼지 않는다. 빠른 매칭에는 적용하지 않았다.

개발 중 자동 시뮬레이션으로 인원별로 300판씩 돌려 판 길이를 확인했다.

인원 판 길이 중앙값 후보 게임 바꾸기 전
2명 4.6분 13종 16종, 4.5분
3명 7.0분 22종 7.0분
4명 8.0분 24종 그대로 —

판 길이는 거의 그대로였다. 뺀 게임들이 평균 길이에 가까운 게임이라서다. 2명 판은 첫 번째로 화장실에 간 사람이 나오면 끝나서 짧다. 친구들과 해 보고 “너무 금방 끝난다”는 말이 나오면 2명 판만 우유를 약하게 하는 게 다음 후보로 적혀 있다.

방장이 거는 판 벌칙

친구끼리의 긴장감은 진짜 벌칙에서 나온다고 봤다. 그래서 친구방 설정에 “판 벌칙” 한 줄을 더했다. 방장이 30자 안으로 적거나 추천 칩을 누르면, 대기실에 있는 모두에게 “판 벌칙: ○○” 줄이 보인다. 기본값은 벌칙 없음이다.

친구방 설정의 판 벌칙 입력칸과 추천 칩. 벌칙 없음, 꼴찌가 커피 쏘기, 우유왕 소원 하나 들어주기, 꼴찌가 설거지 담당 등이 있다 추천 칩 8개는 초안이다. 결정 기록에 “검수는 나중에”로 남겨 두었다

누가 걸릴지는 세 가지 중에서 고른다.

  • 꼴찌(기본): 결과 순위 맨 끝. 가장 먼저 화장실에 간 사람이고, 아무도 안 갔으면 배탈 게이지가 가장 높은 사람이다.
  • 우유왕: 1등이 걸린다. “이긴 사람이 쏜다”는 역발상이다.
  • 랜덤 1명: 결과가 나올 때 서버가 한 명을 뽑는다.

두 번째 선택지는 처음에 “우유왕 반대”라는 메모로만 있었다. 꼴찌와 같은 뜻이면 선택지를 둘 둘 까닭이 없어서 1등이 걸리는 쪽으로 해석해 넣었다. 다른 후보로 “가장 많이 마신 사람”과 “꼴찌·랜덤 둘만”도 적어 두었는데, 96d586c에서 세 선택지를 그대로 확정했다.

결과 화면에서는 우유왕 발표 다음에 1.2초 동안 북소리가 울리고, 쾅 하는 소리와 함께 “오늘의 벌칙” 큰 카드가 뜬다. 맨 위 사진이 그 카드다. 명장면 공유 카드와 공유 문구에도 벌칙 한 줄이 들어간다. 다른 사람 닉네임을 가리는 기존 규칙은 그대로 둔다.

벌칙 칸은 채팅보다 한 겹 더 막는다

친구방이라도 처음 보는 사람이 앉을 수 있다. 그리고 벌칙 문구는 결과 화면과 공유 카드에 크게 남는다. 그래서 저장하기 전에 세 겹을 통과하게 했다.

  1. 채팅 보호 모드와 같은 규칙: 연락처, 링크, 만남 제안, 개인정보, 성적 표현, 금전 제안
  2. 욕설
  3. 벌칙 칸에만 쓰는 돈 규칙: 현금 액수, 송금, 계좌처럼 실제 돈이 오가는 표현

판 벌칙 입력칸에 “꼴찌가 만원 내기”를 적자 아래에 빨간 글씨로 “돈 액수·송금은 벌칙으로 못 걸어요. 커피 쏘기 정도로!“가 뜬 화면 돈 액수를 적으면 저장 전에 화면에서 바로 까닭을 알려 준다

클라이언트와 서버가 같은 검사 함수를 쓴다. 화면에서 먼저 이유를 보여 주고, 그래도 들어온 문구는 서버가 조용히 무시하고 지금 값을 유지한다. 반대로 “꼴찌가 커피 쏘기”, “밥 사기” 같은 가벼운 내기는 원래 채팅 규칙에도 걸리지 않는다는 걸 테스트로 확인했다. 그래서 규칙을 풀 필요는 없었다. 추천 칩에는 우유 테마에 맞는 것만 넣었다.

남은 일

1단계는 버튼 순서와 문구, 그리고 판 벌칙이다. 남은 일은 추천 칩 8개를 다시 보는 것과, “친구 한판더” 숫자가 쌓이면 이 전환이 맞았는지 확인하는 것이다.

친구방 코드와 링크 초대의 원래 구조는 빠른 매칭과 친구방 4자리 코드에, 벌칙 문구가 통과해야 하는 채팅 규칙은 채팅 안전장치 글에 적었다. 2명 판에서 빠진 게임이 궁금하면 눈치게임 공략과 공산당 게임 공략을 보면 된다. 친구방은 랜선포차 게임 페이지에서 바로 열 수 있다.

#랜선포차#개발일지#친구방#판 벌칙#UX

함께 읽으면 좋은 글

전체 글 →