---
sidebar_position: 3
---

# Preload Scene

Setup configuration for asset loading.

---

The Preload Scene is where you define which assets will be downloaded **before** and **after** the game starts.

Setting up the preload system involves several steps, depending on the types of assets and specific download requirements.

Check out the [Game Assets Structure](../category/game-asset-structure) for more detail.

## Preload vs Postload

Hyper Slot Game uses a two-stage loading process:
- **Preload**: Downloads essential assets before the game scene is displayed. These typically include the background, text elements, and static textures.
- **Postload**: Downloads additional assets in the background after the scene has been loaded. This usually includes animations. While these assets are downloading, static frame texture are shown in place of the actual animations. Once the download is complete, the animations seamlessly replace the static frame.

|              Preload                 |             Postload            |
|--------------------------------------|---------------------------------|
| ![Preload](./img/03-preload-scene/preload-static.png) | ![Postload](./img/03-preload-scene/postload.png) |

Preload and postload assets are organized by scene.

For example, before loading the **Main Scene**, its preload assets are downloaded first. After the scene is displayed, the postload assets begin downloading in the background.

The same process applies to other scenes such as **Gamble**, **Free Game**, and **Bonus**.

## Platform Assets

Hyper Slot Game runs on both Web Desktop and Web Mobile platforms. While the UI and textures appear visually similar across both, the actual assets differ due to platform-specific optimization requirements.

Typically, the mobile version uses smaller-sized texture assets to reduce memory usage and improve performance.

|        Assets         |  Desktop Size |  Mobile Size |
|-----------------------|---------------|--------------|
| Symbol Bonus Animation|  1024x2048    | 1024x1024    |
| Bigwin Spine Animation|  512x1024     | 358x717      |

As a result, when the game detects a mobile device, it will automatically download a different set of optimized assets tailored for that platform.

## Localize Assets

Hyper Slot Game supports localization through both text and raw asset replacements, with English as the default language.

Based on the selected language configuration, the game will download the corresponding localized assets instead of the default English versions.

|    Assets     |                    EN                   |                      ZH                     |                     TH                      |
|---------------|-----------------------------------------|---------------------------------------------|---------------------------------------------|
|Text Buy Bonus|![Buy Bonus EN](./img/03-preload-scene/title-buy-bonus.png)|![Buy Bonus ZH](./img/03-preload-scene/title-buy-bonus_zh.png)|![Buy Bonus TH](./img/03-preload-scene/title-buy-bonus_th.png)|

## Setting Up the Preload Scene

![Preload Scene Setup](./img/03-preload-scene/preload-scene.png)

To set up the Preload Scene, simply open the scene and run the **preload-hyper** command from the **P4F Editor** package.

The available commands are:
- **Load Message**: Scans the working directory for any text message files and loads them into the `game-message` component.
- **Load Localize**: Detects all available language options and loads the corresponding localized assets into the `localization` component.
- **Load Preload Assets**: Defines preload and postload assets, then loads them into the `p4f-scene-manager` component of the `scene-manager` node.
- **Load Assets By Platform**: Scans for mobile-specific assets (used when the game runs on mobile devices) and loads them into the `platform-asset-manager` component.
- **Load Sound**: Scans for background music and sound effects (SFX) and loads them into the `sound-controller`.
- **Load All Above**: Executes all of the above commands in sequence.