If you are interested in participating in eXperience Play (XP) remotely, I am going to provide a to-do list of items each week. These to-do lists will include a variety of tasks such as playing games, reflecting, blogging, and portions of game development. If you complete all five to-do lists, you will produce an educational text-based game in five weeks. For more information on this professional development, read this blog post, visit the eXperience Play website, or contact me via Twitter or email. This post corresponds with the fourth session of XP.
Part 1 – Game Development
1. Review the following Twine Syntaxes and guides:
You can customize your Twine game in various ways using the Story Stylesheet in Twine and some CSS (Cascading Style Sheets) code. Using CSS, you can alter the presentation of your game including background and text color. For in-depth CSS view this guide and these resources. Otherwise, check out the basic Twine CSS below (copy any code you want into your game’s Story Stylesheet):
Example Twine CSS Code
- Remove the “back arrow” button in your Twine game:
tw-icon.undo { display: none; }
- Change the background color (you can use color hex codes here):
html { background-color: black; }
- Change the text color (you can use color hex codes here):
tw-passage { color: green; }
- Example CSS, (click here to see what this does):
/* Text between these symbols contains my comments. */
html { /* This CSS changes the background to a random image. */
background-image: url("https://source.unsplash.com/random/1280x720");
background-size: cover;
}
tw-story { /* Changes to text and text box, respectively. */
color: black;
text-shadow: 1px 1px grey;
font-size: 24px;
border: 5px black;
border-radius: 20px;
background: rgba(255,255,255,0.9);
padding: 20px;
}
tw-link { /* Changes color of links. */
color: rgb(51,179,166);
}
tw-icon.undo { /* Removes the undo button. */
display:none;
}
If you want to dive deeper, here’s a look at Twine syntax and CSS:
2. Using the above syntaxes, guides, and everything you have learned in the past few weeks, continue working on your game until it’s complete.
For reference, here’s an example Twine game from a participant of XP:
3. Find someone to play your completed game and give you feedback. Use this opportunity to make more revisions. Again, I’d recommend getting reviews from individuals in your vicinity since your game is stored locally on your computer for now.
Part 2 – Professional Development
4. Write a blog post about your experience building your game using the following prompt:
- Document how your game has changed from last week. I encourage you to include a screenshot of your final product.
- Reflect and write about how peer-review and feedback has impacted your game’s design.
- Research and define “Peer-Peer Learning” in your own words.
Get your Twine game as closed to complete as possible by October 3rd. Share screenshots of your progress with me via Twitter or email or reach out with any questions.
The featured image is provided CC0 by John Hult via Unsplash.