Verbcoin Interface

Started by Babar, Sun 15/07/2018 13:55:08

Previous topic - Next topic

Babar

Hey all!
I've never seen a well implemented verbcoin, but people keep telling me that there's this hypothetical verbcoin that is really the best UI ever. Since I can't find it (side note: if you've made one, please share, the verbcoin template that comes with AGS counts as one of those horrible ones, and I've seen people complain about the template available on these forums as well), I decided to make it myself. And for that, I need your help!

Some design points I gleaned from these forums on what is the best kind of verb coin:

  • Left-clicking where there's no interactable makes you walk there
  • Left-clicking where there's an interactable opens up the verb coin around the point you clicked
  • If you click in a corner, the verbcoin opens such that it would fit on screen
  • Interactions are LOOK, USE, TALK and OPEN INVENTORY
  • Right-clicking does nothing (although I don't think I'd ever want to make a generalised UI for both PC and mobile, apparently it's important)
  • Clicking outside the verbcoin closes it
  • Moving the mouse around without clicking shows whatever is under the mouse (not relevant to mobile, though)
  • The eventual game would have keyboard shortcuts, but I've not currently implemented them, as I wanted to get a feel specifically for the verbcoininess of this system

So what I came up with (I can share the entire game if you like, but I'm not sure it's necessary just at this moment):

(don't be bothered too much by those things in the corners, those were just to test the literal edge cases)

Code: ags
// main global script file
int verbCoinX, verbCoinY;//stored coordinates of whatever the user clicks to have the verbcoin pop up


function repeatedly_execute() 
{
  if ((gVerbCoin.Visible==false) && (tLabel.Text!=Game.GetLocationName(mouse.x, mouse.y))) tLabel.Text=Game.GetLocationName(mouse.x, mouse.y);
  // gVerbCoin is the Verbcoin GUI, tLabel is the label showing what interactable is under the mouse
}

function on_mouse_click(MouseButton button) // called when a mouse button is clicked. button is either LEFT or RIGHT
{
  if (IsGamePaused() == 1)
  {
    if (gVerbCoin.Visible==true)
    {
      if (GUI.GetAtScreenXY(mouse.x, mouse.y)==null)
      {
        gVerbCoin.Visible=false;
      }
    }
  }
  else if (button == eMouseLeft) 
  {
    if (GetLocationType(mouse.x, mouse.y)==eLocationNothing) cCharacter.Walk(GetViewportX()+ mouse.x, mouse.y, eNoBlock, eWalkableAreas);
    else
    {
      verbCoinX=mouse.x;
      verbCoinY=mouse.y;
      if (verbCoinX<gVerbCoin.Width/2)gVerbCoin.X=0;
      else if (verbCoinX>System.ViewportWidth-gVerbCoin.Width/2) gVerbCoin.X=System.ViewportWidth-gVerbCoin.Width;
      else gVerbCoin.X=verbCoinX-gVerbCoin.Width/2;
      
      if (verbCoinY<gVerbCoin.Height/2) gVerbCoin.Y=0;
      else if (verbCoinY>System.ViewportHeight-gVerbCoin.Height/2) gVerbCoin.Y=System.ViewportHeight-gVerbCoin.Height;
      else gVerbCoin.Y=verbCoinY-gVerbCoin.Height/2;
      gVerbCoin.Visible=true;
      
    }
    
  }
  else //Right-click, which does nothing right now
  {   
    //Room.ProcessClick(mouse.x, mouse.y, eModeLookat);
  }
}

//If the player clicks the LOOK icon on the verbcoin
function bLook_OnClick(GUIControl *control, MouseButton button)
{
  gVerbCoin.Visible=false;
  Room.ProcessClick(verbCoinX, verbCoinY, eModeLookat);
}

//If the player clicks the USE icon on the verbcoin
function bUse_OnClick(GUIControl *control, MouseButton button)
{
  gVerbCoin.Visible=false;
  Room.ProcessClick(verbCoinX, verbCoinY, eModeInteract);
}

//If the player clicks the TALK icon on the verbcoin
function bTalk_OnClick(GUIControl *control, MouseButton button)
{
  gVerbCoin.Visible=false;
  Room.ProcessClick(verbCoinX, verbCoinY, eModeTalkto);
}



So what I'm asking help for is to make this system as user-friendly as possible, and to have the code as generalised as possible (so it can be made a template for any game), and if there are any potential bugs or improvements. I don't really need help with the art, but if you're willing to provide something I can use better than what I'm using now (thanks, cat! :=), then I'd be more than grateful to use it.

Specific things I'm currently unsure about:

  • I had initially thought to use radial menus, because apparently they're the best, but ran into issues with screen edges. Along the edge, I'd have to rearrange the button positions, and depending on the number and size of the buttons, and whether the click is near the corner, the buttons would not fit. So currently, it's just a GUI with 4 buttons in fixed positions relative to each other. Does someone have a suggestion that would make radial menus viable, or is it fine as is?
  • I'm assuming there's an optimal size of Verbcoin/buttons/mouse to screen ratio. If someone can point to a better one, I'd appreciate it. Currently the resolution is 320x200, the verbcoin buttons are 32px large, and spaced 70px away from each other (corner to corner, not centre).
  • CrimsonWizard in another thread suggested a system where once the verbcoin is opened, the mouse pointer would disappear, and one of the buttons would be highlighted to be clicked, moving the mouse in another direction would highlight another button. This system would have the issue of requiring another button to close the verbcoin, and would require a rethinking of the button placements. Is it worth it? Would it be better?
  • Verbcoin currently closes when you move the mouse out of the verbcoin range. Should an X button be added to be able to explicitly close it? Or some other system to close it?
  • I just randomly set the current buttons and their placement. Do you feel something else would be better? Should inventory be there, or be opened through something else? Disadvantage of having inventory only through the verbcoin is that you may want to check your inventory without wanting to interact with something on screen. What about a settings menu? Where would these go if they weren't in the verbcoin?

Sorry for the long post (hope that doesn't translate to a lack of responses), and thanks in advance for all your help!
The ultimate Professional Amateur

Now, with his very own game: Alien Time Zone

Cassiebsg

In order to post mine, I need to grab the relevant code from the game. (roll) The previous one I had, and is still on mediafire here is a buggy version of the final version.

QuoteCrimsonWizard in another thread suggested a system where once the verbcoin is opened, the mouse pointer would disappear,

I hate that, don't take my cursor away! >:(

Those buttons look huge, maybe it's the round solid BG color, as I don't mind the icons. As for making them radial is just a matter of re-adjusting them slightly. Right now, they ARE radial... ;) only in a 4 point circle. I think they could be slightly smaller, but only by trial and error. Also there's got to be something left for the dev to do and adjust the design. :-D

Having the inv in the verbcoin is an idea that never crossed my mind, mostly cause I like having the inventory always visible, but again this is personal preference. I would at least change the inv icon with the talk one, as it's less intuitive to go "backwards"... ;)

I think a settings menu should not be in a verbcoin. You only want stuff there that are relevant to playing the game. An icon at one of the corners should be good enough to access the settings and options menu. Just pick which ever corner is less intrusive for the game (usually a top corner, as on the bottom we tend to have walking areas and stuff.
There are those who believe that life here began out there...

cat

Nice use of the icons! Good to see the AGS stash in action.

Quote from: Babar on Sun 15/07/2018 13:55:08
Right-clicking does nothing (although I don't think I'd ever want to make a generalised UI for both PC and mobile, apparently it's important)
QuoteVerbcoin currently closes when you move the mouse out of the verbcoin range. Should an X button be added to be able to explicitly close it? Or some other system to close it?
You could use right click as an additional option for closing the verbcoin. This way you can close it without additional mouse movements. An x would just use up additional screen space.


Quote from: Cassiebsg on Sun 15/07/2018 17:43:56
QuoteCrimsonWizard in another thread suggested a system where once the verbcoin is opened, the mouse pointer would disappear,
I hate that, don't take my cursor away! >:(
Same here, don't do that!


Quote
Those buttons look huge, maybe it's the round solid BG color, as I don't mind the icons.
What about making the background 50% transparent and only the icons and a 1px outline around them solid?


Quote
Having the inv in the verbcoin is an idea that never crossed my mind, mostly cause I like having the inventory always visible, but again this is personal preference. I would at least change the inv icon with the talk one, as it's less intuitive to go "backwards"... ;)
In combination with
QuoteLeft-clicking where there's no interactable makes you walk there
this means you cannot open the inventory when there is currently no hotspot on screen. Or you have to interact with the table/door/bookshelf for being able to combine the batteries and the torch.


Quote
I think a settings menu should not be in a verbcoin. You only want stuff there that are relevant to playing the game. An icon at one of the corners should be good enough to access the settings and options menu. Just pick which ever corner is less intrusive for the game (usually a top corner, as on the bottom we tend to have walking areas and stuff.
Agreed.

Crimson Wizard

#3
nevermind.

Cassiebsg

CW, I didn't say I did not understand the point. I just said I hate it when my cursor vanishes... (roll)
There are those who believe that life here began out there...

Babar

Thank you both for your suggestions! I'm implementing what I can right now.
I'll keep the verbcoin closing system as it is right now, with the addition of the right mouse button to close it.

I currently had the whole verbcoin, as 4 buttons, each a circle and symbol on the circle as a single button. I suppose I could separate it, to make them transparent/smaller, but I'd like to be clear as to the isssue I'm solving. Are the buttons too big? Is it bothersome to not be able to see behind them? I think I made the mouse pointer too big as well :D.

You are right about the inventory not being openable if there are no interactables on screen, so I guess I should move it. Maybe I'll do it as a pop-up modal like the Sierra iconbar, along with the settings. So I'm down one button in the verbcoin. You sure I shouldn't put an X there? Or maybe I can have the inventory openable from there as well as from moving the mouse up? That probably wouldn't make sense. Or just leave it at 3 icons right now?
The ultimate Professional Amateur

Now, with his very own game: Alien Time Zone

Cassiebsg

I think that as long as you placed an explanation on how to add more buttons to the verbcoin, then the dev can decide if his/her game only needs 3, or if it needs 4 or 5 or...
Just as long as it's easy to edit then it should be fine. ;)
There are those who believe that life here began out there...

tzachs

Quote from: Babar on Sun 15/07/2018 13:55:08
but people keep telling me that there's this hypothetical verbcoin that is really the best UI ever.
...
  • Interactions are LOOK, USE, TALK and OPEN INVENTORY
I mentioned it in the original thread, but I'll repeat it here, that in my eyes, the hypothetical verbcoin that has the potential to be the best UI ever will have a dynamic context based verb list.
So always having the same verbs kind of misses the point. The concept, as I see it, should be to allow defining a list of verbs (or interactions) per hotspot.
You can either do verbs which map to icons, OR you can do fully blown descriptions which will just be textual.
So, for example, in your scene, using the icons scheme you'll have "look", "knock" and "lick" on the windows, but with the text scheme you can have "examine the material of the windows", "look at the big shining star", "knock and scream for help", and "lick the window, yeah, let's get weird".

Quote from: Babar on Sun 15/07/2018 13:55:08
I had initially thought to use radial menus, because apparently they're the best, but ran into issues with screen edges. Along the edge, I'd have to rearrange the button positions, and depending on the number and size of the buttons, and whether the click is near the corner, the buttons would not fit. So currently, it's just a GUI with 4 buttons in fixed positions relative to each other. Does someone have a suggestion that would make radial menus viable, or is it fine as is?
You can use an arc. The arc can be adjusted when on the edge, so if you're in the top the arc will be below the hotspot and horizontal and if you're in the right the arc will be to the left of the hotspot and vertical, etc.

Babar

I'm not sure I'd be a fan of dynamic context lists of verbs (potential to either spoil solutions or be required to provide loads of filler outlandish actions), but is that really something exclusive to verbcoins? You could have a LucasArts style verblist that fills up with context sensitive verbs (up to 15 if you go by Maniac Mansion).

Also, reading up on radial menus in an attempt to get something good gave me a LOT of research about how non-radial context menus (like what pops up when right-clicking) are really inefficient, user-performance-wise.
The only other option would be, as you mentioned, to have a large but set list of actions with corresponding icons, some of which (to a set maximum) show up depending on context when the player clicks on something.
Cassie's system in her BSG game does something similar, although it only draws from a pool of 4 actions (shoot, look, use, talk), the unnecessary ones for each interactable on screen are hidden away when that interactable is clicked. In the spirit of generalisation, I suppose it is something I could implement, but I'm still not sure about the general consensus on this: Are varying lists of context-relevant actions for each interactable something that people want, and would be good?

Finally, your point about using arcs, I'm not sure I understand, could you please explain? The way I looked at it, lets say for simplicity, we have a total of 3 interactions (LOOK, USE, TALK), clicking something on screen would pop up a radial menu around that point, with those actions. If there's something near the upper right corner to interact with, however, those 3 actions would have to be either squeezed together in the lower left (and even for just 3 buttons on a radial menu, of half the size I have them now (16px instead of 32), that's a tight squeeze depending on how far in the corner the item is- and probably not work for 320x200. Or the buttons would have to be moved further away from the interactable, again making behaviour inconsistent.
The ultimate Professional Amateur

Now, with his very own game: Alien Time Zone

VampireWombat

Context sensitive verbs are something I've wanted before. If done right, it shouldn't spoil anything.
Of course I was wanting it more for giving different options for different characters.
Context sensitive verbs are the only reason I'd even want to use a verb coin, actually.
Of course it is a balance thing. Too many interactions and it can be overwhelming. Too few and you may as well just use a 2 click system.
But the way the coding for this looks, it shouldn't be too hard to do for those want it.

Snarky

Quote from: Babar on Mon 16/07/2018 09:51:08
Finally, your point about using arcs, I'm not sure I understand, could you please explain? The way I looked at it, lets say for simplicity, we have a total of 3 interactions (LOOK, USE, TALK), clicking something on screen would pop up a radial menu around that point, with those actions. If there's something near the upper right corner to interact with, however, those 3 actions would have to be either squeezed together in the lower left (and even for just 3 buttons on a radial menu, of half the size I have them now (16px instead of 32), that's a tight squeeze depending on how far in the corner the item is- and probably not work for 320x200. Or the buttons would have to be moved further away from the interactable, again making behaviour inconsistent.

I think if someone absolutely must use a verb coin, they simply shouldn't have hotspots near the edges of the screen. (Characters that move around should be made non-clickable once they come close enough to the edge.) In a scrolling room, I suppose you could scroll it to fit the verb coin.

Babar

#11
Hahah...that would be sad solution. But is it a reasonable expectation from someone making a game? I know that you have all those implicit assumptions with other UIs as well (game dev can't utilise a fullscreen background in the classic LucasArts system, or game dev can't place stuff to close to the top in Sierra's Iconbar system, and game dev can't shouldn't have items/people so near the edge of the screen that it'd trigger them walking to the neighbouring room), but this limitation seems particularly egregious, no?

But then again, is having a radial/pie menu, or having a menu that consistently pops up in the same place relative to your click more important UX-wise, than having a menu that readjusts its position or placement of buttons depending where you click?

Also, VampireWombat, I'm still not seeing why context sensitive verbs would be something exclusive to verbcoins? I mean, aside from two-click systems (the ultimate in context-sensitive interaction :grin:), any UI system could be context sensitive.
It's just that the more verbs you have, the more cumbersome it would become- but for most cases, I feel it would be an incredibly rare situation that any interactable would have more than 4 interactions. You'd usually have a look for most things, maybe another talk/use for people/items. Maybe some rare people would have look, talk and use/push, or some items would have look, use, pick up, and the very rare item could have something like look, push, open, pick up (for something like a box?).

Is the verbcoin a useless or substandard UI if it doesn't have context-sensitive verbs?
The ultimate Professional Amateur

Now, with his very own game: Alien Time Zone

VampireWombat

Context sensitive verbs wouldn't be exclusive, no. It's just the only way I can see a verb coin being useful. The game I was wanting to use such a system in had one character with fingerprinting, using a taser, and taking pictures as interactions. And the other character had sniff, mark, and something else as interactions. I just didn't have the programming experience at the time to implement it properly.
Something like that and/or where interactions with people are different than with objects and/or hotspots are how I see a context sensitive verb coin being useful.
A better version of what Return to Zork used is perhaps what I'm thinking.

tzachs

Quote from: Babar on Mon 16/07/2018 09:51:08
I'm not sure I'd be a fan of dynamic context lists of verbs (... or be required to provide loads of filler outlandish actions)
Exactly the opposite. Because it's dynamic, you can just have a "look" for the windows if you want to, whereas with the static verb-coin you HAVE to have filler actions for interact and talk even if you have no meaningful action to provide (or do the annoying "can't do that" default action).

Quote from: Babar on Mon 16/07/2018 09:51:08
but is that really something exclusive to verbcoins? You could have a LucasArts style verblist that fills up with context sensitive verbs (up to 15 if you go by Maniac Mansion).
Hmmm, maybe, but how would it work in practice, though?
First, you'll need to reverse the clicking order, making it act basically like a verb coin (i.e click on hotspot and then verb instead of verb and then hotspot). And if you haven't selected a hotspot yet, there will be a ton of dead empty space (because you don't know which verbs will be available to you).
Of course, you can solve the dead space by just drawing the icons without any background, but then it's basically a verb coin only with the verbs layed out in the bottom instead of next to the hotspot.


Quote from: Babar on Mon 16/07/2018 09:51:08
Finally, your point about using arcs, I'm not sure I understand, could you please explain? The way I looked at it, lets say for simplicity, we have a total of 3 interactions (LOOK, USE, TALK), clicking something on screen would pop up a radial menu around that point, with those actions. If there's something near the upper right corner to interact with, however, those 3 actions would have to be either squeezed together in the lower left (and even for just 3 buttons on a radial menu, of half the size I have them now (16px instead of 32), that's a tight squeeze depending on how far in the corner the item is- and probably not work for 320x200. Or the buttons would have to be moved further away from the interactable, again making behaviour inconsistent.
I meant that there will not be a radial menu, that the menu will always be in arc form and auto adjust based on the number of verbs and placement. And yeah, it won't be consistent, especially near the edges, but I think it can work regardless. Is it consistent around the edges in your current design?

Quote from: Babar on Mon 16/07/2018 09:51:08
Is the verbcoin a useless or substandard UI if it doesn't have context-sensitive verbs?
I wouldn't say useless, but less efficient than a static verb-list imo. It can still be justified though if you need the extra screen space, I guess.

Babar

#14
Quote from: VampireWombat on Mon 16/07/2018 15:48:24
Context sensitive verbs wouldn't be exclusive, no. It's just the only way I can see a verb coin being useful. The game I was wanting to use such a system in had one character with fingerprinting, using a taser, and taking pictures as interactions.
Isn't that all doable (and in fact more intuitive) through inventory items?


Quote from: tzachs on Mon 16/07/2018 16:35:24
Exactly the opposite. Because it's dynamic, you can just have a "look" for the windows if you want to, whereas with the static verb-coin you HAVE to have filler actions for interact and talk even if you have no meaningful action to provide (or do the annoying "can't do that" default action).
But then you face the problem I mentioned before the "or"- If your only options when you click the piano is LOOK and MOVE, it becomes a bit spoilery, no? I realise two-click systems have the same issue, but it somehow seems worse with context sensitive verbs, because it actually lists it all out.

Quote from: tzachs on Mon 16/07/2018 16:35:24
Hmmm, maybe, but how would it work in practice, though?
I had just imagined 4 (or so) empty verb slots at the bottom of the screen, and when you mouse over something, they fill up with the possible actions you can take. Clicking on an interactable on screen would solidify those options, so then you can click one of them.

Quote from: Babar on Mon 16/07/2018 09:51:08
I meant that there will not be a radial menu, that the menu will always be in arc form and auto adjust based on the number of verbs and placement. And yeah, it won't be consistent, especially near the edges, but I think it can work regardless. Is it consistent around the edges in your current design?
The positions of the buttons relative to each other is always the same, but the position of all of them together relative to where the user clicked is not. As I said, currently it's just a fixed GUI, not a radial/arc menu.
eg:

vs:
The ultimate Professional Amateur

Now, with his very own game: Alien Time Zone

tzachs

Quote from: Babar on Mon 16/07/2018 18:37:16
But then you face the problem I mentioned before the "or"- If your only options when you click the piano is LOOK and MOVE, it becomes a bit spoilery, no? I realise two-click systems have the same issue, but it somehow seems worse with context sensitive verbs, because it actually lists it all out.
Right, it's spoilery, which is a problem, but all interfaces except the text parser are spoilery. Verb-lists are spoilery too (only with added frustration because some of the verbs are useless, but players will click those anyway).

Quote from: Babar on Mon 16/07/2018 18:37:16
I had just imagined 4 (or so) empty verb slots at the bottom of the screen, and when you mouse over something, they fill up with the possible actions you can take. Clicking on an interactable on screen would solidify those options, so then you can click one of them.
Right, so you'll have dead space here (the empty slots)- which is why I thought of maybe just having icons without a background, but it might look ok, I guess. Though, the way I look at it, it's not really a verb-list interface anymore but a hybrid between verb-coin and verb-list (because you reversed the actions from verb -> hotspot to hotspot -> verb, making it behave like a verb-coin).

Quote from: Babar on Mon 16/07/2018 09:51:08
The positions of the buttons relative to each other is always the same, but the position of all of them together relative to where the user clicked is not. As I said, currently it's just a fixed GUI, not a radial/arc menu.
Ah, ok, so why can't you do the same with a radial or arc menu? Just offset all of it when you're near the edges.

Babar

Quote from: tzachs on Tue 17/07/2018 18:53:20
Ah, ok, so why can't you do the same with a radial or arc menu? Just offset all of it when you're near the edges.
I could do that, yes. Would that make it better, though? I thought the point and advantage of radial menus was that you could reach every action with an equal mouse distance? If the mouse is not centred in the menu, that would no longer be the case, then.
The ultimate Professional Amateur

Now, with his very own game: Alien Time Zone

Danvzare

Ok, after a lot of thought, there's one problem with verbcoins, that I can't figure out, which no one seems to ever mention. The inventory.

If you use the left mouse button to bring up the verb coin, then what happens when you click on an inventory item?
You can either have the item be picked up like the BASS interface, thus preventing you from brilliant puzzles like using bubblegum with a talk command, or you can make the verb coin appear, and have the use command pick it up so you can use it, thus annoying the hell out of you since you always have to click twice to use an item.

Alternatively you could use the hold left mouse button to bring up the verb coin, but we've all already established that is a terrible idea,

Lastly you could use the right mouse button to bring up the verb coin, but I think that's only slightly better than holding the left mouse button in.

Which means the best way to handle the inventory is by not being able to interact with inventory items using the verb coin. Which in my opinion, defeats the purpose of having a verb coin. :-\

Does anyone have any ideas?

Cassiebsg

#18
The way it works on mine, you get the verbcoin on inventory items.
Left click picks up the item, right click opens the verbcoin for that item.
For instance, at the start of the game you need to smoke the cigar. You can either pick it up from the inventory and then click it on Starbuck, or you can right click and choose the hand. Both will do exactly the same thing, so just pick which one method you prefer. ;)

In the case of "open verbcoin on left click over hotspots" I don't know what the expected behavior the player would expect. But guess the logic would be to open the verbcoin, even if not much convenient.
There are those who believe that life here began out there...

Babar

#19
Quote from: Danvzare on Wed 18/07/2018 10:46:34
or you can make the verb coin appear, and have the use command pick it up so you can use it, thus annoying the hell out of you since you always have to click twice to use an item.
But every single interaction with the verbcoin is already like this- you always have to click twice to use do anything at all. Why would it being in the inventory bother someone more?
This is the solution I was using for my system, along with an inventory that pops down when the player moves the mouse to the top of the screen (since one of the advantages of verbcoin is that it doesn't take permanent screen space, I assumed that was important, so I didn't have a permanently onscreen inventory). Is there something wrong with it?
The ultimate Professional Amateur

Now, with his very own game: Alien Time Zone

SMF spam blocked by CleanTalk