Module 3: Make an adventure game in HTML
Objective: exercise your game design skills and teamwork with a simple HTML game.
Game plan
Ready to program? Awesome, me too!
Today, we'll embark on your first project, a Choose Your Own Adventure-style game.
If you're not familiar with the book series, the idea is to make a collection of pages for a player to navigate through. On each page, the player will choose some kind of action from a list of choices, each choice represented by a link which leads to other pages, revealing a story. Each page is either an ending with no further choices or a transition page with additional choices for the player to make. Here's an example.
Feel free to be as creative as you want! The only requirements are that pages correctly link together and that each member contributes at least three pages. Projects should be finished by the end of the week.
The process
-
Spend no more than 20 to 30 minutes planning your game. Planning is important, but don't get bogged down to the point where there won't be time left to implement it. A good plan should...
-
state the objective of the game. You'll probably want to spend a few minutes writing down any and all ideas that come to mind, then spending a few minutes more working as a group to pick the best idea.
-
determine the scope of the game. Keep it simple so you'll have time to finish what you set out to do--you can always add more as time permits.
-
create a provisional layout of the game states, or different pages a player can visit.
-
delegate tasks. Who's responsible for which parts of the game?
-
-
Start programming! Build a standard HTML template for your group to use, share it on Github, then start filling in the game states' text and images. Don't get too bogged down in style concerns; CSS will offer you many more options for handling those in the next module.
Next time
Awesome job! Next module will introduce CSS, which will be helpful for adding more visual appeal (colors, backgrounds, layout, etc) to your game. See you then.