Pages: [1]
  Print  
Author Topic: Hidden Object Game Tutorial for Classroom Use (Willing to pay for help.)  (Read 7438 times)
Offline (Unknown gender) LaunaS
Posted on: March 12, 2011, 10:52:38 PM
Member
Joined: Mar 2011
Posts: 4

View Profile
I was wondering if anyone here takes tutorial requests? My friend, Jennifer, is looking for a Gamemaker tutorial for a class of autistic boys she teaches. I'm trying to help her find one. Here's her original message:

"I teach 9 to 12 year old autistic boys. The thrust of the class is to create focus and hold attention. We've created comic books and trading card games. We've worked in CAD and StudioMax. We've made steampunk creatures. Then we started working through some of the tutorials at Yoyo Games. The boys are very dedicated and bright but they don't have the ability to take the skills from one tutorial and apply those skills in a different project/genre.

I was hoping to find a pre-existing tutorial for a hidden object game (like "Lost in the City" which the boys played and loved). I do have a budget for the class and would be willing to pay for someone's time to create a tutorial. I know what it needs to cover and could supply a checklist. Is anyone up to the task? I promise I'm really easy to work with.

By "hidden objects game" I mean a game like this one:

http://www.bigfishgames.com/download-games/4647/lost-in-the-city/index.html

There are cut scenes with narrative text and then intricate pictures. You have a sidebar menu of items you try to find hidden in the intricate picture. Sometimes you have to drag these hidden items onto other items in the picture to trigger events. Other times you get to take hidden objects and place them into your inventory (another sidebar or bottom of the screen panel) to use to interact with a future picture. When you find an item, it then automatically crosses off your list of items to find.

Sometimes there are breaks in the game with puzzles like slider puzzles, match-up games, or memory games but I think I can find tutorials for those kind of "mini-games" myself.

I don't need any 3D or animation. 2D would be fine. "Lost in the City" is just flat 2D pictures with "hot spots" for each hidden object. The objects can't be rotated in space or anything like that, just dragged and dropped. Also, players can't move around in the scene, they just get a flat picture peppered with hidden objects.

The "cut scenes" between the picture scenes can be literally just text over a background. No problem there. Not looking for any animation really.

I'm mostly concerned about how to set up the sidebars for the inventory and hidden object lists.

I hope I'm explaining this all clearly enough. The game I linked to can be downloaded for free (trial for an hour) if you want to get a really good idea of what I mean.

I can be reached by posting here or by email at blueartisans@gmail.com. If anyone would like to take a crack at a tutorial that would cover HUDs like described above as well as the other elements described (mouse pointer changing to clicked object, and clicking on all objects in any order triggering the end of the level). I have a budget of $100 for a complete written tutorial with screen captures. I don't need a sample game file created or graphics. Just the tutorial.

The class will be the second week of April so I'd like to have the tutorial in-hand by then.

I wish I was a savvy IT professional. I'm just a social skills and team project teacher working with some great kids.

Thanks everyone. I'm going to continue my search and will keep checking back here just in case.

Jennifer"

Is anyone willing to help? Again, we can afford to pay for your time, we just need help preferably by the end of the month and definitely by the second week in April.

You can contact Jennifer at the email above, post here, or even email me if you can help us.

Thank you so much!

Launa
Logged
Offline (Male) Josh @ Dreamland
Reply #1 Posted on: March 13, 2011, 11:19:59 PM

Prince of all Goldfish
Developer
Location: Ohio, United States
Joined: Feb 2008
Posts: 2953

View Profile Email
Seems interest isn't very high, likely because most of us are C/Java programmers or are on Linux. Have you tried the 64Digits community? They're a good balance of intelligence and... well, free time or boredom, I guess. Whatever component is missing here.

The problem may also be that a hidden object game is essentially 2 percent programming, 95 percent graphics, and 3 percent level design. Assuming you can provide the graphics, the procedure is simple (I will describe a more redundant, less technical method). You can deliver it to her with my regards, or you can wait and see if someone will draft out a GM6 of it.

1) Create a sprite for each hidden object.
2) Create backgrounds that are full of clutter and scenery, such as a messy classroom or a busy city street, as I assume is in the game you mentioned.
3) Create an object with any name (have your students assign it a name of their choice, but give them an example). This will be the parent object. It will not have a sprite. This is the most difficult concept in the operation. It has but one event, "Mouse Press", in which a few simple calls are made: effect_create_above() with your choice of particle as a flashy effect, instance_destroy() to remove the object from play, and score += 1 to, well, add to the score.
4) Create a controller object. This object checks in the step event, if (!instance_exists(<the parent object's name>)) room_goto_next();. This will keep the game going once they've found them all.
5) Have the students create several objects, setting the parent of each to the first object and setting the sprite to a different hidden object sprite. Have them place the objects in a separate folder for each scene to teach them organization skills.
6) Create a room for each background scene they've made. Have them place the objects from that category in them. Add a room to the end, and in it, set the background to a big, "You Win!" image. Optionally, in the room start code, add show_message("You win! Score: " + string(score));. Of course, the score will always be the same, unless you have the controller keep track of time.

Game Maker should automatically display the score in the caption. If it doesn't, use room_caption = "Score: " + string(score); in the step event of the controller.

Out of curiosity, how did you find out about this board?
« Last Edit: March 13, 2011, 11:42:09 PM by Josh @ Dreamland » Logged
"That is the single most cryptic piece of code I have ever seen." -Master PobbleWobble
"I disapprove of what you say, but I will defend to the death your right to say it." -Evelyn Beatrice Hall, Friends of Voltaire
Offline (Unknown gender) LaunaS
Reply #2 Posted on: March 14, 2011, 01:33:41 AM
Member
Joined: Mar 2011
Posts: 4

View Profile
Thank you, Josh! I'll pass this information along. I'm definitely not a programmer by any stretch of the imagination, just a researcher who wanted to help her friend.  :) I'll definitely look into the 64Digits community as well. Thanks for the suggestion!

I found the site in a pretty round-about way. I started at yoyogames and, when I didn't find the tutorial I was looking for, I went to a section suggesting other tutorial sites. This took me to Flagged Games, where the author of the tutorials mentions he writes mostly for this site (http://flaggedgames.wordpress.com/about/). When I saw there was a section for tutorials here and your main site mentions a few of your members work with Game Maker, I figured I'd see if anyone could help.

The kids in her class love to make their own graphics, so that will just be a part of the class. It's the work with the actual coding for the sidebars (one for the hidden objects list and one for the player's inventory) we need help with.

Thank you again for responding and being so nice to a noob like me :)

Launa
Logged
Post made March 14, 2011, 03:29:07 AM was deleted at the author's request.
Offline (Male) Josh @ Dreamland
Reply #4 Posted on: March 14, 2011, 08:46:10 AM

Prince of all Goldfish
Developer
Location: Ohio, United States
Joined: Feb 2008
Posts: 2953

View Profile Email
Oh, the irony. Look, fede, you're an asset after all!

Anyway, no problem. Happy to help. I read over my post again, and I think I should clarify that the controller needs placed in each room with hidden objects, while the parent object doesn't need instantiated anywhere, except implicitly through the child objects the students will be placing.
Logged
"That is the single most cryptic piece of code I have ever seen." -Master PobbleWobble
"I disapprove of what you say, but I will defend to the death your right to say it." -Evelyn Beatrice Hall, Friends of Voltaire
Post made March 14, 2011, 12:52:22 PM was deleted at the author's request.
Offline (Unknown gender) LaunaS
Reply #6 Posted on: March 14, 2011, 06:55:07 PM
Member
Joined: Mar 2011
Posts: 4

View Profile
:D Thank you, Fede!

Just as an update, I got another message from Jennifer, breaking down exactly what's needed for the game. If anyone has time for a tutorial (or even just a little list of tips I can use to create a tutorial myself) that would be wonderful!

"I'm looking for a tutorial on heads up displays that would help my students learn how to create two different HUDs. The HUDs would display on all interactive game screens but not on cut scenes. Game screens would be single screens, static, with objects that players click for various results. Once all "hidden objects" have been clicked by the player, the game would progress the player to a cut scene where the HUDs would not display. The player would read the text and then click "continue" to be progressed to another game screen with more "hidden objects."

This is what the HUDs on the game screens would need to do:

Righthand HUD: This HUD would appear along the righthand side of the game screen. The students call this the "Objective HUD." It would be a list of objects that the player has to find and click on. When a player clicks on an object, that item would be crossed off the list. When all the items are crossed off the list, the game progresses the player to a cut scene. This HUD will show a different list the next time it appears. Students would like to create a background for this HUD and they know they will need to make graphics of the words both written and crossed off.

Bottom HUD: This HUD would appear along the bottom of every game screen (though not on the bottom of cut scenes). The students call this the "Inventory HUD." When players click on a rare "bonus object" in the game, the object is crossed off the Objective HUD like a normal object (see above) but then an image of the object appears on the Inventory HUD. Only about five objects during the entire game will appear in the Inventory HUD. The Inventory HUD 's inventory needs to stay the same as the game progresses. Meaning, if a player picks up a rare flashlight in game screen #4, the flashlight stays on the Inventory HUD from then on.

The second function of the Inventory HUD, is that players need to be able to click an object on the Inventory HUD and that object then displays with a glow around it to signify that the object is selected and active. The player can then try to click on hidden areas in the game screen to activate special events. Example: The player adds a skeleton key to their Inventory HUD in game screen #6. In game scene #9 there is a locked door and a locked treasure chest. The player clicks the skeleton key on the Inventory HUD, and the key glows on the Inventory HUD. The player then clicks on the treasure chest and nothing happens. The player next clicks on the door, and the player is rewarded by being progressed to a screen with the locked door now opened.

Once a player selects an object in their inventory it should stay selected until the player clicks the object again to deselect it.

The students know that they will have to create different graphics for all of this -- glowing objects, normal objects, etc etc. They are very excited about each of them being able to create different background textures for their HUDs to customize the look and feel of their game.

I created a very basic template of what a game screen might look like.  Just to orient helpers to what I'm talking about."



Any ideas?

Launa
Logged
Offline (Male) Josh @ Dreamland
Reply #7 Posted on: March 14, 2011, 09:45:21 PM

Prince of all Goldfish
Developer
Location: Ohio, United States
Joined: Feb 2008
Posts: 2953

View Profile Email
In that case, you would have to edit the controller I described to draw those two HUDs. Add those images you drew atop the chickens as backgrounds, and use draw_background to display them. Use the following to populate it, in the draw event as well of course:
Code: (GML) [Select]
global.list = "";
with <PARENT OBJECT NAME>
{
  global.list += object_get_name(object_index) + "#";
}
draw_text(<x coordinate of objective HUD> + 16, 16, global.list);

This code requires that the students enter an English name for each child object.


The inventory HUD will make the game more complicated. Game Maker does not allow for multiple inheritance (nor does ENIGMA at the moment). That being the case, in the destroy event for each findable inventory item (i.e., your skeleton key), you will need to execute a code. You will also need a sprite for them as they will appear in the inventory, including any borders. Keep them all the same dimensions so it looks presentable. Give them each three subimages; the first subimage will be drawn in the HUD when it isn't selected, and the second will be drawn there when it is, and the third will be drawn at the cursor.

You will need a Game Start event in the controller:
Code: (GML) [Select]
global.inventory = "";
global.inventory_sprite = -1;
global.inventory_selected = -1

Then, just after you draw the other HUD,
Code: (GML) [Select]
var i, xx, yy; xx = 16; yy = <HUD Y COORDINATE> + 16;
for (i = 0; global.inventory[i] != ""; i += 1)
{
  draw_sprite(global.inventory_sprite[i], global.inventory_selected = i, xx, yy);
  xx += sprite_get_width(global.inventory_sprite[i]) + 4;
  if (xx + sprite_get_width(global.inventory_sprite[i]) > room_width-16) {
    xx = 16; yy += sprite_get_height(global.inventory_sprite[i]) > room_width-16) + 4;
  }
}

Add a Global Left Pressed event to the controller.
Code: (GML) [Select]
if (mouse_y > <HUD Y COORDINATE>)
{
  for (i = 0; global.inventory[i] != ""; i += 1)
  {
    if (mouse_x > xx and mouse_x < xx+sprite_get_width(global.inventory_sprite[i])
        and mouse_y > yy and mouse_y < yy + prite_get_height(global.inventory_sprite[i]) > room_width-16)) {
      global.inventory_selected = i;
      exit;
    }
    xx += sprite_get_width(global.inventory_sprite[i]) + 4;
    if (xx + sprite_get_width(global.inventory_sprite[i]) > room_width-16) {
      xx = 16; yy += sprite_get_height(global.inventory_sprite[i]) > room_width-16) + 4;
    }
  }
}

Again in the controller's draw event,
Code: (GML) [Select]
if (global.inventory_selected != -1)
  draw_sprite(global.inventory_sprite(global.inventory_selected), 2, mouse_x, mouse_y); // Draw the selected item at the mouse

Again in the controller, on Global Mouse Release:
Code: (GML) [Select]
global.inventory_selected = -1; // Clear the selected item
The inventory collectibles, as I mentioned, need to have something special in them to add them to the inventory. This is a script that you will call in the destroy event of EACH collectible inventory object; call it inventory_add(name,sprite):
Code: (GML) [Select]
var i;
for (i = 0; global.inventory[i] != ""; i += 1) {}
global.inventory[i] = argument0;
global.inventory_sprite[i] = argument1;
global.inventory[i+1] = "";
global.inventory_sprite[i+1] = -1;
A sample call is inventory_add(object_get_name(object_index),spr_inv_skeleton_key);.

This next script is inventory_remove(name or id).
Code: (GML) [Select]
var i;
if (is_string(argument0))
{
  var found; found = false;
  for (i = 0; gobal.inventory[i] != ""; i++)
  if (gobal.inventory[i] == argument0) {
    found = true; break;
  }
  if (!found) exit;
}
else i = argument0;
if (i == gobal.inventory_selected)
    gobal.inventory_selected = -1;
while (gobal.inventory[i] != "")
{
    gobal.inventory[i] = gobal.inventory[i+1];
    gobal.inventory_sprite[i] = gobal.inventory_sprite[i+1];
}

As an example, your treasure chest would make this check in its Mouse Press event:
Code: (GML) [Select]
if (gobal.inventory_selected != -1)
  if (gobal.inventory[gobal.inventory_selected] == "Skeleton Key")
  {
    instance_destroy();
    instance_create(x,y,obj_secret_hidden_object);
    inventory_remove(gobal.inventory_selected);
  }



I recommend that you provide the students with the two scripts, if they are not very good with code.
I've not tested any of the above code, but I have some confidence it will work if you put a little time into it.
You can send this to her as well, again with my regards. I can't continue abstract work on this game if it grows any more complicated, but I'm happy to answer questions. Peace.
« Last Edit: March 14, 2011, 09:48:57 PM by Josh @ Dreamland » Logged
"That is the single most cryptic piece of code I have ever seen." -Master PobbleWobble
"I disapprove of what you say, but I will defend to the death your right to say it." -Evelyn Beatrice Hall, Friends of Voltaire
Offline (Unknown gender) LaunaS
Reply #8 Posted on: March 16, 2011, 04:14:49 PM
Member
Joined: Mar 2011
Posts: 4

View Profile
Thank you so much, Josh! I'll send it her way!
Logged
Pages: [1]
  Print