Reproducing commercial adventure game GUIs in AGS

[SupSuper]

Merely an experiment I'm doing with AGS. Basically, I'm trying to reproduce the GUI of commercial adventure games with AGS. What's the point of this, you ask? Well, many:
- Giving remakers a starting point.
- Seeing how far AGS' capabilities can go.
- A good learning experience.
Or, most importantly, I'm dead bored.

I don't know if this is the right forum, if there's even any point of me doing this and posting this, but I'm still gonna do it. I understand there might be copyright issues, but somehow I doubt I'll get sued for using copyrighted graphics merely for demonstration purposes. Still, I hereby hold no responsibility on the use that others give to these GUIs.

But enough chit-chat. My first experiment. Reproducing the GUI of Leisure Suit Larry 1, the VGA edition. Here's some screenies:

Iconbar.
Control panel.
Inventory.

Don't mind the buttugly test room, it's meant purely for testing since I can't have a working GUI without a room.

This was purely based on screenshots, and not yet complete, so it's not a perfect reproduction.
All the buttons have normal/hover/pressed states like the Sierra ones and all the LSL cursors and help descriptions are in there, and it works just like the original. Or so I hope. Coded with the latest AGS and scripting techniques.

Issues I ran into:
- All of the GUI is "hardcoded" because AGS just wouldn't get things to work my way. For instance:
o The iconbar is a "Popup Modal" that I coded to work like a "Mouse YPos". This is because AGS' "Mouse YPos" automatically disappears after pressing a button and forces the Pointer cursor, which rendered the Help mode useless.
o To "simulate" the Help mode I had to make every button run a script, even those that normally just change the cursor.
- The Detail slider doesn't actually do anything since there's no such thing in AGS.
- The Inventory looks like the LucasArts one. This is because if I used the Sierra-like default, it'd be uncustomizable.
- The Control Panel buttons look rather ugly since AGS doesn't center button text vertically.
- Since AGS already uses Interact for selecting items in the Inventory, I had to use the unused Pickup mode looking like the Interact mode to reproduce Sierra's Interact mode in the inventory.

Things missing:
- LSL1VGA's fonts. I have no idea how to get those.
- Save/Restore/Quit dialogs haven't been changed.
- No Sierra icon in the About button in the Control Panel, dunno how to put that without a new button image.

I'll put up the AGS files if anyone wants to try it out themselves (just exporting the GUI probably wouldn't include the new sprites, cursors and script) and have a look at my sloppy coding.

Templates:
- Leisure Suit Larry VGA
- Full Throttle
- The Dig

[vict0r]

Correct me if i'm wrong, but haven't all of the commercial GUIs been remade for AGS already?

[scotch]

Pretty much, yes.  You can get templates and modules to do the more common ones, no need to do it yourself.

[Steel Drummer]

Kind of neat, but the GUI for LSL1 is the pretty much the same as the default AGS GUI. Most adventure games use the same GUI anyways.

[Huw Dawson]

Actually, recreating old GUI's yourself is a good way of practicing coding and GUI creation. And knowing how old GUI's work is a good way of learning how to make a new gui.

Basically, it's good practice. Don't discourage him. 

- Huw

[SSH]

- The Control Panel buttons look rather ugly since AGS doesn't center button text vertically.

Maybe its new in the 2.72 beta, but it does:

[SupSuper]

- The Control Panel buttons look rather ugly since AGS doesn't center button text vertically.

Maybe its new in the 2.72 beta, but it does:

Yeah it's only in the beta. I know that even though they're called betas they're fairly stable, I'd rather not use them.

Anyways, well, at least one member's encouraging me. Yes, I know there are already some modules and/or templates for this purpose. I've tried them. Some are German, some are rather old and buggy, and some aren't 100% accurate. In any case, my point isn't to replace them.

My point isn't to try to adapt old game GUIs to AGS, but the opposite. To find out exactly how the commercial games worked. To find out what's missing from AGS until I can create a 100% accurate GUI of a commercial game. And as Dave pointed out, it's good coding practice. I'd rather figure things out and code them on my own than use pre-made templates and modules.

If you think this is rather pointless, fine, I'll keep working on these on my own and not post my findings here.

[Steel Drummer]

Actually, it's sort of neat that he's doing this, but all the Sierra games pretty much have the same GUI, except with different style buttons. The GK1 GUI, however was neat. Especially how you could listen to conversations you previously had.

[Kweepa]

Interesting. Please continue to share.
More polished GUIs are always a good thing to have. For example, the LSL GUI has that "help" button. That's a useful addition to standard AGS.
I'd be interested to see an original GUI from you too, with the best of the best.

[SupSuper]

Thanks for the interest.

Actually, it's sort of neat that he's doing this, but all the Sierra games pretty much have the same GUI, except with different style buttons. The GK1 GUI, however was neat. Especially how you could listen to conversations you previously had.

I know most Sierra games have a similar interface, but I wanted to start easy Also, I picked LSL1VGA since it has the more "original" SCI interface.
And I don't have a huge variety of adventure games (most are Sierra/LucasArts titles) so there's not a lot of GUIs at my disposal. Still, if you want me to take on a specific game just let me know. If it's one I don't have just get me screenshots of what I need and tell me how it's supposed to work, and I'll do my best.

I'd be interested to see an original GUI from you too, with the best of the best.

What do you mean?

Anyways, this time I took on Full Throttle:
Inventory.
Verbcoin.
Control panel.
The only things missing are custom Quit, Save and Load windows (I just really hate making those ), everything else is in there. Even pausing! The verbcoin works a bit different from the original one though, you just have to click to use it, instead of holding your mouse button down. Easier to code, I doubt anyone will mind.

Issues:
- You can control the max position of a slider's thumb but not the min position, which doesn't always work out right with a custom slider background.
- The Full Throttle GUI has those "animated flames", and AGS doesn't support animations in GUIs (at least I don't think so). Though that's probably for the best since I make these out of screenshots, I don't know how to rip out the sprites (or even sounds, since the flames also made a sound).
- AGS doesn't have checkboxes, though it's not a big problem since I easily reproduced them with regular buttons.
- The buttons aren't exactly like the original ones, since LucasArts' button don't "sink" when pressed, they just change the color of the text. And AGS doesn't support that. Ok so I'm just splitting hairs.

So, what do you think? I've also thought if I should try to reproduce other features like minimaps or minigames but that'd probably be getting too close to reproducing the full game.

[Scummbuddy]

I grabbed the Full Throttle one. When I can get back into making games full time, perhaps the end of summer, I will definitly work on this template. It's great to see what you've done, and what you are doing is a bit help to the community. keep up the good work.

[Steel Drummer]

Can you make a GUI of "The Dig"? That one's kind of original.

[Ashen]

I agree with Steve - I'd like to see your own GUI with the best bits from the ones you've reproduced. (I think that's what he meant, anyway. I think it's a good idea, even if it wasn't.)

The Full Throttle GUI has those "animated flames", and AGS doesn't support animations in GUIs (at least I don't think so).

You can animate Buttons easily enough (Button.Animate), but backgrounds are a little trickier. You can do it, though, using the GUI.BackgroundGraphic property, and rep_ex (_always if it's Popup Modal), which'd be a nice addition for a later version.

[SupSuper]

Can you make a GUI of "The Dig"? That one's kind of original.

Hmm, that's a tough one. Some of the GUI's semi-transparent and I don't know if you can make icon-based speech options.

I agree with Steve - I'd like to see your own GUI with the best bits from the ones you've reproduced. (I think that's what he meant, anyway. I think it's a good idea, even if it wasn't.)

The Full Throttle GUI has those "animated flames", and AGS doesn't support animations in GUIs (at least I don't think so).

You can animate Buttons easily enough (Button.Animate), but backgrounds are a little trickier. You can do it, though, using the GUI.BackgroundGraphic property, and rep_ex (_always if it's Popup Modal), which'd be a nice addition for a later version.

- Well there's the GUI I made for a WIP game, but I'd rather keep it exclusive to the game.
- Well I'd still have to figure out how to rip out the frames from the game, since it's hard to make an animation out of screenshots.

[Steel Drummer]

I remember an amateur adventure game with an icon based talk system- Life Of D. Duck. I think it's pretty easy to do icons, but regular words are more popular, I think.

[strazer]

There's also an icon-based dialog system module in the Tech Archive.

Edit: Yeah, the file host is horrible. I've pm'd the author to update the download links. In the meantime, the module itself can be downloaded here (from the new AGS resource site).

[SupSuper]

There's also an icon-based dialog system module in the Tech Archive.

I found that but the download links don't work for me. In any case I'll leave it to the game designer to use whichever method he prefers, I'll just include the needed graphics.

Anyways, I got everything done, I'm only having problem with implementing "Any click" interactions (since The Dig doesn't have specific mouse modes). Mainly, they don't work. Is it because the default mouse mode is Walk? Surely "Any click" would mean "Any click"

[raimo]

I was working on an "any click" interface yesterday and used IsInteractionAvailable to determine what to do. If the player clicked the left mouse button the game would either do ProcessClick with eModeWalkto or eModeLookat if there is an interaction available. The right mouse button did eModeInteract or displayed a random "I don't know what to do with that" message if there was an eModeLookat available but no eModeInteract.

I only started with AGS a week ago so i'm not sure if this is the best way to do it. So someone please correct me if there's a better way.

I also did verb coin in a similar way by showing the coin-gui (could have also been a sprite, I guess) while Mouse.IsButtonDown and choosing the right action depending on the mouse co-ordinates. I didn't exactly finish it but it seemed to work ok. I think at least that could be done in a much nicer way tho.

[lemmy101]

Nice work...

"I understand there might be copyright issues, but somehow I doubt I'll get sued for using copyrighted graphics merely for demonstration purposes. "

I think if the lawyers came a'visiting they would have a few ports of call before they even looked at what GUIs you were using, demonstration or otherwise

We've shamelessly ripped the Scumm interface from Monkey Island 2 (with new GFX, of course) -- if we got told to take our game down because of it we'd be quite surprised (especially since Lucasarts themselves seem to have abandoned it for the usual modern "one click fits all" approach)

Might be nice to export your work as game templates for others to start making games with these interfaces. IMO nostalgia is an important aspect of indie point-and-clicks and playing a game with your favourite GUI helps take you back to those times.

That said I was never a fan of the Sierra style GUI.

lemmy

[SupSuper]

We've shamelessly ripped the Scumm interface from Monkey Island 2 (with new GFX, of course) -- if we got told to take our game down because of it we'd be quite surprised (especially since Lucasarts themselves seem to have abandoned it for the usual modern "one click fits all" approach)

Might be nice to export your work as game templates for others to start making games with these interfaces. IMO nostalgia is an important aspect of indie point-and-clicks and playing a game with your favourite GUI helps take you back to those times.

Well unlike you, I use the original GFX. I suppose it doesn't matter, but I'd rather be sure.
And there's already templates for download, I moved the links to the first post so you can find them more easily.

I was working on an "any click" interface yesterday and used IsInteractionAvailable to determine what to do. If the player clicked the left mouse button the game would either do ProcessClick with eModeWalkto or eModeLookat if there is an interaction available. The right mouse button did eModeInteract or displayed a random "I don't know what to do with that" message if there was an eModeLookat available but no eModeInteract.

Yeah that's what I did, but apparently "any click" interactions don't apply to Walk mode, so I switched the default mode to Interact and problem solved.

Anyways, The Dig GUI is done. It works nearly exactly like the original:
- The Inventory is 80% transparent but the inventory items aren't so I created 2 GUIs for the inventory.
- The Inventory is shown either by right-clicking or clicking the i button.
- The Inventory is hidden either by clicking the i button or moving the mouse to any edge of the screen. (you should also be able to right-click to make it go away but on_mouse_click doesn't work during Popup Modal GUIs).
- Clicking on any area performs an interaction if available, or a walkto.
- The mouse lights up if over an interactable area, the i button or an inventory item.
- The template includes the "special" Examine item.
- If the mouse is over an interactable area, it shows "AREA". If over an interactable area with an item, "Use ITEM with AREA". If over a character with an item, "Show ITEM to CHARACTER". If over the i button with an item, "Put away ITEM". If using the special Examine item over an interactable area, "Examine AREA".
- I even used a background image for the control panel this time, for extra... um... accuracy?

The only minor flaws are:
- AGS doesn't support what I'd call a "grid-based inventory". Like used in The Dig or Sam & Max Hit the Road, you've got this big grid where you can place items anywhere. When you take an item, it's removed from the grid, wherever you put it back, it sticks there.
This doesn't work with AGS, so you can use items on themselves. Unless you go to the hassle of coding add/remove for every item everytime you click on it.
- The Label on the bottom prevents mouse clicks, but I think this is fixed in the latest beta so no worries there.

Screenshots:




To demonstrate the GUI better you can now interact with the window in the test room.