Construct 3 Settings Menu (Most Common UI Elements) + Source Code

Download the source file from here:
https://drive.google.com/file/d/1QWE3...

Hi guys,
Hope you’re doing well!
Today we are going to talk about one of the fundamental subjects in the game making: User Interface. The role of UI in a game can’t be ignored and without it, a game would be meaningless. UI exists in every part of a game, from play button to level map, HUD, and level is done. In every part of a game, the user needs to see or change the information. Can you imagine the game “Super Mario” without a main menu and HUD? You can’t even start this amazing game without them!
Fortunately, UI has an almost similar rule in all games and the same ordinary things should be done. So learning how to implement it is not difficult. You should only read about UI standards and pay attention to some standard games’ UIs to understand what elements and how you should use them in your game.
If I want to tell you about the place we use UI in the games, I should say that it is necessary everywhere, except in the gameplay. In fact, UI is not a part of gameplay, but gameplay runs among some UI elements. The first place that these elements come from is the home page or main menu. On this page, our goal is to start a game, or maybe using some tools like activating or deactivating the music or SFX. Also, the user may want to see the leaderboard or buy from the shop. The next place that UI has a key role is HUD (the part of the game during gameplay that shows the statistics of the game on the screen - generally on top). In this section, the player observes the important information of the game including coins number or lives numbers. Also, pause and menu buttons are placed in this section so that by clicking on them, users may be transferred to another page or pop-up and they are in the game’s UI too! Finally, the player will win or lose and here we need UI for some buttons of retry or going to the next level again.
If I want to talk especially about this video, I should say that I have tried to instruct the most important and practical UI elements like Check Box, Radio Button, Toggle Button, Text Area, Progress Bar, Buttons and some more implemented in the settings menu. But you can use them in any place of the game that I have mentioned in the previous paragraph. Eventually, there is the source code of this tutorial for you to use or even develop.
Besides these subjects, you will be familiar with some features in the Construct 3 game engine that can help you so much for making better games in the future, including:
UI basics
Three types of button reactions (change frame/change color/change scale)
Checkboxes
Radio Buttons
Slider Bar
Progress Bar
Text Input (Textbox)
Tween
Changing Theme (light mode / dark mode)
Loading Spinner
Webfonts (woff/woff2 format)
Loading CSS file

Finally, as you know, DoonDookStudio’s team is always interested in sharing their information and knowledge in developing games with other eager people. Please help us to grow our network by sharing our content with your friends and subscribing to our channel. So we will meet new people and they will learn new things from us!

👉 Discord:   / discord  
Website: https://doondook.studio
YouTube:    / @doondookstudio1530  
Twitter:   / doondookstudio  
LinkedIn:   / doondook-studio  
Instagram:   / doondook.studio