dungdq 76bbdc2bfb update link more info

2025-06-12 18:19:55 +07:00

4.9 KiB

Raw Blame History

sidebar_position

sidebar_position
13

Game Logo

Overview

The Game Logo is a key branding element displayed consistently across all platforms and orientations to reinforce the game’s identity.

Platform	Orientation	Preview
Desktop	Standard
Mobile	Landscape
Mobile	Portrait

Implementation

Prepare Assets

1. Core Setup

Location: assets/core-assets/hyper-core/packages/hyper-logo-animation

Script: Initialize animation states for the logo.

// File: assets/core-assets/hyper-core/packages/logo-animation/hyper-logo-animation.js
onLoad: function () {
    const self = this;
    // Initialize animation states
    self.animPlay = AnimationProvider.Instance.GetAnimation('anim-logo-play');
    self.animIdle = AnimationProvider.Instance.GetAnimation('anim-logo-idle');
}

2. Required Assets

Static Assets:

Platform	Location	Preview
Desktop	`assets/game-assets/textures/desktop/preloads/main-game/custom-scale`
Mobile	`assets/game-assets/textures/mobile/preloads/main-game/custom-scale`

Animation Assets:

Platform	Location	Preview
Desktop	`assets/game-assets/textures/desktop/postloads/main-game/animations`
Mobile	`assets/game-assets/textures/mobile/postloads/main-game/animations`

3. Animation Settings

Configure Animation Provider:
- Register the logo animations in the Animation Provider.
Set Up Animation States:
- Enable a static frame for the loading state in anim-logo-play and anim-logo-idle.
- Configure continuous loop playback for animations.

Setup

Desktop Configuration

Base Settings:
- Configure the logo node in the main scene.
Node Setup:
- Add the hyper-logo-animation component to the logo node.
- ```
Components: {
    animation: 'hyper-logo-animation',
}
```

Tip: Adjust position and size according to the game design specifications.

Mobile Configuration

Landscape Mode

Node Setup:

Configure the logo node with the following components:

Component	Description
`hyper-logo-animation`	Plays and manages the logo animation.
`node-position-by-jackpot`	Adjusts logo position based on jackpot display state.
`landscape-logo-spine-aspect-ratio-keeper`	Maintains consistent logo size (e.g., 1.0).

Portrait Mode