whdwo798/Travel_Run
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Build TravelRun intro and tutorial flow

Browse Source
This commit is contained in:
jongjae0305
2026-07-06 16:15:20 +09:00
parent af26dd4311
commit 2ba3882f1b
153 changed files with 13625 additions and 2086 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Docs/TravelRun_Incheon_Tutorial_FullCourse.svg
+257
View File
@@ -0,0 +1,257 @@
<svg width="6200" height="980" viewBox="0 0 6200 980" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="sky" x1="0" x2="0" y1="0" y2="1">
<stop offset="0" stop-color="#071420"/>
<stop offset="0.52" stop-color="#123143"/>
<stop offset="1" stop-color="#193846"/>
</linearGradient>
<linearGradient id="glass" x1="0" x2="0" y1="0" y2="1">
<stop offset="0" stop-color="#173c51" stop-opacity="0.92"/>
<stop offset="1" stop-color="#0a1d29" stop-opacity="0.94"/>
</linearGradient>
<linearGradient id="floor" x1="0" x2="0" y1="0" y2="1">
<stop offset="0" stop-color="#6d8790"/>
<stop offset="1" stop-color="#405b64"/>
</linearGradient>
<pattern id="tile" width="88" height="54" patternUnits="userSpaceOnUse">
<rect width="88" height="54" fill="#58717a"/>
<path d="M0 0H88M0 54H88M0 0V54M88 0V54" stroke="#91aab1" stroke-width="2" opacity="0.34"/>
<path d="M44 0V54" stroke="#91aab1" stroke-width="1.4" opacity="0.2"/>
</pattern>
<filter id="softShadow" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="8" stdDeviation="6" flood-color="#000000" flood-opacity="0.28"/>
</filter>
<style>
.title { font-family: "Malgun Gothic", Arial, sans-serif; font-size: 38px; font-weight: 800; fill: #eaf9fc; }
.sub { font-family: "Malgun Gothic", Arial, sans-serif; font-size: 22px; fill: #badfe7; }
.label { font-family: "Malgun Gothic", Arial, sans-serif; font-size: 20px; font-weight: 700; fill: #eefbff; }
.small { font-family: "Malgun Gothic", Arial, sans-serif; font-size: 16px; fill: #c9e7ee; }
.tiny { font-family: "Malgun Gothic", Arial, sans-serif; font-size: 13px; fill: #d8f0f5; }
.bubble { fill: #f4fbff; stroke: #56b5cb; stroke-width: 3; filter: url(#softShadow); }
.bubbleText { font-family: "Malgun Gothic", Arial, sans-serif; font-size: 18px; font-weight: 700; fill: #102a35; }
.bubbleSmall { font-family: "Malgun Gothic", Arial, sans-serif; font-size: 14px; fill: #234755; }
.measure { stroke: #77d4e8; stroke-width: 4; stroke-dasharray: 12 12; fill: none; opacity: 0.85; }
.path { stroke: #ffe16a; stroke-width: 5; stroke-dasharray: 18 14; fill: none; opacity: 0.95; }
.floorOutline { stroke: #b8d2d8; stroke-width: 4; }
.warning { fill: #ff5c4b; }
.item { fill: #69f09a; stroke: #e8fff0; stroke-width: 4; }
</style>
</defs>
<rect width="6200" height="980" fill="url(#sky)"/>
<g opacity="0.95">
<rect x="0" y="102" width="6200" height="278" fill="url(#glass)"/>
<path d="M0 380H6200" stroke="#2d7990" stroke-width="6" opacity="0.45"/>
<path d="M0 102H6200" stroke="#62b7ca" stroke-width="3" opacity="0.24"/>
<g stroke="#4aa7bd" stroke-width="3" opacity="0.24">
<path d="M170 102V380"/>
<path d="M430 102V380"/>
<path d="M690 102V380"/>
<path d="M950 102V380"/>
<path d="M1210 102V380"/>
<path d="M1470 102V380"/>
<path d="M1730 102V380"/>
<path d="M1990 102V380"/>
<path d="M2250 102V380"/>
<path d="M2510 102V380"/>
<path d="M2770 102V380"/>
<path d="M3030 102V380"/>
<path d="M3290 102V380"/>
<path d="M3550 102V380"/>
<path d="M3810 102V380"/>
<path d="M4070 102V380"/>
<path d="M4330 102V380"/>
<path d="M4590 102V380"/>
<path d="M4850 102V380"/>
<path d="M5110 102V380"/>
<path d="M5370 102V380"/>
<path d="M5630 102V380"/>
<path d="M5890 102V380"/>
</g>
<g opacity="0.34">
<circle cx="270" cy="204" r="7" fill="#ffd46b"/>
<circle cx="1030" cy="160" r="5" fill="#ffd46b"/>
<circle cx="1880" cy="222" r="6" fill="#ffd46b"/>
<circle cx="2860" cy="174" r="5" fill="#ffd46b"/>
<circle cx="3960" cy="212" r="7" fill="#ffd46b"/>
<circle cx="5070" cy="168" r="5" fill="#ffd46b"/>
<circle cx="5840" cy="226" r="7" fill="#ffd46b"/>
</g>
</g>
<g>
<text x="96" y="66" class="title">TravelRun - Tutorial / Incheon Full Course Draft</text>
<text x="96" y="96" class="sub">전체 코스를 실제 게임처럼 길게 펼친 설계도. 발판, 틈, 장애물, 아이템, 설명 타이밍을 이 그림 기준으로 조정.</text>
</g>
<g id="airport-props" opacity="0.9">
<rect x="438" y="150" width="210" height="66" rx="8" fill="#09202b" stroke="#5ec7df" stroke-width="3"/>
<text x="543" y="178" class="small" text-anchor="middle">ICN GATE A1</text>
<text x="543" y="203" class="tiny" text-anchor="middle">Departure</text>
<rect x="2430" y="142" width="250" height="76" rx="8" fill="#09202b" stroke="#5ec7df" stroke-width="3"/>
<text x="2555" y="173" class="small" text-anchor="middle">TRANSFER</text>
<text x="2555" y="199" class="tiny" text-anchor="middle">Slide Practice Zone</text>
<rect x="5240" y="145" width="270" height="72" rx="8" fill="#09202b" stroke="#5ec7df" stroke-width="3"/>
<text x="5375" y="176" class="small" text-anchor="middle">BOARDING SOON</text>
<text x="5375" y="201" class="tiny" text-anchor="middle">Mileage Finish Line</text>
</g>
<g id="floor">
<rect x="0" y="748" width="6200" height="140" fill="#263b43"/>
<path d="M0 748H6200" stroke="#9fc0c7" stroke-width="5" opacity="0.35"/>
<g filter="url(#softShadow)">
<rect x="90" y="646" width="1260" height="96" rx="10" fill="url(#tile)" class="floorOutline"/>
<rect x="1700" y="646" width="680" height="96" rx="10" fill="url(#tile)" class="floorOutline"/>
<rect x="2380" y="646" width="3710" height="96" rx="10" fill="url(#tile)" class="floorOutline"/>
</g>
<g opacity="0.74">
<text x="725" y="775" class="tiny" text-anchor="middle">기본 발판 연결 구간</text>
<text x="1520" y="708" class="label" text-anchor="middle">2단 점프용 긴 틈</text>
<path d="M1360 696H1685" class="measure"/>
<text x="4235" y="775" class="tiny" text-anchor="middle">아이템 체험 구간은 발판이 계속 연결되어야 함</text>
</g>
</g>
<g id="start">
<rect x="126" y="545" width="92" height="82" rx="12" fill="#163441" stroke="#73d3e8" stroke-width="4" filter="url(#softShadow)"/>
<circle cx="172" cy="572" r="20" fill="#e9c19f"/>
<rect x="145" y="594" width="54" height="38" rx="14" fill="#8a5a36"/>
<rect x="150" y="632" width="21" height="18" fill="#41543d"/>
<rect x="177" y="632" width="21" height="18" fill="#41543d"/>
<text x="172" y="523" class="label" text-anchor="middle">START</text>
</g>
<g id="tutorial-bubbles">
<g>
<rect x="710" y="430" width="260" height="104" rx="18" class="bubble"/>
<text x="840" y="465" class="bubbleText" text-anchor="middle">1. 점프</text>
<text x="840" y="493" class="bubbleSmall" text-anchor="middle">가방 장애물을</text>
<text x="840" y="516" class="bubbleSmall" text-anchor="middle">왼쪽 클릭으로 넘기</text>
<path d="M840 534L870 602" stroke="#56b5cb" stroke-width="4"/>
</g>
<g>
<rect x="1368" y="430" width="304" height="108" rx="18" class="bubble"/>
<text x="1520" y="465" class="bubbleText" text-anchor="middle">2. 2단 점프</text>
<text x="1520" y="493" class="bubbleSmall" text-anchor="middle">발판이 멀리 떨어짐</text>
<text x="1520" y="516" class="bubbleSmall" text-anchor="middle">공중에서 한 번 더 클릭</text>
<path d="M1520 538L1520 628" stroke="#56b5cb" stroke-width="4"/>
</g>
<g>
<rect x="2396" y="430" width="294" height="104" rx="18" class="bubble"/>
<text x="2543" y="465" class="bubbleText" text-anchor="middle">3. 슬라이드</text>
<text x="2543" y="493" class="bubbleSmall" text-anchor="middle">천장 표지판 아래를</text>
<text x="2543" y="516" class="bubbleSmall" text-anchor="middle">오른쪽 클릭으로 통과</text>
<path d="M2543 534L2543 602" stroke="#56b5cb" stroke-width="4"/>
</g>
<g>
<rect x="2962" y="424" width="310" height="118" rx="18" class="bubble"/>
<text x="3117" y="459" class="bubbleText" text-anchor="middle">4. 강제 피격</text>
<text x="3117" y="487" class="bubbleSmall" text-anchor="middle">한 번 맞아서 목숨/속도</text>
<text x="3117" y="510" class="bubbleSmall" text-anchor="middle">감소를 직접 확인</text>
<path d="M3117 542L3117 610" stroke="#56b5cb" stroke-width="4"/>
</g>
<g>
<rect x="3528" y="416" width="432" height="134" rx="18" class="bubble"/>
<text x="3744" y="451" class="bubbleText" text-anchor="middle">5. 아이템 체험</text>
<text x="3744" y="479" class="bubbleSmall" text-anchor="middle">초밥 → 라멘 → 방어막 → 운동화 → 마일리지 카드</text>
<text x="3744" y="502" class="bubbleSmall" text-anchor="middle">먹은 뒤 바로 효과를 느끼도록 강제 상황 배치</text>
<path d="M3744 550L3744 614" stroke="#56b5cb" stroke-width="4"/>
</g>
</g>
<g id="jump-section">
<path d="M300 612 C420 565, 600 565, 740 612" class="path"/>
<rect x="842" y="585" width="70" height="60" rx="10" fill="#c7924d" stroke="#492d17" stroke-width="5" filter="url(#softShadow)"/>
<rect x="856" y="566" width="42" height="22" rx="10" fill="none" stroke="#492d17" stroke-width="5"/>
<circle cx="858" cy="646" r="7" fill="#1d1d1d"/>
<circle cx="898" cy="646" r="7" fill="#1d1d1d"/>
<text x="877" y="682" class="tiny" text-anchor="middle">점프 장애물</text>
</g>
<g id="double-jump-section">
<path d="M1210 620 C1320 492, 1460 468, 1586 556" class="path"/>
<path d="M1586 556 C1660 610, 1700 640, 1784 650" class="path"/>
<circle cx="1406" cy="536" r="18" fill="#ffe16a" opacity="0.88"/>
<circle cx="1568" cy="540" r="18" fill="#ffe16a" opacity="0.88"/>
<text x="1490" y="498" class="label" text-anchor="middle">공중 2번 입력</text>
<path d="M1360 646L1700 646" stroke="#ff6b5c" stroke-width="10" opacity="0.7" stroke-dasharray="22 20"/>
<text x="1528" y="775" class="tiny" text-anchor="middle">여기는 실제로 바닥이 없어야 2단 점프 이유가 생김</text>
</g>
<g id="slide-section">
<rect x="2496" y="504" width="178" height="38" rx="10" fill="#285061" stroke="#93d7e5" stroke-width="4" filter="url(#softShadow)"/>
<text x="2585" y="530" class="small" text-anchor="middle">DEPARTURE</text>
<rect x="2526" y="542" width="118" height="64" rx="9" fill="#4b85a1" stroke="#9ae4f2" stroke-width="4"/>
<path d="M2390 630 C2450 660, 2540 660, 2660 630" class="path"/>
<rect x="2398" y="608" width="80" height="28" rx="14" fill="#8a5a36" opacity="0.9"/>
<text x="2585" y="682" class="tiny" text-anchor="middle">슬라이드 장애물: 천장 구조 + 매달린 표지판</text>
</g>
<g id="force-hit-section">
<rect x="3048" y="582" width="72" height="64" rx="10" class="warning" stroke="#4b120c" stroke-width="5" filter="url(#softShadow)"/>
<rect x="3026" y="506" width="120" height="34" rx="9" fill="#ff8174" stroke="#4b120c" stroke-width="4"/>
<rect x="3064" y="540" width="46" height="58" rx="9" class="warning" stroke="#4b120c" stroke-width="4"/>
<text x="3084" y="625" font-family="Arial, sans-serif" font-size="38" font-weight="800" fill="#2a0805" text-anchor="middle">!</text>
<text x="3084" y="684" class="tiny" text-anchor="middle">피하기 어렵게 만들어 효과 설명</text>
</g>
<g id="item-section">
<g>
<circle cx="3430" cy="578" r="32" class="item" filter="url(#softShadow)"/>
<text x="3430" y="587" font-family="Arial, sans-serif" font-size="32" font-weight="800" fill="#0b2715" text-anchor="middle">+</text>
<text x="3430" y="634" class="tiny" text-anchor="middle">초밥: 회복</text>
</g>
<g>
<circle cx="3752" cy="578" r="32" class="item" filter="url(#softShadow)"/>
<text x="3752" y="587" font-family="Arial, sans-serif" font-size="30" font-weight="800" fill="#0b2715" text-anchor="middle">R</text>
<text x="3752" y="634" class="tiny" text-anchor="middle">라멘: 무적</text>
<rect x="3904" y="582" width="62" height="64" rx="10" class="warning" stroke="#4b120c" stroke-width="5"/>
<text x="3935" y="625" font-family="Arial, sans-serif" font-size="34" font-weight="800" fill="#2a0805" text-anchor="middle">!</text>
<text x="3935" y="684" class="tiny" text-anchor="middle">무적 체감</text>
</g>
<g>
<circle cx="4250" cy="578" r="32" class="item" filter="url(#softShadow)"/>
<text x="4250" y="587" font-family="Arial, sans-serif" font-size="30" font-weight="800" fill="#0b2715" text-anchor="middle">G</text>
<text x="4250" y="634" class="tiny" text-anchor="middle">방어막</text>
<rect x="4420" y="582" width="62" height="64" rx="10" class="warning" stroke="#4b120c" stroke-width="5"/>
<text x="4451" y="625" font-family="Arial, sans-serif" font-size="34" font-weight="800" fill="#2a0805" text-anchor="middle">!</text>
<text x="4451" y="684" class="tiny" text-anchor="middle">방어 체감</text>
</g>
<g>
<rect x="4748" y="582" width="62" height="64" rx="10" class="warning" stroke="#4b120c" stroke-width="5"/>
<text x="4779" y="625" font-family="Arial, sans-serif" font-size="34" font-weight="800" fill="#2a0805" text-anchor="middle">!</text>
<text x="4779" y="684" class="tiny" text-anchor="middle">일부러 감속</text>
<circle cx="4978" cy="578" r="32" class="item" filter="url(#softShadow)"/>
<text x="4978" y="587" font-family="Arial, sans-serif" font-size="30" font-weight="800" fill="#0b2715" text-anchor="middle">V</text>
<text x="4978" y="634" class="tiny" text-anchor="middle">운동화: 속도 회복</text>
</g>
<g>
<circle cx="5308" cy="578" r="32" class="item" filter="url(#softShadow)"/>
<text x="5308" y="587" font-family="Arial, sans-serif" font-size="30" font-weight="800" fill="#0b2715" text-anchor="middle">M</text>
<text x="5308" y="634" class="tiny" text-anchor="middle">마일리지 카드</text>
<g fill="#ffd95b" opacity="0.95">
<circle cx="5468" cy="590" r="13"/>
<circle cx="5524" cy="590" r="13"/>
<circle cx="5580" cy="590" r="13"/>
<circle cx="5636" cy="590" r="13"/>
<circle cx="5692" cy="590" r="13"/>
</g>
<text x="5580" y="634" class="tiny" text-anchor="middle">카드 먹고 바로 수집</text>
</g>
</g>
<g id="finish">
<rect x="5900" y="520" width="10" height="126" fill="#f4fbff"/>
<path d="M5910 520H6050V586H5910Z" fill="#ffdd6c" stroke="#2c2c2c" stroke-width="3"/>
<text x="5980" y="562" font-family="Arial, sans-serif" font-size="24" font-weight="800" fill="#24210f" text-anchor="middle">CLEAR</text>
<text x="5978" y="690" class="label" text-anchor="middle">다음 맵: Japan</text>
</g>
<g id="bottom-notes">
<rect x="96" y="900" width="6008" height="48" rx="12" fill="#071820" stroke="#2a7688" stroke-width="2" opacity="0.9"/>
<text x="126" y="931" class="small">수정 기준: 바닥을 이어야 하는 곳은 타일이 계속 연결되고, 2단 점프 구간만 실제 빈틈으로 표현. 장애물/아이템은 이 좌표 흐름을 기준으로 프리팹 배치.</text>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

Docs/TravelRun_Minimap_Blueprint.svg
+68
View File
@@ -0,0 +1,68 @@
<svg width="1400" height="420" viewBox="0 0 1400 420" xmlns="http://www.w3.org/2000/svg">
<rect width="1400" height="420" fill="#061219"/>
<rect x="64" y="46" width="1272" height="284" rx="20" fill="#091b22" stroke="#2c8398" stroke-width="3" opacity="0.96"/>
<text x="104" y="96" fill="#dff5fa" font-family="Malgun Gothic, Arial, sans-serif" font-size="34" font-weight="700">인천공항 출발 준비 - 구조형 미니맵 예시</text>
<text x="1126" y="96" fill="#bde3eb" font-family="Arial, sans-serif" font-size="28" text-anchor="end">0 / 850m</text>
<rect x="104" y="128" width="1192" height="148" rx="10" fill="#0d252d" stroke="#1d4d5a" stroke-width="2"/>
<rect x="104" y="128" width="248" height="148" rx="10" fill="#1c829a" opacity="0.22"/>
<g id="platforms" fill="#59aeba">
<rect x="118" y="236" width="108" height="14" rx="4"/>
<rect x="198" y="236" width="108" height="14" rx="4"/>
<rect x="278" y="236" width="108" height="14" rx="4"/>
<rect x="358" y="236" width="108" height="14" rx="4"/>
<rect x="526" y="236" width="108" height="14" rx="4"/>
<rect x="606" y="236" width="108" height="14" rx="4"/>
<rect x="686" y="236" width="108" height="14" rx="4"/>
<rect x="766" y="236" width="108" height="14" rx="4"/>
<rect x="846" y="236" width="108" height="14" rx="4"/>
<rect x="926" y="236" width="108" height="14" rx="4"/>
<rect x="1006" y="236" width="108" height="14" rx="4"/>
<rect x="1086" y="236" width="108" height="14" rx="4"/>
<rect x="1166" y="236" width="108" height="14" rx="4"/>
</g>
<text x="448" y="228" fill="#66e2ff" font-family="Arial, sans-serif" font-size="18" font-weight="700" text-anchor="middle">2</text>
<path d="M404 226 C424 190, 468 190, 492 226" fill="none" stroke="#66e2ff" stroke-width="4" stroke-dasharray="8 8"/>
<text x="448" y="272" fill="#9edce8" font-family="Malgun Gothic, Arial, sans-serif" font-size="17" text-anchor="middle">먼 발판</text>
<g id="jump">
<rect x="304" y="208" width="30" height="28" rx="5" fill="#ffd34a"/>
<text x="319" y="229" fill="#061219" font-family="Arial, sans-serif" font-size="18" font-weight="700" text-anchor="middle">J</text>
</g>
<g id="slide">
<rect x="612" y="150" width="88" height="12" rx="5" fill="#85a5ff"/>
<rect x="642" y="162" width="32" height="30" rx="5" fill="#789fff"/>
<text x="658" y="184" fill="#061219" font-family="Arial, sans-serif" font-size="18" font-weight="700" text-anchor="middle">S</text>
</g>
<g id="force-hit">
<rect x="736" y="204" width="30" height="32" rx="5" fill="#ff5a4a"/>
<rect x="720" y="150" width="78" height="12" rx="5" fill="#ff8173"/>
<rect x="745" y="162" width="28" height="28" rx="5" fill="#ff5a4a"/>
<text x="751" y="226" fill="#061219" font-family="Arial, sans-serif" font-size="18" font-weight="700" text-anchor="middle">!</text>
</g>
<g id="items" font-family="Arial, sans-serif" font-size="16" font-weight="700" text-anchor="middle">
<circle cx="834" cy="202" r="16" fill="#66ee93"/><text x="834" y="208" fill="#061219">+</text>
<circle cx="918" cy="202" r="16" fill="#66ee93"/><text x="918" y="208" fill="#061219">R</text>
<rect x="958" y="204" width="28" height="32" rx="5" fill="#ff5a4a"/><text x="972" y="226" fill="#061219">!</text>
<circle cx="1048" cy="202" r="16" fill="#66ee93"/><text x="1048" y="208" fill="#061219">G</text>
<rect x="1088" y="204" width="28" height="32" rx="5" fill="#ff5a4a"/><text x="1102" y="226" fill="#061219">!</text>
<rect x="1168" y="204" width="28" height="32" rx="5" fill="#ff5a4a"/><text x="1182" y="226" fill="#061219">!</text>
<circle cx="1248" cy="202" r="16" fill="#66ee93"/><text x="1248" y="208" fill="#061219">V</text>
<circle cx="1290" cy="202" r="16" fill="#66ee93"/><text x="1290" y="208" fill="#061219">M</text>
</g>
<rect x="134" y="170" width="12" height="82" rx="5" fill="#ffc735"/>
<polygon points="140,154 122,174 158,174" fill="#ffc735"/>
<text x="104" y="312" fill="#b9dce3" font-family="Malgun Gothic, Arial, sans-serif" font-size="20">
발판 모양과 빈 구간, 천장 장애물, 아이템 위치를 같이 보여주는 구조형 미니맵
</text>
<text x="104" y="366" fill="#7fb7c3" font-family="Malgun Gothic, Arial, sans-serif" font-size="20">
J 점프 | 2 2단점프 | S 슬라이드 | ! 강제 피격 | + R G V M 아이템
</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

Docs/assets.md
+108
View File
@@ -0,0 +1,108 @@
# Assets
현재 만들어진 이미지와 사용 위치를 정리합니다.
## Runtime Resources
`Resources.Load<Sprite>()`로 직접 사용하는 에셋입니다.
| 파일 | 용도 |
| --- | --- |
| `Assets/Resources/UI_PassportPanel.png` | 왼쪽 여권 HUD 배경 |
| `Assets/Resources/UI_JJ_Face.png` | 플레이어 얼굴 UI |
| `Assets/Resources/UI_LifeStamp.png` | 목숨 도장 |
| `Assets/Resources/UI_PassportItemSlot.png` | 아이템 슬롯 |
| `Assets/Resources/Map_Tutorial_Incheon_Airport.png` | 튜토리얼 인천공항 배경 |
| `Assets/Resources/Map_America_NewYork.png` | 미국 뉴욕 배경 |
| `Assets/Resources/FinishGate_Tutorial_Incheon.png` | 튜토리얼 출국 게이트 |
| `Assets/Resources/FinishGate_Japan_Torii.png` | 일본 토리이 도착 지점 |
| `Assets/Resources/FinishGate_China_Paifang.png` | 중국 패방 도착 지점 |
| `Assets/Resources/FinishGate_America_Highway.png` | 미국 자유의 여신상 도착 지점 |
## Intro Assets
| 파일/폴더 | 용도 |
| --- | --- |
| `Assets/ConceptArt/Intro/` | 인트로 세계지도, 여권, 스마트폰, 버튼, 도장 이미지 |
| `Assets/ConceptArt/Intro/UI/intro_title_lockup.png` | TravelRun 타이틀 이미지 |
| `Assets/ConceptArt/Intro/UI/intro_button_start.png` | 시작 버튼 이미지 |
| `Assets/ConceptArt/Intro/UI/intro_button_continue.png` | 이어하기 버튼 이미지 |
| `Assets/ConceptArt/Intro/UI/intro_button_settings.png` | 설정 버튼 이미지 |
| `Assets/ConceptArt/Intro/Cutouts/` | 잘라낸 여권/스마트폰/아이콘 부품 |
## Opening Story Assets
| 파일/폴더 | 용도 |
| --- | --- |
| `Assets/ConceptArt/Opening/Cutscene/` | 오프닝 만화 컷 |
| `opening_jj_v2_panel_01_room.png` | 누워있는 장면 |
| `opening_jj_v2_panel_02_alert.png` | 휴대폰 알림 |
| `opening_jj_v2_panel_03_react.png` | 반응 컷 |
| `opening_jj_v4_panel_01_sparkle.png` | 눈 반짝임 |
| `opening_jj_v4_panel_02_messy_room.png` | 여행 준비 |
| `opening_jj_v4_panel_03_leave_with_items.png` | 나가는 컷 |
| `opening_cutscene_final_departure_jj_06_street_strict_stylematch.png` | 거리로 나가는 큰 컷 |
## Gameplay Items
| 파일 | 효과 |
| --- | --- |
| `Assets/Sprites/Items/Item_Health_Sushi.png` | 목숨 회복 |
| `Assets/Sprites/Items/Item_Invincible_Ramen.png` | 잠깐 무적 |
| `Assets/Sprites/Items/Item_Shield.png` | 충돌 1회 방어 |
| `Assets/Sprites/Items/Item_Speed_Shoes.png` | 속도 회복 |
| `Assets/Sprites/Items/Item_Mileage_Card.png` | 마일리지 획득량 증가 |
| `Assets/Sprites/Items/Item_Lunchbox.png` | 면세점 도시락 |
| `Assets/Sprites/Items/Item_Backpack.png` | 가방/슬롯 확장 |
| `Assets/Sprites/Items/Item_Souvenir_Magnet.png` | 기념품 |
## Regional Items
`Assets/Sprites/RegionalItems/`에 국가별 음식/소품 아이템이 있습니다.
- 한국: 김밥, 바나나우유, 붕어빵, 교통카드
- 일본: 초밥, 라멘, 말차, 오니기리
- 중국: 만두, 월병, 차, 훠궈
- 미국: 햄버거, 도넛, 콜라, 핫도그
현재 튜토리얼은 기본 아이템 에셋을 사용하고, 이후 맵별 스킨으로 교체할 수 있습니다.
## Obstacle And Platform Skins
`Assets/Sprites/ObstacleSkins/`
| 종류 | 파일 예시 |
| --- | --- |
| 공항 발판 | `Skin_Platform_AirportFloorTile.png` |
| 공항 천장 | `Skin_Platform_AirportCeiling.png` |
| 일본 발판 | `Skin_Platform_Japan.png` |
| 중국 발판 | `Skin_Platform_China.png` |
| 미국 발판 | `Skin_Platform_USA.png` |
| 낮은 장애물 | 캐리어, 석등, 시장 상자, 콘 |
| 슬라이드 장애물 | 공항 표지판, 홍등, 배너, 도로 표지판 |
## Effects
컨셉 이미지:
- `Assets/ConceptArt/gameplay_effects_concept_01.png`
포함된 효과:
- 마일리지 획득 반짝임
- 목숨 회복 하트/+1
- 방어막 버블
- 무적/속도감 실루엣
- 속도 바람
- 충돌 폭발
- 먼지 효과
현재 구현:
- `Assets/Scripts/ItemFeedbackEffect.cs`가 런타임에서 링, 반짝임, 짧은 문구를 생성합니다.
- 아이템 획득 시 `+1`, `SAFE`, `SHIELD`, `SPEED`, `x2` 같은 피드백을 표시합니다.
- 라멘 무적/방어막 방어 성공 시 피격 깜빡임 대신 `SAFE` 또는 `BLOCK` 피드백을 표시합니다.
다음 방향:
- 컨셉 시트에서 실제로 사용할 이펙트 PNG를 개별 스프라이트로 잘라 교체합니다.
Docs/blueprint.md
+102
View File
@@ -0,0 +1,102 @@
# TravelRun 설계도
이 문서는 프로젝트를 다시 열었을 때 가장 먼저 보는 전체 설계도입니다. 세부 내용은 각 문서로 분리하고, 여기서는 어디를 보면 되는지와 현재 구조만 정리합니다.
## 읽는 순서
```text
README.md
-> Docs/blueprint.md
-> 필요한 세부 문서
```
세부 문서:
| 문서 | 확인할 내용 |
| --- | --- |
| [design.md](design.md) | 화면 구성, UX, 아트 방향 |
| [assets.md](assets.md) | 현재 이미지 에셋, 사용 위치, 교체 기준 |
| [gameplay.md](gameplay.md) | 조작, 장애물, 아이템, 클리어 조건 |
| [maps.md](maps.md) | 맵별 배경, 도착 지점, 패턴 방향 |
| [systems.md](systems.md) | 씬 흐름, 저장/로드, 면세점, 맵 해금 |
| [feedback.md](feedback.md) | 날짜별 수정 기록과 다음 할 일 |
## 게임 핵심
TravelRun은 여행 테마 2D 러너입니다.
플레이어는 집에서 여행 영상을 보고 출발하며, 인천공항 튜토리얼을 지나 일본, 중국, 미국으로 이동합니다. 각 맵은 정해진 시간 안에 목적지까지 도착하는 구조입니다.
핵심 재미:
- 점프, 2단 점프, 슬라이드의 명확한 체험
- 클리어 가능한 패턴 기반 코스
- 마일리지 수집과 면세점 준비
- 국가별 배경, 장애물, 도착 지점 이미지
- 여행지 클리어와 다음 여행지 해금
## 전체 씬 흐름
```text
Intro
-> Opening Story
-> MapPreview
-> Main(Game)
-> Result
-> DutyFreeShop
-> MapPreview
```
역할:
| 씬 | 역할 |
| --- | --- |
| `Intro` | 세계지도 기반 타이틀, 시작/이어하기/설정 |
| `Opening Story` | 처음 시작 시 만화 컷신 |
| `MapPreview` | 다음 목적지와 목표 확인 |
| `Main` | 실제 러너 플레이 |
| `Result` | 클리어/실패 결과, 보상 |
| `DutyFreeShop` | 마일리지로 다음 스테이지 준비 |
## 현재 맵 구성
| 순서 | 맵 | 목적 |
| --- | --- | --- |
| 0 | Tutorial / Incheon | 조작과 아이템 학습 |
| 1 | Japan | 첫 일반 맵 |
| 2 | China | 지역 스킨과 난이도 확장 |
| 3 | America | 뉴욕/자유의 여신상 도착 |
자세한 맵별 자료는 [maps.md](maps.md)를 봅니다.
## 코스 설계 원칙
랜덤 배치가 아니라 검증된 패턴을 이어붙이는 방식으로 갑니다.
```text
기본 발판
-> 점프 장애물
-> 2단 점프 거리
-> 슬라이드 장애물
-> 강제 피격 체험
-> 아이템 체험
-> 도착 지점
```
이 방식은 플레이어가 왜 그 조작을 해야 하는지 실제로 체험하게 만듭니다.
## 문서 운영 규칙
- `README.md`는 짧은 입구로 유지합니다.
- 실제 전체 구조는 이 `blueprint.md`에 정리합니다.
- 구현 기록은 `feedback.md`에 날짜별로 남깁니다.
- 이미지 목록과 사용 여부는 `assets.md`에만 적습니다.
- 맵별 수치와 방향은 `maps.md`에만 적습니다.
- 시스템 구조는 `systems.md`에만 적습니다.
## 다음 작업 우선순위
1. 변경된 도착 지점 이미지가 실제 게임에서 제대로 보이는지 확인
2. 면세점 구매 아이템을 장착 슬롯과 연결
3. 일본, 중국, 미국 맵의 실제 반복 패턴과 난이도 차별화
4. 미국 도착 지점 파일명 정리
Docs/design.md
+107
View File
@@ -0,0 +1,107 @@
# 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
방향:
- 다음 여행지 목적지 보드
- 목표 거리, 제한 시간, 보상 표시
- 해금 상태 표시
- 비행기 이동이나 여권 도장 분위기 활용
Docs/feedback.md
+44
View File
@@ -0,0 +1,44 @@
# Feedback
날짜별 수정 내용과 다음 할 일을 기록합니다.
## 2026-07-06
### 수정한 점
- 인트로 화면 방향을 세계지도, 여권, 스마트폰, 미니 비행기, 도장 버튼 구조로 잡음
- 오프닝 스토리를 만화 컷 형식으로 구성
- 캐릭터 의상 방향 결정
- 오버핏 갈색 니트
- 짙은 올리브 골덴 바지
- 올리브색 숏비니
- 운동화
- 백팩
- 튜토리얼 맵을 인천공항 배경으로 구성
- 튜토리얼 순서를 점프, 2단 점프, 슬라이드, 강제 피격, 아이템 체험으로 정리
- 랜덤 발판 대신 검증된 패턴 기반 코스로 전환
- 도착 지점 구조 추가
- 튜토리얼 출국 게이트
- 일본 토리이
- 중국 패방
- 미국 자유의 여신상/뉴욕 도착지
- 미국 맵 배경을 뉴욕 배경으로 연결
- 문서 구조를 `README.md`와 `Docs/` 세부 문서로 분리
- 하단 미니맵을 런타임 HUD에서 제거
- 아이템 획득 시 짧은 링/반짝임/문구 이펙트 추가
- 라멘 무적/방어막 방어 성공 시 피격 깜빡임 대신 `SAFE`/`BLOCK` 피드백 표시
### 현재 문제
- 면세점 구매 아이템이 아직 장착 슬롯과 연결되지 않음
- 미국 도착 지점 파일명이 아직 `FinishGate_America_Highway.png`라 실제 내용과 이름이 다름
- 일본, 중국, 미국 맵의 실제 패턴과 난이도 차별화가 더 필요함
- 도착 지점 이미지의 게임 내 크기와 위치를 실제 플레이로 확인해야 함
### 다음 할 일
1. 도착 지점 이미지 크기와 위치 플레이 확인
2. 면세점 구매 아이템을 장착 슬롯과 연결
3. 일본, 중국, 미국 맵의 실제 패턴과 난이도 차별화
4. 미국 도착 지점 파일명 정리 검토
5. 컨셉 이펙트 이미지를 실제 개별 스프라이트로 분리할지 결정
Docs/gameplay.md
+72
View File
@@ -0,0 +1,72 @@
# Gameplay
게임 규칙과 플레이 구조를 정리합니다.
## 조작
| 입력 | 기능 |
| --- | --- |
| 왼쪽 클릭 | 점프 |
| 공중에서 왼쪽 클릭 | 2단 점프 |
| 오른쪽 클릭 유지 | 슬라이드 |
## 클리어 조건
```text
목표 거리 도달
+ 도착 지점 통과
+ 제한 시간 안에 도착
= 클리어
```
실패 조건:
- 제한 시간 초과
- 목숨 0
- 낙하
## 목숨과 속도
- 기본 목숨은 3개
- 장애물에 맞으면 목숨 감소
- 장애물에 맞으면 속도 감소
- 충돌 후 짧은 무적 시간이 생김
- 라멘 무적이나 방어막으로 막은 충돌은 피격 깜빡임 대신 방어 성공 이펙트로 표시
## 튜토리얼 순서
튜토리얼은 설명만 보는 것이 아니라 실제 구간을 통과해야 합니다.
1. 점프: 낮은 장애물 1개
2. 2단 점프: 멀리 떨어진 발판
3. 슬라이드: 천장 장애물
4. 강제 피격: 일부러 맞아 목숨/속도 감소 체험
5. 아이템: 각 아이템을 먹고 효과 체험
## 아이템
| 아이템 | 효과 | 튜토리얼 체험 |
| --- | --- | --- |
| 초밥 | 목숨 1 회복 | 강제 피격 후 회복 |
| 라멘 | 잠깐 무적 | 먹은 뒤 장애물 통과 |
| 방어막 | 충돌 1회 방어 | 먹은 뒤 다음 충돌 방어 |
| 운동화 | 속도 회복 | 피격 후 느려진 속도 회복 |
| 마일리지 카드 | 마일리지 획득량 증가 | 먹은 뒤 마일리지 수집 |
아이템을 먹으면 짧은 링, 반짝임, 문구 이펙트가 떠서 획득 여부를 확인할 수 있습니다.
## 코스 생성
현재 방향은 개별 랜덤 생성이 아니라 검증된 코스 조각을 순서대로 배치하는 방식입니다.
패턴 예시:
- Basic
- Jump
- Double Jump
- Slide
- Force Hit
- Item
- Finish
이 방식은 쿠키런식으로 계속 이어지는 기본 발판을 유지하면서도, 장애물과 아이템은 상황에 맞게 배치할 수 있습니다.
Docs/maps.md
+119
View File
@@ -0,0 +1,119 @@
# Maps
맵별 배경, 스킨, 도착 지점, 목적을 정리합니다.
## 공통 구조
각 맵은 `MapDefinition`으로 관리합니다.
주요 필드:
- `mapId`
- `displayName`
- `routeName`
- `platformSkin`
- `backgroundResourcePath`
- `finishGateStyle`
- `targetDistance`
- `timeLimit`
- `clearMileageReward`
- `openingSteps`
- `loopSteps`
## Tutorial / Incheon
역할:
- 기본 조작과 아이템 학습
- 실제 플레이 시작 전 연습 코스
배경:
- `Assets/Resources/Map_Tutorial_Incheon_Airport.png`
도착 지점:
- `Assets/Resources/FinishGate_Tutorial_Incheon.png`
- 출국 심사/보딩 게이트 느낌
체험 순서:
1. 점프
2. 2단 점프
3. 슬라이드
4. 강제 피격
5. 초밥
6. 라멘
7. 방어막
8. 운동화
9. 마일리지 카드
## Japan
역할:
- 첫 일반 여행 맵
- 튜토리얼에서 배운 조작을 반복 패턴으로 사용
도착 지점:
- `Assets/Resources/FinishGate_Japan_Torii.png`
- 토리이
스킨:
- 일본 발판
- 석등 낮은 장애물
- 배너/표지판 슬라이드 장애물
## China
역할:
- 붉은색/금색 지역감
- 슬라이드와 점프 패턴 확장
도착 지점:
- `Assets/Resources/FinishGate_China_Paifang.png`
- 중국 패방
스킨:
- 중국 발판
- 시장 상자 낮은 장애물
- 홍등 슬라이드 장애물
## America
역할:
- 뉴욕 도착 맵
- 자유의 여신상에 도착하면 클리어되는 느낌
배경:
- `Assets/Resources/Map_America_NewYork.png`
도착 지점:
- `Assets/Resources/FinishGate_America_Highway.png`
- 현재 파일명은 기존 하이웨이 이름이지만, 실제 이미지는 자유의 여신상/뉴욕 도착지입니다.
- 추후 파일명을 `FinishGate_America_Liberty.png`로 바꾸는 것이 더 명확합니다.
스킨:
- 미국 발판
- 콘/도로 장애물
- 배너/표지판 슬라이드 장애물
## 맵 추가 규칙
새 맵을 추가할 때:
1. `MapId` 추가
2. `MapDatabase`에 `CreateMap()` 추가
3. 배경 이미지를 `Assets/Resources/Map_*.png`로 저장
4. 도착 지점 이미지를 `Assets/Resources/FinishGate_*.png`로 저장
5. `backgroundResourcePath`, `finishGateStyle` 연결
6. `openingSteps`, `loopSteps` 구성
Docs/systems.md
+111
View File
@@ -0,0 +1,111 @@
# Systems
게임의 주요 시스템 구조를 정리합니다.
## Scene Flow
`GameFlowManager`가 전체 흐름을 관리합니다.
```text
Intro
-> Opening Story
-> MapPreview
-> Main
-> Result
-> DutyFreeShop
-> MapPreview
```
## Save / Load
관련 파일:
- `Assets/Scripts/Flow/GameSaveData.cs`
- `Assets/Scripts/Flow/GameSaveManager.cs`
저장하는 것:
- 현재 맵 인덱스
- 해금된 맵 인덱스
- 총 마일리지
- 면세점 구매 아이템 수량
## Map Data
관련 파일:
- `Assets/Scripts/Maps/MapId.cs`
- `Assets/Scripts/Maps/MapDefinition.cs`
- `Assets/Scripts/Maps/MapDatabase.cs`
역할:
- 맵 이름
- 배경
- 발판 스킨
- 도착 지점
- 목표 거리
- 제한 시간
- 보상
- 다음 맵
- 코스 패턴
## Gameplay Runtime
관련 파일:
- `Assets/Scripts/GameManager.cs`
- `Assets/Scripts/PlayerController.cs`
- `Assets/Scripts/PlatformSpawner.cs`
- `Assets/Scripts/Platform.cs`
- `Assets/Scripts/ItemPickup.cs`
- `Assets/Scripts/ItemFeedbackEffect.cs`
- `Assets/Scripts/MileagePickup.cs`
- `Assets/Scripts/FinishGate.cs`
역할:
- 게임 속도 증가
- 거리/시간 계산
- 목숨/피격/무적
- 아이템 효과
- 발판/장애물/아이템 스폰
- 아이템 획득/방어 성공 이펙트
- 도착 지점 통과 시 클리어
## DutyFreeShop
현재 상태:
- 화면 흐름은 있음
- 구매 데이터 저장은 있음
- 실제 장착 슬롯과 플레이 시작 전 준비 구조는 아직 미완성
다음 방향:
1. 면세점 구매 아이템을 보유 수량으로 표시
2. 스테이지 시작 전 장착 슬롯에 넣기
3. 가방 업그레이드로 슬롯 수 증가
4. 스테이지 중 장착 아이템 사용/소모
## Finish Gate
`FinishGate`는 맵별 도착 지점 이미지를 `Resources`에서 불러옵니다.
현재 도착 지점:
- 튜토리얼: 출국 게이트
- 일본: 토리이
- 중국: 패방
- 미국: 자유의 여신상/뉴욕 도착지
플레이어가 도착 지점 트리거를 통과하면 클리어 처리합니다.
## Minimap
하단 미니맵은 현재 삭제했습니다.
이유:
- 현재 튜토리얼/코스 설계에는 화면 하단 미니맵보다 실제 발판과 도착 지점 가독성이 중요합니다.
- 이후 필요하면 별도 작은 진행 바 형태로 다시 설계합니다.