Resources - Interactive CYOA Creator Tutorial (2024)

Interactive CYOA Creator¶

• Online version
• Offline version at itch.io (one-time purchase of 2.50 USD or more)
• Interactive CYOA Creator Plus^(post)(repo)^ – By Wahaha303 / Hikawa Sisters. A modded version of the ICC that includes a massive amount of changes, such as automatically converting large images files to webp, border image setting, large backpack image download, a loading animation built in to the viewer, and other additions. Also fixes each row duplicating the background image and many more other fixes. Includes a new viewer.
• Lt. Ouroumov's Modded Creator – A modded version of the ICC that has many changes, such as generating longer IDs and requirement optimization.

• AvifCyoaCompressor^{(repo) (post)} – By blathers16/bubo_virginianus. A tool that compresses CYOAs massively by converting the images to the .avif or webm format, which supports both regular images and GIFs, dropping the project size anywhere from 30 to 55%.

• InteractiveCyoaVerifier^(repo) – By blathers16. This is a tool that checks CYOAs too make sure that there are no bugs.

• dct – By DelicateIntegral. A tool that can process ICC jsons in various ways.

  See Also

  Choice-based interactive fiction - IFWikiCreating Your CYOA - Interactive CYOA Creator TutorialNeocities - Interactive CYOA Creator Tutorial

  Some example tasks that it can do on ICC jsons (go to the repo link to get detailed info):

  • Disabling Images.
  • Refreshing Discord links, downloading images to a image folder and updating urls accordingly.
  • Converting Images (image format, image quality can be chosen) when saving after downloading.
  • Changing prefixes of urls/paths of images in json.
  • Converting Base64 embedded images to local images in image folder and updating urls/paths accordingly.
  • Converting images in image folder to Base64 and embedding in json.

• build.js/build.css – By DelicateIntegral. You can include these two files in your index.html to give users option to save/load/delete builds. Go to this release link to get the zip file containing these two files. To check how it looks, see this live deployment

• IntCyoaAutosaver – By Name0930. A userscript that automatically saves your CYOAs made with MeanDelay's or Lt. Ouroumov's creator. RegExp Download Organizer can be used with this to automatically sort your downloads folder.

Other Creators¶

• CYOA Maker – A creator that builds off of static images
• CYOA Generator – An AngularJS based web framework for making interactive CYOAs. Preview here.
• Chickens2's Engine – Engine and development environment for interactive versions of CYOA images
• CYOA Studio – An open-source static CYOA creator, for those who are less graphically-inclined.
• CYOAP – An online creator that apparently allows for advanced logic
• Corrosive-Forge (WIP) – An interactive CYOA maker & viewer made in Rust with the Leptos crate
• Moirai Interactive by Lt. Ouroumov – An Interactive CYOA Creator. Seemingly inactive
• Novelette (Unknown status) – Designed as a replacement/successor to the Interactive CYOA Creator, with the ability to play and create visual novels too.

Reddit¶

• r/InteractiveCYOA – A subreddit for Interactive CYOAs. If you make an Interactive, feel free to showcase it here!
• r/makeyourchoice – The original CYOA subreddit. Interactives are accepted but only if you link the static. If you are creating an original interactive, either export it as a static or create a static manually.
• r/nsfwcyoa – A subreddit for NSFW CYOAs.

Discord¶

Here are some discord servers that relate to CYOAs and Interactive CYOAs.

• PixelGMS's Interactive CYOAs – The primary discord server for Interactive CYOAs. It was made by u/PixelGMS, who is the creator of the r/InteractiveCYOA subreddit.
• If you join, go into #roles and get the CYOA Making Channels role. This will let you join #cyoa-making, a channel that'll help you should you get stuck on something.
• makeyourchoice – A discord server for the r/makeyourchoice subreddit.
• nsfwcyoa – A discord server for the r/nsfwcyoa subreddit.
• Check out #programming-and-interactives-tank for discussion on Interactive CYOAs.
• /CYOA/ – A discord server from 4chan.
• CYOA – Another discord server from 4chan.

Other¶

• https://arca.live/b/cyoa – Korean CYOA community

Tutorials¶

Credits to these tutorials and information sources for helping me make this tutorial.

• CYOA 101 by Dragon's whor* (NSFW) – A huge tutorial on how to make Interactive CYOAs
• How to guide on making interactive CYOAs for a first time creator. (Reddit) – This guide shows you how to upload your finished Interactive CYOAs to Neocities, which is also covered in this tutorial here.

Direct links:

• Imgur

• Google Slides

• Tips and Pitfalls for Interactive CYOA Creators (Reddit) – Contributed a fair amount to this tutorial.

• MeanDelay's Interactive CYOA Creator Tutorial – Made by u/PixelGMS
• Interactive CYOA Tips & Tricks (intcyoacreator) – Made by u/PNG-MAN.
• Uploading Interactive CYOAs onto neocities – By u/PixelatedNSFW.
• Here's how to put your CYOA onto Neocities – Also by u/PixelatedNSFW.
• Just curious, how do you start making CYOAs? – Advice in the comments
• Wanna make a cyoa... but how important is the design? – Advice in the comments
• How to make (format) a CYOA post? – Advice in the comments

Static CYOAs¶

Resources primarily for Static CYOAs. May still apply to creating Interactives.

• How to Create a CYOA – From the official r/makeyourchoice subreddit, this guide is focused more on static CYOAs. However, should you create an Interactive from scratch rather than adapting them, this could help you.
• Tips and Tricks for CYOA Making – By Hexall.
• On Building CYOAs - By Fox.
• Tips for writing descriptions – A post with many comments to help you write descriptions of your own content.
• Inkscape Guide – An (incomplete?) guide on how to use Inkscape to make CYOAs

Templates¶

• Interactive CYOA Template by Valmar
• Preview
• Download
• Static CYOA Template by Pubby – An HTML and CSS template for creating 4chan-style CYOAs.

CYOAs¶

Archives¶

Actual downloadable CYOAs.

• The Allsync – The Allsync is perhaps the definitive CYOA archive. It contains almost all static CYOAs, taking up a whopping total of 103.7 GB as of writing this.
• Alternate link.
• The Blog
• Patreon – Support the Allsync financially using the official Patreon
• CYOA (Drive) – A massive NSFW CYOA archive. Claims to have 80% of CYOAs (presumably only NSFW ones). Has 300 folders.
• TokHaar Gol's CYOAs – This is TokHaar Gol's personal Google Drive with their CYOAs.

Indexes¶

Catalogues and links to CYOAs.

• CYOA Archives – An absolutely massive sortable catalogue of both Static AND Interactive CYOAs. Includes NSFW. 10,612 entries.
• Infaera's Interactive Index – By u/Infaera. A solid index of Interactive CYOAs, containing 406 entries.
• Reddit post
• NSFWCYOA Archive – A massive archive of NSFW CYOAs. Includes Interactives in a separate sheet. Also has a lot of sorting options. 1571 main entries and 258 Interactive entries as of writing.
• List of Interactive CYOAs – From r/nsfwcyoa.
• TextBin
• CYOA List (Doc) — A document containing a list of CYOAs, static, interactive, SFW, and NSFW. 202 entries.
• Compilation of all Interactive CYOAs on r/InteractiveCYOA – By u/PixelGMS. It contains 57 entries.
• Reddit post
• Ikeran's Jumpchain Index – A list of Jumpchains

Stories¶

Websites where you can post stories made by CYOAs.

• SpaceBattles (SB) – A forum for all sorts of things. The Creative Writing section is where you can post and view stories.
• General CYOA Thread
• Creative Writing
• Questionable Questing (QQ) (NSFW) – Like the above, but is more lenient in terms of rules. Allows NSFW content.
• General QQ CYOA Thread – Check the Threadmarks for more indexes
• Sufficient Velocity (SV) – A splinter of SpaceBattles.

General¶

• Pixiv
• Artstation
• DeviantArt
• Danbooru – Anime images (contains NSFW)
• Gelbooru – Anime and Hentai gallery (contains NSFW)
• Google Images
• /tg/booru – Booru for /tg/
• Pinterest
• Zerochan – Anime images

Icons¶

• https://game-icons.net/

Fonts¶

• Google Fonts – Massive fonts list for use in your project.

Background¶

• Toptal Subtle Patterns – 500+ subtle background patterns for background flair.

Other Resources¶

• r/nsfwcyoa's wiki
• Image Resources – From r/makeyourchoice

Programming Resources¶

HTML¶

• Programiz – Easy to understand.
• W3Schools – Good reference.

CSS¶

• W3Schools – Reference.
• Guide to CSS properties and selectors
• A Complete Guide to Flexbox by CSS Tricks – Tutorial on Flexboxes
• Learn CSS Layout

JavaScript¶

• https://javascript.info/ – Not interactive. One of the best full courses on JavaScript. This tutorial actually inspired me a lot to create this tutorial.
• freeCodeCamp – A good interactive JavaScript tutorial.
• W3Schools – A good reference for when you want learn specific parts of the language.

Multiple¶

• freeCodeCamp – Interactive HTML and CSS tutorial.
• Mozilla docs – HTML, CSS, and JavaScript. Comprehensive, but can be hard to follow for beginners.
• Learn to Code HTML & CSS – HTML and CSS basics. Very simple and easy to follow.
• Interneting Is Hard – Friendly web development tutorials for complete beginners.
• The Odin Project – Web Dev Tutorials / Courses.

Miscellaneous¶

• Chooseyourownbooru – A booru for CYOAs.
• CYOA Thread Pasta – Pastebin that provided a lot of information for this page.
• Some Musings by a CYOA Author – A post by StarDustAnon. It contains musings and advice on how to create CYOAs in general. An excellent read.
• Interactive CYOA Tools – A home page for aronedwards91's Interactive CYOA Tools.
• ICCT Static Folder – It's the static/ directory of this tutorial. It contains a couple of useful things to download.
• ICC Comments – The Interactive CYOA Creator's comments section. Go to this if you can't find help anywhere else. You can also go through this, see if anyone else has had your problem, and see if anyone replied with a solution.
• General QQ CYOA Thread's Threadmarks – A list of indexes that helped out this page