Rexxie Jump Game (T-Rex Game Parody)

in #steemmonstershow6 years ago (edited)

Background

So, as I've said before, I'm relatively new to coding. But I'm also good at learning and problem solving.
After my previous post about my life plans, @littlescribe reached out to me, and asked if I would show some of my skills, and make a small game demo.

Now, I had never before made any complex games. I had programmed games on my TI-84, which gave me basic game mechanics, as long as dabbed in a little bit of JavaScript.

So, when she asked me to make a game, I wasn't sure what I wanted to do. But that night, when the internet went out for some reason, I had an idea.

image.png

If you didn't know, when your computer or phone loses connection to the internet, google chrome will display a minigame when you try to load a page. Just look up "t-rex game" and you should find it. In this game, you play as a dinosaur and have to jump over cacti.
I found inspiration in this, and wanted to make my own version of it, because I thought of Rexxie as I was playing it. So the thought processes began (oh AP Psych, you lovely little annoyance).

Programming

Since the best computer language (and the most relatable to my game-making past of TI-BASIC) was JavaScript, I wanted to try to make my game using that.
I knew you could do gaming, but I wasn't sure how advanced you could go, so I looked up "js game tutorial." From here I saw my recognized w3schools link, so I went to it and found canvas, an HTML tag that you could put JS objects on.
This might not make a lot of sense, but basically, it is an in-browser game window.


I didn't know anything about canvas before this, it was all new to me. I went through the tutorial one night, looking at all the examples, figuring out how each of them worked. I slept through the night, and started making my game the next day. I wanted it to be good, complete, and bugless (which is almost impossible, so close enough. I wrote on paper some different parts that I would need to make it work. I used some basic functions from the tutorial of the night before, because I couldn't fully remember it. I stripped them down into their basic form, with one or two lines each, and then added my own code.
image.png

I drew images (or took backgrounds out), I added objects, I added formulas for gravitational pull. I kept the frame rules (not to be confused with framerules of speedrunning), but changed the game to run at about 200 frames per second. This is faster than the human perception, reducing rage toward the game. (I also reduced the hitboxes of my images later for the same reason :D.)
I ordered, reordered, and added new functions. It was a completely different game, using few mechanics from different parts of the game tutorial.

Restarting

In the end, everything was running pretty smoothly, except that you had to reload the page every time you wanted to play the game again. This inconvenienced things, so I switched it up a little. I wasn't sure how to proceed however, so I asked my programmer friend, who suggested a few ideas. In the end, I made a button that will restart the game for you, while also keeping your personal highscore (make sure to send those to me).


This image is a link to the site of the game. image.png


Special Thanks

Thanks goes out to @steemmonsters for creating such a great community (and partially inspiring this game), @littlescribe for asking me to do this, giving me the motivation to dedicate time to this. Also thanks to W3Schools for having a programming tutorial so I could learn how to make games like these.

Final Remark

I hope to make more games soon. I'm almost stabilized from the onset of school, which is why this game took so long to come out from when I had finished it, because I was so busy with school and soccer.

-Buddy
Logo180.png
Get updated:
Follow me on Twitter

If you liked this, consider upvoting.
If you want more, consider following.
If you want to add something, consider commenting, we can discuss :).
See ya next time :D

Sort:  

Wait, the dinosaur chrome screen is a game? I never realised that. That's cool. Also good job with your game. Will have to have a closer read of the code you have in this post later on.

That sounds like a great idea. Maybe today I'll make a video about it explaining each part :)

Wow, that is very cool, @buddyboyb. My best score so far in your game was only 120, but I didn't try for long, just enough to get an idea of how it worked. I think what you have done here is very cool, and is at about my level of programming. I can take other people's code and modify it, but I'm not so good at creating something from scratch. Well done, you've made a fun little game, which uses the SteemMonsters assets!


🙚   SteemMonsters:Site   • Discord   |  Steempunk.net:Site   • Discord   |   Chibera:   • Site   • Discord   🙘

Yeah, but now after I've done it once or twice, I think I could replicate it from scratch. The next game I try, I'll try it :)

Soooo awesome!!! I love it! Make sure you enter the game jam! You are seriously the coolest. Love the idea. And it turned out great.

The game jam is over right now, but I'm pretty sure they're planning to do another one. I'll probably make something for that :)

Nice one, this is a colorful twist to the good old no connection mini-game! Glad to see a refreshing rendition.

Thanks. I plan to make more games in the future. Look out for them!

I look forward to playing them!

Hello! Your post has been resteemed and upvoted by @ilovecoding because we love coding! Keep up good work! Consider upvoting this comment to support the @ilovecoding and increase your future rewards! ^_^ Steem On!

Reply !stop to disable the comment. Thanks!

not because I'm opposed, just because I like keeping my comments fairly clean.

What's your highest score?
After the most recent path change to where this game should be parked, mine is 342.

Congratulations @buddyboyb! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :

Award for the number of upvotes

Click on the badge to view your Board of Honor.
If you no longer want to receive notifications, reply to this comment with the word STOP

Do not miss the last post from @steemitboard:

SteemitBoard - Witness Update

Support SteemitBoard's project! Vote for its witness and get one more award!

Duuuuuude!

This is awesome!

And impressively addictive. 😎

I've resteemed and dropped your link in some places. I hope folks find you!

Keep coding!

Thanks! I'm planning to. And now that I've scheduled homework out, I'll have more time to do it too.

My friend said it was addictive as well. I can see how it can be :P

You have received a Steemmonsters upvote! This post has been upvoted by Steemmonsters Discord member, 𝓒𝓪𝓻𝓻𝓲𝓮𝓐𝓵𝓵𝓮𝓷.

Please find out more about Steemmonsters: https://steemmonsters.com/

Coin Marketplace

STEEM 0.30
TRX 0.11
JST 0.034
BTC 66499.54
ETH 3203.31
USDT 1.00
SBD 4.14