Files
Travel_Run/Docs/design.md
T
2026-07-06 16:15:20 +09:00

3.0 KiB

Design

TravelRun의 화면 구성과 시각 방향을 정리합니다.

공통 방향

  • 게임 첫 화면은 설명용 랜딩 페이지가 아니라 바로 플레이 세계로 들어가는 느낌이어야 합니다.
  • 전체 콘셉트는 여행, 여권, 공항, 세계지도, 비행기 이동입니다.
  • UI는 텍스트보다 아이콘과 이미지 중심으로 읽히게 합니다.
  • 튜토리얼은 글만 보여주지 않고 실제 발판/장애물/아이템과 함께 체험하게 합니다.
  • 맵별 도착 지점은 나라의 대표 이미지를 사용합니다.

Intro

현재 방향:

  • 메인 배경은 세계지도
  • 오른쪽 아래에 여권과 스마트폰
  • 지도 위를 움직이는 미니 비행기
  • 제목은 TravelRun
  • 버튼은 게임시작, 이어하기, 설정
  • 버튼 선택 시 출국 도장 느낌의 애니메이션

주의:

  • 어두운 검은 배경 카드 느낌은 줄입니다.
  • 제목/버튼도 가능하면 이미지 에셋 기반으로 깔끔하게 구성합니다.
  • 여권은 스마트폰 밑에 깔리되 잘 보여야 합니다.

Opening Story

처음 게임 시작 시 한 번만 보여주는 만화 컷신입니다.

구성:

  1. 캐릭터가 집에서 누워 있음
  2. 휴대폰 알림을 봄
  3. 여행 영상을 보고 눈이 반짝임
  4. 집을 어지럽히며 여행 준비
  5. 여권, 스마트폰, 올리브색 숏비니를 들고 나감
  6. 거리로 나가며 게임 시작

현재 결정:

  • 텍스트는 최소화하거나 제거합니다.
  • 그림만으로 흐름이 이해되게 합니다.
  • 캐릭터 의상은 오버핏 갈색 니트, 짙은 올리브 골덴 바지, 숏비니, 운동화, 백팩입니다.

Main Game

게임 화면은 플레이 가독성이 최우선입니다.

HUD:

  • 왼쪽 상단은 여권 느낌 상태 UI
  • 목숨은 도장 이미지
  • 아이템 슬롯은 추후 가방 업그레이드와 연결
  • 오른쪽 상단은 점수/마일리지/거리/시간/속도 정보
  • 아이템 획득/방어 성공은 짧은 링, 반짝임, 문구 이펙트로 표시

현재 결정:

  • 하단 미니맵은 삭제했습니다.
  • 진행도 표시는 필요해지면 작은 진행 바 형태로 다시 설계합니다.

Tutorial

튜토리얼은 설명과 플레이가 같은 타이밍에 맞아야 합니다.

구간:

  1. 점프
  2. 2단 점프
  3. 슬라이드
  4. 강제 피격
  5. 아이템 사용

설명은 화면을 가리지 않도록 잠깐 멈춘 뒤 보여주고, 이후 실제 구간을 통과하게 합니다.

Result

방향:

  • 여행 정산표 느낌
  • 클리어/실패
  • 획득 마일리지
  • 보상 기념품
  • 면세점/다음 맵/재도전 버튼

DutyFreeShop

방향:

  • 스테이지 사이 준비 화면
  • 상품 진열 중심
  • 보유 마일리지 표시
  • 다음 맵 이동은 오른쪽 방향성으로 안내
  • 구매 아이템은 실제 장착 슬롯과 연결 예정

MapPreview

방향:

  • 다음 여행지 목적지 보드
  • 목표 거리, 제한 시간, 보상 표시
  • 해금 상태 표시
  • 비행기 이동이나 여권 도장 분위기 활용