Tony Wang

Developer

MENU

Weely J Blog For ART 3001

By Tony Wang

04/23/2023

This week is just a week that continuing working on the final project.

Probably have not mentioned before, for the final project, I am trying to do pixel game.

I have made pixel games before using Unity, but never have a chance to make one using html and css.

Just like the things I have done using p5js, my original idea is to use p5js.

So I started with doing some research on how to import sprites using p5js.

A sprite is a series of one pixelated characters that include its actions in frames.

I found how to import them and p5js allows spirtes to be animated.

However, I found really hard to create the properties of the sprite to do things like moving left, right, jump.

It's easy to just push the sprites and place them on the canvas.

So I want to try this in a different direction by just using Javascript.

I know that Javascript is one of the early tool to use to create games, so it defintely works.

So first I create a canvas using Javascript and also the canvas element in html.

And another important element to setup is the player element.

By creating a new class called Player, just like what we have talked in class, it is easy to define many features of this new class and use it.

For the Player class, I tried to create gravity just like I did in Unity, by adding velocity on the y direction.

And other things to figure out is to make the Player move by pressing keys, in this case, w is jump, a is moving left, d is moving right.

I added the comments on my code so others can understand them easier.

Other things I figured out were things like adding collision and putting the background, making the sprite and edit it as the player element, and so on.

It is indeed time consuming when some bugs came up and need to figure out which part I have missed.

But overall it is pretty fine to get this little game running.