Progress PWA: Responsive menus
This week I've been working on making a menu that transforms to fit any sort of screen ratio and size.
The idea of combining the previous project of Preact + Bulma CSS with Phaser was to be able to use traditional HTML/CSS techniques to do GUI and leave Phaser to deal with the game only. You can absolutely do GUI in Phaser, but I hoped it would be more efficient and less re-inventing the wheel to do this solution instead.
The changes in the menu layout is fully in CSS, only the scaling when the screen it too small is done in code. It could be done with CSS as well, but found the code solution to be smoother and less to write.
▶️ DTube
▶️ IPFS
What effect would it have on a pixel art GUI?
Should be fine, can style any way you like. When it re-arranges the layout for fit, it would stay pixel friendly. Perhaps the scaling for small screens would be undesirable though. In that case you could have different sizes and at certain screen size intervals switch between them. I do breakpoint switching for the first loading screen, I scale the image, but could as well use new images for each step.
I've decided to go for deciding on solutions and then let those solutions limit what type of game can be created. The possibilities are endless so figured this would be a good way to narrow them down :) Game has to work with the visible play area being very different for users, input can only be mouse or touch etc.
Yes, if we dabble into a territory too large for us, it's good to set up a camp so there's no risk to wander around aimlessly. Been there done that way too many times, specially as a gamedev hobbyist.
"RPG Platformer - what if I add that... which leads to that... and oh my god this would be so cool... gonna make it online... with a brand new dungeon system design for a mmo with instanced 8-player quests... yes... no wait. Nvm, too big for me, project dead."
Congratulations @smjn! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :
Click here to view your Board
If you no longer want to receive notifications, reply to this comment with the word
STOPTo support your work, I also upvoted your post!