{"id":26916925,"url":"https://github.com/blacksentrydevxo/ui-onboarding-tutorial-mask-system-unity","last_synced_at":"2025-06-17T03:37:13.821Z","repository":{"id":283552945,"uuid":"952147157","full_name":"BlackSentryDevXo/UI-Onboarding-Tutorial-Mask-System-Unity","owner":"BlackSentryDevXo","description":"A simple UI onboarding tutorial system for Unity that allows for guiding the player through the UI of your game.  It's build with lexibility and is well optimized for performace","archived":false,"fork":false,"pushed_at":"2025-03-23T20:34:18.000Z","size":834,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-01T19:56:32.706Z","etag":null,"topics":["gamedev","unity","unityui"],"latest_commit_sha":null,"homepage":"","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/BlackSentryDevXo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-03-20T20:06:43.000Z","updated_at":"2025-03-28T17:59:13.000Z","dependencies_parsed_at":"2025-03-20T22:04:10.646Z","dependency_job_id":"0852f52e-bb1b-49fb-87ad-b4690f9ebba0","html_url":"https://github.com/BlackSentryDevXo/UI-Onboarding-Tutorial-Mask-System-Unity","commit_stats":null,"previous_names":["blacksentrydevxo/ui-tutorial-mask-system-unity","blacksentrydevxo/ui-obboarding-tutorial-mask-system-unity"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/BlackSentryDevXo/UI-Onboarding-Tutorial-Mask-System-Unity","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlackSentryDevXo%2FUI-Onboarding-Tutorial-Mask-System-Unity","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlackSentryDevXo%2FUI-Onboarding-Tutorial-Mask-System-Unity/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlackSentryDevXo%2FUI-Onboarding-Tutorial-Mask-System-Unity/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlackSentryDevXo%2FUI-Onboarding-Tutorial-Mask-System-Unity/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BlackSentryDevXo","download_url":"https://codeload.github.com/BlackSentryDevXo/UI-Onboarding-Tutorial-Mask-System-Unity/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlackSentryDevXo%2FUI-Onboarding-Tutorial-Mask-System-Unity/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260286499,"owners_count":22986599,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["gamedev","unity","unityui"],"created_at":"2025-04-01T19:50:08.488Z","updated_at":"2025-06-17T03:37:13.800Z","avatar_url":"https://github.com/BlackSentryDevXo.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# 🎮 Unity UI Tutorial System\n\nA **fully customizable, dynamic UI tutorial system** for Unity that helps guide players by highlighting buttons, displaying tooltips, and managing tutorial sequences. This system is designed to be **modular**, **scalable**, and **easy to integrate** into any game project.\n\n## ✨ Preview\n   https://github.com/user-attachments/assets/01dd8ff6-89cd-4f7b-9308-72f4a0b2855b\n\n## ✨ Features\n- **Dynamic Tutorial Sequences** – Easily create and manage multiple tutorial sequences.\n- **Auto-Generated Enums** – Automatically generate `ButtonID` and `SequenceID` enums from ScriptableObjects.\n- **Button Highlighting** – Focuses on buttons and makes them stand out during tutorials.\n- **Customizable Tooltips** – Position tooltips near buttons dynamically.\n- **Event-Based System** – Hooks into Unity UI buttons with event-driven interactions.\n- **Editor Integration** – Simple tools to manage tutorials from the Unity Editor.\n\n---\n\n## 📥 Installation \u0026 Setup\n### 1️⃣ Clone the Repository\n```bash\ngit clone https://github.com/BlackSentryDevXo/UI-Onboarding-Tutorial-Mask-System-Unity.git\n```\n\n### 2️⃣ Import into Unity\n- Open your Unity project.\n- Drag and drop the `TutorialSystem` folder into your `Assets` directory.\n\n### 3️⃣ Add the `UITutorialManager` to Your Scene\n1. Create an empty GameObject and name it **`UITutorialManager`**.\n2. Attach the **`UITutorialManager.cs`** script.\n3. Assign:\n   - **Overlay Panel** (to dim the screen during tutorials).\n   - **Tooltip Prefab** (for showing instructions).\n   - \u003cimg width=\"964\" alt=\"Screenshot 2025-03-20 at 7 56 01 PM\" src=\"https://github.com/user-attachments/assets/e9e8ad5b-2aa4-467d-bbfc-a241493716ee\" /\u003e\n  \n### 4️⃣ Define Your Buttons\n1. Create a `ScriptableObject` for buttons:\n   - **Go to** `Assets \u003e Create \u003e UI \u003e Buttons DB`\n   - Name it `ButtonsDatabase`.\n   - Add the button names.\n   - Click `Generate Enum` (or use `Tools \u003e ButtonID Enum Generator`).\n   \u003cimg width=\"624\" alt=\"Screenshot 2025-03-20 at 7 57 39 PM\" src=\"https://github.com/user-attachments/assets/9f281ad2-16fe-477f-aca3-d93646a2cda4\" /\u003e\n   \u003cimg width=\"513\" alt=\"Screenshot 2025-03-20 at 7 56 44 PM\" src=\"https://github.com/user-attachments/assets/5c7a7573-9449-41b5-a8c6-cb1d7677e020\" /\u003e\n\n2. **IMPORTANT!!** Add UIButton.cs to every button you want highlighted\n3. **IMPORTANT!!** For every button you want highlighted, Assign `ButtonID` to each UI button in the Inspector.\n\n\n### 5️⃣ Create Tutorial Sequences\n1. **Go to** `Assets \u003e Create \u003e UI \u003e SequenceID DB`.\n2. Add a new `SequenceDatabase`.\n3. List the tutorial sequence names.\n4. Click `Generate Enum`.\n5. Assign tutorial sequences in `UITutorialManager`.\n   \u003cimg width=\"624\" alt=\"Screenshot 2025-03-20 at 7 57 39 PM\" src=\"https://github.com/user-attachments/assets/423380f4-3fd5-436e-b828-b482f1dfe5d0\" /\u003e\n   \u003cimg width=\"510\" alt=\"Screenshot 2025-03-20 at 7 56 57 PM\" src=\"https://github.com/user-attachments/assets/78338707-71cf-4a11-9a38-65fa76a886f5\" /\u003e\n\nYour Tutorial manager should look something like this when everything is well setup\n   \u003cimg width=\"496\" alt=\"Screenshot 2025-03-20 at 7 53 50 PM\" src=\"https://github.com/user-attachments/assets/8a479f78-052b-40d1-89d6-5c0d0e98705a\" /\u003e\n\n### 6️⃣ Install `NaughtyAttributes` (Optional)\nTo take advantage of enhanced Inspector UI flexibility, install the **NaughtyAttributes** package:\n- **Download from GitHub**: [NaughtyAttributes Repository](https://github.com/dbrizov/NaughtyAttributes)\n- **Import into Unity** via Package Manager.\n- This allows for better Inspector usability in the project.\n\n---\n\n## 📌 How to Use\n### 🎯 Starting a Tutorial\nCall the `StartTutorial` function with a `SequenceID`:\n```csharp\nUITutorialManager tutorialManager = FindObjectOfType\u003cUITutorialManager\u003e();\ntutorialManager.StartTutorial(SequenceID.seq_shop);\n```\n\n### 🎯 Highlight a Button with a Tooltip\n```csharp\ntutorialManager.FocusOnButton(ButtonID.shop, \"Click here to open the shop!\");\n```\n\n### 🎯 Ending a Tutorial\n```csharp\ntutorialManager.EndTutorial();\n```\n---\n\n## 🛠️ Customization\n### 🖊️ Modify Tooltip Appearance\n- Edit the **TooltipUI Prefab** to change text styles, colors, or animations.\n- Modify `TooltipUI.cs` to change how tooltips position themselves.\n\n### ⚡ Add Custom Logic to Steps\nEach step can execute custom logic using the `OnStepCompleted` event:\n```csharp\nvar step = new UITutorialStep { \n    buttonID = ButtonID.shop,\n    message = \"Click here to open the shop!\",\n    OnStepCompleted = () =\u003e Debug.Log(\"Shop button clicked!\")\n};\n```\n### Here are some visuals of how a well setup project should look like in action\n   \u003cimg width=\"289\" alt=\"Screenshot 2025-03-20 at 7 54 55 PM\" src=\"https://github.com/user-attachments/assets/84fc3a92-5012-417c-8d7d-a1e7a8981b15\" /\u003e\n   \u003cimg width=\"289\" alt=\"Screenshot 2025-03-20 at 7 55 22 PM\" src=\"https://github.com/user-attachments/assets/b5fa6760-a802-4a99-8d14-24a88390085b\" /\u003e\n\n\n### 🎛️ Adjust Button Highlight Effects\nModify `UIButton.cs` to change how buttons are visually highlighted during a tutorial.\n\n---\n\n## 🤝 Contributing\nWe welcome contributions! Feel free to **fork** the project, submit **pull requests**, or **report issues**.\n\n### ✅ How to Contribute\n1. **Fork the repository**.\n2. **Create a new branch** (`feature/tutorial-improvement`).\n3. **Make your changes \u0026 commit**.\n4. **Push the branch \u0026 open a PR**.\n\n---\n\n## 📅 Future Improvements\n- **👀 UI Animation System** – Add smooth transitions for highlighting buttons.\n- **📖 Localization Support** – Multi-language support for tutorials.\n- **📊 Analytics Integration** – Track tutorial completion rates.\n\n---\n\n## 📜 License\nThis project is licensed under the **MIT License**. Feel free to use and modify it!\n\n---\n\n## 👏 Credits\nDeveloped by **Black Sentry**. Inspired by various UI tutorials in the gaming industry.\n\n---\n\n## ⭐ Support the Project\nIf you find this useful, **give it a ⭐ on GitHub**! 🚀\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblacksentrydevxo%2Fui-onboarding-tutorial-mask-system-unity","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblacksentrydevxo%2Fui-onboarding-tutorial-mask-system-unity","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblacksentrydevxo%2Fui-onboarding-tutorial-mask-system-unity/lists"}