컨스트럭트2를 선택한 것은 정말 잘한 일입니다. 당신의 첫 번째 HTML5게임을 함께 만들어 봅시다. 우리는 'Ghost Shooter'라는 데모 게임을 만들 예정입니다. 여기를 눌러보십시오 우리가 목표로 하는 것을 당신은 알 수 있을 것입니다. 플레이어는 마우스의 방향을 바라보고, 이동은 방향키로, 그리고 마우스를 누르면 적을 향해 총을 쏠 것입니다. 당신은 간단한 게임을 만들기 위해 당신에게 필요한 모든 것을 알 수 있을 것입니다. – 레이어에서부터 이벤트 시스템까지!
노트: 이 튜토리얼의 덧글에 도움을 요청하지 마십시오! 대신에, 우리의 포럼에 질문을 하시면 최고의 답변을 얻을 수 있습니다.
다른 안내서들
초심자를 위한 다른 안내서도 있습니다: 탑 다운 슈터보다 점프 앤 런 플랫포머 게임을 만들고 싶다면 플랫포머 게임을 만드는 방법을 보시면 됩니다. 당신은 어느 튜토리얼이든 시작할 수 있지만, 우리는 당신이 두 종류의 게임을 만드는 방법에 대한 좋은 아이디어를 얻기 위해 두 가지를 모두 완료하는 것을 매우 추천합니다!
또는 좀 더 고급스러울 뿐만 아니라 매우 상세한 Kyatric의 100개 이하의 이벤트로 소행성의 클론을 만드는 방법 도 있습니다.
컨스트럭트2의 설치
만약 아직 다운을 받지 않았다면, 여기에서 최신 배포버전을 받으면 된다. here. 컨스트럭트2 에디터는 윈도우에서만 작동하지만 당신이 만드는 게임은 맥, 리눅스 또는 아이패드 등 어디에서나 실행할 수 있습니다. 컨스트럭트2는 제한된 사용자 계정에만 설치할 수 있습니다. 또한 USB 메모리 스틱 같은 휴대용 장치에 프로그램을 설치하고 당신과 함께 언제라도 같이 다닐 수 있습니다!
시작하기
설치를 한 후 컨스트럭트2를 실행합니다. File 버튼을 누르고, New를 선택합니다
New Project 화면에서 당신은 어떤 것도 바꿀 필요가 없습니다. 그저 Create project만 클릭하면 됩니다. 컨스트럭트2는 하나의 .capx 파일에서 전체 프로젝트를 유지합니다. 당신은 지금 빈 layout을 보고 있을 것입니다. - 그것은 당신이 객체를 만들고 위치시킬 수 있는 디자인 화면입니다. 게임 레벨이나 메뉴 화면과 같은 layout으로 생각하면 됩니다. 다른 도구에서 room, scene 또는 frame을 불러올 수도 있습니다.
오브젝트 삽입하기
타일 배경
우리가 원하는 첫 번째 일은 배경 타일을 반복시키는 것입니다. The Tiled Background 는 이것을 가능하게 합니다. 첫째, 아래의 배경 텍스쳐를 마우스 오른쪽 클릭하고 당신의 컴퓨터 어딘가에 저장하십시오:
이제, 새로운 개체를 삽입하기 위해 layout의 빈 공간을 더블 클릭 합니다. (만약, 화면이 가득 차 있을 경우, 오른쪽 클릭을 하고 Insert new object 를 선택해도 됩니다.) Insert new object 화면이 나타나면, Tiled Background object를 더블 클릭 하면 삽입됩니다.
객체를 배치 할 위치를 표시하는 십자선이 나타나면 레이아웃 중간쯤을 클릭합니다. 타일 텍스쳐를 입력 할 texture editor 가 열립니다. 그럼 이전 단계에서 컴퓨터에 저장한 타일 이미지를 불러와봅시다. 폴더 아이콘을 클릭하면 디스크로부터 텍스쳐를 로드하고, 당신이 파일을 다운로드 한 위치를 찾아 그것을 선택하면 됩니다.
오른쪽 상단의 X를 클릭하여 텍스쳐 에디터를 닫습니다. 만약 묻는 메시지가 표시되면 그것을 꼭 저장해야 합니다. 이제 레이아웃의 배경에 바둑판 식으로 배열된 객체들을 볼 수 있을 것입니다. 그것이 전체 레이아웃을 커버할 수 있도록 크기를 조정해 봅시다. 객체를 선택하면, 왼쪽에 있는 Properties Bar 가 크기와 위치를 포함한 그 객체의 모든 설정을 보여줄 것입니다. Position을 0, 0으로 설정하고(레이아웃의 왼쪽 상단), size를 1280, 1024 (레이아웃의 크기)로 설정합니다.
우리가 한 일을 확인해 봅시다. 키보드의 control 버튼을 누르고 마우스 휠을 아래로 스크롤하여 화면을 축소시킬 수 있습니다. 또한 상단의 view 메뉴를 클릭할 수도 있습니다. zoom out을 몇 번 누르면 됩니다. 당신은 또한 스페이스바를 누르거나 마우스 휠 버튼을 눌러 주위를 둘러볼 수도 있습니다. 멋지죠? 당신이 삽입한 타일 배경은 이제 전체 레이아웃을 커버하고 있습니다:
키보드 control+0(숫자)을 누르거나 또는 view 메뉴의 zoom to 100%를 클릭하면 1대1 화면을 볼 수 있습니다.
(당신이 만약 나처럼 참을성이 없다면, window title bar 옆에 있는 작은 ‘run’ 아이콘을 클릭해 보십시오 – 당신이 만든 타일 레이아웃을 보여주는 창이 나타날 것입니다!)
[참고로 프로젝트 실행 시 테스트는 익스플로러가 아닌 다른 인터넷 브라우저를 이용하십시오. 익스플로러에서 테스트하면 기능이 제대로 동작하지 않습니다. – 번역한 사람]