SCREENSHOT SURVIVAL 20XX

Posts

author=EtherPenguin
I know the ring menu is centered on the screen, it was the character not being centered that was throwing me off. Admittedly, even after reading your post, I'm still not entirely clear on why that's case, but you obviously have your reasons. I wouldn't recommend the thing with making the character invisible and adding a new sprite to the center. It would look too wonky have character pop into a different place like that. You're better off sticking to what you got on that one.

Now the one thing about the ring menu I will say is egregious, and not a nitpick, is having the currently selected menu option(the treasure chest) all the way at the bottom of the screen, and the name (battle favored items) all the way at the top. If nothing else, I would try to fix this. Perhaps put the textbox at bottom of the screen and move the ring up by however many pixels tall the textbox is. That may require fiddling a little bit with variables, but it could be worth it.


Last paragraph's concerns first.

I was trying for consistency. The top and middle selections also have top textbox, so to make it suddenly on the bottom kinda breaks that. Also, it's a bit close to the bottom of the screen there, and would actually risk covering the icon. I'm not using variables to make this. My ring box actually looks like this below the hood.













It's just a bunch of strung-together simple pictures, which I then check if RingMenu name is Calendar for instance, the cursor moves to that and the display says "calendar" and pressing confirm selects the calendar. As such, I have to drag everything by hand, and then realign by hand. I could reduce the picture by 75% to make things closer, but then I'd need to move the arrows.

As for the first paragraph, I kinda explained why this is the case, since they are distinct pictures, the worry is that messing too much with variables might create a screwed up ring. Also, in the interest of reducing lag from other parallel processes, I elected to keep things simple.

Now, the idea of putting the item name in the black space is something I actually hadn't thought of. I imagine that I could do this, though.

Oh, I see, so your ring menu doesn't rotate like in the Mana games. That changes things. Yea, in that case it doesn't really matter where you put the textbox. I thought you had it where the current selection was always at the bottom of the screen and if I pressed left then the treasure chest would move to where the compass is and the yin/yang would move to be the new current selection.

By the way, I made these if by chance you might like them:


I know you were unhappy with my suggestions yesterday, so I edited your icons to try and be respectful of the visual direction you want while finding a way to make them pop out against the greyscale better.

I added a black outline to the ones that didn't have it like the treasure chest and signpost, then I put a deep purply-blue drop shadow under them for the sake of adding depth. They're not perfect. I admit the yin/yang and the sword guy with a pink aura look a little wonky with a drop shadow added. I do think the treasure chest, compass, and wooden sign benefit a lot from this though. Just something to consider.
Well, the reason they are not on the screen together, is that the top, right, left, and bottom are all default stuff. The "cellphone", sign, "watch", map, and ummm "calendar" (scare quotes because they barely resemble what they are supposed to be) are added when you actually have the item.

In other words, it's not actually supposed to run as a complete ring, but a partial one where the other stuff is added as the game progresses.

No, I'm not that unhappy. I'm just trying to impress upon you why some stuff won't work. And ppl playing my game on a stream also mentioned that they didn't know what the items on the item equip menu were until clicking on them, so that comment was spot on.
It's been a while! I'll try to jump back to rpgmaker.net, because it's kinda more peaceful here. I started a new game project and here is the first screenshot revealed, also more detailed character concept art. What do you think?


author=bulmabriefs144
Well, the reason they are not on the screen together, is that the top, right, left, and bottom are all default stuff. The "cellphone", sign, "watch", map, and ummm "calendar" (scare quotes because they barely resemble what they are supposed to be) are added when you actually have the item.

In other words, it's not actually supposed to run as a complete ring, but a partial one where the other stuff is added as the game progresses.

No, I'm not that unhappy. I'm just trying to impress upon you why some stuff won't work. And ppl playing my game on a stream also mentioned that they didn't know what the items on the item equip menu were until clicking on them, so that comment was spot on.

Maybe instead of having them not there, having them greyed out might work instead? Or having multiple versions of the image that is replaced as stuff unlocks (supposing that the unlocking is through specific progression based on the story).


Orange- that shit be tite, yo. I love the visual design a ton. Just one question - are the eyes on the sprite supposed to be misaligned? They look even on the art, but one seems to be lower than the other in the sprite itself.

Also? Loving the grass tufts. hnng~<3
Liberty I'm using the character template from my previous game for this one too and in it the characters had this tiny tilt to their perspective where they weren't fully facing front. I guess it's more apparent with this character with the bigger contrast between eye and skin colours. I'll probably tweak the sprites more!
Cap_H
DIGITAL IDENTITY CRISIS
6578
whoa, orange (I dont have any meaningful remarks).
Been working on the battle system for my game some more. So far there really isn't much to show off, but all the buttons animate like they're supposed to.




Also wow. I don't really have much to add that hasn't been said already, Orange, but that looks incredible.
author=Liberty
Maybe instead of having them not there, having them greyed out might work instead? Or having multiple versions of the image that is replaced as stuff unlocks (supposing that the unlocking is through specific progression based on the story).


I thought about this. And realized it would be very obnoxious to determine multiple variants of getting the map but not the calendar, the calendar but not the cellphone, everything but the sign, etc.

Orange has a pretty picture. As a person who has worked in lawncare, one critique (since this thread is about constructive criticism and not just fawning over stuff) is to make the maps based around some knowledge of horticulture. I don't always practice this myself, but as a quick example, the fern stalks... ferns are shade-loving plants. The edge one works, the one right next to it is too out in the open. The bushes seem prevalent on the hill, but this is actually the opposite of how things work, where normally vegetation recedes with high elevation. Lastly, weeds don't tend to grow directly under trees, since they drop their leaves and seeds, and try to kill off grass and stuff. That bare spot should be near the tree, and the weed (for reference, a Common Plantain) will compete with the grass and be much more common.
@orange- I LOVE that costume design! Looks great.

I've been going back and forth on how much visual stuff I should have done before posting anything in this thread. My game will (hopefully) have all original pixel art, I've been practicing since October-ish, but I don't have too much done or integrated into the actual game yet.

I do have a lot of the UI going, however, and I figure it's best to catch problems early on, so I thought I'd go ahead and post to see if I'm on the right track. Now, only one character has some sprites done. The others are just different colored blocks so bare with me, but here's what I've got for a main menu at the moment:

I'm pretty sold on Dragon Quest's sleek minimalistic style. I'm not against making it fancier if people really don't like this, but clean and legible have to be the number one priority. The game world will be visible behind the transparent black that covers the screen. The floor in this room is just solid grey at the moment which is why it looks all black (though you can kind of see an enemy touch encounter on the right).

There will be eight characters in total to fill the right box. It doesn't look great when there's only one or two characters in your party. I'm thinking of changing it so only the active party (max four characters) appears in this window. I've also been debating nesting some of the menus. Equip, Skills, Attributes, and Party Order could all go under a 'Characters' menu selection. Too much nesting can be obnoxious though.

The font I made myself. I used Momodora Reverie Under the Moonlight and Owlboy as references. I can't make up my mind on the anti-aliasing, Momodora did it, and it looked fine there, though I may have gone overboard with it. I'd really appreciate hearing some thoughts on the font.


Here's the equip menu. It's a little messier. Trying to align the boxes with the number of stats and equip slots is a pain. I sort of want to get rid of the weapon gems (the second slot), but then the stats window becomes too long, and I also can't decide whether to have a magic defense stat which would screw up the boxes even more.

I've also considered making it so only the stats that are affected by a piece of equipment are displayed in the right box. That falls apart when changing equipment, though. Any piece can affects a number of stats. If your changing from one piece of equipment with four stats on it to one with the opposite four stats then all eight stats need to be shown. That doesn't happen with any equipment I have in the game at the moment, but I want the system to be prepared for instances like that.

I'm pretty obsessive about UI especially for making a game in a genre all about menus. Any and all help with getting these to look nice would be appreciated.

EDIT: Resized images.
You have a couple of navy blue squares on your menu.

I've never actually done menus with entire words like that, but the concept is the same as mine.

I'm pretty obsessive about UI especially for making a game in a genre all about menus. Any and all help with getting these to look nice would be appreciated.

  • Never ever ever use variables for storing database-style events. You can use it for figuring out item IDs, doing the math, etc, but the final storage of items should always set an equip to a dummy hero (Thea_Equip set, Scrap Sword). Use variables for things variables excel at (like when you need a precondition, or need to do math). Yes, I know everyone uses variables. And they wind up wasting more. There are two major reasons for this.
  • First, every hero (which, any programmer worth their salt can make a dummy hero) has at least four useful stats for condition branches: checking the hero name (this will allow your main screens to be broken down into multiple item screens), skills, conditions, and equips (probably best here, but you can use skills). The three most important of these are name, skills, and equips. This saves variables/switches for the important events of your game, and for things that absolutely must use those.
  • Second, for a database, two things are crucial. Easy labeling and the ability to break order. Variables fail on both counts, which is why they tend to do poorly on a ring menu. Hero names and equips are unfixed, meaning they can be renamed/reset easily. This allows you to move completely around a ring menu without having to add then reset to 0. Skills are fixed, which makes them important for something like marking treasure chests you've opened.
  • For the art aspect of it... I knew what I was doing when I made the ring menu like that. A full screen template allows you to have a fixed position for items. Using lines and dividers can help you align further, and you simply remove them when done.
  • Doing a database menu like this saves alot of the headache you would get trying to manage variables, and it is more user friendly. You should use variables still for this menu (unless you're me, but I'm insane), but figure out how not to overuse them, and how to organize you code for readability.
  • Lastly, you mentioned an issue with displaying the numbers. Typically, if you're having trouble with something, you're probably thinking about it wrong, and you should work on drawing (I mean literally drawing) out a design, until you have what you're looking for. It might be that you need to break numbers into parts and have as a picture, or maybe a number pictures up to 255 (or 999) is what you need.

Now your request was to make them look nice. I'm not sure about that. But it makes the database code easier to manage. Which in turn frees up energy for better artwork. So yea, it looks nice as a result.
Thanks for the response! The blue squares on the menu are actually the player character behind the menu. Rosh doesn't have sprites yet so he's just a blue block. I didn't realize how silly it looked. Here's a shot with Thea as the party leader and my hideous grass tiles to give you better sense of the transparency:


I probably should've mentioned I'm using Gamer Maker Studio 2 for this. I'm unclear how much of your post is universal, some of it I don't understand. I don't know how to program a dummy hero so I may not be a programmer worth my salt.

I guess I just don't understand what you mean by not using variables. The other day I thought you were talking about something like drag & drop tools that did the variables behind the scenes but now I'm stumped. I mean, variables are everything. I hear you about making code as readable as possible, I try to be very careful about that. You say variables work against this and also mention the problem with ordering, but that's what enumerators are for.

Here's my setup for all information on characters, equipment, skills, and enemies, my homemade databases: Since GMS doesn't have classes and methods, I use objects to hold all my variables for these things. For instance, I create an object called 'characters' and on creation I have it make a large array as a local variable which I feed all the info into. At the end of the creation event, I use a script I made to turn the array into a data structure grid that remains in the object for the whole time the game runs and I reference it whenever I need to pull info on stats or anything out of it. It looks like this:

enum char_info {
name,
stats,
equip_set
}

enum stats {
hp_max,
str,
def,
mag,
heal,
dex,
agi,
luck,
hp_now,
sp_now
}

var char_array = (
(
"Thea",
(array holding stats),
(array holding equipment)
),
more character arrays go on from here...
)

And then I convert all this into a giant ds grid called ds_char_data

So when calling stats I don't have to remember that the array holding the stats is specifically the second value inside the larger array defining Thea, I just have to call characters.ds_char_data(# char_info.stats, char.thea). I could then turn that into a local variable called something like _stats and call _stats.(@ stat.def) when I want to get her defense value. It's super flexible and doesn't require strict ordering at all.

Same with the menu boxes, so much more flexible when using variables to be precise about the positions then making a bunch of images the size of my resolution. Every box you see in my screens comes from one 12x12 sprite. I have script that I enter the corner positions into and then it draws the rest of the box in the middle. I can easily resize and move around boxes with ease. It's a much quicker flow.

Maybe there's some differences in the way Game Maker and RPG Maker handle memory, but I find large images eat away at memory far quicker than any variable could. If I tried to draw all the box across tons of 384x216 images, I don't know if my game could handle it as opposed just having 12x12 image that I can stretched as much I want by just punching in different variables. Of course, if I do go for something less minimalistic like making the menu look like pieces of parchment or something then I may have to go with your method. But even then, I would still have to tell the image to sit at the top left corner of the view port which would require variables. Even if the x and y values are both zero, those are still variables.

My concern about displaying the numbers was more about finding an aesthetically pleasing way to fit all my stats on the screen. Originally I wanted to find a way where not all stats needed to be shown. Unfortunately that would mean reducing the amount of stats I could put on any one piece of equipment. If there's a lot more stats on screen than equipment slots then it becomes harder to make the menu boxes neatly line up like this. Same with the main menu. Right now, there'll be eight characters and eight menu options so it works out well to keep the menu boxes forming one greater box, but what if find I needed another menu option? Maybe it's okay for the menus to be a little sloppier instead of trying to fit all the boxes neatly together. Maybe my whole look for the menus is an eyesore to begin with and I need to go a completely different direction all together. I really don't know.

By the way, any thoughts on the font?
I wouldn't bother listening to what bulma says because apparently everything has to do with the extremely limited ring menu bulma made and keeps hitting the same point about not over-relying on variables in a very specific rpgmaker eventing context.

I think the font could just be opaque white rather than the extra shades but that's just me. I think it can get distracting when you over detail important graphics, it can look fine for borders and other less important things. Overall I think the UI looks fine, you're not doing anything out of the ordinary and you have a ton of examples to look to on how to keep the number of input traveling to a minimum. I actually think the indicator to see that you can swap to other characters in the equip screen is neat. It just comes down to how fast the player can find what they need and how fast they can read all of the information. Which is hard to test and not worth fussing about until later in.

I've only built a partial RPG system in Game Maker before but it sounds like you're on the right track if you're using data structure grids and what not. Just keep it simple and make it easier to edit later.

Also this is starting to feel like a game development topic and not a screenshot showoff topic, just saying.
Took a 2 year break from game dev, coming back to it now because I have more time. Bought a buncha cheap RPG assets on humble bundle too, so I got some of of the art covered, hopefully. Question, is it weird to use art assets from different style tilesets? I made a town, got some fancy looking buildings mixed in with some really plain ones. Should I keep it like this, or try to get everything matching by sticking to one tileset?



author=Darken
I wouldn't bother listening to what bulma says because apparently everything has to do with the extremely limited ring menu bulma made and keeps hitting the same point about not over-relying on variables in a very specific rpgmaker eventing context.

I think the font could just be opaque white rather than the extra shades but that's just me. I think it can get distracting when you over detail important graphics, it can look fine for borders and other less important things. Overall I think the UI looks fine, you're not doing anything out of the ordinary and you have a ton of examples to look to on how to keep the number of input traveling to a minimum. I actually think the indicator to see that you can swap to other characters in the equip screen is neat. It just comes down to how fast the player can find what they need and how fast they can read all of the information. Which is hard to test and not worth fussing about until later in.

I've only built a partial RPG system in Game Maker before but it sounds like you're on the right track if you're using data structure grids and what not. Just keep it simple and make it easier to edit later.

Also this is starting to feel like a game development topic and not a screenshot showoff topic, just saying.

Uhhhh okay. So don't listen to anything someone says cuz they mention something and you decide "everything" has to do with that. Excuse me, but I actually do have worth as a person. I don't care how good Nemoral is, that doesn't give you the right to belittle others for their concept ideas.

I was talking about the fact that if you do a database, with variables, you have to do Thea Helmet Equip variable. Then Thea Weapon variable. Then Thea Armor variable. Then Thea Accessory variable. Say you're using five characters. This is twenty variables that you have to manage and cannot overlap because variables take a specific space in memory. I have 11 heroes, so this is quite a few variables for every situation you need it, this adds up and you can't reuse these without creating conflicts. Or you can just tab up or down on the hero name and reuse the same equipment. From an organizational standpoint one of these gives you headaches. And I've done this this way before. But obviously I dunno what I'm talking about...

Ether Penguin, there are discolored squares. Not blue, I know what what was. But like spots below the name Seren. And to the right of plain clothes and travel charm.

I dunno if it is universal. Basically, rpgmaker has a number of condition branches, and some of them are like If Bob's name is Bob. You can use these as objects to identify what you're currently selecting. If RingMenu's name is System. It also has If Bob is Equipped with Long Sword. This part is very useful for a MENU BASED AROUND EQUIPS (sorry for the all caps, but Darken basically called me stupid for suggesting something perfectly suited for the thing you're using it for, assuming your engine has this stuff. Kinda not enough that he probably hasn't tried and can't say the merits and limits of what I'm talking about but also has to trash it. Is it perfect for every situation? No. But for THIS it helps). I'll teach you in PM if you're interested.

As to the thing looking like a game development thread, this is a screenshot feedback thread. And he wanted feedback to his UI, specifically how to get it to work better.
Again you're conflating your own way of doing things in rpgmaker with completely different software that doesn't rely on if statement chains as much. He has no idea what you're talking about because (as he explained) the menu is coded and structurally dissimilar from an rm2k3 workaround menu. Game Maker has no preset database, you have to build it yourself using data arrays making the whole "rely on the character database and not variables" advice not very apt. Even variables are declared differently in game maker (temporary,instance based,global), while rpgmaker just has variables already declared and you have to manually set them and organize them in weird ways.

This is nothing against you personally, I don't know how else to tell you this as you'll just ignore what I'm saying anyway.
@PhantasmaX I couldn't really tell there's different tile sets until looking at it for a bit. I think it looks nice, but would probably err on the side of the fancier looking ones. The fancier one on the left has very cartoon-exaggerated wood beams which make it harder to sell as being in the same reality as the house next door, but it's not like they're worlds apart. Hopefully someone with a better eye for this stuff can give you a meatier response, but overall your map looks very pretty to me.

@Bulmabrieffs144 The discolored squares are indeed the player character. If you look the screen with the grass tiles I posted in my last response, you'll see the one character with some sprites done is in roughly the same spot as the discolored square in the other screens. I didn't mean to imply you didn't know what blue looked like, I didn't realize I came across so rudely. It's just the transparency of the menu is very thick, it's barely see-through, which why the square is such a dark color.

I'm sorry I didn't mention I was working in a different engine earlier, but considering this is the screenshot thread, I was hoping to get more universal advice on the aesthetic principles of UI design. I really appreciate the gesture of offering some coding advice and even offering to teach me through pms. That's very kind, I do appreciate it. I just feel we're working with incompatible programs. To make things clearer, I'm using the methods outlines in these videos for programming the menus and databases: https://www.youtube.com/watch?v=1ITZOrI2qkA .

I really didn't mean to cause a scuffle and derail the thread with this. I certainly never meant to imply I was calling you stupid or anything terrible like that. I just don't think there's more to say regarding programming this stuff. I don't want to bury posts talking about actual screens like PhantasmaX's lovely screen or Sidewinder's funky fallout-inspired skeuomorphic interface. I'm so sorry if my posts and ensuing scuffle derailed things.

@Darken Thanks for the note on the font! I think I will ditch the anti-aliasing.
author=EtherPenguin
I really didn't mean to cause a scuffle and derail the thread with this. I certainly never meant to imply I was calling you stupid or anything terrible like that. I just don't think there's more to say regarding programming this stuff. I don't want to bury posts talking about actual screens like PhantasmaX's lovely screen or Sidewinder's funky fallout-inspired skeuomorphic interface. I'm so sorry if my posts and ensuing scuffle derailed things.

I can't speak for PhantasmaX, but there's no hard feelings on my end.

And, thanks. Haha, funky, eh? I think that's a good word for it.
@EtherPenguin

Hey no worries, and thanks a lot for the nice feedback! To be honest, I didn't notice a big difference either since I was always zipping around town on my game characters, but then I had to record a GIF of my game for an animation and stood in front of the buildings for long, that's when I noticed the fanciness. You did give me an idea though. I feel like I might go back into the sprite and erase some of the fine details on the fancy buildings, make it look more "poor" like all the other builds. The town's citizens support equality!

Biggest limitation for me this time around are going to be art, I gotta use cheap/free resources and see if I can make a game from it, and I'll use workarounds whenever possible. I will probably be posting a lot of UI related screenshots with questions too.
Blue-ness

author=EtherPenguin
@Bulmabrieffs144 The discolored squares are indeed the player character. If you look the screen with the grass tiles I posted in my last response, you'll see the one character with some sprites done is in roughly the same spot as the discolored square in the other screens. I didn't mean to imply you didn't know what blue looked like, I didn't realize I came across so rudely. It's just the transparency of the menu is very thick, it's barely see-through, which why the square is such a dark color.



I figured you were under the impression that I meant the blue next to Theas and <Shift. So it's some sort of transparency thing? Yeah, I didn't know because your last post before this seems to be a few pages back. It just kinda looked like what I get in paint projects when I copy and paste. You can probably fix that by tweaking transparency some more?

author=EtherPenguin
I'm sorry I didn't mention I was working in a different engine earlier, but considering this is the screenshot thread, I was hoping to get more universal advice on the aesthetic principles of UI design. I really appreciate the gesture of offering some coding advice and even offering to teach me through pms. That's very kind, I do appreciate it. I just feel we're working with incompatible programs. To make things clearer, I'm using the methods outlines in these videos for programming the menus and databases: https://www.youtube.com/watch?v=1ITZOrI2qkA .



Yes they are different engines, but many codes are translatable.

This is my ring menu code. This is what I mean. And you may have similar code, or this may be completely impossible, in which case I'm just gonna say moot point. But your engine can probably do things mine can't.



(This simulates rotating the cursor, by "renaming" the current position)



(This creates a cursor position and description name. The cursor nor the character ever move. But they appear to)



(And this is the results of pressing the confirm/select button when the cursor is "on" a certain selection. No variables at all here, which is important to me)

Notice I said important to me. The point I'm making that Darken is being rude about, is not that I mean "you must do it this way blah blah blah" but rather "don't get locked into someone else's mentality on how you should program, not mine, not some tutorial's, not Darken's, not anyone's. Figure out the code you want and how to do it." To me, I wound up with a lot of cool codes once I stopped fixating on the "you need to use switches this way and variables that way" mentality. It was around this time I created a ring menu, a system for determining weapon "state" (Poor, Good, Perfect, even though weapons actually have no state, allowing weapons to be broken after repeated uses), and a custom item menu. Is it perfect? Oh hell no, using names as variables opens up some very weird glitches. Is it fun? Hell yes. So try coding in a way you don't normally do, and you'll figure out something for your engine.

author=EtherPenguin
I really didn't mean to cause a scuffle and derail the thread with this. I certainly never meant to imply I was calling you stupid or anything terrible like that. I just don't think there's more to say regarding programming this stuff. I don't want to bury posts talking about actual screens like PhantasmaX's lovely screen or Sidewinder's funky fallout-inspired skeuomorphic interface. I'm so sorry if my posts and ensuing scuffle derailed things.

@Darken Thanks for the note on the font! I think I will ditch the anti-aliasing.


The point of this thread is to (a) post pictures, and (b) have fun and give or receive critique. Some people have lost this, and do things like spend 8 pages telling people off. I have no use for such people. The point of a screenshot thread is to have fun posting screenshots.

So by all means, post pictures of code, post weird artwork, even post videos like I've seen some people do. Don't worry about derailing things, because in two pages someone else will post something else, and they'll critique that instead.