Pixel Journey
Play demo at Github Pixel Journey
Pixel Journey is a slide scroll game developed with Javascript and Html. The game was built with the latest Javascript language which isn't supported on every web browser. Pixel Journey is recommended to play on the Chrome.
About pixel journey
Project background
I've been a big fan of the game Journey when it was first released on PS4, so I decided to recreate this game in my favorite pixel style.
Challenge & Outcome
Without any web development background, the coding languages are fresh new to me and this is the very first time I build my own game from scratch. I've learnt the whole pipeline of making a simple game in this one-month project. I got used to working with the basic interaction prototyping skills - Javascript, Html and Phaser 3.
My role
This is an individual work, I designed the gameplay, completed the art asset including character animations, backgrounds, and developed the playable demo with code.
01 Game Mechanism
How does the player engage in the game? What's the game mechanism?
02 Game art
How does the visual style reflects on the original Journey game?
How does the player perceive the game world?
03 Development
Thinking about playable demo, key processes in the programming and coding.
01 Game Mechanism
In this 2D scroll flappy-bird game, the player need to use left mouse button to control the running character to avoid obstacles or ground. As the time goes, the speed will be faster. The goal of game is to reach higher score.
02 Game Art
Character design
As a fan of the game Journey, I referenced the original design from the game, and re-design it into 2D pixel style. I designed two posture of the character, running and static, then, animating them as if there was the wind force.
Sketches of the character
Animations of the character from Pixel Journey
Elements design
I referenced the enemy in the original game---- the machine looking monster creature, as the obstacles. Also, I have the gravestones on the ground to add the difficulties of the game.
Game screenshots from original Journey
Game elements design from Pixel Journey
Scene design
I referenced the original intro page of Journey, because I love the beauty of the abandoned desert. I also used eroded buildings in the game as assets to reflect the desolation of the original work.
Game screenshots from original Journey
Game scene design and sketch from Pixel Journey
03 Development
I used Phaser 3 as a plugin in Visual Studio to help with better coding visualizations to develop this game. This game is divided into four sections for the player to complete the game loop. Each section has different interaction design that I coded for the players. I considered different visual elements for the better player experience.
Code from Pixel Journey
.png)
You can find this game on github if you are interested in it or if you would like to help me on developing it further!