[Full Source Code][3D Runner Game] Jare's Adventure

[New work by Mr. Kylin] 3D Runner game framework + complete sample game, level mode, endless mode, block making, level making …

Download Cocos Store | Jare’s Adventure

Play online

Go to play and show your rank : Jare’s Adventure


1. Notice

  • This version does not have access to the SDK( such as payment ,login and ads SDK ) of H5 platforms and mini-game platforms.It is not suitable for direct operation.
  • It can be used for personal learning, making video courses, and operating after secondary development for money.

2. Introduction

Project Name: Jare’s Adventure


Development Environment

  • Engine:Cocos Creator 3.6.2
  • Programming Language:TypeScript
  • Game Type:3D
  • Supported Platform:H5

Main Gameplay

Level Mode





Networking Ranking

Click the ranking button in the middle to open the ranking.

Endless Mode

  1. Click the ENDLESS button to enter endless level.

  2. Players control Jare to avoid obstacles.

  3. The distance will be displayed at the top, the farther you go, the better.

  4. In endless mode, when game is over, the level settlement screen will pop up, as well as the rankings.

  5. As shown above, players have one chance to change their name, and when the change is successful, it will be displayed as the modified name.

Type of Obstacles

  1. Stumps and rocks will only change the direction of jare movement when they are hit. And will not end the game.

  2. Jare will fall and end the game when he hits the dead wood.

Character Control

  1. Jare will automatically move forward, can not control the forward speed.
  2. On the computer, control Jare left and right through the A and D keys.
  3. On the mobile platform, tap the left half of the screen to move to the left and the right half to move to the right.

Offline Ranking

The online ranking requires cloud storage service support, when this service is not available, you need to enable offline mode. The ranking in offline mode will record the distance you reach each time you play the game in endless mode, and then rank it.

3. Secondary Development Guides


Block Making


Whether it is level mode or endless mode, the levels are stitched together using multiple blocks.

The more block styles there are, the more interesting the level will be.

  1. Find the Assets/blocks directory, copy a block, and modify the position of the tiles and obstacles to create a new block.

  2. To make an obstacle that ends the game if you hit it, just name it as Obstacle.

  3. In the Assets/models directory, drag the FBX into the scene to find the relevant objects.

  4. It is recommended to keep the length of the blocks the same and only modify the contents. Otherwise, there will be a problem with splicing of blocks in endless level mode.

Level Making

Level Mode


Level Editing

  1. Copy an existing level
  2. Modify type of blocks


  1. Handle the next level logic in UIManager.ts
    let currentScene = director.getScene().name;
    if(currentScene == 'level-001'){

    if(currentScene == 'level-002'){
  1. Handle the final level logic in UIManager.ts
    if(director.getScene().name == 'level-003'){
        this.uiLevelComplete.active = true;
        this.uiLevelSuccess.active = true;

Endless Mode


Modify random blocks

The blocks for the endless levels are randomly selected from the Blocks Prefab list in Inspector panel on the right.

  1. Open level-endless scene.
  2. Drag the required block prefabs to the Blocks Prefab array, the number can be increased or decreased.

Modify the initial blocks

In order to take care of the player experience, the first few blocks of the endless level are fixed, and the initial blocks can be modified by following steps:

  1. Open the level-endless scene
    2.Delete the blocks in the left hierarchy and re-add the initial blocks you want, any number of initial blocks are supported.
  2. After the initial blocks are edited, you need to modify Block Start with a value of 32.5 + 45 * (initial number of blocks).

Networking Ranking

The ability to network leaderboards is turned off by default in the source code. To turn it on, you need to set the useRemote variable in the RemoteDataMgr.ts file to true.

After useRemote is turned on, you need to open the cloud storage service and create the database. Obtain SECRET_KEY and SAFE_TOKEN from the cloud storage service provider.

If you need to switch to another cloud database, you need to modify the network request code according to the API documentation of the cloud database.

If you have any questions,please post in the forum.

1 Like

I tried! 403m.


Developing an endless runner game that incorporates both lane shifting, akin to Subway Surfers, and lane turning mechanics similar to Temple Run, presents a significant challenge. Combining these mechanics not only increases the complexity of the gameplay but also demands meticulous optimization to ensure smooth performance. Integrating such diverse gameplay elements requires careful design and implementation to provide players with a challenging and immersive experience.

Could you please create a tutorial for that?

I’ve made a tutorial for the endless runner game. But sorry, it’s in Chinese only.

1 Like