MilesMouse
patreon
Progress Report 6/24/2022
🕑 Added 2022-06-24 21:52:01 +0000 UTCIt's so hot... I'm melting... meeeltiiiing! Here's what I got done this week:
- Created a modular grid of buttons for the Giantess menu
- Made color selections for the Giantess menu
- Spent WAY too much time giving scroll functionality to the Giantess menu
What's this "Giantess menu", you ask? Well, I was planning on writing it as "Mystery Menu G" and keeping you guys in suspense, but this one is gonna take me a while. So without further ado, this is what I have of the Giantess Menu so far:
Or as I should call it, the Giantess Customization menu. This feature has been swirling around in my head since the beginning of the project, and it's... sort of happening! I mean, it's a start, right?
The thing that hung me up the most this week was not the scroll functionality (but boy did I lose some years of my life on that one), but the design of the color selection. For context, this is basically a dress-up game within Run From Me. You're gonna be able to change the giantess's's's clothes, her skin tone, her facial expressions, the whole lot. It's a huge undertaking that requires careful planning and -- you guessed it! -- very solid UI design.
So, I want the player to be able to change the colors of the clothes and skin and whatnot. However, how much power do I want the player to have? Should there be a grid of preset colors to choose from?
(Let's just pretend the squares aren't all white)
That looks good, but it severely limits the color selection and thus the creativity of the player. So what if I give them the option of every single color using three sliders correlating with red, blue, and green? It works in games like Stardew Valley, after all.
It looks good, it's compact, and it offers every color under the sun. However, from my experience, it's a bit tricky to get the right color out of these. You think you need more blue when you actually need to decrease red and now your character looks like a smurf... Well, anyways, let's put a pin in that one for now.
There's another option to offer every single color in the spectrum using Godot's built-in color picker:
It's not exactly pretty to look at, and it's far from compact. That's okay, though! With the black magic of programming, I was able to modify it to look much more professional!
And you know what? That's not half bad! This was the design I stuck with for most of the week while I worked on other menu pieces (*cough cough* scrolling *cough cough*). Unfortunately, being the perfectionist that I am, I couldn't get past how bulky the whole thing is. The less the player needs to scroll to get to all the menu components, the better.
I lay in bed one night, unable to stop thinking about this. How do I make it more compact? Do I even need to make it compact? Wait... what if I just took all the color stuff... and pushed it somewhere else?
And instead of a button for each color element (skin tone, eye color, etc.), I could just have a paint brush tool that lets you change the color of any body part/clothing by clicking on it once!
Despite my excitement, this idea had its faults. For example, how would you color her nails? You'd have to be nearly pixel perfect with that brush. Not to mention I'm not even sure how I'd implement that kind of system.
Every idea has had its pros and cons. I wanted to give the player access to every color with a UI that's compact and easy to use. It's not that tall of an order, but every method I've attempted failed in at least one of those areas...
I thought about it for hours and hours, trying to envision the perfect solution in my mind. Finally, right when I was about to wrap up yesterday, it hit me: what about a button that opens up to the color picker?
And wouldn't you know it, there's literally a node in Godot called "color picker button".
Huh... I wish I'd known about this sooner. That's basically perfect! The only issue is that clicking on it opens up the default color picker with all the sliders and whatnot. I can worry about that later, though, since I know that I can fix it.
As for the scrolling... I'll keep it short. VBoxContainers, HBoxContainers, ScrollContainers, TabContainers... I had containers inside of containers inside of containers, and each one controlled certain elements of everything within it. The biggest hurdle for me was the fact that "size" was one of those elements that I could no longer change, but "minimum size" is. It was all a big mess and overall rather unintuitive in my opinion. I don't know why game engines struggle with UI design so much sometimes... I say after spending a week making a color button. :x
The best part is that you can't even see the scroll bar right now since I successfully made everything compact. Irony at its finest...
Anyways, I don't know about you guys, but I'm parched in this heat, and the only thing that can quench my thirst is Taco Bell. I'll see you guys in two weeks, after my week off! Until then, stay safe and stay cool! :)
Comments
Do you guys like really detailed progress reports like this one, or do you prefer if I keep the details at a minimum unless it's about something particularly interesting? :)
