Skip to content

Commit 2f4fe68

Browse files
Update README.md
1 parent ef4eebc commit 2f4fe68

1 file changed

Lines changed: 8 additions & 9 deletions

File tree

README.md

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -30,17 +30,14 @@ git clone https://github.com/BlackSentryDevXo/UI-Obboarding-Tutorial-Mask-System
3030
- **Tooltip Prefab** (for showing instructions).
3131
- <img width="964" alt="Screenshot 2025-03-20 at 7 56 01 PM" src="https://github.com/user-attachments/assets/e9e8ad5b-2aa4-467d-bbfc-a241493716ee" />
3232

33-
<img width="496" alt="Screenshot 2025-03-20 at 7 53 50 PM" src="https://github.com/user-attachments/assets/8a479f78-052b-40d1-89d6-5c0d0e98705a" />
34-
35-
3633
### 4️⃣ Define Your Buttons
3734
1. Create a `ScriptableObject` for buttons:
3835
- **Go to** `Assets > Create > UI > Buttons DB`
3936
- Name it `ButtonsDatabase`.
4037
- Add the button names.
4138
- Click `Generate Enum` (or use `Tools > ButtonID Enum Generator`).
42-
<img width="624" alt="Screenshot 2025-03-20 at 7 57 39 PM" src="https://github.com/user-attachments/assets/9f281ad2-16fe-477f-aca3-d93646a2cda4" />
43-
<img width="513" alt="Screenshot 2025-03-20 at 7 56 44 PM" src="https://github.com/user-attachments/assets/5c7a7573-9449-41b5-a8c6-cb1d7677e020" />
39+
<img width="624" alt="Screenshot 2025-03-20 at 7 57 39 PM" src="https://github.com/user-attachments/assets/9f281ad2-16fe-477f-aca3-d93646a2cda4" />
40+
<img width="513" alt="Screenshot 2025-03-20 at 7 56 44 PM" src="https://github.com/user-attachments/assets/5c7a7573-9449-41b5-a8c6-cb1d7677e020" />
4441

4542
2. **IMPORTANT!!** Add UIButton.cs to every button you want highlighted
4643
3. **IMPORTANT!!** For every button you want highlighted, Assign `ButtonID` to each UI button in the Inspector.
@@ -52,9 +49,11 @@ git clone https://github.com/BlackSentryDevXo/UI-Obboarding-Tutorial-Mask-System
5249
3. List the tutorial sequence names.
5350
4. Click `Generate Enum`.
5451
5. Assign tutorial sequences in `UITutorialManager`.
55-
<img width="624" alt="Screenshot 2025-03-20 at 7 57 39 PM" src="https://github.com/user-attachments/assets/423380f4-3fd5-436e-b828-b482f1dfe5d0" />
56-
<img width="510" alt="Screenshot 2025-03-20 at 7 56 57 PM" src="https://github.com/user-attachments/assets/78338707-71cf-4a11-9a38-65fa76a886f5" />
52+
<img width="624" alt="Screenshot 2025-03-20 at 7 57 39 PM" src="https://github.com/user-attachments/assets/423380f4-3fd5-436e-b828-b482f1dfe5d0" />
53+
<img width="510" alt="Screenshot 2025-03-20 at 7 56 57 PM" src="https://github.com/user-attachments/assets/78338707-71cf-4a11-9a38-65fa76a886f5" />
5754

55+
Your Tutorial manager should look something like this when everything is well setup
56+
<img width="496" alt="Screenshot 2025-03-20 at 7 53 50 PM" src="https://github.com/user-attachments/assets/8a479f78-052b-40d1-89d6-5c0d0e98705a" />
5857

5958
### 6️⃣ Install `NaughtyAttributes` (Optional)
6059
To take advantage of enhanced Inspector UI flexibility, install the **NaughtyAttributes** package:
@@ -98,8 +97,8 @@ var step = new UITutorialStep {
9897
};
9998
```
10099
### Here are some visuals of how a well setup project should look like in action
101-
<img width="289" alt="Screenshot 2025-03-20 at 7 54 55 PM" src="https://github.com/user-attachments/assets/84fc3a92-5012-417c-8d7d-a1e7a8981b15" />
102-
<img width="289" alt="Screenshot 2025-03-20 at 7 55 22 PM" src="https://github.com/user-attachments/assets/b5fa6760-a802-4a99-8d14-24a88390085b" />
100+
<img width="289" alt="Screenshot 2025-03-20 at 7 54 55 PM" src="https://github.com/user-attachments/assets/84fc3a92-5012-417c-8d7d-a1e7a8981b15" />
101+
<img width="289" alt="Screenshot 2025-03-20 at 7 55 22 PM" src="https://github.com/user-attachments/assets/b5fa6760-a802-4a99-8d14-24a88390085b" />
103102

104103

105104
### 🎛️ Adjust Button Highlight Effects

0 commit comments

Comments
 (0)