모바일 입력
모바일 입력 세부
탭, 더블탭, 롱프레스, 드래그를 구분하는 임계값을 둡니다. 스크롤과 게임 제스처가 겹치면 게임 쪽을 우선하고, 진동은 짧게 한 번만 씁니다.
- 스크롤 제스처와 충돌 시 게임 입력 우선, 페이지 끌림 방지
- 오입력 로그를 모아 자주 빗나가는 버튼 위치를 옮김
모바일 데스크톱 및 성능
첫 화면은 가볍게, 본편은 나눠서 받습니다
밤 아홉 시, 손끝에서 바로 시작되는 플레이. 모바일과 데스크톱에서 같은 게임이 다르게 느껴지는 이유를 풀고, 저희 대응 기준을 공개합니다.
반응형 기준
반응형은 해상도가 아니다
360px 폰
엄지 닿는 위치부터 다시 잽니다
태블릿 가로
양손 그립에 맞춰 터치 영역 이동
캔버스 분리
캔버스 스케일과 UI 스케일 분리
글자 보호
깨지기 전에 레이아웃을 먼저 바꿈
같은 720p라도 엄지가 닿는 위치가 다르면 다른 게임입니다. 젠발트로 스튜디오는 작은 폰부터 태블릿 가로까지 터치 영역을 다시 잡고, 글자가 깨지기 전에 레이아웃을 바꿉니다. 반응형 게임플레이는 크기를 줄이는 일이 아니라 손에 맞게 다시 배치하는 일입니다.
데스크톱 입력
데스크톱 입력 세부
마우스 이동과 키보드 병행을 지원합니다. 호버 힌트는 보조로만 두고, 창 크기가 바뀌어도 루프를 멈추지 않고 레이아웃만 갱신합니다.
고주사율 모니터에서는 프레임 상한을 두어 발열과 전력 소모를 함께 관리합니다.
로딩 설계
초기 로딩 설계
빈 화면을 없애는 것이 먼저입니다. UI 셸을 200KB 이내로 먼저 열어 손가락이 갈 곳을 만들고, 본편은 씬 단위로 나눠 받습니다.
가벼운 껍데기 먼저
UI 셸 우선 표시
200KB
빈 화면 없음
씬 단위 분할
본편 나눠 받기
HTML5
이어서 로드
오디오는 나중에
이펙트는 옵션
후순위
버튼 우선
진행률 바보다 눌러볼 버튼을 먼저 보여줍니다. 아이가 기다리는 동안 할 일이 있으면 체감 로딩은 짧아집니다.
에셋 다이어트
에셋 다이어트 순서
스프라이트 시트 중복 제거, 텍스처 압축, 오디오 비트레이트 순으로 줄입니다. 폰트 서브셋과 JSON 경량화를 곁들이고, Unity WebGL처럼 덩치가 큰 빌드는 압축과 분할을 함께 봅니다.
공식 문서의 메모리와 호환성 항목을 체크리스트로 써서 빌드마다 같은 곳을 확인합니다.
WebGL 편차
WebGL 편차 이해하기
WebGL은 플러그인 없이 GPU 가속을 제공하지만 체감 품질은 기기별 GPU와 드라이버, 브라우저 구현에 따라 달라집니다.
WebGL 1.0과 2.0 대응 범위를 Khronos 기준에서 확인하고, 지원 밖 기기는 막는 대신 단순 렌더 경로로 낮춰서 엽니다.
루프와 측정
루프와 전력, 그리고 측정 기준
requestAnimationFrame에 맞춰 루프를 돌리고 백그라운드에서는 멈춥니다. 배터리 절약 모드에서는 이펙트 단계를 자동으로 내리고, 발열이 오르면 해상도를 먼저 낮춥니다.
부드러움과 전력 사이에서 전력을 먼저 봅니다. 아이 손의 폰이 뜨거워지면 좋은 게임이 아니기 때문입니다.
백그라운드 정지
절전 시 이펙트 축소
측정 기준 — 세 가지를 잽니다
초기 표시 시간
조작 가능 시간
저사양 프레임 로그
기기 6종에서 같은 구간을 재현해 잽니다. 수치는 약속이 아니라 다음 수정의 근거이며, 리포트는 한 장으로 공유합니다.
지금 쓰는 게임, 어디서 무거운지 먼저 봅니다
로딩 진단과 지원 기기 목록이 필요하면 연락처 페이지로 이어집니다. 주소는 서울특별시 강남구 테헤란로 231, 7층 702호, 운영 시간은 월–금 09:00–18:00입니다.