HTML5 게임 템플릿 20가지

플래시는 브라우저에 기반을 둔 게임 세계를 열었습니다. 이후 플래시가 저물고 HTML5가 등장하면서 똑같은 플래시 기반의 게임은 그 걸어온 길을 HTML5를 위해 비켜주었습니다.

아마 여러분은 아래에 나열한, HTML5로 제작된 게임 중 하나는 해본 적이 있을 것입니다. 아마 브라우저가 아닌 앱 형식으로라도 말이죠.

여러분에게 게임 아이디어나 컨셉이 있나요?

게임 아이디어의 적절한 출발점을 찾거나 웹사이트에 쓸 완벽한 솔루션을 찾는다면 Envato Market에서 인기 짱인 HTML5 게임 템플릿 20가지를 자세히 살펴보시기 바랍니다.

1. Canvas Puzzle

Canvas Puzzle은 Envato Market에서 최초의 HTML5였습니다. 이 게임이 좋은 출발점인 것 같네요.

게임 컨셉은 단순합니다. 그런데 이 게임이 왜 유명해졌을까요?

 

이 HTML5 게임 템플릿은 모든 모던 브라우저와 호환되며, 인터넷 익스플로러 9 이하 버전에 대한 대비책이 되어있습니다. 최근에 출시된 iPad에서도 작동하고요.

사용자는 모든 이미지를 사용할 수 있습니다. 파이어폭스와 크롬에서는 드래그 앤드 드롭해서 이미지를 사용합니다. 그리고 이미지는 무한정의 다양한 조각들로 만들어집니다.

Canvas Puzzle은 파일 용량이 가볍고, 단순하고 깔끔하며, 원하는 대로 변경 가능합니다.

2. Word Search Game

스크립트를 업로드만 해도 Word Search Game을 곧바로 시작할 수 있습니다.

인터넷 익스플로러 6부터 최신 브라우저까지, iPad에서조차 사용 가능한 이 단어 찾기 게임은 경량이며 언제든 재미있게 즐길 수 있습니다.

게임 용도로 다음과 같은 매우 중요한 특징이 있습니다.

• unicode 지원
• 모든 알파벳 사용
• 숫자 이용 옵션

Word Search Game에는 게임 옵션 관리자까지도 들어 있습니다.

3. Indiara and the Skull Gold

많은 HTML5 게임 템플릿처럼 Indiara and the Skull Gold는 모든 플랫폼에서 동작합니다.

함정으로 가득한 동굴에서 고대 유물을 수집하는 모험을 떠날 준비가 되었나요?

이 환상적인 HTML 게임 템플릿에는 다음과 같은 특징이 있습니다.

• 8 레벨
• Construct 2 파일
• 레이어로 된 포토샵과 일러스트레이터 파일
• 그 외 다수

Indiara and the Skull Gold는 터치와 마우스로 제어 가능하며, 소셜 미디어 공유 버튼이 있습니다. 이미지 파일을 바꾸는 방식을 이용해 시각적인 면에서 원하는 대로 변경하거나 Construct 2를 이용해 수정할 수 있습니다.

4. Slot Machine The Fruits - HTML5 Casino Game

Slot Machine The Fruits - HTML5 Casino Game은 모바일과 데스크톱 모두에 최적화되어 있으며, 1500x640 해상도를 지원하는 고품질 이미지가 들어갑니다.

다음과 같은 방식으로 다채로운 게임이 개발되었습니다.

• HTML5
• JavaScript
• CreateJS

Slot Machine The Fruits - HTML5 Casino Game은 CTL Arcade WordPress 플러그인까지도 이용해 설치할 수 있습니다.

 

Advertisement

5. Coloring Book - HTML5 Game

Coloring Book - HTML5 Game으로 자신만의 가상 컬러링 북을 만들어 보세요.

터치와 마우스 방식이 모두 지원되므로 이 반응형 컬러링 북에는 시작하는 데 필요한 모든 것을 갖추고 있습니다.

이 HTML5 게임 템플릿에는 다음과 같은 특징이 있습니다.

• 인쇄 시스템
• 설정 시스템
• 맞춤형 외관
• 그 외 다수

무엇보다도 Coloring Book - HTML5 Game에는 컬러링 이미지를 원하는 만큼 추가하는 옵션과 함께 24가지 컬러와 16개 이미지가 들어 있습니다.

6. The Sorcerer - HTML5 Game

Sorcerer - HTML5 Game으로 HTML5 게임 템플릿에서의 마술을 즐겨보세요.

Zuma 게임 방식에서 영감을 얻어 이 게임이 제작되었으며, 게임에는 세 가지의 다양한 점진적인 레벨이 있습니다.

다음과 같은 언어로 개발되었습니다.

• HTML5
• JavaScript
• CreateJS

960x540 해상도에 맞춰졌으며 CTL Arcade WordPress 플러그인에서 사용될 수 있습니다.

The Sorcerer - HTML5 Game을 원하는 대로 변경해서 마술 퍼즐을 제작해 보세요.

7. Christmas Furious 게임

즐거운 계절입니다!

Game Christmas Furious HTML5 게임 템플릿은 모든 플랫폼에서 즐기도록 터치와 마우스 방식을 지원합니다.

이 게임의 특징은 다음과 같습니다.

• 6 레벨
• Construct 2 파일
• 레이어로 된 포토샵과 일러스트레이터 파일
• 그 외 다수

북극을 침략하는 풍선들—산타는 풍선을 피해 선물을 전부 지킬 수 있을까요?

Game Christmas Furious HTML5 게임 템플릿은 언제든지 즐길 수 있으며 원하는 대로 변형 가능합니다.

 

Advertisement

8. HTML5 3D BlackJack - HTML5 Casino Game

HTML5 3D BlackJack - HTML5 Casino Game에는 다음과 같은 특징이 있습니다.

• 양손 모드(split hand)
• 이중 내기(double bet)
• 보험 기능

그런데 이 게임의 핵심은 고해상도의 3D 그래픽 형식입니다.

이 게임은 HTML5와 자바스크립트, CreateJS로 개발되었고, 게임을 하며 맞춤화할 수 있습니다.

CTL Arcade WordPress 플러그인을 이용해 HTML5 3D BlackJack - HTML5 Casino Game에서 돈을 걸 수도 있습니다.

9. Game FlapCat Steampunk

Game FlapCat Steampunk는 단순한 디자인과 게임 기능을 활용한 유사 블록버스터 게임에 기반을 두고 있습니다.

1280x720 해상도의 꽉 찬 화면에서 터치와 마우스가 호환되는 이 게임을 즐겨보세요.

 

이렇게 쿨한 게임 템플릿에는 다음과 같은 파일이 들어 있습니다.

• 무한 레벨
• Construct 2 파일
• 레이어로 된 포토샵과 일러스트레이터 파일
• 그 외 다수

Game FlapCat Steampunk에는 훌륭한 아트 스타일이 있으며 언제든지 놀거나 자신에 맞게 변형할 준비가 되어 있습니다.

10. 3D Roulette - HTML5 Casino Game

HTML5 3D BlackJack - HTML5 Casino Game처럼 3D Roulette - HTML5 Casino Game에는 매력적인 고해상도 3D 화면이 있습니다.

또한, 아래의 코드로 개발되었습니다.

• HTML5
• JavaScript
• CreateJS

포토샵과 일러스트레이터 파일을 다운로드하고 편집하는 방식으로 3D Roulette - HTML5 Casino Game을 쉽게 변경해 보세요. CTL Arcade WordPress 플러그인을 이용해 워드프레스 안에서 직접 설치할 수도 있습니다.

11. Bubble Shooter - HTML5 Games

Bubble Shooter - HTML5 Games는 Snood와 다른 게임을 연상케 합니다.

단순하며 중독성 있는 이 게임을 있는 그대로 설치하거나 취향에 맞게 수정할 수 있습니다.

해상도가 870x1504인 이 HTML5 게임 템플릿은 반응형이며, 포토샵과 일러스트레이터 파일을 사용해 쉽게 수정할 수 있습니다.

HTML5와 자바스크립트, CreateJS로 개발되었고, 언제든 게임을 즐기거나 CTL Arcade WordPress 플러그인을 사용해 워드프레스 안에서 직접 설치할 수 있습니다.

12. Woblox

Woblox는 이 HTML5 게임 템플릿 목록에서 가장 중독성이 강한 게임인 듯싶습니다.

자신의 로고를 추가하세요. 이 퍼즐 게임은 항시 준비되어 있습니다.

모든 플랫폼에서 게임을 실행할 수 있지만, 초록 블록을 빼내려고 블록을 원하는 곳으로 밀어 직관적으로 움직이고 싶다면 터치스크린에서 사용하는 것이 가장 좋습니다.

이 게임의 특징은 다음과 같습니다.

• 화면 해상도 384x600
• 45가지의 점진적인 레벨
• 100개 이하의 Construct 2 이벤트 사용
• 그 외 다수

손쉽게 원하는 대로 고칠 수 있는 동시에 중독성 있는 Woblox는 뛰어난 HTML5 게임 템플릿입니다.

13. Sliding Puzzle

Sliding Puzzle HTML 게임 템플릿에는 세 가지의 다른 모드가 있습니다.

• classic
• challenge
• fun

뒤죽박죽된 이미지가 다 맞춰질 때까지 이웃한 이미지 조각을 서로 교환하는 퍼즐의 기본 콘셉트 방식을 모드마다 다르게 접근하고 있습니다.

 

자신의 이미지 팩을 업로드하고, 디자인과 환경 설정을 원하는 대로 변경하는 것을 Sliding Puzzle HTML5 게임 템플릿으로 시작해 보세요.

14. Don't Crash

충돌 사고를 막아라.

그게 다예요.

쉽게 들리지만, 이 혼을 쏙 빼놓는 HTML5 게임 템플릿은 여러분을 계속 예측하게 합니다.

이 게임에는 다음과 같은 특징이 있습니다.

• 터치 지원
• 반응형
• 화면 해상도 1280x720 
• Construct 2 파일 포함
• 그 외 다수

잊지 마세요—Don't Crash!

15. HTML5 Slot Machine: Jackpot 777

HTML5 Slot Machine: Jackpot 777 템플릿에는 맞춤형으로 제작하는 데 필요한 모든 것이 담겨 있습니다.

이 게임의 특징은 다음과 같습니다.

• 일러스트레이터 파일
• Construct 2 파일
• 마우스와 터치 방식의 제어
• 그 외 다수

HTML5 Slot Machine: Jackpot 777 게임 템플릿으로 대박을 터뜨리세요.

16. Katana Fruits - HTML5 게임

맞춤형 가능한 Katana Fruits - HTML5 Game을 이용해 다음 과일 닌자가 되어 보세요.

이 HTML5 게임 템플릿은 아래의 코드로 개발되었습니다.

• HTML5
• JavaScript
• CreateJS

템플릿에 들어 있는 포토샵과 일러스트레이터 파일을 이용해 룩앤필을 편집하고, CTL Arcade WordPress 플러그인을 사용해 워드프레스 안에 직접 설치할 수 있습니다.

17. Panda Love

자리에, 준비, 땅!

플레이어는 빨리 달리는 판다가 장애물을 넘어 상금을 모으도록 이끌어 주며, 20레벨 이상 되는 게임을 한 판씩 끝내야 합니다.

이 템플릿에는 Construct 2 파일과 다음과 같은 특징이 있습니다.

• 자동 저장
• 광고 지원
• 원 터치 방식의 제어
• 그 외 다수

Panda Love를 활용해 픽셀 사랑을 보여주세요.

18. HTML5 Tetris

저는 모든 HTML5 게임 템플릿 중에 HTML5 Tetris를 좋아합니다.

클래식에서는 문제가 거의 생기지 않지요.

터치 방식이 지원되고 800x600인 해상도에서 여러분은 다음과 같이 작업을 할 수 있습니다.

• 사운드와 곡 변경
• 게임 외관 맞춤화
• 재디자인이 가능하도록 레이어로 된 포토샵 파일 사용

GameMaker Studio를 이용해 제작되는 HTML5 Tetris 게임 템플릿은 누구나 즐길 수 있는 게임입니다.

19. Let's Park!-High Quality Parking Game

Let's Park!-High Quality Parking Game에는 입체적인 표현과 매끄어운 움직임이 있습니다.

게임 템플릿에 다음과 같은 파일이 들어 있습니다.

• HTML5 파일
• 레이어로 된 포토샵 파일
• Construct 2 프로젝트 파일

Let's Park!-High Quality Parking Game HTML5 게임 템플릿은 키보드와 터치 제어를 모두 지원하지만, 터치 화면을 강력히 권장합니다.

20. Angry Finches - Funny HTML5 Game

제 생각에 Angry Finches - Funny HTML5 Game이 무엇을 본떠서 만든 것인지는 분명하네요.

GameMaker Studio를 이용해 구축되었으며 다음과 같은 특징이 있습니다.

• 20 레벨
• 레이어로 된 포토샵 파일
• 원하는 대로 변경 가능한 사운드와 곡
• 그 외 다수

자신만의 앵그리 버드 기반의 재미있는 게임을 만드는데 Angry Finches - Funny HTML5 Game 템플릿을 사용해 보세요.

마무리

여기 있는 템플릿 중에 일부는 템플릿일 뿐이지만 다른 템플릿은 완벽한 게임 컨셉에 가깝습니다. 웹사이트 용도로 무언가를 찾거나 자신의 아이디어를 구체화하는 방법을 학습하고 있다면, HTML5 게임 템플릿이 얼마나 다양한지 명확히 이해했을 것입니다.