JumpOn! - PlayCanvas

So, I decided to get to know Playcanvas a bit better and make a simple game for Facebook. This is my first ever game, not only using Playcanvas, but in general, so take it with a grain of salt! Critical feedback is appreciated :slight_smile:

This is a fork of the actual game I make with removed Facebook SDK calls and related UI, so you guys can try it out here, on Playcanvas.

Some features:

  • I use Ammo.js physics simulation for the actual jump
  • I use Tween.js for moving platforms and the jumper, and squeezing models for charging power effect
  • Landing on the center of the next platform gives extra bonus points
  • Difficulty increases with the increase of the score (platforms become smaller, distance become larger, new super hard platforms can spawn after 150 points)

Special thanks:
I used the awesome 3D models from https://kenney.nl/, since my modelling skills are horrible :slight_smile:

9 Likes

That’s a great concept! So fun, thanks for sharing it.

Some things on my test:

  • On mobile I wasn’t able to play since on touchend the espresso machine won’t fly :slight_smile:
  • You could potentially enable device pixel ratio on your project render settings to increase visual fidelity on retina/mobile displays.

Keep up the good work!

1 Like

@Leonidas, thank you for the bug report ^^ I fixed the jump issue and enabled the DPR, as you suggested. Should have checked the mobile device earlier.

However, I do find many visual artifacts on mobile device, which are not visible on PC, like the light jumps together with the mixer, or the weird platform shadow halos. Will play a bit with the lighting setup.

1 Like

This is really great. I’m addicted already. Congratulations!

I particularly like the attention to detail with the animation and audio.

If I could recommend anything to polish, it’d probably be the UI artwork. e.g. nice font + 9-sliced buttons + some UI animations/transitions etc

2 Likes

Nice game! Simple but addictive! I like the move effects of the objects and camera. I played it on my iPhone X and as far as I could see everything works well. On the iPhone X left and right bars are visible, but i think you can solve this by adjusting a setting and spreading the background over the entire screen.

1 Like

Thank you, guys, for the valuable feedback!

@will, I will prettify the UI, after the Facebook SDK integration is comeplete. Thanks for the 9-sliced tip, I didn’t think of it initially.

@albertos, thank you for iPhoneX tip. I seem to keep missing the mobile bugs ^^ And by the way, the camera is static in the game - I move everything down with a tween after spawning a new platform. As mentioned, this is my first game, so I didn’t know how to handle the case, where the game area would crawl in one direction indefinitely. Probably, figuring out the direction and spawning a new floor tile, while removing the old one would be the way? I decided to simply move the platforms instead, together with the mixer, and destroy the old platforms, which are offscreen. The visual effect is the same, though, as with moving the camera.

1 Like

I’m also new in the programworld and I’m working on my first games to. If I want to achieve something, I try do it on a way that i understand. You can always improve things later. This forum can helps a lot.

1 Like

I think this is a bug:

1 Like

Good catch! :slight_smile: Thanks!

To fix the left and right bars you can try to use the fill window option.
(Project settings > Rendering > Fill mode > Fill window).

1 Like

@albertos ep, that did the trick. Thank you! Will make the changes in the fork too later.

1 Like

@LeXXik, If you fail at the first jump, the final score of the previous game is displayed.

@albertos, I should implement medals and give you one for most reported bugs :slight_smile: Thanks. I’ve already seen it and it is fixed in the main branch.

1 Like

Haha gladly done, i hope it helps you!

1 Like

Finally had some time to revisit my JumpOn!

  • Added a whole new friends system, because why not :stuck_out_tongue: You can now add friends, by sending their player tag.
  • Changed UI somewhat, to accommodate new features, like friends, settings, profiles, etc
  • Oh, added simple settings, to turn on/off audio or floating avatars of your friends. And they should be persistent, saving in the cloud.
  • What else… A global top 100 leaderboard! Now you can see how you place yourself in the world ranks. Well, not like the whole world is playing though :smiley: Nevertheless, I also released this version to Google Play market, so both Android players and you will be ranking on the same leaderboard. Multi-platform!

Next, I want to return to that performance optimization topic and follow @Leonidas guide. Also I need update the UI to accomodate PC screens, because currently it aims mobile. I mean, how do you handle it without HTML? Currently it scales all the way to the width of the screen. Is there a way to set, say a container, to be with a minimum width so the children could scale, but not all the way to go over the border? You can see it in the game, if you play full screen browser, some UI is stretched too much (so resize your view to be narrower).

2 Likes

Do you use a 2D screen with elements for that? In my game I have no problems with the scale on mobile and pc screen. The scale is on every screen the same compare with the screen. (So not to big on pc and not to small on mobile).

I’ve updated the link in the original post for you. :smile: Nice progress on the game!!

2 Likes

Thank you, will :slight_smile:
@albertos yep, I do use the 2d screen. To better explain myself, I will make another topic to discuss ways to make the UI elements responsive.