How to support MULTIPLE SCREEN sizes? | Construct 3 Tutorial
ฝัง
- เผยแพร่เมื่อ 18 มิ.ย. 2024
- Hey everyone, this is a quick Construct 3 Tutorial on How to support multiple screen sizes on mobile.
This is a frequent issue we face when developing games for mobile. Phones come in different sizes and have crazy ratios for their screen, so in this tutorial I tell you how to configure your game to make sure it scales properly regardless of the size of the screen. I took the opportunity to talk a little bit about Resolution, Aspect Ratio and the difference between the two so if you have ever felt confuse with those terms this video is for you.
Check it out and be sure to let me know if you use it in your game.
😻 Wishlist my upcoming game Nekopirate 🏴☠️ on Steam: store.steampowered.com/app/22...
🐰 Play A Pretty Odd Bunny here:
Nintendo Switch: www.nintendo.com/games/detail...
Xbox: www.xbox.com/en-us/games/stor...
PS4/PS5: store.playstation.com/en-us/c...
Steam: store.steampowered.com/app/14...
Poki: poki.com/en/g/a-pretty-odd-bunny
Android: play.google.com/store/apps/de...
IOS: apps.apple.com/us/app/a-prett...
Nekopirate is a story driven action-platformer featuring short challenging levels, colorful graphics and a heartfelt story. Nekopirate is currently in development.
Visit my site: ajordaz.com/
Follow me on Twitter: / ajordazdev - เกม
Oh it's my favorite game! I love it...
It's design and story is perfect!
🎉
Very nice video! I would also suggest to use the "anchor" behavior on ui elements such as on screen buttons for moving left and right, jumping etc. This will help keeping the controls at the same distance from the screen edges on devices like phones and tablets. I really enjoy following your gamedev journet in these video! See ya next time!
Absolutely! Thank you for adding that. The anchor behavior can help a lot to keep everything in place. Also big thanks for checking the video 💙
thanks, I didn't even know that behavior was a thing. I've been manually positioning stuff.
Though I wonder if you even want to use that if you're doing "scale outer", for example, on ultra wide screens if you move the HUD all the way to the left it'll be too far away to see easily.
Why not just 0 the parallax?
Good one. I always spend way too much time dealing with ratio and red. I use C3 for UI and sometimes user use ultra high density display which gonna make scaling really complicated. This tutorial is nice unless it's that.
I watched the video, it's a fine introduction to the topic, although I can't stress enough the fact that it's better to make the game with Scale Outer in mind first, rather than making it a later addition (especially regarding placement of the HUD elements, you might want to adapt their position with either Anchor or with the ViewportBottom/Top/Left/Right expressions as reference points), for not all games can be easily "widescreened" without issues depending on how they were made.
You're absolutely right. Now that most phones are ultra-wide we should implement this from the very beginning.
Yeah it's definitely important to consider it a lot.
Because you may have objects outside of normal view, that you don't expect to show up, especially if you're developing with a narrower monitor.
I think my next game I'll use scale outer. But I'm not sure if I should use "anchor" or not? Because on ultra wide monitors, all that HUD positioning will go to far too the sides and make it difficult to ever notice.
Thank you for the information it is very useful
Great to hear! Thanks
Thanks!
No problem
Great tutorial!
Appreciated it! I hope it's helpful.
Admin, let me ask: Is there a way to make the viewpoint rotate automatically when the player rotates the screen? And how does the Game Screen itself fill up the player's phone screen?
Yes, the Browser object has a condition to check if the game is on Portrait or Landscape mode. You can use that to tell the game to adjust to the screen. Move objects, etc. As for filling the whole screen, that's what this tutorial is for. Just need to make sure you have enough graphics for at least 21:9. The game will do the rest automatically.
Very nice. In this case, what are the sizes of your tilemap, character, and enemies?
Most of the sprites and background are for a 4k screen and then I resize them on engine.