Building a PAC-MAN Mobile Game with MIT App Inventor

Tutorial plan

1- Presentation of PAC-MAN Game

2- Objective of PAC-MAN Game mobile application

3- Description of application designer interface

4- Description of application blocks part

Presentation of PAC-MAN Game

PAC-MAN is one of the most famous and iconic arcade games in video game history. It was first released in 1980 by Namco (now Bandai Namco).

The player controls Pac-Man, a yellow, circular character with a big mouth, who navigates through a maze.

The main objective is to eat all the small dots (pellets) scattered across the maze.

At the same time, Pac-Man must avoid four colored ghosts (Blinky, Pinky, Inky, and Clyde) that try to catch him.

If a ghost touches Pac-Man, the player loses a life.

Special power pellets allow Pac-Man to temporarily eat the ghosts for bonus points.

The game continues through progressively harder levels, with faster ghosts and more challenging mazes.

In summary: PAC-MAN is a maze-chase arcade game where the player’s skill is tested by collecting points, avoiding enemies, and surviving as long as possible. It became a cultural phenomenon and remains one of the most popular and influential games ever created.

Objective of PAC-MAN Game mobile application

The objective of the PAC-MAN mobile application is to control Pac-Man using direction buttons to collect all the points on the screen while avoiding the ghosts.

The player changes Pac-Man’s movement direction with Up, Down, Left, and Right buttons.

Pac-Man must eat all the points (which disappear when collected).

If Pac-Man collides with a ghost, the clock stops, the game ends, and a “Game Over” message is displayed.

The player can use the Reset button to restart the game, which resets Pac-Man, the points, and the clock.

Description of application designer interface

The Designer interface in MIT App Inventor is where the visual layout and components of the Pac-Man game are created. It defines how the game looks and what elements are available for interaction.

Descripton of graphic components :

1- Screen Setup

Set the title (e.g., PAC-MAN GAME).

Arrange the layout of the game elements (Canvas, Buttons, Labels).

2- Game Area (Canvas)

The Canvas acts as the playing field.

Pac-Man, ghosts, and points (balls or images) are placed inside the Canvas as sprites.

The Canvas handles movement and collisions.

3- Player Controls (Buttons)

Four direction buttons (Up, Down, Left, Right) let the player move Pac-Man.

A Reset button restarts the game.

Game Logic Components (Non-visible)

4- Clock:

It controls Pac-Man’s continuous movement and animation.

5- Notifier:

It shows messages like “Game Over!”.

6- Game Objects (Sprites)

ImageSprite for Pac-Man: represents the main character.

ImageSprite for Ghost(s): represent the enemies.

Ball for Points: represent the pellets Pac-Man eats.

Description of application blocks part

The Blocks part in MIT App Inventor is where the logic and behavior of the Pac-Man game are programmed. Unlike the Designer (which builds the interface), the Blocks part makes the game interactive and functional.

The complete program

Explanation of the program

1- reset procedure

The reset procedure is responsible for restarting the Pac-Man game by putting all elements back to their initial state. It ensures that the game can start again after being stopped or after the player clicks the reset button.

It activates the clock, resets Pac-Man’s picture, makes him visible, and sets initial positions of Pac-Man and points.

2- reset_visible procedure

The reset_visible procedure restores all points on the game screen, making them visible and ready to be collected by Pac-Man again. It works together with the reset procedure to restart the game properly.

3- when Screen1.Initialize event

The Screen1.Initialize event is used to set up the game environment by calling the reset and reset_visible procedures when the application starts. This guarantees that Pac-Man, the points, and the clock are ready for the game before the player interacts.

4- when reset.clic event

The reset.Click event allows the player to restart the Pac-Man game at any time by reactivating the clock, restoring Pac-Man to his initial state, and showing all the points again. It provides a quick way to replay the game without restarting the whole app.

It calls the reset and reset_visible procedures.

5- direction variable

The direction variable is used to control and store the current movement direction of Pac-Man. It is a key element that determines both Pac-Man’s movement and his appearance (image orientation).

The variable keeps the latest direction chosen by the player (e.g., "up", "down", "left", "right").

6- when button.clic event

The when Button.Click event is triggered whenever the player presses a button on the screen. In the Pac-Man game, these buttons are used to control Pac-Man’s movement and perform other actions like resetting the game.

For the Up, Down, Left, and Right buttons:

- Updates the direction variable to the corresponding value ("up", "down", "left", "right").

- Changes Pac-Man’s image to face the correct direction.

7- when Clock1.Timer event

The Clock1.Timer event runs repeatedly at set time intervals (defined by the Clock’s TimerInterval property). It is responsible for animating Pac-Man and controlling continuous movement.

a) Animation of Pac-Man’s Image

The Clock1.Timer changes Pac-Man’s sprite image depending on the direction.

It alternates images to create mouth open/close animation.

b) Moving Pac-Man Continuously

The Clock1.Timer checks the value of the direction variable.

It updates Pac-Man’s X or Y position on the Canvas according to the current direction (up, down, left, right).

8- when pacman.CollideWith event

The when Pacman.CollidedWith event is triggered whenever Pac-Man touches another sprite on the Canvas, such as a ghost or a point. It is essential for detecting interactions between Pac-Man and other game elements.

a) Collision with Ghosts

If Pac-Man collides with a ghost:

The program stops the Clock (Clock1.TimerEnabled = false) to pause movement and shows a “Game Over!” message using a Notifier.

b) Collision with Points (Pellets)

If Pac-Man collides with a point:the program hides the point (Point.Visible = false) to simulate it being eaten.