#twine coding

[uroboros-if]

Fade to Black Macro V2

My previous code was completely incomprehensible; here is a MUCH simpler and elegant solution with jQuery. Thanks to TheMadExile for their post on splash screens! This is simply a modification of their original code. In this case, please do not credit me.

Features

Compatible with backgrounds.

Adjustable fade in, fade out, and delay.

Default is a black screen, but can use a web image instead.

Overall much more flexible, smooth, and clean.

Just get the JavaScript here and the CSS here. Instructions and demo on Itch.io, but instructions also below readme.

Usage

To use it, you must use the link macro WITHOUT an additional argument for the passage name you want to go to. Instead, include that in the passagefade macro that comes with the Javascript code.

The new macro above uses the following arguments: how long it takes to fade in the black screen, how long it stays, and how long it fades out in miliseconds.

You can additionally have a fifth argument with the web image URL in quotes to use an image instead. If you don't have a fifth argument, it will default to a black background.

[hubris-the-if-game]

HELP ME WITH TWINE I BEG

Does anybody know how to update a twine html on itch.io without completely destroying save files or uploading a new html and not being able to load an old save onto it. I have been searching the internet for hours and I still do not know.

---(a very distressed) Quinn

[the-six-that-thrive-if]

hiii, i love ur story, can i ask, what is it u do to make it so the player can make coices within the text, like when in chapter 1 you can change between smiling/sighing/grinning, also what is that called in the coding

Cycling! They're cycling variables! Now to add little marks like the rotation marks I have next to it, you can add it by yourself or code it in to automatically appear.

This is what it looks like.

<<cycle "$insertanyvariable"autoselect>>

<<option "option 1">>

<<option "option 2">>

<<option "option 3">>

<</cycle>>

They look like that

[loressa]

Succor postmortem:

https://loressa.itch.io/succor/devlog/919027/succor-2025-update-postmortem

[thewoodshungers-if]

Quick Question (Help)

Is anyone who use Twine Desktop able to reload the pages and update the passage / display in real time?

I'm working on some UI stuff and I always have to re-run and re-build everything from the start for the changes to show?

This was never a problem in browser, but.. The memory on browser is limited.. and I've hit that limit..

Help please, message me if anyone knows thanks!

[moonlightpeddler]

I've been working hard, writing code, implementing functions, and now that I'm finally done with the most important one, I realised that I can't test it because I haven't written up to the point where it would activate.

I'm sitting here, staring at a long list of variables and javascript, and ask myself why the hell I worked backwards instead of just following my schedule.

set $schedule to -1 if $schedule is < 0 Visible Confusion

[atrial-ofhorror-if]

Not me figuring out what was wrong with the code 2 hours after I rage quit 🥴🥴🥴

[troublebrewing-if]

Roadmap for Chapter 5

We've got outlines for Chapter 5, which will again include and A and B side. This time you are assigned to work on helping Al build their image and gather support among the people. You will get to choose between working along side Quinn and Reese or Sloan/e and Al.

I will also be working on the relationship point system to ensure that it is properly balanced. The other point of contention is how to implement a save system that actually works. Until I get it to work, it is being removed because it is reverting the PC's name back to Cassidy Kaylock and occasionally messing up their gender.

We will likely not release the next update until it is completed in its entirety, which will likely be sometime this summer, unless we end up working at a quicker pace than expected. Currently the demo is at 55k words, and we anticipate Chapter 5 will add approximately 30-40k words.

[noble-hater-rezan]

OMG IT'S ALMOST DONE!!!!

Can't wait to see Rezan again!!!!

Hey all, wanted to let you know the release date for CH13 is planned for June! By the end of May I'll give you a specific date, but I'm aiming for somewhere mid-June hopefully.

Hope you have a great week 💖

[uroboros-if]

Content Warning Macro

DEMO | CODE

(Dedicated to my friends from the sister Ouroboros server ♥️ A cute mini project I worked on for a few hours!)

A macro that allows readers to toggle for topics they find triggering/sensitive to hide them unless clicked/pressed. This simplifies the process by a lot, and comes with additional features!

For instructions, follow the link to the code above. Below, I will be explaining more in-depth about how it simplifies the process, and includes additional features. :)

Simplified how?

When you want to section off portions of the text as it has sensitive content, you may use an if condition to check if the reader is sensitive to it, followed by a linkreplace.

However, doing this multiple times can be exhaustive. It also likely requires you to copy the text twice, for both in the case the reader is sensitive, and the case they are not. This can be unwieldy if you have a lot of paragraphs or a big one. See example below.

Using the macro, however, you can shorten it to this:

Not only is this much more readable, it does not artificially inflate the word count of your game and take up space, and it is also much quicker to write!

And some other neat features...

Can section off only parts of a paragraph!

Content warning text is generated automatically, but can optionally be rewritten!

Content warnings only list sensitive topics relevant to the reader, even if that section has multiple other content warnings!

[riverflow-studios]

KUWTW Dev Log #2:

I am aliveeeeeeee!

I know I’ve been inactive af but aaaaa! I had no internet until JUST now

Unfortunately, that only means that I am way behind on my work. But worry not! As I write this dev log, I'm working on the game. I already got a chuck of the scenes worked on, and started a new one.

The game, however, will take very long. As any game! But Im alone on this project, so the process is way slower than it should be.

The art is its own can of worms- similar situation, yet even slower. I honestly don’t know much digital art, so it’s taking its time.

Overall: the project is still ongoing! Just a bit slower

[fables-if]

The Night of Ataegina and Betatun

A high fantasy interactive fiction story based on Spanish mythology, folklore, and paganism. Set in modern-day Spain. Most locations and all the characters are fictional, except the type of fae that will be seen during the story.

Summary:

After leaving Imeria during your eighteen birthday to chase your dreams and college education, you return to the little village in Southern Europe that saw you grow up after receiving the horrible news that Caterina, the old woman that took you in after the death of your family and your adoptive grandma (or yaya, as you call her), is terminally ill and has a few months left.

During your return, Imeria is set in motion to host an ancient festival and masquerade. It’s supposed to honor two ancient Iberian deities, one called Ataegina, ruler of the underworld, and the other one Betatun, deity of fertility. Most Imerians don’t believe in the ancient legends but those who do, like Catelina say that it’s the most dangerous night of the year because the frontier between the mortal and the magic realm is so thin anything can happen. 

Returning home under the threat of Caterina dying is already hard enough, but will you be able to adapt back into Imeria and rekindle old friendships or form new ones? Will you uncover the deep and rich history of your home and the old magic it carries? 

We shall discover it all very soon.

Features:

Customizable mc: Gender, pronouns, and physical appearance

Build friendship or romance with four characters.

Learn more about Spain's folklore and pagan traditions. Uncover your family history and your abilities.

Develop your MC's personality as you go

Two characters are gender locked but you can choose the gender identity of the other two

Your choices can't be undone and will have consequences.

Characters:

Caterina: An older woman, well into her 80s who took in the MC after most of her family died. She doesn’t seem to have a family of her own, or at least that’s what Mc believes. Caterina has a sweet disposition, always up for helping anybody. She raised MC with the stories of the folklore of their village, so she will always know how to honor the traditions of Imeria. MC doesn’t remember very well what she did for a living but she used to do fortune and tarot reading for some villagers and they usually came to her for advice and help. 

Ana: She runs The Golden Apothecary, a small store where she sells traditional remedies. Her family has run the Apothecary forever, and it’s considered a family craft. Ana has golden shoulder-length wavy hair, almond ocean-blue eyes, and a button nose. She’s no taller than 167cm, with a voluptuous body and soft features. Ana is in her late 20s to early 30s.

Personality-wise, Ana is soft-spoken, sweet, and very open-minded. She strikes to accept everyone with open arms, as long as they’re good people. Unfortunately, some individuals mistake Ana’s kindness with weakness, which is untrue. Ana is extremely smart, stubborn, and strong-minded, she’s always kind but only to those who deserve it. She can be a lot to reckon with if she deems you a bad person. Ana dreams of seeing the world but there is something tying her to Imeria.

Supernatural or not (spoiler):

Ana is a Xana, a river spirit that helps those she finds worthy by offering them pure water or gold. Some people believe that Xanas interchange human babies with fairy babies. As a river spirit, Ana can’t be apart from her river or she’ll suffer horrible consequences.  She met Caterina when Caterina was a young maiden and bathed in her river. Ana saw the purity of her soul and gifted her magic. Xanas are mythological creatures that originate from Asturias, a northern region of Spain with strong Celtic influences.

Anne, An or Antón: Anne/An/Antón works on their family farm along with some of their siblings. The Zamora’s farm supplies Imeria with its fresh produce. Everyone knows the family since they’re a happy and amicable bunch. Anne/An/Antón is pretty tall, around 185cm, they have wide shoulders, a big frame, tan skin and are chubby. The shape of their face is round, with little freckles, big green eyes, long eyelashes, and a hooked nose. They have short straight brown hair and are a bit hairy.. Their voice is deep and loud, almost booming, exactly like their laugh. Anne/An/Antón is super extroverted, knows everybody in the village, and has a sunny and sweet disposition. They are super strong, from all the physical labor but their secret hobby crocheting, they’re always making little dolls for the children of the village or making clothes. In general, they’re super well-liked and have a golden heart. Anne/An/Antón is the MC's childhood best friend and neighbor. Unfortunately, after leaving Imeria they didn’t keep in touch. Anne/An/Antón is 25 years old. 

Supernatural or not:

Anne/An/Antón is an Ome, a mountain spirit, and a giant made of rock that turns into mountains after living for many centuries. Their whole family is made of Omes graznidos. Omes Graznidos are a type of mythological creature that originates from Aragón, a northeast region of Spain surrounded by mountains.

Diego, Diana, or Dix: Diego/Diana/Dix is new in Imeria, they have been living in the little village for less than a year. Nobody knows where they came from, they remain a bit of a mystery for everyone. They set up a popular lounge called “The Velvet Moon” in the middle of the village, very exclusive and chic which clashes with the rest of the decoration of Imeria. Still, the young Imerians love the place. They’re 31 years old but look slightly older. 

Diego/Diana/Dix is of average height, standing around 174cm, they’re pretty slender, with a petite frame and olive skin. They have an angular face, with sharp features, long shaggy black hair, and clear eyes that almost seem silver-colored. Diego/Diana/Dix keep mostly to themselves and can be seen riding their motorcycle around the village. They have a limp and can be seen using a cane. As mysterious as they are, they’re pretty talkative once you get to know them, and are very protective of those they love. Diego/Diana/Dix seems to be interested in the MC, since they’re always watching them, and seem to have a secret that they don’t want to share with anybody. They are very self-reliant, have learned to survive by themselves and have a hard time trusting others, but once you have earned their trust, they’re loyal to a fault. 

Rumors say they have a criminal past and are mixed with a bad crowd, but not everything seems as it is.  

Supernatural or not (spoilers):

Diego/Diana/Dix takes the form of a giant spectral dog, with long black hair and a permanent limp, which is called dip by Spanish folklore. They’re supposed to be emissaries from the devil and they suck the blood of the livestock at night. However, not all legends tell the entire truth. 

Bingen: Bingen lives in the forests near Imeria, where he has a small cottage and a little bit of land where he has a vegetable patch. Bingen is a well-known journalist for online newspapers. He’s an ecologist, and his coverage is mostly about the natural world and ecologism. 

Bingen barely sets foot in Imeria, he is auto-sufficient but he comes down to the village to visit Ana and her apothecary, and to buy a few things he needs.

Bingen has a square jaw with high cheekbones, sharp green eyes, and long blonde messy hair, usually kept in a braid. He has a sweet face with a straight nose, and round brown eyes that resemble a little lamb. He’s the tallest of the bunch, 1’90cm, very muscled from all the exercise, and has a big frame. He loves hiking and is very in touch with nature. Bingen has a hard time socializing, preferring being around animals and plants since he understands them better. He, as intimidating as he looks, is a sweetheart and really craves human connection. Bingen is not talkative but expresses his feelings and emotions through his actions. He might have a hard time telling you he cares about you but he’ll help you install furniture or will make you soup when you’re sick. He always shows up when you need him to.

Bingen recently led a rescue of a few teens who got lost in the forest and saved them from a wolf attack, since then a lot of the villagers have respected him a lot and brought little sweet treats to his cottage. He's in between 27-33 years old.

He has struck a friendship with Ana, who frequents the forest often.   

Supernatural or not (Spoilers):

Bingen is a Basajaún a creature that inhabits the forests of The Basque Country, Navarra, and some parts of Aragón. Basajaúns are described as giant hairy men who protect the livestock, and warn shepherds of wolfs during the night. Basajaúns are seen as protectors of the forest but also creatures of great strength and kinda dangerous. 

Rami: A green weasel-like creature, with a long and flexible body, similar to a snake, and little tusks. They’re friendly and sweet and help guide the MC during their adventure. Rami’s fur has healing qualities. 

Extra:

This project is made by an absolute amateur in coding so it's going to take a long time. I have been writing since forever so I trust in my ability to create a good and entertaining story and I hope you guys stay for the ride.

The Night of Ataegina and Betatún is also going to be a surprise gift for a dear friend of mine who absolutely loves Interactive fiction and this project (if I get to finish it;_;) might be the way I ask her out since we both harbor strong feelings for each other. So let's hope she doesn't find out about the project before it's time.

[thdalsk]

This was originally just supposed to be my MC in her dress but then I drew M’s reaction and things spiraled from there… 🙂‍↕️🙂‍↕️

The Ballad of the Young Gods by @childrenofcain-if! <3

[manonamora-if]

The 100% Good Twine SugarCube Guide!

The 100% Good Twine SugarCube Guide is a coding guide for the SugarCube format of Twine. It is meant as an alternative to the SugarCube documentation, with further explanations, interactive examples, and organised by difficulty. The goal of this guide is to make the learning curve for new SugarCube user less steep, and provide a comprehensive and wide look over the format.

VIEW / DOWNLOAD THE GUIDE!!!!

The Guide is compartmentalised in (currently) four categories:

THE BASICS or the absolute basics to start with SugarCube. No need for extra knowledge. Just the base needed to make something.

THE BASICS + adding interactivity, and creating a fully rounded IF game May require a bit of CSS knowledge (formatting rules)

INTERMEDIATE MODE adding more customisation and complex code Will probably require some CSS knowledge, and maybe some JavaScript

ADVANCE USE the most complex macros and APIs Will surely require some JavaScript/jQuery knowledge

Note: The Advanced Use includes all the APIs, macros, and methods not covered by the previous categories. This includes code requiring very advance knowledge of JavaScript/jQuery to be used properly.

Each category explains many aspects of the format, tailored to a specific level of the user. More simpler explanations and examples are available in earlier chapters, compared to the later ones.

If something is unclear, you found a mistake, you would like more examples in the guide, or would like a feature covered, let me know!

The Guide currently covers all macros (as of SugarCube v.2.37.3), all functions and methods, and APIs. It touches upon the use of HTML, CSS, JavaScript and jQuery, when relevant. It also discusses aspects of accessibility.

The Guides also provides a list of further resources, for the different coding languages.

The Guide is available in a downloadable form for offline view:

HTML file that can be opened in Twine

.tw file that can be opened in Twine

source code, separating the chapters, .js and .css files

GITHUB REPO | RAISE AN ISSUE | TWINE RESOURCES TWEEGO | TEMPLATES | CSCRIPT 2 SG GUIDE

Twine® is an “an open-source tool for telling interactive, non-linear stories” originally created by Chris Klimas maintained in several different repositories (Twinery.org). Twine is also a registered trademark of the Interactive Fiction Technology Foundation.

SugarCube is a free (gratis and libre) coding format for Twine/Twee created and maintained by TME.

VIEW / DOWNLOAD THE GUIDE!!!!

As of this release (v2.0.0), it is up to date with the version 2.37.3. If you are looking for the guide covering SugarCube 2.36.1, you can find it on my GitHub.

Note: the Guide is now complete. There won't be further substantial updates.

[thesovereignsring-if]

Hello! Your IF story inspired me to start my own IF game

Im thinking of using twine

And I would like to ask you if you had any tips or advice

Thank you!

Also side note I’m really excited and very interested in how this story is going to play out I already love the cast and can’t wait to see the rest!

OOoo thank you so much! I'm very flattered the game inspired you!

Twine has many different story formats, each with their own pros and cons. I personally use Sugarcube (I think next to Harlow, it is the most popular) so all my tips will be for Twine Sugarcube:

Basic tips:

Bookmark the Sugarcube V2 Document. This is your bible. It will have everything you need to use Twine. It's a daunting read, but I use it to troubleshoot when I forget how Macros work. I always have tab open for it.

Download a Twine Template. If you are brand new to Twine and making IFs, I heavily suggest downloading a template or two. Most of them come with tutorials and examples on how they work. Sometimes they even provide more helpful resources on Twine. I use Vahnya's Template II that I modified myself afterwards.

Study from pre-exisiting Twine IFs. Might be controversial, but I personally believe that diving in and seeing how other authors code and structure their stories helps a lot. Eventually you'll figure out a system and structure that works for you. It might not work for all games, but most Twine games can be downloaded and opened up in the twine editior. If you're worried about spoilers or upsetting people, feel free to download my game and see whats inside. I make multiple copies of the game, so any build I have out in the public is not the original build and therefore have no spoilers. I know it will look insane when you open it, but there's a method to the madness.

Writing and Planning:

Making an IF is no joke! Plan your story out, know your big variables, your branching routes and at least some part of your ending!! Try to stay as organized as possible. These projects and can will spiral out of control if you're not careful. I suggest having a giant excel sheet with tabs for important variables, chapter/scene breakdowns, wordcount and characters ect. Updating it will be a pain (that I am guilty of not doing) but will make developing easier. Even if you don't make a big project, its still good practise to do it.

#Stylesheet:

All the code in here relates to how the game looks. You can fiddle in there to configure the game to look how you want it to look. If you even want to see what element is tied to what ID code, the best thing to do is playtest the game (build >> play) and then leftclick and select "inspect element" you browser will open up the developer window and you see what elements are tied to what and even play around with the contents to test out CSS elements you like.

This website is a great resource on using CSS and other coding language. I personally used it many time to modify my game.

Helpful resources and Macros:

Chapel has made a LOT of custom macros that you can add to your game. You can find the list here.

But the most important one is the Pronoun Template. It might be confusing at first but one you understand how it work, its a great tool to have. You can even add gendered titles so that they work with the pronoun template.

Idrellegame is a great resource on coding in Twine. You can find the list here. It helped me out when starting out.

Exporting to Itch:

I never see people talk about Butler when it comes to uploading If games onto itch.io, so i'm doing it now.

What is Butler? Its a command-line tool that Itch made to upload your game onto Itch.io quickly and reliably.

The documentation is here. And I suggest coping and pasting the export codes onto a doc so you can use them for every update afterwards.

Here is a youtube tutorial you can follow along as well: https://www.youtube.com/watch?v=_JCJa5iWREM

I personally have the Butler on the Itchio.app so that's its always up to date.

Thats all I can offer off the top of my head, if you or anyone wants some help on something specifically, feel free to DM me or drop another ask in the inbox. Always happy to help. Working in twine is very overwhelming for newcomers.

[idrellegames]

When would be an appropriate point to open a blog for my story? I plotted my whole story, got the story down, finished 95 percent of the code, started writing a little, and now I just need to fully figure out the rest of my cast (procrastination 😬). I'm a little confused when and tbh... how lol. Been questioning myself a lot. I want to start early to build a fanbase, but I also don't want to lead anyone on. You've been around a while, so I feel like you know your stuff.

So, there's really no right or wrong answer to this kind of thing.

But I think the most important thing is that you need a substantial demo and to know exactly what your vision is for your game before you start to build an audience. Don't build a fandom before you have something for them to be a fan of—story summaries, character introductions, and all that kind of stuff is well and good, but if players don't have something to play, you're setting them (and yourself) up for disappointment.

You need to have a demo that is functional, substantial, and gives the player a solid idea of what your game is about and how it is going to play. You need enough material that what they can play is satisfying and leaves them wanting more.

I think you also can't underestimate the impact a growing audience has on your work, and how excitement over in-development ideas can influence you in ways that will ultimately harm your game. The audience doesn't know what you want or what your vision is, only you do. Know exactly what you're creating so you can stand firm on your ideas.

My one regret in starting my blog when I did (which albeit was for a completely different game, Wayfarer as it is conceptualized now didn't exist when I made this blog) is that I announced too many characters too soon. If I was doing this over again, I would keep my mouth shut about any upcoming characters, especially companions, until they were actually in the game—even if it meant that no one knows who they can and cannot romance.

Companion/RO lists are the number one marketing tool for IF games on tumblr, but in practice this only works for a small number of games with a very specific structure. If these characters are not in the game from the first chapter, don't say anything about them. Don't hint. Don't announce. Don't offer information. Keep it blind.

Development is always, always, always going to take longer than you expect.

Trust your gut instinct. Keep more things to yourself than you think you need to. It's better to let future updates surprise your playerbase than to let hype for a future character or moment lead to disappointment when it ends up taking you a while to get there.

Good luck!