Construct solves some of the difficult problems other gaming frameworks have when mixing HTML and canvas. Did you know that all HTML form controls sit on top of the canvas?! I see many tutorials that try to convince you to create list boxes, checkboxes, and radio buttons inside the canvas as image sprites. I ask myself, "WHY? When HTML form controls are native and 'liter' than additional image files."
So here's a brief tutorial about generating “RPG Background Stories” using simple HTML5 form controls. You can download either the Construct2 or Construct3 examples. See a demonstration in the Arcade: ( construct.net/en/free-online-games/create-rpg-background-stories-45382/play )
- Create a new project
- Add (insert) these HTML form controls plugins: a text input box, a list, and an “OK” button.
- Add other text for your page’s title, user instructions, dynamic story title, story text, and – if you’re wise – a legal copyright notice.
Now for the Event Sheet:
I’m using Global variables … yes! I’ve heard it all before about how spinach is good for you and that you should never use Global variables. Well, I’m here to tell you that one tastes horrible and the other simplifies this miniature project.
Download one (or both) examples. Open it and review what I’ve done. I’ve created a “subject”, “direct object”, and “possessive pronouns” variables. The user should select their favorite gender, and the event sheet will fill in these parts of speech accordingly. The “char” variable (e.g.: short for character) holds the main character of this story. I set some locations, offspring, years, and “story fragments” variables. Yes, YES! I could have used arrays, AJAX, loaded external data and posted it into the array(s). But you’re not paying for this tutorial … so …. Beggars can’t be choosers.
The first event assigns information into some of the Global variables – those things that won’t change.
Event 2 uses “every tick” because a gamer might change their minds. Using “every tick” is expensive on CPU cycles, but only two things are going on: assigning the character’s name into the variable, and into the story’s title. I also assign the character’s gender.
Event 3 is a function that is triggered by the “OK” button found in event #9. The button simply calls the “Create Story” function. I can hear you moaning from here. Event 4 to 8 doesn’t use arrays, JSON, external data, nor SQL queries. You can travel the "high road", but I'll take the "low road" and we'll see who finishes in Scotland before thee! I elected to use “choose” and populate it with phrase snippets. These nine-story fragments are “glued” together very soon. So slide down to the last action in event #8. This action takes the “Story” text box and concatenates all the story fragments.
You've now seen how this works. I use it in "The Rescue of NCC Pandora" -- the demonstration game from this book. and the Adventurers of Renown Quests -- both are available in the Assets store. The background story dynamically changes each time a gamer plays.