Game Design Question

[Zizka]

Hello again,

I’d like your comments regarding the design I’m going for in my game. I need to make sure before making a decision because then I’ll pay the programmer and there’s no going back (well there is but then I’ll have to pay him again).

What I’m basically going for is something similar to “Wizard of Firetop Mountain”, by Tin Man Games:


It's basically a gamebook with graphics.

In the case of Firetop Mountain you'll notice that text is displayed over the game environment, the player statistics are on the left and the inventory is on the right (along with the options).

The resolution of the game is 816x624. I'll making my art at 1:1 and then resample it at 1:2. Basically, this means art like this:
will end up looking like this:



Now, please look at this mockup:


I have several issues:
1. The various HUD elements are not disposed logically.
2. Screen is currently too wide at 1202 px while it should be at 816.
3. I'd like the notepad to be larger to display more text at once.
4. The inventory takes too much room compared to the other elements. I've tried to change the shape of the suitcase but stops looking like a suitcase.
5. Some elements clash with one another.

So basically, I'd like ideas and suggestions so I don't have to pay many times to have this changed programming wise. Any ideas are welcomed!

Thank you!

[Xorceles]

i rotated the briefcase and enlarged the notepad,all was adjusted to fit in 816x624 resolution if your programmer is good he can rotate the briefcase and the options button with a script without errors this is just a idea

hope it work

[Zizka]

@xorceless:
Thanks for the edit. I still feel it's a bit chaotic though.

Here's my new take on it:


I've eliminated all the unnecessary clutter and streamlined everything. Pressing a key on the keyboard will reveal the menu the player is looking (status, notes, inventory or options). I came to the conclusion that they didn't need to be constantly displayed on screen anyway. This allowed me to save a lot of space.

I replaced the notepad with a book which feels more in the spirit of things. I've also added some text from the actual game here to give you guys a better idea.

Remaining issues:
-Still looks amateur. I'd like the visual area (with the characters) to be clearly identified from the hud area (book, inventory and so on).
-Still too wide. I went from 1200ish to 1032 but I'm still over. So there's still some work left here.
-The amount of text displayed might still be a bit too limited. I mean, it's not too bad but I wish I could cram a few more words in there so the player doesn't have to interact to get to the next part of text.
-Empty space to the left and right of the visual area which could be used more efficiently.

Do let me know what you think. I'm so involved in this it's sometimes difficult to take a step back and get the picture as a whole.

Thank you for reading.

[eishiya]

All your different sections and buttons don't match each other, because they're all using different metaphors and styles. Pick one, two at the most, and stick to that.

If you run with the book metaphor, you could use it for all the menus. The inventory could be a literal inventory, i.e. a list of items. The different menu icons could be bookmarks sticking out of the book (or out of the bottom of the screen when the "book" is inactive, you could have a show/hide "bookmark" for that), and the different symbols would be drawn on the bookmarks.
If you want the condition (and whatever that winged-heart number is) visible at all times, it can be scribbled in the top margin of the page, it doesn't even have to be its own section.
You don't need quite that much shadow and margin around the middle of the book. It might be realistic, but it's not very good UI. Unless turning pages back and forth is something you want, you could even have just one page of the book visible.

I've critiqued the way you do upturned paper corners before. You're doing them weird again, even though you did it right on the notepad!
I don't think you need them in this case anyway, unless those are buttons to go to prev/next "pages" (in e.g. dialogue).

The world seems too modern to be represented by a time-stained book in any case, so perhaps expanding the notepad metaphor would be better. Proper bookmarks would look weird on a notepad, but you could have earmarks. You could orient it coils-up or could to the side, depending on which gives you the separation you want. I think as long as the various buttons (bookmarks/earmarks) are attached to the notepad rather than floating, and don't have much of the game-background visible behind/around them, you don't need to worry too much about intentionally separating them.
If you go with the notepad, make the lines much lighter, perhaps your lightest blue that they fade out to. The dark lines will be distracting and make things harder to read.

The text in the book feels oversized compared to the artwork, I think the font you had in the notepad is better. Ideally you should provide an option for larger text for players with poor eyesight, but in that case you'd also need something to enlarge the world/characters too, just larger text would probably not be enough.

[Zizka]

Thanks again, eishiya.

-I've dropped the old book and decided to go for a notebook instead. It's more modern and it holds more text than the notepad. It also allowed me to make my screen fit the resolution I was looking for. This has also taken care of the page corner thing you told me before. I had forgotten you had mentioned that actually.

-I looked up ''earmark'' on google but couldn't find anything. So I tried separators instead.

-I dropped the page shadows.

-I lightened the lines to a light blue.

There's still some issues with the line spacing and word arrangement. I can't fit enough words on the pages at the moment. That's fine though as I can make the pages wider.

How does this look then?

[eishiya]

By earmark, I meant those little sticky bookmarks, I don't know why I said earmark. Sorry :'D
The sticky bookmarks are great for menu icons because they give a good visual cue for which one is currently active, since you can show where it's stuck onto the page. At the same time, since it's sticky and small, it doesn't cover up any content.

You can always make the line spacing larger, too.

I recommend leaving some extra space above the top line, to put menu headings, speakers' names, etc.

The UI should probably fill up the full width of the screen, no? Otherwise, you're wasting that space. You don't have to show the bottom of the notebook, you could just show the top part, like you did with the book. If you do show the bottom, consider putting the curled corners there instead of at the top, so that they're less likely to distract from the text. And again, you don't even need the corners unless they're functional. As pure decoration, I think they're too distracting because they look functional.

You could put the menu icons/separators on the side rather than the top, which would use up some of that horizontal space and give you more space up top for the game world.

The coil of the notebook is distracting. Try using lighter colours for it.

Nitpicks:
The lines in the notebook are off-centre. Cheap lined notebooks usually have the lines go all the way to the edge (the lines are printed before the sheets are cut up), so that's one way to solve the problem. If this is meant to be more of a journal with per-page line printing, then I think it should have more decorations suggesting its extra price, like dotted rather than solid lines, flourishes, etc.
Why are the page corners so dark? That makes it look like the pages are blue on the other side.


This is all very blue. A lot of your work is. Is that intentional?

[Zizka]

Thanks again.

-Alright, so I optimized the space like I had mentioned in my previous message.
-I increased the line spacing.
-I changed the color of the coils to make them less distracting. They might still be too dark however, we'll see what you guys think.
-As for sticky bookmarks, I used this as a reference:

I decided against sticking to the same palette for the actual separations for variety sake.
The first tab is meant to take you to story mode.
The second tab takes you to inventory mode.
The third tab takes you to status mode.
The fourth tab takes you to options.
-I've rearranged the tabs to make them more organized. I've reworked the options tab giving it more texture and reflection so that it looks much better now. In fact, all four tabs look pretty good now in my opinion.

-I replaced the previous status icon which didn't look good with this new one which looks much better.

-I removed the bottom of the book as well as the corners.

I recommend leaving some extra space above the top line, to put menu headings, speakers' names, etc.

I wasn't sure if you meant inside the book (on the page) or outside the book. I added some more space on top of the pages as well.

You could put the menu icons/separators on the side rather than the top, which would use up some of that horizontal space and give you more space up top for the game world.

True, but I feel like it's fairly evenly distributed now (at a glance anyway).

Speaking of color, I changed the color of the notebook a bit.

Much more room for text now, acceptably so.

So here's the new version:


Do let me know what you think, always interested in what you guys have to say.

As far as the parts of the book where the player needs to make a choice, I was thinking of having a pop-up to show up like this:


But then that would hide the gameplay are, so I figured something like this would be better:


Not 100% on the footprints yet, however.

You'll notice that the game area to be interacted with are outlines with a 1px line. I think this will create more uniformity between the text and the playing area.

As far as the equipment tab is concerned, you'll notice it stands out when that it's selected.

I've done a first draft for the inventory. What I am not satisfied with here is the location of the description on the other page. It doesn't work for me. I'll need to find something else.

[eishiya]

Minor nitpicks, but they bug me: Your two pages are different widths, and your sticky bookmarks appear to be on different pages than the ones they bookmark xP They should be in front of the page, not behind it.
Also, the lines on your notebook paper aren't evenly spaced, that's going to make positioning text and icons a nightmare for your programmer.


Here's my try with the bookmarks on the side, with them being stuck onto the page rather than behind it, and an idea for how to do the inventory:

Sticky bookmarks, in my experience, tend to be stuck onto the side of the page rather than the top anyway, since that makes them easier to use and doesn't risk damaging the page when you pull on them. And, it also means your space is used more effectively. If you want the currently selected bookmark to stand out better than it does with just overlapping the page, you could make unselected bookmarks darker, as if they're in shadow.

Having the item icon become circled when selected fits the notebook metaphor better than a hand icon, and saves space. You could use the same one for all the icons, or, if you want to give the game a lot of polish, give make a selected version of each icon that has a custom circle.

I put the item's description next to the item, using up the otherwise empty space, and freeing up the second page for more inventory items. Longer text could start on the same line as the item name, then wrap to the line below (aligned right). I think it looks best if the text appears when the item is selected. This also means you could have even longer text, by letting it wrap to the lines below it (or above it, for items near the bottom), since you know there's not going to be other text there (unless you have items with very long names).

I also made the dark line separating the two pages a little bit lighter. I'd consider making it even lighter, as currently it's so intense that it makes the two pages look like they're separate areas, when they're not.


You could give this notebook additional polish and fill up the space between the bookmarks on the side by having some very dark background/decorative bookmarks behind the menu ones, making it look like the notebook is used for other things too.


What platform is this game for? The screen size seems rather unusual.

[Zizka]

What platform is this game for? The screen size seems rather unusual.

RPG Maker MV.

Minor nitpicks, but they bug me: Your two pages are different widths, and your sticky bookmarks appear to be on different pages than the ones they bookmark xP They should be in front of the page, not behind it.

I've copy/pasted each line on each page and then the page itself so it should be perfect now.

If you want the currently selected bookmark to stand out better than it does with just overlapping the page, you could make unselected bookmarks darker, as if they're in shadow.

I've tried something else. Basically, the selected section ends up on the front page while the other stickies end up on other actual pages so to speak. Check out my example to get a better idea.

Having the item icon become circled when selected fits the notebook metaphor better than a hand icon, and saves space. You could use the same one for all the icons, or, if you want to give the game a lot of polish, give make a selected version of each icon that has a custom circle.

That's true, it does makes more sense than a hand. The problem is that small circle would be harder to implement when making choices in the game (see my other example above with the door and the bed).

I thought of using a small pen icon instead (with that little drop of ink). This would also fit in the theme of the notebook and could be applied in other areas and not only inventory.

I still feel like the item description is wonky. Come to think about it though, I don't need one at all so that could solve the problem entirely. Fighting Fantasy Books didn't use to have description to the equipment:


Here's the new version then:


I still feel like the "Inventory" heading lacks flair and rather bland but I could live with it.

[eishiya]

RPG Maker is an engine, not a platform. I guess this is PC? The reason I ask is this is a non-standard aspect ratio, so it's going to have black bars on the sides on most people's screens, or will have to be played in windowed mode.

The circle could work with the choices, they'd just be around the the bullet points. You could also have hand-scribbled underlines and the like, you don't have to have the exact same graphic for each section, they all just should feel similar and share a theme.
Alternatively, how about drawn arrows? It could work just like the pen icon, but feel less like an icon, and more like part of the notebook.
(Speaking of things feeling like part of the notebook, I think if you're going with this theme, it could feel even better if the menu and item icons were done in a "drawn" style too. They don't have to be monochrome, of course. It would give the whole thing more cohesion and character.)

If you're not going to have item descriptions and there are many different items, consider having two columns of items in the inventory, and/or using adjacent lines instead of skipping lines, so it looks more like a real inventory list. You could even have hand-drawn separators and the like between the columns. You could have slightly larger spacing between the lines if it feels a bit too crowded. I think that would help your longer texts be more legible, too.

As for the headings, why not "handwrite" them? Depending on the personality of the character the notebook belongs to, you could add other decorations too, like stickers, doodles, etc. Also, I put mine on the left because that feels more "natural" to a notebook. Centring feels "cheap" and lazy in this context, though I don't know why.


I feel like there should be more bookmarks on the right side too, currently it's off-centre and asymmetrical, and not in an intentional-feeling way. It might be good to have the in-game bookmarks (inventory, character status, notes) on one side, and meta bookmarks (settings, save/quit, whatever else) on the other. It wouldn't work well with 4 bookmarks, but could work with more, especially if they're larger. Alternatively, you could have the pagination (next/prev) at the top on the right, and the settings underneath, so you'd have six total, nice and symmetrical.

[Zizka]

RPG Maker is an engine, not a platform. I guess this is PC? The reason I ask is this is a non-standard aspect ratio, so it's going to have black bars on the sides on most people's screens, or will have to be played in windowed mode.

Oh yes, I misunderstood. PC it is.

(Speaking of things feeling like part of the notebook, I think if you're going with this theme, it could feel even better if the menu and item icons were done in a "drawn" style too. They don't have to be monochrome, of course. It would give the whole thing more cohesion and character.)

I agree. To be honest, I actually did all the icons and took great care to select the colors so it'd feel like a waste not to use them BUT that's not the kind of reasoning I should go with. I'll redo them with the notebook aesthetic. It won't be on my priority list just yet though as I need to figure out the general design first (to send it to the programmer so he can get started). It's good idea though.

As for the headings, why not "handwrite" them? Depending on the personality of the character the notebook belongs to, you could add other decorations too, like stickers, doodles, etc. Also, I put mine on the left because that feels more "natural" to a notebook. Centring feels "cheap" and lazy in this context, though I don't know why.

I like the scribble idea. The game is essentially horror though so stickers and noodles would probably clash with the mood I'm going for. I could simply use a "scribbling" font for the headings.

You could even have hand-drawn separators and the like between the columns.

Do you have a reference in mind (photo)? Do you mean like the circle you did but as lines? The lines wouldn't be straight then though... Unless I misunderstood.

I feel like there should be more bookmarks on the right side too, currently it's off-centre and asymmetrical, and not in an intentional-feeling way.

Yeah I know, that's actually why I put them on top on the first place to avoid this issue. The thing is that I really don't need more tabs than: book, status, inventory and options. Saving and Loading are part of options technically.

Unless I use: Book, status, inventory, settings, save, load. To be honest, I feel like it'd just be adding tabs for the sake of it then and I don't really want to. Maybe there's a way to balance out graphically without adding more tabs. I've like to have the hero health point displayed somewhere, maybe I could do it there, on the right? I'm not sure!

[eishiya]

Tab balance: I don't think it looks weird to have them all on one side and no gap on the other side, like in my mockup.
Here's an idea: Your current draft with tabs on one side and no tabs on the other, but have the characters stats or something else that's frequently useful on a sheet of paper sticking out of the notepad. Seems like a good, multi-purpose way to use the space.

Hand-drawn separators: Imperfect, hand-drawn lines, yes.

[Zizka]

I see. I don't think it's necessary at the moment. I mean looks ok without it I think:


(nevermind the post-it there).

I tried having stats in the space on the right but it really is too narrow so I just went with all tabs on the left.

So here's what I have at the moment for the book-mode (I can always go back to inventory later. The priority now is to have the general setup of the book vs game area).


Questions I have in mind:
1. Font readable enough?
2. Would it be better to align all four tabs? It looks better but it makes less sense page positioning wise.
3. Is the separation between book and the game area distinct enough?
4. Is there enough text being displayed at once?
5. Is the text spaced out enough, it is easy to read enough?

I currently like the simple interface and few menus. Every game I've worked on in the past always became too complex so it's good to start simple (although it requires willpower and determination to keep things simple).

I feel like I'm almost there but not quite.

[eishiya]

The book and inventory tabs switched places between the two images, is that meant to happen? I think they should stay in their place when selected, and just be highlighted.

1. Font readability: I think serifs are a poor choice for a pixel font. This font has some spacing issues overall, too.

2. Tab spacing: I think it would be better to align them, yes. I'd also have less visible thickness to the pages, which would make them being aligned look better, and give you a little more space to work with. You could really use that space too, some of your text gets too close to the page edge/spine.

3. I think it's distinct enough. Like I suggested earlier though, you could add more non-functional background tabs behind the menu ones just to replace the negative space around them, thus more clearly separating it from the gameplay area.

4. I think this is a fine amount of text, it's more than I'd want to read all at once before getting to make a choice or take some other action.

5. The line spacing is fine, but the font itself isn't very readable because there's no spacing between many of the letters. Also, try moving it down a pixel, so that the bottoms of the letters align with the lines. Currently, they sort of blend in with the lines, making the bottom serifs look really thick. Here's what it looks like moved down a pixel, I think it looks cleaner:

It might look better or worse with a sans-serif font though, so try it out.

[Zizka]

2. Tab spacing: I think it would be better to align them, yes. I'd also have less visible thickness to the pages, which would make them being aligned look better, and give you a little more space to work with. You could really use that space too, some of your text gets too close to the page edge/spine.

I've removed 6 pixel worth of thickness and removed 2 from the spine. The lines were too near the spine. I've also further lightened the text lines (a request from someone else who still found them too distracting).

The book and inventory tabs switched places between the two images, is that meant to happen? I think they should stay in their place when selected, and just be highlighted.

I moved the book section on top because it's the most important one. They'll stay in place in game. They'll just have their sticky bits appear on the left page when they're selected as well as being highlighted like so:

3. I think it's distinct enough. Like I suggested earlier though, you could add more non-functional background tabs behind the menu ones just to replace the negative space around them, thus more clearly separating it from the gameplay area.

I don't know what kind of tabs I would put. I mean, I understand what you mean but I don't know what to put there. If I just put empty tabs I think it'd look strange (unless they're desaturated and don't draw attention) and if I put something on it player will think it's a menu of some sort.

5. The line spacing is fine, but the font itself isn't very readable because there's no spacing between many of the letters. Also, try moving it down a pixel, so that the bottoms of the letters align with the lines. Currently, they sort of blend in with the lines, making the bottom serifs look really thick. Here's what it looks like moved down a pixel, I think it looks cleaner:

Done.

It might look better or worse with a sans-serif font though, so try it out.

Ok, here's a couple of attempts using different fonts:

Cayetano, sans-serif:


Coder's Crux, sans-serif:


Wellbutrin, sans-serif:



Which one do you guys prefer? I'm unsure as to which one to pick. The second is more readable but doesn't really evoke handwriting.

Any suggestions of other pixelated fonts which might fit what I'm looking for?

[Vinik]

Coder's Crux is looking very nice, but it seems to monospaced, which is good for formatting text, but very bad for overflow (very wide "i" "l" and "j" end up taking a lot of horizontal space). I also like the one from the first yellowish book mockup.

[eishiya]

Why not use the front you used earlier?

The non-functional tabs should be dark and should be barely noticeable, imho. Quick sketch of what it could look like:

(You could add some barely-visible ends of dark tabs on the other side, too.)

[Zizka]

I think you guys are talking about the ''Arial'' font and I think it does look great.

Regarding the inactive tabs, I think you pulled it off nicely but I've tried and have come up with nothing convincing on my end. It's too bad because those empty gaps between the tabs is the only thing I'd fix before moving on.

I also got rid of the pen icon on the bottom right. Unless someone else have another idea about the general design of the game screen I'll leave it at that.

[MysteryMeat]

I think you're nearly there, there's a bit of eye glare from the contrast I think could be fixed with either a slightly darker color on the paper or a shift to the font the previous edit by Eishiya uses

[eishiya]

With the tabs, all I did was use your two darkest blues and drew some "sloppy" tabs - some are curled, some are sideways, some are both. I'm sure you can manage that. The key is to keep them dark and simple. Maybe don't outline them like I did and just use your two solid dark blues.

Arial does indeed look good! I think you need to keep the font further from the page edges though. Try to keep at least an em between the text and the edges. You've got it right on the left edge of the left page.

I think the text also gets rather close to the bottom of the screen, I think the bottom line should be higher up off the edge (you could afford to raise all the lines up by a few pixels). That would give you more room for the arrow too.
And an Nth reminder: don't forget your theme/metaphor! Make that arrow a scribble or something xP

[Zizka]

I think you're nearly there, there's a bit of eye glare from the contrast I think could be fixed with either a slightly darker color on the paper or a shift to the font the previous edit by Eishiya uses

I've darkened the pages a bit.

I think the text also gets rather close to the bottom of the screen, I think the bottom line should be higher up off the edge (you could afford to raise all the lines up by a few pixels). That would give you more room for the arrow too.

Ok, I've moved the lines up by 2 pixels.

Arial does indeed look good! I think you need to keep the font further from the page edges though. Try to keep at least an em between the text and the edges. You've got it right on the left edge of the left page.

Ok, text now stands 6 pixels from the lines' left end and 4 pixels from the right end. This makes text justification a bit wonky but there's no going around it with pixel font I don't think. Either way, it's a bit frustrating but not unbearable or a major turn-off.

And an Nth reminder: don't forget your theme/metaphor! Make that arrow a scribble or something xP

Hey, I agree about the notebook theme, not the scribbling part  . I tried the scribbled arrow but didn't have enough room for anything convincing. So I opted for an ink blotch with an arrow in the ink. I think it looks good that way.

I'll keep trying about those tabs thing.

I just realized I was still missing something. I need to have the player's hit points displayed on screen at all times. I wanted to use something like this:


The health goes down as a sort of meter (think Earthbound here). Anyways, this is already coded in, which means I've paid for it. I'd rather keep it not to have wasted money away. Now the meter needs to appear on the screen, somewhere. As a rolling meter, it wouldn't fit on the notebook. I figured the upper left would make sense as this is usually where health is displayed in games.

Now of course I can other graphics around it to integrate it with the theme better but I have no idea why.

Now I can't use the heart because I've already used it in the tabs for the status menu and I like the way it looks.

So basically:

I need to figure out how to integrate the meter thematically without using the heart as an icon.

1st on top: to bare bones. I did like the idea of crossing bandages as an health icon. More original than the usual cross.

2nd on top: added texture and made the crossed bandages bigger. Tried to integrate it with the meter better. Added some blood dripping from the bandage too. It's still badly integrated however.

Ideas?





 

[eishiya]

The arrow doesn't read to me. Keep it simply dark-on-white, you don't have space for such fanciness xP

As for the health meter (which, tbh I didn't realize was a health meter) Why not put the heart tab as the highest one, and have it have a little rolling thing? Bookmarks with moving parts have a long history! Here's one with a rotating dial calendar, here's a medieval one with a dial, here's one with an electronic timer, this one's an electronic dictionary wtf... Point is, if you have a bookmark with something like a health ticker, it wouldn't be entirely unnatural, it would just need to be an actual bookmark rather than a sticky tab. I think that's actually pretty neat though, it would continue into the page and have additional stats on it

[Zizka]

The arrow doesn't read to me. Keep it simply dark-on-white, you don't have space for such fanciness xP

I've reworked the blotch a bit. Does it read better now?

As for the health meter (which, tbh I didn't realize was a health meter) Why not put the heart tab as the highest one, and have it have a little rolling thing? Bookmarks with moving parts have a long history! Here's one with a rotating dial calendar, here's a medieval one with a dial, here's one with an electronic timer, this one's an electronic dictionary wtf... Point is, if you have a bookmark with something like a health ticker, it wouldn't be entirely unnatural, it would just need to be an actual bookmark rather than a sticky tab. I think that's actually pretty neat though, it would continue into the page and have additional stats on it

I don't know how to integrate the meter I have right now to the heart bookmark. The meter is too large to fit in there. If you meant to draw a new meter, it'd be wasting the money I've already given the programmer to code it in so I don't want to do that (it's quite a bit of money).

I've tried two more versions:


So I don't know. I realize that doesn't fit with the whole book thing but I feel like there's no way around it.

[eishiya]

I thought you said you could change the art but keep the programming? It could work the same way but be positioned differently, on a large bookmark.
Whatever you go with, I think it should be positioned as a bookmark or at least near them, it looks out of place in the corner, and the new drafts don't fit thematically with anything.

[Zizka]

I mean, I can change the art around the meter but not the meter itself, that's coded in. Anyways, I have no clue what to do right now what I'll figure something out I'm sure. If worse comes to worse, I'll just have the meter stick out like a sore thumb thematically.


As I've explained in the first message of the thread, the game is a basically an interactive book. This means that players will make decisions throughout the game. Now, I need to decide how to best handle the choice making occurrences.

It needs to be clear for the player that he's got to make a choice. Also, I need a safeguard to make sure the player doesn't make a mistake by accident by mistake.

At the moment, pressing A and D switch pages backwards and forwards. Logically, I don't want to use the same keys to alternate between various available options. I would use "W" and "S" to change from option to option, therefore making sure there's no confusion for the player.

Option 1:
(nervermind the tabs here, just focus on the choice making mechanic).


In this instance, you'll notice that the passive narrative is reserved for the notebook while the choice making pops up in a new separate window. This has the advantage of keeping a clear separations between things. The disadvantage is that it covers either the narrative or the art background which is problematic. Also, if there are a lot of options, everything will get covered up by the new pop-up so I can't really use that one.

Option 2:


In option 2, there's a page break when the player needs to make a choice. Also, the scale icon shows up as well. This has the advantage not to hide anything which makes it a much better choice.

It feels bare bones like this however.


1. Should I trigger an animation+sfx to inform the player he/she needs to make a choice or would it be overkill?

2. Should I require a "Confirm" function? For example, press "Enter" once to select and one more time to confirm? Or should I just ask the player to make a decision and press "Enter" once and that's it?

3. Should I start the cursor at a neutral location instead of putting it next to the first option to avoid pressing enter by mistake? I mean having the cursor besides the choices so that the player needs to consciously press "S" and "W" to move it next to a "selectable" option? I don't think this should be necessary as changing pages requires the A and D key, not the enter key. In other words, "Enter" would only be used to confirm a selection.

4. Should I put a different icon before each choice to clearly differentiate them? Like roman numerals for example or can I just use something simple like dots.


In Firetop Mountain, they use the mouse so it doesn't really apply with my game. This being said:


You'll notice there are arrows before choices.

P.S.: I wouldn't use the hand cursor, it was just for the mockup.

Let me know what you think please!

[Zizka]

*Bump*

I'm experimenting with the choice mechanic. Choices are on the right page. I've tried the silhouette of a scale. I've redrawn the fountain pen.

That's about it for now!

[MysteryMeat]

that wood floor is WAY too noisy, it makes it hard to see anything in the environment! I strongly suggest you take out the two darkest wood colors in favor of the lighter ones, since most of the objects in the room follow a darker color scheme.

[Zizka]

Thanks, I'll fix it.

For inventory I was thinking of something like this:


Inventory on the left page and a description on the right.

I'm unsure if putting the selected item on the right page. It seems redundant.


Do you guys prefer one or the other?

[Xorceles]

look very good to me almost look like you done a screenshot of a game play
the hud on the right is weird the pink color doesn't match with the color of the game the theme of the game is blue imo you can change it to a note in a paper with a hand draw like heart(hope it help)

[Zizka]

Yeah, I think I'll have to bite the bullet on that one and drop the meter. Shame to pay for it and not use it though  . Oh well, can't let it guide my decision.

So here's what I'm thinking for the health meter instead:


The problem is that the number ends up being tiny. On the bright side, it makes better use of the space on the left. I'd need the tab to be the same size as the other tabs.

So I made a few of those in order to make up my mind as to which tab to use. I will be referring you to each tab by their numbers.

#1: Too small, too hard to read.
#2: Better. Still too plain.
#3: Approached the rotating part of the tab to the side. Number is more readable (still too small?). Once it's x2, it should be just fine I reckon.


I like the cohesion of the overall thing. What do you guys think?

[Xorceles]

the meter is a nice idea but  the shape looks wrong

[Zizka]

but  the shape looks wrong

In which way please?

I reworked it a bit. I've added some possible icons to indicate that something is equipped. Do you guys have a preference for one between the checkmark, the big hand, the little hand, the big E and the little e?



I'm also experimenting with the status page.



You'll notice various meters/numbers to represent which stat. Any preference?