Smart UI for Construct 3
A downloadable tool
First of all, thank you for your support and interest in the tool. I'm a solo game developer working on casual and educational games in Construct 3. Pixel Perfect Studio is my brand and my source of income. Seeing you interested in my work and products means the world to me! I really appreciate constructive feedback. If you dislike anything, please be open and constructive so that I can improve my work and products. Above all, I value the reviews you leave on any of my addons and games, as they encourage other developers to trust in what I do, which I’m really devoted to. I always put quality before quantity, and pour all my heart into everything I do.
You subscribed to the alpha testing of SmartUI. Big thanks!
The framework is freshly baked! It just came out of the oven. I’ve been testing it as thoroughly as one person can, and I’m eager to hear feedback from other devs. I really want to create something that lasts as long as possible, despite Scirra's breaking decisions, and that is reliable in the long term. I’m the most interested in this because SmartUI will be the foundation for all my upcoming games, as well as the upgrade for the existing ones.
The alpha testing period is totally free of charge, nevertheless this won't be the final product, and it will work for a limited period of time (Due on December 31st, 2024) although the testing period closes earlier on October 31st, 2024. It means you can create test projects, play with the addons, push them to the limit to see if they break, and conclude if you can create something awesome. In the end, that project will perish, so I encourage you to keep it small for now, until the beta comes. Beta testing phase will be open for everyone, and by then, SmartUI will already have a selling price, so this is a great opportunity for you.
Some important highlights:
- SmartUI runs at version r407 and higher.
- Worker mode is not enabled in this version, nor advanced minification.
- Alpha version of SmartUI has an external dependency file. The framework is served from a CDN, therefore you need a connection to internet at all time.
- You can export your projects to Web apps, but will be able to run them only from a localhost server.
- The source code is obfuscated, you won't be able to access it. The reason behind this is that my work as already been pirated in the past, including plugins. Nobody wants to give is hard-worked products for free, there's always a monetary interest. In the end, I make my living out of this.
- If you have questions about the design behind the tool, or how I tackled some challenges, I'm more than happy to talk about it and share what I've learned with the community.
- SmartUI has some restrictions and features you must be aware of, please visit the official documentation site, there's also some tutorial videos available. https://smartui-docs.pixelperfectstudio.mx/
- I have a discord server for my work, and I've created a private channel to talk about the tool. You can join during the testing phase, send your feedback and concerts directly to me if you'd like. You can leave afterwards if you want. https://discord.gg/k2hWBVndPV
- If you find a bug, it's really important for me to have a minimum project and the exact set of steps to recreate it. I really appreciate if you can report it in github, so that I can resolve them offline. https://github.com/sotano42/Smart-UI
Smart UI is a framework and set of addons designed to simplify UI design and development in the Construct 3 game engine. One of Construct 3's weakest features is UI design, as it relies entirely on HTML/CSS, which tends to perform poorly when exported to the Cordova wrapper. As a result, many developers have opted to create their own UI systems using sprites and custom ACEs within the engine to achieve the desired behavior. However, the main drawback of this approach is its low portability, as Construct lacks the prefab capabilities provided by other engines, limiting reuse. This challenge led to the development of Smart UI, a plug-and-play set of addons that can be included in any world instance to function as specific UI components.
All the addons were built with support for the following features/capabilities:
- UI composition and navigation based on the Object Hierarchy/Scene Graph.
- Long-term compatibility with native Construct 3 SDK features.
- Container-based interactions for managing component focus, document flow, and default actions, as well as grouping components to create operational contexts.
- Focus management, sibling interactions, and clipping based on containers and views.
- Modal and non-modal dialog windows.
- Load/Save game states.
- zIndex-based interactivity to respond to the top-most valid components.
- Flexibility for custom design.
- Simple implementation and easy-to-understand ACEs.
- Advanced minification using UglifyJS (Closure Compiler is not supported).
- Worker mode support for all addons.
SmartUI includes 12 addons to fulfill your UI needs. In combination, they can create powerful and complex UI's, and provide an instant polished feel to your games.
SmartUI addon integration fully depends on Construct 3 object hierarchy. For composite addons like dialogs, scrollbars, scrolviews and gridlayouts, their sub-components and children must be children of the main component.
By design, you can only add one SmartUI behavior to your instances.
Addon | Description | Type |
---|---|---|
Smart UI | Loads the framework and enables the SmartUI addons to communicate with Construct 3. | Single Global Plugin |
Push Buttons | React to user mouse/touch interactions with custom animations and easings. | Behavior |
Check Boxes | Lets you manage boolean values by toggling the check state. Also includes custom animations and easings. | Behavior |
Radio Buttons | Under the same operational context, allows you to select only one object within the group. | Behavior |
Discrete Progress | Under the same operational context, represent an integer value within a group of sprites, distributing the number within the available parts of a sprite. | Behavior |
Progress Bars | Represent a discrete value in a bar. Provides custom animations and easings when setting the value. | Behavior |
Scroll Bars | Behaves like a slider or a scrollbar, the last if the object is composed with additional buttons in the layout. Handles float and integer values in a range. | Behavior |
Containers | Group objects and create operational context for their siblings. Manages navigation, focusing and event propagation to its children. | Behavior |
Dialogs | A complex composite object that behaves like a dialog window, with modal capabilities. Can be maximized, minimzed, or closed like a regular dialog and has custom animations and easings. | Behavior |
Grid Layout | Composite object that lays out your existing scene objects, or Renders objects in a grid layout from a datasource. When using a datasource, it triggers data-render requests. | Behavior |
Scroll View | Composite object that renders all its children within a viewport. | Behavior |
Data Listener | Reacts to data-render request from components, allowing you to decide what to do with the provided data. This behavior can co-exist in the same instance that has a SmartUI behavior. | Behavior |
Status | In development |
Category | Tool |
Release date | 77 days ago |
Author | Pixel Perfect Studio |
Made with | Construct |
Tags | Buttons, construct, Construct 2, construct-3, construct-addons, smart-ui, ui-design, User Interface (UI) |
Links | Homepage, Community, Documentation |
Download
Click download now to get access to the following files:
Development log
- Beta Launch in Progress57 days ago
- Smart UI Multilanguage Support for ACEs70 days ago