Shark
patreon
About the UI (and next update timeframe)
🕑 Added 2021-10-29 22:47:53 +0000 UTCAlright, so-
Let me get the most important thing out of the way: next update is coming next week. I wanted to get it done this week, but couldn't. Why? Allow me to explain the exciting why with this post! I am re-doing, for the last time, that butt-ugly UI!
This is a long post, fuck it's more like an article at this point, but feel free to skip to the images if you just want to look at the new UI!
Current UI was never meant to last
Now, the UI of PtA so far has been very utilitarian. Form over function. The reason why is because the game had just begun developing, so wasting time beautifying it without it even properly working would be a waste of time. So, I designed the UI to simply work. And it barely even did that at time, thanks to Unity's garbage and very confusing UI system. A system they are in the process of replacing.
Upon learning of the latest developing in the UI Builder, the new UI system, and with Allurgard's end being on the horizon. I decided this was the time to finally actually get the game’s mainstay UI in (while also switching to the new UI system).
Allurgard’s importance
Now, Allurgard, being a classic fantasy role-playing setting, was always meant to be the game’s testing ground for its main systems and to define exactly how a dimension will work. Due to that, Allurgard has taken some time to complete, we are approaching the second year mark of the game. So, with its end approaching, I am also aiming to lock down PtA’s main features while also cleaning the code and making the process of getting content in as smoothly as possible. That’s why the past two months have also been about me creating editors for events and areas. But one of the last and most important parts of the game that still needs taking care of is the UI.
Coming up with the UI
Now, I have been playing Pathfinder, and loving it. And seeing their UI was the spark I needed to finally lock down what I want from PtA’s own UI. In-game, saving is explained as writing your holy book. That idea, mixed with my fascination at Pathfinder’s very book driven UI, made me think of one of my favorite games of all time: Supergiant’s Pyre. In that game you have the Book of Rites, a holy book that explains some of the UI in a diegetic way.
Here's how said UIs look btw:
All of that to say, I had the perfect moment and inspirations to make the UI. The UI would essentially be your holy book, that will still change appearances with every dimension. Though, for now, Allurgard will be the only UI look available, since I need to focus on making sure the overall ideas of the UI are working before even thinking about changing the assets.
Challenges
Developing with the UI Builder is tough, because fuck nobody is using it right now. Which is fair, since it indeed is in preview mode, but I believe it more than usable as it is. Still, I am having to learn a lot of things without the father of knowledge Google, so things are going slower. And there are a few things the UI Builder does not support out of the gate, like links? Maybe? Still figuring this out, like I said. Worry not, though! For I am nothing if not resourceful!
PICTURES!
Here is how, in short, development went until the final layout (resolution is gigantic, so mind that):
This is the very messy sketch for the main needs and layout of the new UI. I was just riffing here, so don't mind it too much. But the circled layout is, of course, the final idea.
Now this is the idea taking shape by gathering the main assets needed. It looks like shit, but art always does before being allowed to look good.
Taking shape here. Getting into the idea of the side button as a chapter ribbon bookmark (that's a Pyre thing) and the info panel as an external bookmark. Put in the image with the borders a bit cut like Pathfinder. Also, decided to make the titles with this font that I have used recently on another project and loved.
Put in the other buttons to get a feel for it. Two icons left out for lack of space, but the quit one is going to become a clickable area on the right part of the book, as if you were closing it. Also playing around with making the whole picture cohesive by altering colors and shit.
Colored ribbons (Like Pyre)! And struggling with the bookmark look here. It will take a while before nailing, but it looks good when I do.
And BOOM goes the dynamite! Look at this pretty baby and that cool ass compass directional buttons (the idea of this was one I had since before making the first AI, glad I managed to make it work here)! Also chose a new font for the overall game. Can't see it properly here, but it's good you will see in like... the next image lol.
Thought it was over?! THINK AGAIN! There is still work to be done! Namely fixing the color shit a bit more, removing that fucking massive light stripe that was blinding my mole eyes, and getting the buttons just right. Btw, that last one... kind failed here miserably at that.
And here we go! Added the missing little stuff like the buttons for previous rooms, scrollbar and stuff. Now, I am still unsure about the portrait border here. Making a mask on the UI Builder is kind of not in right now, so the initial idea went out the window until that is implemented. Buttons here have been adjusted a lot later too, but this is the mockup I used to implement the UI in Unity. Let's look at that next!
Alright, this is where the implementation is at right now: LOOK HOW FUCKING CUTE THOSE RIBBONS ARE!
Here's how it resizes, too:
That's it! Finally! Such a big write up had me going a bit mental there towards the end, but we made it through, didn't we? Tell me what you guys think!
Comments
Shark
I am fucking liking and commenting my own shit now, 'cause I am freaking excited and in love with how things are coming along!
