Visual branching passage system

0 favourites
From the Asset Store
This music pack covers differents situations for visual novels, anime games and many more!
  • Ashley's post got me thinking it wouldn't be that hard to make this out of an event include.

  • The Dialogue Designer Parser example uses the array editor which is why you can't run it in free version.

    Dialogue designer and that plugin are exactly what you are asking for so should be your go to solution if you're willing to shell out for a subscription.

    On another note, creating a dialogue designer style app (using C3) that exports dialogue trees to an array seems like an interesting and not too complex project idea.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • I concur you could make your own editor with construct to write blocks of text and drag them around. You could then export it into any format you like.

    You could also make the editor in the game you're making and utilize local storage for fast iterating instead of having to export and import the file every time you make changes. You'd just need to export and import the file before exporting your game since local storage isn't carried over.

    Guess the basic structure of the data you'd need is: the name of the passage, the text of the passage, and a list of the branching options (text and passage to link to). Personally i'd do it all as plain text like this and parse it. But if you make your own editor you can visualize the links between passages, and check it to make sure all the linked passages actually exist and there were no typos.

    #start
    You decide to start to learn to make games, 
    so you open up this cool new software.
    {continue... |next}
    
    #next
    You plug away at learning the software for a few minutes, 
    but then discover it uses math!
    What do you do?
    {Yeet the pc out the window. |yeet}
    {scream!! |scream}
    {faint in despair. |faint}
    
    #yeet
    Losing no time you slam the window open, 
    and with fire in your eyes you yank that 
    mathematical devil device from your desk, 
    and toss it out the window with all your 
    might out into the abyss!!!
    {Peace at last...|end}
    
    #scream
    Noooooooooooooooooooooooooooooooooooooooooooooooooooooooo!!!!!!!!
    {...and you pass out. |faint}
    
    #faint
    You wake up on the floor, unaware of how much 
    time has passed. You also don't recall 
    what you were doing...
    {...continue|start}
    
    #end
    Thank you for playing.
    {care to try again? |start}

    Just typed like that or even written linearly in json or what have you probably can become unruly pretty quick, but then I'd want an editor to help with that.

    You could add some scripting to it by going the parsing route so it could be more lke twine with variables and conditions. It just depends on what you want for your game.

  • Making that in C3 would be a cool project.

    I've been doing something similar recently, a flow chart designer which focuses on variables.

    https://www.dropbox.com/s/zx571o10146fznk/varflod.gif?raw=1

  • Looks like you could definitely adapt your project for the purpose mOOnpunk

    I'd start on it but have too much on at the moment so it would be on the backburner for some time.

    EDIT: R0J0hound Love your example content

  • If possible I would like to stay with Construct 2. 😆

    I know, it is much of me to ask, really.

    Thank you all for your replies so far and willingness to help in the way you are able to.

  • calminthenight thanks!

    mOOnpunk Hey that's pretty cool looking.

    After trying out a few ideas I think the first step would be to decide on what data format you will be using first. Whether Array, Dictionary, json or even some contrived text format you make a parser for.

    The next step would be to manually make passages with the data format you chose.

    Then you'd have something kind of game that uses the data.

    Anyways, I like custom text formats so I wrote a parser. I wanted to be able to put the text links anywhere inside the text so a parser was useful.

    Had to do manual word wrapping since I made it so you can put clickable text anywhere. Also had to use some js because the .textWidth expression is delayed a tick so it's basically worthless.

    dropbox.com/s/47kmt431q7o3wcv/dialog_parser.capx

    I probably got carried away with the parsing. There may be simpler ways, but a least by parsing it's possible to extend it to have some scripting more like twine.

    Anyways, I never got to the visual editor portion. Maybe i'll try that later.

  • Wow, that's cool, R0j0!

  • R0J0hound

    I just got around to trying your example, in C3 it looks like this;

    I'm guessing it has to do with the javascript text width code?

  • Hi helena

    I wrote the tutorial and example that Moonpunk linked and am using Dialogue Designer in my game.

    As Ashley mentioned, a system like this can easily create an unreadable amount of text if you're not careful in how you structure everything. Having said that, I've found it to be a pretty nifty tool for my particular requirements (I came from a Twine background) and the visual flow of it really helped.

    My main concern is with the bloat that happens within the file, my 10,000 dialogue wordcount blows out to 70,000 words and 840 pages when I select all and copy it into a Word document.

  • After my previous comment, I thought I'd better go do some performance tests on my project and see what sort of impact loading a bunch more json text files would have on performance.

    I load the dialogue into the game during the first load screen. As a base line, with a 10,000 word dialogue file created in DD, the overall load time is 15 hundredths of a second (I'm loading other stuff too in this time).

    I made five more copies of my existing dialogue file and loaded them into separate json objects. This represents my estimated word count once the game is finished sans localization. The load time increased to 20 hundredths of a seconds.

    I'm actually pretty surprised by how quick this was, so I thought I'd test it out with 20 copies of my json file - about 200,000 words of dialogue. The time increased to 34 hundredths of a second.

    At this point I got bored of copying events and realised I could probably just do this in a loop if I wanted to go any further with it. But it looks like performance, at least in terms of loading files, shouldn't be a big deal.

  • mOOnpunk

    Looks like the function isn’t being called. In c3 JavaScript stuff is scoped differently I think. You probably can fix it by putting that js function in the global scope another way. Maybe a js block?

  • R0J0hound

    You were right, moving the javascript code to the new inbuilt scripts fixed the problem.

    Another really great example.

  • Thank you R0J0hound ! I made it based on the file you provided, it could be more suitable for the way I work.

    Update:

    I made this template:

    Markdown_Dialogue_System

    cdn.discordapp.com/attachments/225550155531812865/989114414433194005/Markdown_Dialogue_System_v1.0.c3p

    Example

    Choice Branch

    #test
    Mia : Hello.
    Amy : Have you visited our company before?
    Mia : Yes, I was here two years ago.
    Amy : Would you like tea or coffee?
    (...100)
    [Tea](#test-tea)
    [Coffee](#test-coffee)
    
    #test-coffee
    Mia : Coffee, please. With milk.
    Amy: I am afraid we haven't got any milk. I'm very sorry.
    Mia: It doesn't matter.
    
    #test-tea
    Mia : Tea, please.
    Amy: Okay.
    

    Variable in String

    Mia: Hey, {name}. What are you doing?
    

    Condition in String

    #buy-fruit
    guy : Hi, {if gold >= 1000 ? "Rich Man!" : "{name}."} You have {gold} coin. {if gold >= 10 ? "Do you want to buy {if gold > 25 ? fruit1 : fruit2}?" }
    

    Call Function in String

    #show-me-the-money
    Starcraft:S\.H\.O\.W\.\.M\.E\.\.T\.H\.E\.\.M\.O\.N\.K\.~E\.Y\.
    callFunction("AddData, gold, 1000")
    
    
    :===========================================================
    : ■ CheatSheet
    :===========================================================
    : ○ Guide in Section
    : ----------------------------------------------------------
    : text name : text
    : choice [This is a choice.](#scenes)
    : wait (...300)
    : goto (#section)
    : function callFunction("ShakeScreen, 1, 0.25")
    : ----------------------------------------------------------
    : ○ Escapes in "Text" - "This is a *string* and {variable}."
    : ----------------------------------------------------------
    : variable {string}
    : bold *text*
    : delete text~~~~
    : newline \n
    : wait for 50 ms \.
    : wait for 250 ms \-
    : wait for 1,000 ms				\|
    : display directly $text$
    : ----------------------------------------------------------
    : ○ Branch in Text - {if condition ? True : False} 
    : ----------------------------------------------------------
    : condition | < | <= | > | >= | = | == | <> | != |
    : branch | number | variable | "string" | "This is a string and {variable}." | 
    : ..........................................................
    : branch only True {if condition ? True}
    : branch True & False {if condition ? True : False}
    : ..........................................................
    : compare number {if money >= 2000 ? "Rich Man!" : username}
    : compare variable {if condition != variable ? "text1" : "text2"}
    : compare "text" {if weather = "Cloudy" ? "It looks like rain."}
    : ----------------------------------------------------------
    : Note: Use `callfunction` set variable to make more branches.
    : Note: All variables from dictionary. equal to `dictionary.Get(variable)`
    :===========================================================
    

    -------------------------------

    (old)

    :=====================================================
    : ■ CheatSheet
    :=====================================================
    : message name : text
    : choice [This is a choice.](#section)
    : wait (...300)
    : goto (#section)
    : -----------------------------------------------------
    : newline \n
    : wait for 1/4 second \.
    : wait for 1 second \|
    : display directly $text$
    : bold *text*
    : -----------------------------------------------------
    
    #start
    a : Hello.
    (...500) 
    b : Once upon a time\..\..\..
    [There were two choices.](#next)
    [There were four lines of content.](#next)
    
    #next
    b : They lived happily ever after.
    [End.](#start)
    
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)