diff --git a/docs/02-setup-main-game/05-main-scene.md b/docs/02-setup-main-game/05-main-scene.md index 270ffc1..e8f8c62 100644 --- a/docs/02-setup-main-game/05-main-scene.md +++ b/docs/02-setup-main-game/05-main-scene.md @@ -90,8 +90,6 @@ The setup is very straightforward by using the `Generate Panel` command in each ### UI Panel Overview -#### Available Layouts - The UI system supports both desktop and mobile layouts design. #### 🖥️ Desktop Layout @@ -103,62 +101,59 @@ The UI system supports both desktop and mobile layouts design. #### 📱 Mobile Layout The mobile interface adapts to both landscape and portrait orientations: -| Orientation | Preview | -|------------|----------| -| Landscape | ![Mobile Landscape](./img/05-main-scene/menu-landscape.png) | -| Portrait | ![Mobile Portrait](./img/05-main-scene/menu-portrait.png) | +| Orientation | Preview | +|-------------|----------| +| Landscape | ![Mobile Landscape](./img/05-main-scene/menu-landscape.png) | +| Portrait | ![Mobile Portrait](./img/05-main-scene/menu-portrait.png) | -### :one: **Add Prefabs For Desktop** +### UI Panel Desktop -#### Step 1: Setup Prefab Files +#### Step 1: Setup Prefab Editor -1. **Locate Required Prefabs** - - Find `ui-bottom-bar-panel` prefab - ![Locate Prefabs](./img/05-main-scene/add-texture-bottom-bar-prefab.png) +| Step | Action | image | +|------|---------|--------------| +| 1. Locate Prefab | Search for `ui-bottom-bar-panel` prefab | ![Locate Prefabs](./img/05-main-scene/add-texture-bottom-bar-prefab.png) | +| 2. Copy Assets | Navigate to `core/editor` directory | ![Copy UI Folder](./img/05-main-scene/add-texture-label-prefab.png) | +| 3. Place Assets | Copy / Paste to game assets location | ![Asset Placement](./img/05-main-scene/editor-texture-label-prefab.png) | -2. **Copy UI Assets** - - Go to **core/editor** directory - - Copy the `bottom-ui` folder - ![Copy UI Folder](./img/05-main-scene/add-texture-label-prefab.png) - -3. **Place Assets in Game Directory** - - Paste the copied `bottom-ui` folder - ![Asset Placement](./img/05-main-scene/editor-texture-label-prefab.png) +--- #### Step 2: Configure Prefabs -1. **Core Prefabs** - ![Directory Structure](./img/05-main-scene/add-texture-bottom-bar-prefab2.png) - -2. **Copied Prefab** - -At here: +##### Core Prefabs Structure +Navigate to the location where the prefabs: +![Directory Structure](./img/05-main-scene/add-texture-bottom-bar-prefab2.png) +##### Rename Prefabs +Rename the copied prefabs by removing unnecessary prefixes: | Prefix to Remove | Original Prefab Name | Final Name | -|-----------------|---------------------|------------| -| `template-new-` | `template-new-ui-bottom-bar-panel` | `ui-bottom-bar-panel` | -| `template-` | `template-button-auto-selection` | `button-auto-selection` | +|------------------|----------------------|------------| +| `template-new-` | `template-new-ui-bottom-bar-panel` | `ui-bottom-bar-panel` | +| `template-` | `template-button-auto-selection` | `button-auto-selection` | ![Prefab Naming Example](./img/05-main-scene/rename-prefab.png) +#### Customize *`button-auto-selection`* Label + +Use the `template-label-auto-selection` to customize the appearance of the label inside the `button-auto-selection` prefab. + +| Component | Description | +| -------------------- | ------------------------------------------------- | +| **Label Outline** | Add an outline to make the text stand out. | +| **Label Shadow** | Add a shadow for better contrast and readability. | +| -------------------- | ------------------------------------------------- | -#### Button Auto Selection Label -Use `template-label-auto-selection` to customize the `button-auto-selection`: -- Modify text color -- Add Label Outline component -- Add Label Shadow component ![Label Configuration Options](./img/05-main-scene/option-for-label.png) -#### Ui Bottom Bar Panel Label +#### Customize *`ui-bottom-bar-panel`* Label Use `template-label-title` to customize the `ui-bottom-bar-panel`: -:::tip -[Detailed configuration the same Button Auto Selection Label](#button-auto-selection-label) +:::info +*[Follow the same configuration as Button Auto Selection Labels](#customize-button-auto-selection-label)* +**Bottom bar labels include a localization component for multi-language support** ::: -Bottom bar labels include a localization component for multi-language support: -![[Localization Component](./img/05-main-scene/component-locale.png) -#### FormatText +![component-locale](./img/05-main-scene/component-locale.png) The `FormatText` property controls text formatting behavior for label components: @@ -167,27 +162,112 @@ The `FormatText` property controls text formatting behavior for label components | `default` | Initial formatting state | `false` | | `notify` | Formatting update callback | Updates when value changes | +--- +#### Step 3: Setup Ui In Main Scenes -#### Step 3: Apply Textures +Create the following node configuration in your main scene: +![main scenes](./img/05-main-scene/prepare-ui-bottom-bar.png) -1. **Run the Helper Tool** - - Open the UI Desktop Helper - - Select texture assignment options - ![Helper Tool](./img/05-main-scene/run-ui-desktop-helper.png) +##### Platform Node Spawner Settings -2. **Verify Results** +| Setting | Value | Description | +|---------|-------|-------------| +| Desktop Toggle | ✓ Enabled | Show prefabs for desktop platform | +| Mobile Toggle | ☐ Disabled | Hide prefabs for mobile platform | +| Target Prefab | `ui-bottom-bar-panel` | References prefab | + +#### Step 4: Apply Textures + +##### Texture Button Bar +✅ Checklist assets completed for bottom UI and button UI text +🔗 [Follow is by Complete Assets Structure Guide](http://localhost:3000/docs/category/game-asset-structure): + ![main scenes](./img/05-main-scene/prepare-ui-bottom-bar.png) + +##### Run the Helper Tool +- Open the UI Desktop Helper +- Select texture assignment options +![Helper Tool](./img/05-main-scene/run-ui-desktop-helper.png) + +##### Verify Results - **Auto Selection Component** - ![Auto Selection Result](./img/05-main-scene/result-btn-auto-selection.png) +*Auto Selection* +![Auto Selection Result](./img/05-main-scene/result-btn-auto-selection.png) - **Bottom Bar Component** - ![Bottom Bar Result](./img/05-main-scene/result-buttom-bar.png) +*Bottom Bar* +![Bottom Bar Result](./img/05-main-scene/result-buttom-bar.png) -:::tip Success Verification -✔️ Check all textures are correctly mapped -✔️ Verify button states display properly -✔️ Confirm UI layout matches design -::: +--- + +### UI Panel Mobile + +#### Step 1: Setup Prefab +| Step | Action | image | +|------|---------|--------------| +| 1. Locate Prefab | Search for `mobile-ui` prefab | ![Locate Prefabs](./img/05-main-scene/search-mobile-ui.png) | +| 2. Place Assets | Copy to game assets location | ![Asset Placement](./img/05-main-scene/mobile-ui-prefab.png) | +| 3. Locate Prefab | Search for `buy-feature` prefab | ![Locate Prefabs](./img/05-main-scene/buy-feature-bonus-mobile.png) | + +#### Step 2: Rename Prefabs +Rename the copied prefabs by removing unnecessary prefixes: +| Prefix to Remove | Final Name | +|------------------|----------------------| +| `template-` |![Prefab Naming Example](./img/05-main-scene/result-rename-mobile.png) | + +#### Step 3: Setup Ui In Main Scenes + +Create the following node configuration in your main scene: +![main scenes](./img/05-main-scene/set-positon-mobile-ui.png) + +##### Platform Node Spawner Settings + +| Setting | Value | Description | +|---------|-------|-------------| +| Mobile Toggle | ✓ Enabled | Show prefabs for mobile platform | +| Desktop Toggle | ☐ Disabled | Hide prefabs for desktop platform | +| Target Prefab | `mobile-ui` | References prefab | + +#### Step 4: Apply Textures + +##### Texture Mobile Ui +✅ Checklist assets completed for Mobile UI +🔗 [Follow is by Complete Assets Structure Guide](http://localhost:3000/docs/category/game-asset-structure): + ![main scenes](./img/05-main-scene/add-texture-mobile-ui.png) + +##### Run the Helper Tool +- Open the UI Mobile Helper +- Select texture assignment options +![Helper Tool](./img/05-main-scene/run-ui-mobile-helper.png) + +##### Results + +*main ui button added textures* +| ![Auto Selection Result](./img/05-main-scene/result-mobile-button.png) | + + +#### Step 4: Setup Color For Menu Mobile UI + +*Gerenal picker color* using `helper-paint-color-ui-mobile` +| ![Auto Selection Result](./img/05-main-scene/result-mobile-ui.png) | ![Auto Selection Result](./img/05-main-scene/set-color-menu-ui.png) | +|---------|-------| + +|Ordinal number| Properties | Explaination | Example | +|--------------|------------|--------------|---------| +|1 | **Main Ui Normal Color** | pick color: #45AEFF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/buy.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/close.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/tru.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/cong.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/auto.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/balance.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/balance1.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/balance2.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/setting.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/paytable.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/rule.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/cheat.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/button-exit.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/icon-toggle.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/icon-toggle1.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/icon-toggle2.png)![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/icon-toggle3.png) | +|2 | **Main Ui Highlight Color** | pick color: #A8CBFF | ![Auto Selection Result](./img/05-main-scene/main-ui-highlight-color.png) | +|3 | **Toggle State Off Color** | pick color: #45AEFF | ![Auto Selection Result](./img/05-main-scene/toggle-off.png) | +|4 | **Toggle State On Color** | pick color: #A8CBFF | ![Auto Selection Result](./img/05-main-scene/toggle-on.png) | +|5 | **Background Info Page Color** | pick color: #000000 | ![Auto Selection Result](./img/05-main-scene/background-menu.png)| +|6 | **Background Menu Color** | pick color: #000000 | ![Auto Selection Result](./img/05-main-scene/background-menu.png) | +|7 | **Background Point Panel Color** | pick color: #000000 | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/background-win-point.png) | +|8 | **Background Bottom Bar Color** | pick color: #FFFFFF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/background-bottom-bar.png) | +|9 | **Button Quit Color** | pick color: #45AEFF | ![Auto Selection Result](./img/05-main-scene/btn-quit-game.png) | +|10 | **Button Cancel Color** | pick color: #616160 | ![Auto Selection Result](./img/05-main-scene/btn-cancel-game.png) |1 +|11 | **Label Balance Normal Color** | pick color: #7DFFDF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/win-point-color.png) | +|12 | **Label Balance Spin Color** | pick color: #FFFFFF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/spin-point-color.png) | +|13 | **Button Plus Minus Auto Color** | pick color: #FFFFFF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/btn-plus-minus-auto.png) | +|14 | **Label Start Auto Color** | pick color: #FFFFFF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/button%20start.png) | +|15 | **Label Outline Notification** | pick color: #FFFFFF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/outline-notifcation.png) | +|16 | **Total Win Medium Win Color** | pick color: #FFFFFF | ![Auto Selection Result](./img/05-main-scene/image-for-mobile-ui-helper/win-point-special-color.png) | --- diff --git a/docs/02-setup-main-game/img/05-main-scene/add-texture-mobile-ui.png b/docs/02-setup-main-game/img/05-main-scene/add-texture-mobile-ui.png new file mode 100644 index 0000000..ed1e670 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/add-texture-mobile-ui.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/background-bottom-bar.png b/docs/02-setup-main-game/img/05-main-scene/background-bottom-bar.png new file mode 100644 index 0000000..28db2ae Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/background-bottom-bar.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/background-menu.png b/docs/02-setup-main-game/img/05-main-scene/background-menu.png new file mode 100644 index 0000000..6d1794c Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/background-menu.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/background-point-menu.png b/docs/02-setup-main-game/img/05-main-scene/background-point-menu.png new file mode 100644 index 0000000..94b65c9 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/background-point-menu.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/btn-cancel-game.png b/docs/02-setup-main-game/img/05-main-scene/btn-cancel-game.png new file mode 100644 index 0000000..e2d9345 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/btn-cancel-game.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/btn-quit-game.png b/docs/02-setup-main-game/img/05-main-scene/btn-quit-game.png new file mode 100644 index 0000000..2c1d535 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/btn-quit-game.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/buy-feature-bonus-mobile.png b/docs/02-setup-main-game/img/05-main-scene/buy-feature-bonus-mobile.png new file mode 100644 index 0000000..79c1ede Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/buy-feature-bonus-mobile.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/auto.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/auto.png new file mode 100644 index 0000000..4153528 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/auto.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background info.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background info.png new file mode 100644 index 0000000..6cac771 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background info.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background-bottom-bar.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background-bottom-bar.png new file mode 100644 index 0000000..a4d1551 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background-bottom-bar.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background-win-point.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background-win-point.png new file mode 100644 index 0000000..717d4b6 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/background-win-point.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance.png new file mode 100644 index 0000000..4b69dc6 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance1.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance1.png new file mode 100644 index 0000000..f43731d Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance1.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance2.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance2.png new file mode 100644 index 0000000..ff8bdfb Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/balance2.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/btn-plus-minus-auto.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/btn-plus-minus-auto.png new file mode 100644 index 0000000..66c86ef Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/btn-plus-minus-auto.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/button start.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/button start.png new file mode 100644 index 0000000..1a17d54 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/button start.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/button-exit.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/button-exit.png new file mode 100644 index 0000000..a2696f1 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/button-exit.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/buy.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/buy.png new file mode 100644 index 0000000..acd77cf Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/buy.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cancel-exit.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cancel-exit.png new file mode 100644 index 0000000..86efc34 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cancel-exit.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cheat.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cheat.png new file mode 100644 index 0000000..991b10e Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cheat.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/close.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/close.png new file mode 100644 index 0000000..bc2495b Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/close.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cong.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cong.png new file mode 100644 index 0000000..e4b99ce Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/cong.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/exit.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/exit.png new file mode 100644 index 0000000..a300a49 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/exit.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle.png new file mode 100644 index 0000000..cc402f2 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle1.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle1.png new file mode 100644 index 0000000..1b7beeb Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle1.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle2.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle2.png new file mode 100644 index 0000000..b54fc3d Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle2.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle3.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle3.png new file mode 100644 index 0000000..35d215c Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/icon-toggle3.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/outline-notifcation.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/outline-notifcation.png new file mode 100644 index 0000000..4c8827c Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/outline-notifcation.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/paytable.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/paytable.png new file mode 100644 index 0000000..01e88e7 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/paytable.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/rule.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/rule.png new file mode 100644 index 0000000..8543d34 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/rule.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/setting-helper-color.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/setting-helper-color.png new file mode 100644 index 0000000..d575fa5 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/setting-helper-color.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/setting.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/setting.png new file mode 100644 index 0000000..76a8149 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/setting.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/spin-point-color.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/spin-point-color.png new file mode 100644 index 0000000..b21307c Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/spin-point-color.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/tru.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/tru.png new file mode 100644 index 0000000..4efa453 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/tru.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-button.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-button.png new file mode 100644 index 0000000..26b84d8 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-button.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-point-color.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-point-color.png new file mode 100644 index 0000000..c053ae9 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-point-color.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-point-special-color.png b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-point-special-color.png new file mode 100644 index 0000000..d6b0f6b Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/image-for-mobile-ui-helper/win-point-special-color.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/in-scenes-game.png b/docs/02-setup-main-game/img/05-main-scene/in-scenes-game.png new file mode 100644 index 0000000..84b837d Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/in-scenes-game.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/label-color-balance.png b/docs/02-setup-main-game/img/05-main-scene/label-color-balance.png new file mode 100644 index 0000000..3d56b54 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/label-color-balance.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/main-ui-highlight-color.png b/docs/02-setup-main-game/img/05-main-scene/main-ui-highlight-color.png new file mode 100644 index 0000000..fde61e7 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/main-ui-highlight-color.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/mobile-ui-prefab.png b/docs/02-setup-main-game/img/05-main-scene/mobile-ui-prefab.png new file mode 100644 index 0000000..a832b2c Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/mobile-ui-prefab.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/option-for-label.png b/docs/02-setup-main-game/img/05-main-scene/option-for-label.png index c16cccc..ede9f6f 100644 Binary files a/docs/02-setup-main-game/img/05-main-scene/option-for-label.png and b/docs/02-setup-main-game/img/05-main-scene/option-for-label.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/result-mobile-button.png b/docs/02-setup-main-game/img/05-main-scene/result-mobile-button.png new file mode 100644 index 0000000..be0a52d Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/result-mobile-button.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/result-mobile-ui.png b/docs/02-setup-main-game/img/05-main-scene/result-mobile-ui.png new file mode 100644 index 0000000..871f310 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/result-mobile-ui.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/result-rename-mobile.png b/docs/02-setup-main-game/img/05-main-scene/result-rename-mobile.png new file mode 100644 index 0000000..d60ef2e Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/result-rename-mobile.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/run-ui-mobile-helper.png b/docs/02-setup-main-game/img/05-main-scene/run-ui-mobile-helper.png new file mode 100644 index 0000000..74238f8 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/run-ui-mobile-helper.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/search-mobile-ui.png b/docs/02-setup-main-game/img/05-main-scene/search-mobile-ui.png new file mode 100644 index 0000000..4496a33 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/search-mobile-ui.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/set-color-menu-ui.png b/docs/02-setup-main-game/img/05-main-scene/set-color-menu-ui.png new file mode 100644 index 0000000..0748a58 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/set-color-menu-ui.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/set-positon-bottom-bar.png b/docs/02-setup-main-game/img/05-main-scene/set-positon-bottom-bar.png new file mode 100644 index 0000000..96e295c Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/set-positon-bottom-bar.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/set-positon-mobile-ui.png b/docs/02-setup-main-game/img/05-main-scene/set-positon-mobile-ui.png new file mode 100644 index 0000000..c36a666 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/set-positon-mobile-ui.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/toggle-off.png b/docs/02-setup-main-game/img/05-main-scene/toggle-off.png new file mode 100644 index 0000000..a87a28b Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/toggle-off.png differ diff --git a/docs/02-setup-main-game/img/05-main-scene/toggle-on.png b/docs/02-setup-main-game/img/05-main-scene/toggle-on.png new file mode 100644 index 0000000..78d8234 Binary files /dev/null and b/docs/02-setup-main-game/img/05-main-scene/toggle-on.png differ