Make Your Own Dinosaur Jump Game with MIT App Inventor

App Inventor 30-07-25
20 0

Tutorial plan

1- Presentation of Dinosaur Game

2- Objective of Dinosaur Game mobile application

3- Description of application designer interface

4- Description of application blocks part

 

 

Presentation of Dinosaur Game

The Dinosaur Game is a simple, fast-paced endless runner game where the player controls a dinosaur that must avoid obstacles (like cactus plants) by jumping over them. The objective is to survive as long as possible and achieve a high score.

The dinosaur runs forward automatically in a desert-like environment.

Obstacles (cactus) move from right to left across the screen.

The player taps the dinosaur (or presses a jump button) to make it jump over the obstacles.

If the dinosaur collides with a cactus, the game ends and a Game Over screen is displayed.

A reset button allows the player to restart the game.

Sound effects can be added for jumps and game-over events.

 

Objective of Dinosaur Game mobile application

The objective of the Dinosaur Game mobile application is to develop an interactive and educational game where the player controls a dinosaur that must jump over obstacles to survive as long as possible. Built with MIT App Inventor, the project aims to:

Teach event-driven programming concepts through game development.

Demonstrate the use of timers, sprites, collision detection, and user interaction.

Engage users with a fun and challenging experience involving quick reflexes and timing.

Promote creativity and problem-solving through visual programming.

Introduce core principles of animation and mobile app design in a hands-on way.

 

Description of application designer interface

The Designer Interface in MIT App Inventor plays a crucial role in building the visual layout and structure of the Dinosaur Game. It is where the developer adds, arranges, and configures components that make up the user interface and game environment.

In the Dinosaur Game Application, the Designer Interface Includes :

Component

Role in Game

Canvas

The main game area where the dinosaur, cactus, and background appear.

ImageSprite (dinosaur)

The player-controlled character that jumps over obstacles.

ImageSprite (cactus)

The obstacle that moves from right to left across the screen.

Button (reset)

Allows the player to restart the game after a collision.

Label (Game Over)

Displays a message when the player loses.

Clock1

Controls the walking animation of the dinosaur.

Clock2

Manages the upward movement (jump).

Clock3

Manages the downward movement (fall).

Clock4

Moves the cactus and checks for collisions.

Sound (game-over.mp3)

Plays a sound when the game ends.

 

Description of application blocks part

The Blocks part of MIT App Inventor is where the logic and behavior of the application are programmed. It uses a visual block-based coding system to allow users to create interactive apps without writing traditional code.

In the Dinosaur Game, the Blocks Editor is used to define how the game works, including movement, jumping, collisions, scoring, and game-over logic.

The complet program :

Explanation of the program

1- reset procedure :

The reset procedure is a part of the game logic that allows the player to restart the game after it ends (for example, after a collision between the dinosaur and the cactus). It restores the initial state of the game so that the player can play again without closing or reinstalling the app.

When the Reset button is clicked, the following actions are typically performed:

- Move them back to their original positions on the canvas.

- Set the dinosaur sprite to its first/default appearance

- Clear the screen of game-over labels or notifications.Reactivates movement, jump, fall, and obstacle animations.

- Hide the Reset button Removes the Reset button until the game ends again.

2- Screen1.Initialize : 

In MIT App Inventor, the Screen.Initialize event is automatically triggered when the application starts. Instead of repeating initialization logic directly inside this event, it's a good practice to define a separate reset procedure and then call it from Screen.Initialize.

3- reset.Click

In the Dinosaur Game, the Reset button allows the player to restart the game after a collision (when the dinosaur hits the cactus). The button is usually hidden during gameplay and only shown after the game ends.

When the player clicks the Reset button, the event reset.Click is triggered. Instead of repeating all the setup code inside this event, we call a predefined procedure like reset_game to reset everything.

 4- Clock1.Timer

The Clock1.Timer is responsible for animating the walking movement of the dinosaur while it is on the ground. It creates the illusion that the dinosaur is moving by cycling through different images (e.g., walking frames) at regular intervals.

Clock1.Timer controls the walking animation of the dinosaur.

It runs periodically to change the image of the dinosaur sprite.

It is enabled when the game starts and continues until a jump or collision occurs.

5- dinosaur.Touched

This event is triggered when the user touches the dinosaur sprite.

It disables Clock2, stopping any ongoing jumping movement.

6- Clock2.Timer

The Clock2.Timer event is responsible for controlling the jump-up movement of the dinosaur when the player touches the screen.

Each time the timer ticks, the dinosaur’s vertical position (Y coordinate) is decreased to simulate upward movement.

The dinosaur jumps until it reaches a certain height, at which point Clock2 is disabled and Clock3 (falling movement) is enabled.

6- Clock3.Timer

The Clock3.Timer event is responsible for controlling the falling movement of the dinosaur after it finishes jumping up.

This is the second part of the jump sequence, where the dinosaur comes back down to the ground.

On each timer tick, the dinosaur’s vertical position (Y) is increased gradually to simulate gravity pulling it down.

When the dinosaur reaches the ground level (a defined Y position), the timer stops (Clock3.TimerEnabled = false).

6- Clock4.Timer

The Clock4.Timer event is used to animate the cactus movement across the screen.

It simulates the obstacle moving from right to left, giving the impression that the dinosaur is running forward.

On every timer tick, the cactus's X position is decreased, moving it toward the left side of the screen.

When the cactus reaches the left edge (off-screen), it is reset to the right side and may be given a new image to add variety.

Every time the cactus finishes its run (goes off-screen), it comes back with a new image.

This makes the obstacle visually more dynamic and less predictable.

7- dinosaur.CollideWith

The dinosaur.CollidedWith event is used to detect collisions between the dinosaur and another sprite — typically the cactus, which represents the obstacle.

It detects when the dinosaur hits the cactus, and triggers a Game Over sequence.

This event ends the game as soon as the dinosaur touches the cactus. All motion stops, a sound is played, and the player is prompted to try again by tapping the reset button.

0 comment

Leave a comment

Veuillez noter s'il vous plaît*

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Purpose of this website

Educational robotics refers to the use of robots and robotics technology to promote learning in educational settings. It involves the integration of technology, engineering, and computer science into the classroom, allowing students to engage in hands-on, project-based learning experiences.
In this context, our website represents an excellent resource for parents, teachers and children who wish to discover robotics.

Contact details

Zaouiet Kontech-Jemmel-Monastir-Tunisia

+216 92 886 231

medaliprof@gmail.com

Pictures of the articles

Robotic site created by MedAli-Teacher info