live · service
티츄온라인
티츄·마이티·스컬킹·러브레터 — 카드 한 벌로 즐기는 게임을 모은 실시간 멀티플레이 앱. 매칭으로 모르는 사람과도, 코드로 친구하고만도 플레이할 수 있습니다.
서비스 소개
티츄온라인은 직접 카드게임을 즐기던 경험을 그대로 모바일로 옮기려는 시도에서 시작했습니다. 오프라인에서 4명이 모여야만 할 수 있던 게임을, 흩어져 있어도 같은 테이블에 앉은 것처럼 함께 칠 수 있게 만드는 게 목표였습니다.
출시 후로는 한 게임에 머무르지 않고 — Skull King, Love Letter, 마이티까지 — 카드 한 벌로 즐기는 게임들을 차례로 더해왔습니다. 백엔드는 Node.js + TypeScript 위에 WebSocket 으로 실시간 동기화를 담당하고, 전적·매치 데이터는 PostgreSQL 에 저장합니다. 앱은 Flutter 한 코드베이스로 iOS / Android 동시 출시했고, 사용자 로케일에 맞춰 한국어 · 영어 · 독일어로 응답합니다.
- 4가지 게임 한 앱에티츄 · Skull King · Love Letter · 마이티. Skull King은 Kraken / White Whale / Loot 확장팩까지.
- 실시간 멀티플레이WebSocket 기반으로 카드 한 장의 지연도 거의 없이 동기화. 일시 단절 시 게임 자동 복구.
- 친구방 / 빠른 매칭코드를 공유해 친구하고만 칠 수도, 매칭으로 모르는 사람과 칠 수도.
- 사람 같은 봇마이티 / Skull King 봇은 카드 카운팅과 트럼프 빼기 같은 전략적 플레이를 합니다.
- 랭킹 · 시즌 보상점수 비례 ELO, 시즌별 보상이 모든 게임에 동일하게 적용됩니다.
- 운영 도구관리자 대시보드, 공지(Notices), 유지보수 이력, 비주얼 상점 에디터까지 갖췄습니다.
- Blue / Green 무중단 배포두 벌의 서버를 번갈아 띄우고 트래픽을 한쪽으로 절체 — 게임 중에도 끊김 없이 새 버전을 배포합니다.
- Cross-platform · 다국어iOS · Android 동일 빌드. 한국어 · 영어 · 독일어 — 서버 응답까지 로케일을 따릅니다.
Architecture
한 대의 VPS 안에 모든 컴포넌트를 컨테이너로 묶고, 게임 서버만 두 벌(blue/green)을 두어 게임 중에도 끊김 없이 배포합니다.
Behind the scenes
운영하면서 가장 시간이 많이 들어간, 그래서 가장 많이 배운 세 가지 이야기.
-
01
백그라운드로 가면 안드로이드는 소켓을 끊어버린다
가장 오래 붙잡혀 있었던 문제. 안드로이드 OS 는 앱이 백그라운드로 들어가면 절전을 위해 열려있던 소켓을 강제로 닫아버립니다. 그래서 잠깐 다른 앱을 봤다가 돌아오면 — 사용자 입장에서는 "그대로" 인 것 같지만 — 서버 입장에서는 이미 떠난 사람이 됩니다. 끊겼다는 사실 자체를 클라이언트가 늦게 알아채는 것도 문제였고, 다시 붙은 뒤 어느 화면에 있던 사람이었는지 복원하는 것도 별도의 일이었습니다. 끊김 감지 → 재연결 → 세션 복구 → 화면 회귀, 이 네 단계를 한 흐름으로 묶기까지 v1.0.11 / v2.0.0 두 번에 걸쳐 손봤습니다.
-
02
봇은 여전히 멍청합니다
솔직하게 — 지금도 만족스럽지 않습니다. 마이티에 카드 카운팅과 트럼프 빼기를 넣고, Skull King 에 컨텍스트 인식 비딩을 넣었지만, 트릭테이킹 게임은 단순한 규칙 평가로는 닿지 않는 깊이가 있어서 봇과 한 판 칠 때마다 "여기서 왜 이걸 내지?" 싶은 순간이 자주 나옵니다. 아직은 휴리스틱 위주의 의사결정이고, 다음 큰 작업에서 학습 기반 접근을 한 번 시도해볼 생각입니다. → roadmap 의 첫 번째 항목
-
03
모르는 언어를 검수해야 했다
한국어 → 영어 + 독일어 다국어를 넣으면서, 독일어 단어가 길어 화면이 무너지는 케이스가 줄줄이 나왔습니다. 로비 카드 라벨, 비딩 버튼, 다이얼로그 — 한국어로는 깔끔하던 자리가 독일어에서는 두 줄로 넘어가거나 잘려버렸습니다. 오버플로우 가드를 화면 단위로 점검하는 것 자체는 노력의 문제였지만, 진짜 까다로웠던 건 검수였습니다 — 독일어를 한 단어도 모르는 사람이, 번역기와 AI 에 의존하면서 "이 표현이 자연스럽게 들리는지" 를 확신해야 했습니다. 결국 미묘한 어휘는 사용자 피드백을 받아가며 다듬는 중입니다.
Screenshots
카드를 누르면 큰 이미지로 볼 수 있습니다.
More
지나온 버전과 앞으로 들어갈 항목을 별도 페이지에서 확인할 수 있습니다.