moonrider

문 라이더

달, 별, 북극광 사이에서 음악의 길을 서핑하세요.

웹페이지 내에서 실행되는 VR을 보여주기 위해 두 사람이 몇 달에 걸쳐 구축한 사이드 프로젝트입니다. HTML, JavaScript 및 A-Frame으로 제작되었습니다. 공식 게임이나 상용 제품이 아닙니다. Moon Rider는 웹 개발자 커뮤니티가 개방형 WebXR 이니셔티브를 배우고 추진할 수 있는 오픈 소스 리소스입니다.

노래 맵은 beatsaver에서 제공됩니다. 모든 브라우저와 헤드셋(Quest 포함)을 지원합니다. 문제가 있는 경우 GitHub에 문제를 제출하거나 Supermedium Discord에 메시지를 남겨주세요.

지금 브라우저에서 사이트를 사용해 보세요!

다양한 모드 제공:

• 라이드 모드 - 그냥 앉아서 라이딩을 즐기세요.

• 펀치 모드 - 별을 부숴보세요.

• 뷰어 모드 - 브라우저 내에서 비트맵을 시청하세요.

• 클래식 모드 - 음악의 길을 따라 서핑하고 슬라이스하세요.

도움을 주신 @elliottate에게 큰 감사를 드립니다!

개발

Node(< v12, 권장 v11) 및 npm이 설치되어 있습니다.

npm install
npm run start

그런 다음 브라우저에서 localhost:3000 으로 이동하세요.

리믹스와 포크

이 게임을 당신만의 것으로 만들어보세요! 주변을 엉망으로 만드는 몇 가지 쉬운 방법:

• 더 많은 색상 팔레트를 수정하거나 추가하려면 src/constants/colors.js 변경하세요.

• 이미지를 변경하려면 src/assets/img/ 폴더의 이미지를 교체하세요. 예를 들어 `src/assets/img/moon.png'에서 달을 바꾸십시오.

• 모델을 변경하려면 src/assets/models/ 폴더의 모델을 교체하세요. 예를 들어 src/assets/models/arrowblue.obj 또는 arrowred.obj 에서 화살표 블록을 교체하세요.

• 사운드를 변경하려면 src/assets/sounds 에서 사운드를 바꾸세요. 예를 들어, src/assets/sounds/ 에서 히트 사운드를 바꾸세요.

• src/state/index.js 의 speed 또는 src/components/beat-generator.js 의 BEAT_PRELOAD_TIME 과 같은 다양한 값을 변경하여 곡선을 따라 이동하는 속도 또는 노트가 플레이어에 도착할 때까지의 반응 시간을 조정하세요.

더 많은 모드를 추가하는 등의 다른 방법은 더 복잡하지만 A-Frame 및 JavaScript에 대한 지식이 있으면 가능합니다!

테스트 URL 매개변수

URL 매개변수	설명
?debugcontroller={클래식, 펀치, 라이드}	컨트롤러를 표시하고 Shift/Ctrl + {h, j, k, l}로 이동합니다.
?debugbeatpositioning={클래식, 펀치}	가능한 위치에 모든 메모를 표시합니다.
?debugstate={로딩 중, 승리}	로딩 또는 승리 화면을 표시합니다.
?skipintro=true	소개 화면을 건너뜁니다.

GitHub에 배포

미친 맞춤 설정을 자랑하시나요? GitHub Pages 배포를 활성화하여 gh-pages 분기를 배포한 후 다음을 수행합니다.

npm run deploy

웹사이트는 https://yourusername.github.io/moonrider/ 에서 이용 가능합니다.