전체 예제

세 프로젝트에 구현 설명, 이미지, 다운로드, 검증 기록이 있습니다. 소스는 개발용, dist는 실행·게시용입니다. 작성자의 인증 정보나 Post 연결이 없으므로 자신의 게임을 먼저 생성하세요.

경로, 패치, 좌표, 에디터 버전은 해당 프로젝트 전용입니다. 검증은 2026-10-08 기록이며 모바일 뷰포트 확인이 실제 휴대폰 테스트를 의미하지는 않습니다.

H5 예제 · Star Sprint

체력 3으로 시작해 순찰 로봇 2대를 피하며 45초 안에 별 5개를 모읍니다. WASD/방향키 이동, P 일시 정지, R 다시 플레이. 모바일 뷰포트에는 방향 버튼이 있습니다. 소스에는 HTML/JS와 Vite 버전이 모두 포함됩니다.

다운로드 및 실행

새 native-h5 폴더에 압축을 풀고 루트에 package.json이 오게 합니다. 해당 폴더에서 한 경로를 선택하세요.

python3 -m http.server 8000 --bind 127.0.0.1 --directory plain/dist

npm ci
npm run dev

직접 실행 버전은 http://127.0.0.1:8000/, Vite는 http://127.0.0.1:5173/ 입니다. 기록상 위치는 데스크톱의 Move to Combos/native-h5이며 실제 경로를 사용하세요.

로컬 Star Sprint: 시작, 이동, 별 수집, 점수 확인.

테스트와 게시

별을 모아 점수가 증가하고 5개에서 승리하는지 확인합니다. 충돌 피해, 시간 초과 패배, 일시 정지, 다시 플레이도 검사하세요. Vite는 dev를 중지한 뒤:

npm run build
npm run preview

http://127.0.0.1:4173/ 에서 확인하며 직접 실행 버전은 plain/dist를 사용합니다. 게시 후 자신의 combos.json을 유지하세요.

기록된 Vite 배포는 pc,mobile, revision 1입니다. Star Sprint 플레이 , Canvas 코드 07752. 로컬과 온라인에서 키보드로 완전 클리어했습니다. 모바일 조작은 뷰포트만 확인했고 실제 휴대폰에서는 검증하지 않았습니다.

Combos 공개 페이지에서 첫 별을 수집하는 Star Sprint.

소스와 다운로드

index.html/src/style.css는 Canvas, HUD, 버튼, 배치, 터치를 담당합니다. src/main.js는 입력, 이동, 수집, 충돌, 시간, 승패, 그리기입니다. package.json/vite.config.js는 빌드 스크립트와 상대 URL, plain/dist는 빌드 불필요 버전입니다.

다음은 점수 처리 설명이며 Combos 연동 필수 코드는 아닙니다.

if (!star.collected && Math.hypot(
  star.x - state.player.x, star.y - state.player.y
) < 35) {
  star.collected = true;
  state.score++;
}
if (state.health <= 0 || state.elapsed >= 45) show('lost');
else if (state.score === 5) show('won');

• 두 버전의 소스와 커버
• HTML/JS 완성본
• Vite 완성본

두 완성본 ZIP 모두 압축 해제 루트에 index.html이 있습니다.

Unity 예제 · BoatAttack

Unity 공식 BoatAttack의 커밋 91886a3ef1ac963aa10578fcaf1d59e9b6961ab3를 사용합니다. 원본은 6000.2.0b8이며 이 예제는 Unity 6.3 LTS 6000.3.25f1, Apple Silicon ARM64에 맞췄습니다. 보트, 운전자, Island, 물, 물리, AI, C# 로직을 유지합니다.

가져오기와 적용

Git LFS를 설치하고 새 폴더에 clone해 큰 에셋을 받습니다. 두 git apply 명령 전에 적용 패키지를 루트에 압축 해제하세요. 패치는 한 번만 적용합니다.

git clone https://github.com/Unity-Technologies/BoatAttack.git BoatAttack
cd BoatAttack
git checkout 91886a3ef1ac963aa10578fcaf1d59e9b6961ab3
git lfs pull
git lfs fsck
git apply --check tracked-project-changes.patch
git apply tracked-project-changes.patch

이미 적용한 프로젝트에는 반복하지 마세요. 패키지는 호환성·버전 변경, 문서, 라이선스를 포함하며 큰 원본 에셋, Library, dist, Combos 플러그인은 없습니다. 자신의 게임에는 일반 Unity 가이드를 사용하세요.

내보내기 및 레이스

main_menu.unity에서 Play로 메뉴·싱글플레이 설정을 확인하고 중지합니다. 씬은 main_menu.unity (0), level_Island.unity (1). Default, Gzip + fallback, Player Build 시 Addressables를 설정하고 dist로 출력합니다.

Unity 에디터의 원본 BoatAttack 메뉴.

싱글플레이 설정: Island를 선택하고 보트 구성.

기록된 Build는 18:21:57–18:26:03, 246초. 27개 파일, Addressables bundle 5개, 합계 127.36 MiB, 최대 파일 94.58 MiB, ZIP 124.88 MiB였습니다. 용량 제한을 만족하고 ZIP 루트에 index.html이 있었습니다.

python3 -m http.server 8001 --bind 127.0.0.1 --directory dist

http://127.0.0.1:8001/ 에서 RACE → SINGLEPLAYER → ISLAND (1랩) → NEXT → 보트 구성 → RACE로 진행합니다. 연출·카운트다운 후 캔버스를 클릭해 키보드 포커스를 얻으세요. W/↑/스페이스 가속, A/D 조향, R 초기화, F 일시 정지/재개입니다.

게시 및 검증 결과

실제 레이스 화면을 cover.png로 만들고 --platform pc --screen-orientation landscape로 생성합니다. 자신의 기존 연결이 있을 때만 update를 사용하세요. 큰 업로드에는 --timeout 10m을 사용할 수 있습니다.

기록에서는 같은 Post를 revision 2로 업데이트해 게시했으며 submission_is_current=true였습니다. BoatAttack 플레이 , 코드 08759. 로컬 서버를 끈 뒤 독립 브라우저 세션 2개로 공개 페이지·링크에서 레이스에 들어가 가속, 조향, 일시 정지/재개를, 한 세션에서는 R도 확인했습니다. 음소거 상태였고 핵심 파일과 bundle 5개는 공개 배포에서 로드되었으며 게임 실행 오류는 관측되지 않았습니다.

Combos에서 레이스를 진행하는 네이티브 Default 빌드.

검증 범위는 PC 가로 화면 싱글플레이 로딩과 운전입니다. 전체 레이스 승리, 모바일 터치, 실제 휴대폰은 검증하지 않았습니다. loader·엔진 경고는 남아 있으며 외부 페이지의 비로그인 profile 401은 게임 로딩과 별도로 기록했습니다.

변경 내용

원본 코드·에셋과 기존 물의 WebGL 분기를 유지합니다. Default 페이지는 Unity가 만들고 loader는 다시 쓰지 않았습니다. 씬, 압축, Addressables는 기본 UI에 저장했습니다. 패치는 에디터/Input System/URP 버전과 직렬화를 조정하며 UIPanelFade.shader에 최신 uGUI용 _MainTex를 추가합니다.

[PerRendererData] _MainTex("Sprite Texture", 2D) = "white" {}

이전 전용 Editor 빌드 스크립트, Combos 템플릿, com.unity.pipeline은 제거했습니다. 고정 커밋 대비 추적 파일 31개의 패치이며 README-migration.md, WEBGL-MIGRATION.md, LOCAL_SETUP.md, 라이선스가 포함됩니다. 모든 Unity 게임용 범용 패치가 아닙니다.

BoatAttack 적용 패키지 다운로드.

Roblox 예제 · Ball Game

Ball game open source 의 ball game.rbxl을 기반으로 합니다. 5초 기다린 뒤 분홍 공을 밀어 엇갈린 벽 3개를 통과하고 WinPiece에 닿으면 금색으로 바뀌며 Winner를 표시합니다.

원본 확인

Roblox Studio에서 플레이 후 중지하고 .rbxl을 변경하지 않은 채 스크립트, 아바타, 씬, 속성을 확인합니다.

원본 캐릭터, 잔디, 벽, 회색 바닥과 도착 지점.

원본 GetWinner는 공과 WinPiece의 접촉을 감지합니다.

두 스크립트는 공 생성과 승리를 처리하고 Roblox가 렌더링, 캐릭터, 입력, 카메라, 애니메이션, 물리, 서버 실행 환경을 제공합니다. 공은 5×5×5 studs, 잔디는 18×1×74, 벽 중심은 **(22,17.5,34), (32,17.5,15), (21.5,17.5,-4)**입니다. 이 예제 전용 값입니다.

Ball.Touched:Connect(function(partTouching)
    if partTouching.Name == "WinPiece" then
        Ball.BrickColor = BrickColor.new("Gold")
        warn("Winner!")
        game.Workspace.Map1.PlayerWon.Value = true
    end
end)

단순 Part 씬은 Play 중지 상태에서 아래 읽기 전용 코드를 Command Bar에 실행해 Output으로 속성을 볼 수 있습니다. 복잡한 메시, 텍스처, 리그는 별도 처리해야 하며 이 코드는 H5 게임을 내보내지 않습니다.

for _, part in ipairs(workspace:GetDescendants()) do
    if part:IsA("BasePart") then
        print(part:GetFullName(), part.Position, part.Size,
            part.Material, part.Transparency)
    end
end

H5 소스 대응

원본은 실행 시 계정 Avatar를 불러옵니다. 여기서는 Roblox 공식 메시를 직접 가져오지 않고 로컬 형상과 텍스처로 외형을 재현했습니다. Part는 실제 배치를 따릅니다. 다른 프로젝트는 내보낼 권한이 있는 모델과 텍스처를 재사용할 수 있습니다.

아바타 정면: 머리카락, 미소, 파랑·검정 상의, 어두운 바지, 흰 밑창.

머리카락, 신체 분할, 신발이 보이는 측면.

예제는 1 stud = 0.3 m, 원점 (27,15,15), 공 반지름 0.75 m를 사용합니다. 좌표 변환, 질량, 마찰, 구름 감쇠, 속도 제한은 자신의 게임에 맞춰 조정하세요.

장애물 3개, 경계와 도착 지점을 원본 배치로 재구성한 레벨.

ballBody.addEventListener('collide', event => {
  if (event.body !== winPiece.body || state.mode !== 'playing' || state.won) return;
  state.won = true;
  state.phase = 'finished';
  pink.color.set('#fff000');
  pink.emissive.set('#fff000');
  glow.material.color.set('#fff54b');
  document.querySelector('#status').textContent = 'Winner!';
  show('won');
});

브라우저 버전에는 터치 이동·점프, 일시 정지/재개, 다시 플레이, 전체 화면, 아바타 보기, WebGL 미지원 안내를 추가했습니다. Roblox 계정, Robux, 멀티플레이 동기화, 클라우드 저장은 이전하지 않았으며 완전 호환 런타임은 아닙니다.

실행과 검증

새 ball-game-h5 폴더에 풀고 루트에 package.json을 둡니다. level.js, avatar.js, environment.js, camera.js, main.js, SOURCE-MAPPING.md, reference/의 원본 Lua가 있습니다.

npm ci
npm run dev

http://127.0.0.1:5174/ 를 엽니다. 기록상 폴더는 데스크톱의 Move to Combos/ball-game-h5이며 자신의 경로를 사용하세요. 시작 후 5초 뒤 공이 나옵니다. WASD/방향키 이동, 스페이스 점프, 드래그 회전, 휠 줌, P 일시 정지, R 다시 플레이, F 전체 화면입니다. 아바타 보기는 현재 판을 멈추고 돌아가면 재개합니다.

로컬 3인칭 화면에서 분홍 공을 물리적으로 밀기.

기본 시점에서 오른쪽, 왼쪽, 오른쪽으로 벽을 돌아 마지막 홈에 넣습니다. WinPiece 접촉으로 금색이 되고 Winner가 표시됩니다. 기록된 로컬 테스트는 키보드·물리 조작으로 완주했고 착지, 일시 정지, 다시 플레이, 카메라, 아바타 보기를 확인했습니다.

로컬 완전 클리어: 금색 공과 Winner.

빌드 및 게시

dev를 중지하고 http://127.0.0.1:4174/ 에서 최종 결과물을 확인합니다.

npm run build
npm run preview

소스에 cover.png가 있습니다. 자신의 게임을 생성하고 연결을 유지해 업데이트한 뒤, 로컬 서버 없이 공개 링크를 다시 테스트하세요. 기록된 캐릭터·씬 업데이트는 revision 2, 게시됨, submission_is_current=true입니다. Ball Game H5 플레이 , 코드 70261. 온라인 키보드 클리어를 완료했지만 모바일 버튼은 뷰포트만 확인했으며 실제 휴대폰은 검증하지 않았습니다.

로컬 서버를 끈 뒤 Combos에서 실행하는 최신 Ball Game H5.

• 전체 H5 소스, Lua 참고 코드, 소스 대응표
• 압축 해제 루트에 index.html이 있는 완성본

출처: Combos 개발자 연동 가이드 . 원문 확인일: 2026-10-08, CLI v1.14.2. 예제 결과는 원문에 기록된 실행 결과입니다.