#twine resources

[sofia-d-asb]

Twine/SugarCube ressources

Some/most of you must know that Arcadie: Second-Born was coded in ChoiceScript before I converted it to Twine for self-publishing (for various reasons).

I have switched to Ren'Py for Cold Lands, but I thought I would share the resources that helped me when I was working with Twine. This is basically an organized dump of nearly all the bookmarks I collected. Hope this is helpful!

Guides

Creating Interactive Fiction: A Guide to Using Twine by Aidan Doyle

A Total Beginner’s Guide to Twine

Introduction to Twine By Conor Walsh (covers Harlowe and not SugarCube)

Twine Grimoire I

Twine Grimoire II

Twine and CSS

Documentation

SugarCube v2 Documentation

Custom Macros

Chapel's Custom Macro Collection, particularly Fairmath function to emulate CS operations if converting your CS game to Twine

Cycy's custom macros

Clickable Images with HTML Maps

Character pages

Character Profile Card Tutorial

Twine 2 / SugarCube 2 Sample Code by HiEv

Templates

Some may be outdated following Twine/SugarCube updates

Twine/Sugarcube 2 Template

Twine SugarCube template

Twine Template II

Twine Template by Vahnya

Sample Code and more resources

A post from 2 years ago where I share sample code

TwineLab

nyehilism Twine masterpost

How to have greyed out choices

idrellegames's tutorials

Interactive Fiction Design, Coding in Twine & Other IF Resources by idrellegames (idrellegames has shared many tutorials and tips for Twine, browse their #twine tag)

How to print variables inside links

How do I create a passage link via clicking on a picture

App Builder

Convert your Twine game into a Windows and macOS executable (free)

Convert your Twine game into a mobile app for Android and iPhone (90$ one-time fee if memory serves me right) // Warning: the Android app it creates is outdated for Google Play, you'll need to update the source code yourself

[uroboros-if]

Multipronouns in SugarCube

Hello guys!! So sorry for my absence! I've made JS code free for anyone to use in their Twine game, which allows you to have multiple pronouns for your main character -- for example, she/they, she/he, she/he/they, whatever combination!

Some features include:

Completely customizable, and therefore neopronouns-friendly!

No limitations as to how many sets of pronouns you can add—you can add even just one.

Can determine singular and plural pronouns, even if you use pronouns that are different

Automatically switches between pronouns -- and you only need to write ?mcthey, ?mcthem, etc.

If you want to stick to one pronoun temporarily (e.g. so a character refers to MC as she/her and not switch to they/them mid-sentence), it is possible, too!

DEMO (playable online + downloadable) // CODE (+ documentation)

SHOUTOUT to @magiciansvoyage for inspiring me to do this for Twine!! :)

Why I Did This

I was inspired by @magiciansvoyage (!!!) who made multipronouns in CS, and I wanted to make multipronouns in Twine. Shout to them for this, they're amazing!!

I'm aware there are other gender code out there, but as far as I know, I don't know of any that can have multiple pronouns and switch between them using she/her and they/them automatically, for example.

How to Implement?

Just copy and paste the JavaScript code into your JavaScript, and copy and paste the variables into your StoryInit passage! Link to code here!

You can find the macro with in-depth explanation of what everything does here! I will include a How To underneath the readmore as well for a quick and dirty, but you will still benefit a lot from reading through the readme on GitHub.

How to Use?

This section will be more process-oriented than detail-oriented. For a better explanation on ?mcthey, $mc_they, and the <<gender>> macro, look at my readme on GitHub where you pull the code!

The Setup

Allow the player to add their pronouns for themselves as you would normally. Set these to $mc_they, $mc_them, $mc_theirs, $mc_themself, and $mc_plural (true if plural, false if singular).

Then, you can add this to your MC's pronouns with < < gender $mc_they $mc_them $mc_their $mc_theirs $mc_themself $mc_plural > > (had to add a space between the triangle brackets because Tumblr is weird). This will add that set of pronouns, which will be in rotation throughout the story. Make sure to add every argument, or else the macro will complain you've added too little.

When you want the player to add a new set of pronouns, repeat steps 1 and 2. You can keep prompting the player to add pronouns until they're satisfied. Make sure you give them a confirmation and reiterate what pronouns they've added, as there will be no way to remove pronouns once done (I may add this feature in the future if needed).

In-text

If you want to change between she/they, use ?mcthey or ?mcThey for capitalization. For her/them, use ?mcthem or ?mcThem. And so on.

If you want to use is/are, use $mc_is (a $ this time, not a ?), or $mc_was if you're writing in past tense. It will take the latest pronoun mentioned to determine whether to use is/are. If "they" was last mentioned, it will use "are". If "she" was last mentioned, it will use "is".

If you want to use a contraction like they're or she's, then use ?mctheyre or ?mcTheyre.

If you want to stick to one pronoun temporarily, use $mc_they, $mc_them, etc. It will stick to the last pronoun mentioned by ?mcthey, ?mcthem, etc.

If you want to use singular verb vs. plural verb, use $mc_s. Again, it will take the latest pronoun mentioned to determine whether to add "s" to a verb or not.

I also added $mc_has that follows the same logic as $mc_is to determine has vs have.

If this isn't super clear, make sure to read the readme. Also, feel free to DM or ask questions otherwise! :)

[interact-if]

Do you have any resources for someone looking to learn twine?

Hi Anon,

Please check our Tags list for coding resources for different programs, including Twine. You can also find a compiled list of resources for Twine on this page.

[manonamora-if]

The third volume of the Twine Grimoire is out!

[burning-academia-if]

Hey, this isn’t related to the story but I was curious how you got started with twine? Your story inspired me and I want to learn the program so I can make my own. I wanted to see if you had any advice or reference points. Perfectly fine if not, much love regardless!

I've messed with Twine on and off for a while now, so I'm not sure when I actually got into it? It was probably when I originally got into IFs back in like 2015 lol

I use Twine Sugarcube specifically, and I pretty much just watched/read through these:

Twine or Treat: a youtube playlist where a guy shows you how to make a game. Focuses more on making an exploration/puzzle game in Twine, but still has some useful/relevant info

Introduction to Twine: another video playlist, although again, I really only watched what I needed

The Twine Grimoire: there's 3, with each one going through more complicated concepts each volume, includes Harlowe as well as Sugarcube

Sugarcube (and Harlowe) also have their own documentation, but it's so Long and Daunting that I honestly just ignored it when I first started LOL. It's obviously useful to have and reference, but I always need to watch people doing the thing first. I really struggle with just reading through things personally. I'm comfortable enough with Twine now that it isn't overwhelming though lol

Also I'd argue you really only need to learn how to set variables to get started with IFs. Once you know how passages work and how variables work, you're almost set to make an IF.

I'd also recommend learning the very basics HTML and CSS just in case. There's plenty of Twine templates available for free on itch.io, but if you want to adjust them in any way, it's helpful to know CSS/HTML. Also just have fun and mess around! From visual novels to this IF, my learning process has honestly just been 'fuck around and find out' and it's been useful so far! I also think it helps with the inherent anxiety of trying something new too

But yeah, hopefully some of this is helpful/useful to you!

[kalorphic]

i may or may not have i IF in the making, a sapphic werewolf IF about learning to love yourself with everything. is pretty angsty but also sweet. :o)

I'm still not sure if i should, i don't know if people are gonna like it and coding scares me. :o(

Trust me, there’s going to be a following there for sweet but angsty sapphic werewolves (I will definitely be one of them) 👀 but at the end of the day, as long as you love your story and you’re interested in it, that should be all that matters (although I do know that’s easier said than done)!

As for coding, that’s still a massive hurdle for me and several other authors. Looking up tutorials on youtube or other IF accounts or using the many resources that are available online can be a huge help though and has got me through a lot. I will put in the tags the hashtags that I’ve used to tag those resources, so I’d suggest having a look through those!

Good luck though, lovely! I know it can all seem a bit daunting, but a lot of the authors in this community would be happy to help a fellow author out with coding if you messaged them or sent them an ask (I put out cries for coding help all the time lol). So, if this is something that you want to do, then I’d say go for it !! <3

[losergames]

A custom Sugarcube 2 template for desktop, tablet, and mobile.

🔗 - Check it out on Itch.io!

Features:

Splash page, start menu, and main body passage.

Custom navigation bar.

Links, buttons, and other UI styling.

Change font style, font size, line height and themes.

Toggle fullscreen, autoname saves, notifications, choice indicators, and passage fade transition.

ChapelR Macros.

and more!

i've wanted a simple template for myself for a little while now - so here it is! hopefully it's helpful to someone else!! there are annotations in the code to help but i am always down to answer questions about it. feel free to use it as is or hack it up - enjoy and happy coding!

[childrenofcain-if]

Yeah, as accomplished and impressive as the mc is, the mc is far from a Mary Sue/Gary Stu. Literally, the scene with V where they try to cook? I cringed when I heard their plans for it (but trying new things is crucial to being good at them). Not to mention other scenes just showing the unbalanced lifestyle (I found Elias asking if the mc had their credit cards to be particularly hilarious) and things they lack. It's not like the mc reaches and touches an extracurricular, and whoops, Bam, Magnus Carlson!

They've also suffered not insignificantly (I can't possibly imagine losing a parent at that young of an age, let alone one you're close to.) And that nosebleed thing must've been a hell of a scare. Also - your reflection looking like that (as in non human or supernatural) would be terrifying. My life isn't notably bad, certainly not all sunshine and rainbows, but if I was offered to become mc and go through all that they will or even all that they have?

Yeah, I think I'll pass. I also think some of it might be people thinking the mc is completely effortless - which I have no idea where they got that - but it's evident while they aren't average in intelligence, they busted their ass off even if they try to play it laidback style. They got the best tutors in the world from a very young age - but that also meant they were using those resources constantly and studying. Not to mention, I think somewhere it's mentioned how mc's time was basically entirely split between studying, extracurriculars, and volunteering.

They're not a god. Just a mortal who had very fortunate resources who worked very, very hard with those resources. Hell, take a normal person with mid resources and have them use that schedule of studying, extracurriculars, and volunteering, and I'd bet they would turn out pretty damn accomplished/impressive too, even if they're not as good as the mc. It's what Richard Feymann said - you can get a normal person to understand quantum physics. They just have to study it well, hard, and for a while.

Yeah, the mc is rich and have quite the privilege, but that doesn't mean they didn't work hard for it and also lost some things in the trade off (mc might know how to cook if they weren't studying "all" the time and took the time to learn, for example)

Mc kind of reminds me of what's referred to as a glass cannon - exceptionally good at one or a few things, but at the severe (and probably unworthy) detriment of being very bad at others. Does mc even know what FAFSA is?

Also, the literal fatal flaw? An actual list? And mc can be as stupid (wisdom stat, not intelligence) and just party all the time.

If anons were going to pick on a character for being "too perfect" then M almost makes more sense. 10 languages, God knows how many instruments, in a good position in HoS, is probably crushing all of their classes, and is majoring in philosophy which can get wildly difficult now and again before toning back down (Nietzche, Kant, and Hegel, probably). Oh, they're also an RA. They to me seem more insane than mc does, even a mc who is designed to be crazy like vocal lessons, two sports, robotics, and debate club, with no burnout. And yet, they are perfectly flawed.

The mc just worked exceptionally hard, is clever, and had literally the best possible resources to get the most bang for their (or rather, Elias's) buck. I think about anyone would - at least - do very well in academia and extracirriculars if they had the best tutors in the world training them in those respective areas from a very young age.

this.

[solarpaintdragon]

Friendly reminder to donate to the small indie resources

If you use a free art software like Krita or GIMP

If you use free and open source 3D software like Blender

If you use a free resource like PureRef, Quickposes, or AdorkaStock

If you use a free game-making software like Renpy, Twine, or GBStudio

Your favorite digital brush makers, like Devin Elle Kurtz

Your favorite free font makers, such as Blambot

feel free to add more

A lot of these are made and maintained by one person or a small team of people, who likely have day jobs and other responsibilities, but also create these resources for us to use.

Obviously these are all free to begin with for a reason. So you don't need to feel guilty using it if you can't afford to donate.

But If you can afford just $5 or $10 dollars, show the creators of your favorite free software your thanks. Remember that there are real people behind these resources who make them free and open source out of the kindness of their own hearts. It's easy to forget the human behind the screen.

[idrellegames]

As an IF author that does this with a "this is my job" mindset I find it hard to do other things in my day to day because whenever I pick up my phone I feel like I am at work and I feel like I constantly think about my story.

Do you have any tips or advice on how to separate myself from my work and stop thinking about it 24/7?

Thank you!

Having a clear division between work and regular life is really important. I think it can be a little harder to do if developing an IF isn't your full-time gig. If you're working a job or are in school and you're packing IF development on top of it, then it can get really tricky to balance.

I also think that if you're working on a large, long-term project, it's a good and normal part of the writing process to think a lot about your story. Not all writing is done when you are actively writing. Daydreaming about your characters and your story lets you work out different kinks and make new discoveries.

So, you have a couple of choices here. You can reframe IF as your hobby, the thing you do in your free time for fun. Take away the pressure of thinking about it like work. You can pick away at it when the mood strikes, write on your own terms, and if you stop having fun with it, it's okay to slam on the breaks and put it aside until you're ready to come back to it.

But if you want to continue treating it as work or if it is already is your job, then you need to set some boundaries for yourself. This is going to be different for everyone; what works for me might not necessarily work for you. But here are a few things you can try:

Set a schedule. Try to contain the times when you are actively working on your project to within certain regular hours. Set different times for different parts of your job. For example, I only do social media management (tumblr inbox and notifications, Patreon, email, itch etc) during the first couple hours of my morning and then the rest of my work day is for writing and/or coding. I don't get through everything, but it's okay. It's really important for online creators not to fall into the trap of feeling like they have to answer everyone immediately, otherwise you will not get anything done.

If you manage social media for your IF, have separate accounts for your personal stuff and work stuff. I have two tumblr accounts, one that manages this sideblog and the other for personal fandom things. Logging out of my work account and into my personal one means that I'm not seeing notifications from this blog and I'm not tracking Wayfarer stuff. It really helps me keep work as work and downtime as downtime.

Separate your work and downtime spaces. Sometimes it's just as simple as working in one room and relaxing in another. This can be a bit tricky if you only have one device that you work from. I have a PC so I can't move it around, so if I'm using it to game later I try to change up my space (by getting a different chair or changing something else about my set up) so I have some kind of physical difference to trick my brain into going from "work mode" to "relax mode". Sometimes I have to get out of my office entirely in order to get that sense of separation, otherwise I feel like I am constantly at work.

If you're on your phone a lot and you don't really use it to make your IF or have alternatives for writing, get rid of the apps that put you in a work headspace. I got rid of the tumblr mobile app a couple years ago and it was probably the best decision in terms of actually keeping me out of work mode.

Take time off. Give yourself a weekend. Pursue other hobbies, play other games, write things other than your IF. IFs take a very long time to make, you can't go at it 24/7 or you will burn out.

[lifesupreme-if]

Hello friend I'm not sure if you saw but dashingdon.com is being shut down at the end of the month and all the demos there will be deleted.

https://www.tumblr.com/if-addiction/772817972060454912?source=share

It looks like itch and cogdemos.ink are the hosting platforms people are moving to. Instructions on how to download and backup your game can be found here: https://forum.choiceofgames.com/t/how-to-see-code-on-dashingdon-com/26303

Wanted to make sure you saw in time to back your stuff up!

THANK YOU ARLO!!!!!!!!!!!!!!!!!!!!!!!

i am very fortunate in that @if-30x30 has been working on porting A Life Supreme to twine, but i have a hard time reading twine games sometimes and really would like to try to keep a CScript backup. this means the world to me and these resources are invaluable, thank you!!!!!!!!!!

[thesilicontribesman]

Logan Botanic Gardens, Port Logan, South Rhins, Scotland

[uroboros-if]

Please please share some coding/designing wisdom. Your game is so damn pretty 😭😭😭 Could you tell us what template you used and how hard it was to make it look like it is today? I imagine so much work must have gone into it

😭😭 I am no expert, but these are just my rationale/methods behind the visual choices I made!

For the template I used—I used Vahnya's Template! However, this post by @/manonamora-if has a whole section for templates that I wish I saw or checked out before making my IF! In another lifetime, I might've just used nyehilism's template to achieve the bottom sidebar instead of torturing myself learning how to do it... ;;

Below, I go into detail the timeline of designing Uroboros, as well as advice through the process I went!

Design Timeline

I started designing the UI late October 2022, and kept fixing, changing, editing it well into February and maybe a little bit of March 2023.

October 2022 - Early iterations of the design. Looked for stock images and began implementing it to add a background to the sidebar and the actual passages. Swatched some color palettes and began implementing them into the IF. Later decided to make the sidebar on the bottom instead of on the side. Also, added a title screen.

November - Testing different backgrounds for the IF's sidebar. Added a textbox to the passages, also worked on the black fade transitions.

December - Finished working on the sidebar background for both light and dark theme, began work on the background of the IF instead.

January 2023 - Finished working on the dark and light theme backgrounds! Started work on drawing the skill icons for light and dark theme, and finished!

February - Changed the title screen to look better on mobile, created a circle logo, added a border to the textbox. Also, made further edits for light theme.

March - Just remade the "Uroboros" logo.

If you're wondering why it took approximately 5 months to get to the final version—don't worry! I wasn't working only on the design for 5 months. My partner helped make the edits for the design, while I worked on coding them in and writing.

I spent a lot of time trying to get a grasp on Javascript, SugarCube, and HTML all throughout this time as well, to know how to fluidly add these things. Meaning, while I was working on these visual elements, I was also figuring out how to do the "looking" mechanic, black and white transitions, figuring out how Tweego worked, radio buttons, and so on.

Do note I've been busy the entire time throughout, so perhaps you can do this much quicker than I can!

The "Secrets"

1. Please—look at IFs you love! What are some visual aspects of other IFs that you love and want to include in your story? I started by analyzing parts of other IFs that I love. I liked Wayfarer's textbox; I liked how the choices looked in When Twilight Strikes. I liked the textboxes in the beginning of Zorlok. Find the things that amaze you about other IFs, and implement it your own way!

This seems like super basic advice—but trust me, once you think, "How can I put this in my game?" you will not only be able to have it, but most likely, you'll also learn a LOT.

While seeing how I could make the radio buttons, for example, I started researching. I googled "How to live change text?" and then I found out about jQuery, how to use the replace macro, etc. etc. JUST from researching how to do exactly one (1) feature.

2. What is missing in other IFs? Think about your own reading experience. I didn't like the clunkiness of some, how the sidebar is on the side when space on a mobile-screen is severely limited length-wise. So, I put the sidebar on the bottom.

I didn't like how other choices look in IFs, so I wanted a way to do mine that's nice and elegant(though it's still a little hard to read, admittedly).

Again, researching how to do the things you want opens many doors for you. I learned how to style <li> and change how bullets look, learned how to style links in Twine in general, etc. etc. again with just this ONE thing I wanted to change/add.

3. Don't do the work all by yourself. I struggled so hard because I hate asking for help. I was happy to Google other people's problems, but I never thought to open up my own thread or ask anybody in the community for help. Please, not only ask, but also—your work doesn't have to be completely original.

Use templates. Look at manon's amazing masterlist of things you can implement. I also have a few macro's that you can use, like multipronouns for MC, that does the work for you, for free.

Rip people's codes—respectfully. I'm not saying from other IFs, but online in other places. If they appear on help forums or are publicly available through places like CodePen, chances are that they're open-source or licensed in such a way that anyone can use it (e.g. MIT license).

Again, here is Manon's masterlist, which includes custom macros you can use in your game (Chapel, HiEv and Cycy are my high recommendations)! Additionally, here's my code for multipronouns here and my code for setting RO genders here.

4. MAKE IT READABLE!! Even if you want your game to look pretty... please, I'm begging you, make it easy to read. This is the most important thing ever.

I have a short attention span, and so does my partner. We reviewed the game to make sure we are NOT compromising the reading experience with our design. As much as we want fantastical backgrounds, we wanted to make sure it was at least not distracting. As much as we want gaudy styles, we want the actual passage to be suited for the long haul.

The most, most important part is to enhance the reading experience--not by adding things on, but by making it simple and intuitive. As someone in the computer science field, the user experience is CRITICAL. Put yourself in their shoes, think about them first and foremost.

Twine is amazingly customizable, and its powers can be wielded for good and evil. Plenty of amazing writers but inexperienced UI designers, especially from CoG, get into Twine. CoG almost completely takes away the design element, so Twine is a whole new ballpark.

Uroboros has a lot of pomp, but the actual textbox is uncharacteristically simple in comparison. The simplicity against an otherwise fantastical, but non-distracting background helps give it elegance. The sidebar, in contrast, is very eye-catching—but, it's also out of view most of the time, and isn't built for long reading.

To add on, make sure it's readable on mobile. I guarantee 80% of your readers are going to be reading your IF on their phone, and probably at 3 AM, so you will want the mobile to look as good as PC, or even better.

Closing Thoughts

Anyway, as basic as this advice is, this is really what guided my entire thought process behind my visual choices! -- Picking and choosing what you like from IFs, figuring out how to do them through research, and making sure your IF is built to be read for a while.

Thanks so much for asking, thinking that I have wisdom to impart!! 😭🫶💕

[interact-if]

Hello! I wanted to learn either twine or html in my spare time (I am not planning to be an author or anything, just maybe help someone code their story once I have an handle of it) which one do you think'd be better?

Hi there,

Twine is a compiler that creates games in an HTML file, from code in a specific coding format (Harlowe, SugarCube, Chapbook, Snowman, etc...). You do not require knowledge of HTML to create a game in Twine, but you will need to learn one of its format to code.

Still, HTML (and CSS) can be helpful in more advanced projects, especially in regards to building a UI.

If you are trying to help someone coding their project in Twine, we recommend you start with the chosen Twine format first.

~~

Note: the best program out there is one that works for you and the project. There are a lot of programs and formats to create IF out there, all with their advantages and faults. We advise you to look into a few programs and test them out, see what you could be comfortable with.

Note 2: while many programs have their own specific coding language, some may require extra knowledge in HTML/CSS, or JavaScript/jQuery, or Python, or C++, etc... depending on what you are trying to attempt.

[manonamora-if]

Chapel's Simple Inventory has been updated! Get the new version on GitHub!!

[fox-guardian]

renaissance faire prop making easy as shit just find a stick or two and tie em together. BOOM. staff.