Game UI Editor Integration in Horror Game Kit 1.5!

Hello Creators, Happly Halloween! :partying_face: :smiling_face_with_three_hearts: :jack_o_lantern:

We’re thrilled to share that Horror Game Kit 1.5 now integrates UI editor! Easily design and customize UI elements for a fresh visual experience, illustrating your own game style! Moreover, we are not just migrating the user interface from the Party Game Kit, we expand your UI options by importing packages from this pro game UI editor - FairyGUI, strive to continue your usage habits in order to enhance the design and efficiency of the UI.

Introducing UI editor

The UI editor empowers you to customize your game’s style, utilizing built-in UI elements to achieve basic UI effect layouts, and combining custom code logic with Lua scripting to implement more advanced personalized features. Furthermore, we provide access to the FairyGUI editor, which serves as an integrated editor for a wider range of UI design functions. It offers you an enhanced creative experience, allowing you to import and use external resources directly in Studio.

Benefits of UI editor

  • Enables creators to use built-in UI elements combined with code logic to achieve customized game styles.

  • Establishes a connection with FGUI, providing a quick entry for FGUI in the UI editor which enables the import and use of fui resources.

  • Lays the foundation for a transformative leap from no UI capabilities to code-free UI development.

  • Break down the barriers with UI editors from other engines.

  • Represents a pivotal advancement in bolstering the comprehensiveness of the YAHAHA Studio engine.

UI editor capabilities

The UI editor currently includes 9 built-in UI elements for creators to use, allowing creators to leverage these elements to design the game’s UI style. The overall workflow is simple and intuitive, with functionality similar to Microsoft PowerPoint and Keynote, effectively reducing the learning curve. You can design multiple canvases to interpret the effects of different game sections. Furthermore, each built-in UI element will have its own properties window for easy advanced settings by creators. Once your design is complete, you can use the preview feature to view the effects, facilitating modifications to the UI. Finally, when everything is ready, click export, and you can find UI package from Studio > My Resources for easy access and invocation by creators.

Currently, UI editor is still in the Beta version. Basic UI elements do not include logical configurations (e.g., displaying resources when clicking a button), which requires coordination with Lua script. Therefore, Horror Game Kit 1.5 supports low-level APIs (FairyGUI API&Resource Manage API), providing developers with more significant control over UI logic, making it easier for those familiar with Unity and FairyGUI to adapt.

Create the UI package in UI Editor&Using external FairyGUI

To learn more about the usage of the Yahaha UI editor and FairyGUI, please refer to the Yahaha official documentation website.

FGUI resources limitations for Studio

In YAHAHA Studio (Studio) you can import UI packages from FairyGUI, a cross-engine, designer-friendly UI editor to customize your user interfaces (UIs).

Currently, the following FairyGUI UI elements are not yet supported for import into Studio:

  • Skeletal animation

  • Loader(3D)

  • Fonts: Text created with FairyGUI must use fonts that Studio supports. For a list of all supported fonts in Studio, refer to fonts.

What’s ahead

Our roadmap is packed with exciting updates inspired by the new UI editor feature in Horror Game Kit. Here’s what you can look forward to:

  • Addition of Built-in UI Elements: Offering a wider range of UI elements to help you push the boundaries of your game’s design style.

  • Support for Built-in UI Element Alignment: Facilitating the achievement of more rational UI layouts.

  • Local UI File Management: The directory tree structure in Yahaha Studio can help you quickly locate, organize, and browse UI package files.

  • Provision of UI Templates: Assisting you in expanding design ideas and styles, while reducing the cost of creation.

  • Provision of Studio UI Projects: Enabling rapid UI reskinning and ensuring the output of high-quality UI resources without the need for coding.

Stay tuned for more updates, and happy game-making!

Your feedback is invaluable to us! We encourage community developers to continue sharing your suggestions and insights in this thread, or join our Discord server. Thanks for being awesome! :partying_face: :partying_face:

1 Like