update final free spin
@ -1,105 +0,0 @@
|
||||
---
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# Free Spins Implementation Guide
|
||||
|
||||
## Overview
|
||||
The Free Spins feature provides bonus rounds where players:
|
||||
- Receive complimentary spins
|
||||
- Can win prizes without additional bets
|
||||
- Often encounter enhanced winning opportunities
|
||||
|
||||

|
||||
|
||||
## Setup Process
|
||||
|
||||
### 1. Asset Configuration
|
||||
|
||||
#### Core Components
|
||||
Required prefabs from core package:
|
||||

|
||||
|
||||
#### Game-Specific Assets
|
||||
Implementation prefabs:
|
||||

|
||||
|
||||
### 2. Background Configuration
|
||||
|
||||
1. **Animation Setup**
|
||||
```typescript
|
||||
// Add to Animation Provider
|
||||
animationProvider.addAnimation('freespin-background');
|
||||
```
|
||||

|
||||
|
||||
2. **Display Modes**
|
||||
| Mode | Configuration |
|
||||
|------|---------------|
|
||||
| Landscape |  |
|
||||
| Portrait |  |
|
||||
|
||||
### 3. Feature Implementation
|
||||
|
||||
#### Scene Structure
|
||||
Required components:
|
||||
- Trigger Display
|
||||
- Retrigger Handler
|
||||
- Win Presentation
|
||||
|
||||

|
||||
|
||||
#### Component Setup
|
||||
|
||||
1. **Trigger Configuration**
|
||||
- Add assets:
|
||||
- Fonts
|
||||
- Textures
|
||||

|
||||
|
||||
2. **Retrigger Configuration**
|
||||
- Configure display elements
|
||||

|
||||
|
||||
3. **Win Display**
|
||||
- Set congratulations assets
|
||||

|
||||
|
||||
:::tip Configuration Guidelines
|
||||
Maintain consistency with game design specifications for:
|
||||
- Font selection
|
||||
- Visual elements
|
||||
- Animation timing
|
||||
:::
|
||||
|
||||
### 4. Optional Enhancements
|
||||
|
||||
#### Sidebands
|
||||
Classic slot visual enhancement:
|
||||
```typescript
|
||||
interface SidebandConfig {
|
||||
particleEffect: 'particle-free-sideband';
|
||||
background: 'sideband-back';
|
||||
foreground: 'sideband';
|
||||
shine: 'sideband-shine';
|
||||
liquid: 'sideband-static';
|
||||
indicator: 'indicator-static';
|
||||
}
|
||||
```
|
||||

|
||||
|
||||
#### Transitions
|
||||
Polish between game states:
|
||||
1. Configure animation provider
|
||||
2. Set node mappings
|
||||

|
||||
|
||||
## Implementation Examples
|
||||
|
||||
### Feature Flow
|
||||
1. **Trigger**
|
||||

|
||||
2. **Active State**
|
||||

|
||||
3. **Completion**
|
||||

|
@ -8,7 +8,6 @@ sidebar_position: 2
|
||||
The **Free Spin (or Free Games) Feature** awards players a set number of spins without requiring additional bets. During these spins, players can still win prizes—often larger than in the base game—without spending any of their own credits.
|
||||

|
||||
|
||||
|
||||
## Implementation Guide
|
||||
|
||||
### Prepare Assets
|
||||
@ -18,32 +17,11 @@ The **Free Spin (or Free Games) Feature** awards players a set number of spins w
|
||||
| **Core Components** | Locate the prefabs from the core package. |  |
|
||||
| **Game-Specific Components** | Prefabs are already present in the main game scene. |  |
|
||||
|
||||
|
||||
### Setup
|
||||
|
||||
#### Step 1: Configure Animation Provider
|
||||
|
||||
- Add Free Spin background animation in **Animation Provider**.
|
||||
|
||||

|
||||
|
||||
#### Step 2: Configure Display
|
||||
|
||||
- **landscape**:
|
||||
|
||||

|
||||
|
||||
- **portrait**:
|
||||
|
||||

|
||||
|
||||
#### Step 3: Asset Example
|
||||
|
||||

|
||||
|
||||
---
|
||||
|
||||
#### Main Scene Structure Free Spins
|
||||
### Setup Scene
|
||||
|
||||
#### Structure Free Spins
|
||||
|
||||
Your scene should include the following nodes:
|
||||
|
||||
@ -51,6 +29,8 @@ Your scene should include the following nodes:
|
||||
- **Retrigger**
|
||||
- **Win**
|
||||
|
||||
***Example Scene Structure:***
|
||||
|
||||

|
||||
|
||||
| Property | Description |
|
||||
@ -61,38 +41,45 @@ Your scene should include the following nodes:
|
||||
| `freeSideBandContainer` | Activates the Free Spins side band visual. |
|
||||
|
||||
---
|
||||
|
||||
#### Component Configuration
|
||||
|
||||
##### Trigger and Retrigger Setup
|
||||
##### Trigger & Retrigger
|
||||
|
||||
Configure animations for both trigger and retrigger.
|
||||
To configure the Free Spin **trigger** and **retrigger** components, follow these steps:
|
||||
|
||||

|
||||

|
||||
1. **Add Animations**
|
||||
|
||||
Include the required animations for both the trigger and retrigger elements.
|
||||
|
||||

|
||||

|
||||
|
||||
| Node Name | Purpose | Location in Core Package |
|
||||
|-----------| ------------------------------------------------ | ---------------------------------------------------------- |
|
||||
| `content` | Zoom-in and zoom-out animation | `assets/core-assets/slotty-core/packages/feature-game/animations` |
|
||||
|-----------|-----------------------------------------|------------------------------------------------------------------|
|
||||
| `content` | Handles zoom-in and zoom-out animations | `assets/core-assets/slotty-core/packages/feature-game/animations` |
|
||||
|
||||

|
||||

|
||||
|
||||
| Property | Description |
|
||||
|------------------------|---------------------------|
|
||||
| `durationPresentation` | Specifies how long (in seconds) the animation trigger plays before auto-stopping |
|
||||
|------------------------|--------------------------------------------------------------------------|
|
||||
| `durationPresentation` | Duration (in seconds) the trigger animation plays before auto-stopping |
|
||||
|
||||
2. **Add Background Animation Effect**
|
||||
|
||||

|
||||
|
||||
| Prefab Name | Purpose | Location in Core Package |
|
||||
| ----------- | ------------------------------------------------ | ---------------------------------------------------------- |
|
||||
| `explosive` | Background animation effect triggered by numbers | `assets/core-assets/hyper-core/packages/explosive/prefabs` |
|
||||
|-------------|-------------------------------------------------|-------------------------------------------------------------|
|
||||
| `explosive` | Background animation effect triggered | `assets/core-assets/hyper-core/packages/explosive/prefabs` |
|
||||
|
||||

|
||||

|
||||
3. **Configure Particle Effects**
|
||||
|
||||

|
||||

|
||||
|
||||
| Node Name | Purpose | Location in Core Package |
|
||||
|-------------|---------------------------------------------------------------------------------------|-------------------------------------------------------------|
|
||||
| `particles` | - Particle effects around title and number triggers.<br/>- Set scale to `1` for visibility | `assets/core-assets/slotty-core/packages/present/particles` |
|
||||
|-------------|-----------------------------------------------------------------------------------------|------------------------------------------------------------|
|
||||
| `particles` | - Particle effects around title and number triggers.<br/>- Set scale to `1` for visibility. | `assets/core-assets/slotty-core/packages/present/particles` |
|
||||
|
||||
:::tip
|
||||
Set up the **present freespin retrigger** in the same way as the **present freespin trigger**.
|
||||
@ -124,7 +111,7 @@ Add fonts and textures to show retrigger effect.
|
||||
|-------------------------|-----------------------------------------------------------------------------------------------|
|
||||
| `content` | Node for displaying the win animation content. |
|
||||
| `durationPresentWin` | Duration (in seconds) that the win presentation is shown. |
|
||||
| `animation` | Animation controller for the win presentation.<br/>Located at: `assets/core-assets/slotty-core/packages/feature-game/animations` |
|
||||
| `animation` | - Animation controller for the win presentation.<br/>- Located at: `assets/core-assets/slotty-core/packages/feature-game/animations` |
|
||||
| `clipStartPresentation` | Animation clip played when the win presentation starts. |
|
||||
| `clipStopPresentation` | Animation clip played when the win presentation ends. |
|
||||
| `allowPresentWinPoint` | Enables the display of win points during the presentation. |
|
||||
@ -143,49 +130,94 @@ Follow the visual and font flow as defined by your game's design system.
|
||||
:::
|
||||
|
||||
---
|
||||
|
||||
#### Free Spins Count Box
|
||||
|
||||
The **Free Spins Count Box** displays the remaining number of free spins to the player. Follow these steps to set it up:
|
||||
|
||||
##### Steps to Add the Count Box
|
||||
|
||||
| Step | Description | Image |
|
||||
|------|-----------------------------------------------|-----------------------------------------------|
|
||||
|------|-----------------------------------------------------------------------------|-----------------------------------------------|
|
||||
| 1 | Locate the `freespins-count-box` prefab in the Core package. |  |
|
||||
| 2 | Add the `freespins-count-box` prefab to your main game scene. |  |
|
||||
| 3 | Verify appearance in both desktop and mobile modes. |  |
|
||||
| 3 | Verify its appearance in both desktop and mobile modes. |  |
|
||||
|
||||
##### Platform Setup
|
||||
##### Platform-Specific Setup
|
||||
|
||||
Assign the appropriate node and controller for each platform:
|
||||
|
||||
| Platform | Node Name | Component to Add | Example Image |
|
||||
|----------|--------------------------|-----------------------------|-------------------------------------------------------|
|
||||
| Desktop | `freespins-box-desktop` | `Platform-ui-controller` |  |
|
||||
| Mobile | `freespins-box-mobile` | `Platform-ui-controller` |  |
|
||||
|
||||
##### Asset Setup
|
||||
##### Asset Configuration
|
||||
|
||||
Ensure the correct assets are used for each platform:
|
||||
|
||||
| Platform | Asset Path | Example Image |
|
||||
|----------|-------------------------------------------------------------------|-------------------------------------------------------------------------------|
|
||||
| Desktop | `assets/game-assets/textures/desktop/preloads/main-game/custom-scale` |  |
|
||||
| Mobile | `assets/game-assets/textures/mobile/preloads/main-game/custom-scale` |  |
|
||||
| Common | Freespins Background |  |
|
||||
| Common | Freespins Box Background |  |
|
||||
|
||||
##### Asset Font
|
||||
##### Font Setup
|
||||
|
||||

|
||||
Set the font for the count box display:
|
||||
|
||||

|
||||
|
||||
---
|
||||
#### Free Spin Background Setup
|
||||
|
||||
##### 1. Add Animation to Animation Provider
|
||||
|
||||
Add the Free Spin background animation to your **Animation Provider**.
|
||||
|
||||

|
||||
|
||||
##### 2. Configure Background Display
|
||||
|
||||
Set up the background for both landscape and portrait modes:
|
||||
|
||||
- **Landscape Mode**
|
||||
|
||||

|
||||
|
||||
- **Portrait Mode**
|
||||
|
||||

|
||||
|
||||
|
||||
##### 3. Asset Example
|
||||
|
||||
Example background assets for Free Spin:
|
||||
|
||||

|
||||
|
||||
|
||||
#### Sidebands (Optional)
|
||||
|
||||
- Optional visual element, commonly used in classic or legacy slot designs.
|
||||
Sidebands are optional visual elements, often used in classic slot game designs.
|
||||
|
||||
| Overview | Setup |
|
||||
|-------------------------------------------|----------------------------------------------|
|
||||
| Preview | Asset Structure |
|
||||
|---------|----------------|
|
||||
|  |  |
|
||||
|
||||
**Setup Steps:**
|
||||
|
||||
1. **Add Preference:**
|
||||
Add the free sideband preference in your configuration.
|
||||

|
||||
|
||||
2. **Assign Texture:**
|
||||
Set the correct texture for the free sideband.
|
||||

|
||||
|
||||
**Asset Mapping:**
|
||||
|
||||
| Asset Name | Node/Preference Name |
|
||||
|------------|----------------------|
|
||||
|---------------------------|------------------------|
|
||||
| `anim-free-sideband-static` | `particle-free-sideband` |
|
||||
| `sideband-back` | `sideband-back` |
|
||||
| `sideband` | `sideband` |
|
||||
@ -197,7 +229,13 @@ Follow the visual and font flow as defined by your game's design system.
|
||||
|
||||
#### Transition Effects (Optional)
|
||||
|
||||
create new node and add `transition`, `transition-scaler` component.
|
||||
##### Setup: Create Transition Node
|
||||
|
||||
1. **Create a new node** in your scene for the transition effect.
|
||||
2. **Add the following components** to this node:
|
||||
- `transition`
|
||||
- `transition-scaler`
|
||||
3. Configure the transition properties as required for your effect.
|
||||
|
||||

|
||||
|
||||
@ -216,7 +254,6 @@ create new node and add `transition`, `transition-scaler` component.
|
||||
|
||||

|
||||
|
||||
|
||||
**add preferrence**
|
||||
|
||||
Configure preferences as needed for your transition.
|
||||
|
Before Width: | Height: | Size: 5.5 KiB After Width: | Height: | Size: 3.1 KiB |
Before Width: | Height: | Size: 60 KiB After Width: | Height: | Size: 60 KiB |
Before Width: | Height: | Size: 63 KiB After Width: | Height: | Size: 9.0 KiB |
Before Width: | Height: | Size: 59 KiB After Width: | Height: | Size: 60 KiB |