Tutorial: Top-View Game Setup

Tutorial: Top-View Game Setup

Overview

This tutorial explains how to set up a top-view game.

It assumes that you have completed the standard tutorial course and have learned the basic operations.

In the regular tutorial course, the explanations were based on a side-view game, but ACTION GAME MAKER can also create top-view games.

However, some settings differ from those used in side-view games, so this tutorial focuses mainly on explaining those differences.


Differences Between Top-View and Side-View

There are two major differences:

  1. There is no gravity.
  2. Character animations are not limited to two directions (left and right).
    Instead, they use four directions (up, down, left, right) or eight directions including diagonals.

Issue 1 can be solved by setting the scene gravity to 0, and issue 2 can be solved by manually configuring animations for each direction when creating the character.

Now, let’s start creating the setup.


Creating a Project

  1. Open the Sample Project tab in the launcher.
  2. Load “Topview project base.”

:memo: What is Topview project base?
It is a template sample project with simple settings configured for use in a top-view game.

The main changes are the following two points:

  • The gravity property of the sample game_scene is set to “0”.
  • RPG Maker–style button input is preset.

Gravity Settings

Since the preset scene (game_scene.tscn) already has gravity set to 0, the gravity issue is resolved.

If you create a new scene, you must configure this manually.

In that case, change the Gravity value to 0 in the GameScene node properties.


Preparing a Character Game Object

Create a new game object and select “Topview Character Base.”

:memo: What is Topview Character Base?
This is a game object with a simple setup for use as a top-view character.

Compared to 2D Sprite Character Base, the only differences are:

  • A sample animation set is included.
  • The Motion Mode property of the GameObject is set to Floating.

Setting Up 4-Direction Animations

In this section, we explain only the setup method, assuming that the character has three types of animations:

  • Up
  • Down
  • Left/Right

The BulkSetAnimation used in the tutorial cannot be used, because it is designed only for two-direction (left/right) animations.

Therefore, in a top-view game, you must assign animations manually for each direction.


Steps

  1. Select the GameObject node and expand Animation Set in the properties.

  1. There is a default Move_Template animation, but you can ignore it.
    Click “+ Add Animation Category.”

  2. A new animation will be added.
    Set any name you like, then expand “> Animation & Direction.”

  1. Select “+ Add Direction Variant.”

  2. The animation selector, Auto Flip Y property, and direction pad will appear.


  1. First, set the downward animation.

Set:

  • Auto Flip Y = Off
  • Display Direction = :down_left_arrow::down_right_arrow:

:memo: About Auto Flip Y (autoflip_y)

This property is used only when you want to use the same animation for both left and right directions.

When enabled, the right-facing animation will be automatically flipped depending on the display direction.

Be careful: if the original animation is left-facing, the display will appear reversed.


  1. Next, set the upward animation.

Add another direction with “+ Add Direction”, then set:

  • Auto Flip Y = Off
  • Display Direction = :up_left_arrow::up_right_arrow:


  1. Finally, set the left/right animation.

Add another direction with “+ Add Direction”, then set:

  • Auto Flip Y = On
  • Display Direction = ← →

This completes the four-direction animation setup.


:memo: TIPS

If you want to assign separate animations for left and right, disable Auto Flip Y and set ← and → to different animations.

If you want to configure 8-direction movement, do not assign diagonal inputs to the up/down directions.
Instead, add additional directions and configure them individually.


This completes the top-view game setup.

Next, we will explain how to configure a 360-degree shooter using template objects.

Settings for a 360-Degree Shooter

Here we will explain the setup for a 360-degree shooter with the following style:

  • The upper body faces the direction of the mouse or analog stick.
  • The lower body faces the direction of movement input.

Instead of setting everything up from scratch, this tutorial uses the template object “Topview 360 Shooter Player.”


Setup

  1. From Create Object, select “Topview 360 Shooter Player” from the character templates.
    Enable “Control this object with an input device” and create it.

  1. Select MoveAndJumpSettings and configure the keys according to your project.

  1. Run a test play.
    The upper body (pink arrow) should face the direction of the mouse or left stick, while the lower body (white arrow) should face the direction of the movement keys.


Explanation: Object Design

In this object, the main game object “360Shooter” represents the lower body, while the upper body is the child node “360shooter_head.”


Lower Body Movement

The lower body is configured in a simple way.

An 8-direction movement animation is set, and FaceDirectionSettings is used so that the character faces the direction of the Same As Move Key.

You can replace the animation sprites with your own assets prepared for 8-direction movement to customize the character.


Upper Body Movement

The upper body uses ChangeAngleSettings, which allows a node to rotate based on the mouse or controller stick direction.

By applying this to the “360shooter_head” node, the upper body rotates accordingly.

Since the 360shooter_head node rotates, its child nodes—the head sprite and the target node—also rotate with it.


Settings for Firing Bullets Toward the Mouse or Stick Direction

As mentioned earlier, the main object of this game object is the lower body, so it cannot simply use “Fire in Display Direction” from the bullet settings.

To solve this, a “target” object is used.

The target object is simply a game object that has the “target” group assigned to it.
It is a child node of “360shooter_head” and is positioned slightly in front of the upper body’s facing direction.

Because it is a child node, it rotates together with 360shooter_head, meaning it always remains slightly in front of the upper body, regardless of the direction it faces.

Therefore, if bullets are configured to fire toward the “target” group, they will be fired in the direction of the mouse or stick.

Similarly, if you place a Connector node as a child node of 360shooter_head, you can make bullets fire from positions such as the character’s hand or the muzzle of a gun.

1 Like