This is a one-room dungeon made in Twine. That picture hovers on top of the page. You click on stuff in the picture to get a description of what it is, and what happens when your players fuck with it. The idea is that it serves the same purpose as an "Opener" does for board and card games - it's a short, simple little thing that doesn't need any prep time and slots in as a filler wherever you want. I meant to submit this to Zak Smith's twine contest, but I was too late.
I'd love to make a whole collection of these dungeons, so that you could rifle through them whenever you need some filler. I want to use original images, though. If you're interested, draw an image of a cool room and send it to me. I'll hook it up in twine so you can write out entries for all the items - or we could collaborate on writing entries, or something like that. If you want to go crazy, draw pictures of the room in different states (eg, submerged after the party's pulled a particular lever; Close-up images of some of the items they could find in there; sky's the limit). I'd love to see a bunch of these things pop up.
It's a boring process, but if you want to do it yourself instead, here's a quick tutorial on how I did it. You can download the source file here for extra help.
First, I used this website to create clickable zones in the image. You upload your image, then draw everything you want to click in it. Say I want you to open an entry by clicking the alligator: I right click, go "create poly", then draw around the alligator. When you're finished, right click and go "Get code". Click "Html Code". Copy and paste everything under "HTML Image Map Code" into a passage in your story.
You'll have a lot of lines of code that look like this:
<area alt="" title="" href="http://www.image-maps.com/" shape="rect" coords="392,476,514,581" style="outline:none;" target="_self" />
Each of these lines is for a single clickable zone. Replace the bit that says "http://www.image-maps.com/" with a link to the passage that you want to pop up when you click that zone. The syntax for a link in twine is: "javascript:state.display('******', this);" Replace ****** with the name of your passage.
No comments:
Post a Comment