How to create backlog and messaging system for fictional chat client?

Post reply
1 favourites
  • 10 posts
From the Asset Store
Chat GPT-3 OpenAI Construct 3 Chat Template
$20 USD
Chat with smart animals using the OpenAi Chat GPT 3 API
wckina's avatar
wckina

  • Hello all!

    I am currently working on a resource management game where the resource being managed is the player's mental health. One of the major mechanics I want to include for narrative purposes is a fictional chat client called Chatterfox.

    Here is how I would like Chatterfox to work:

    I would like the player to be able to access the Chatterfox app from the computer. From there they should be able to click on any profile picture within the app to go to that friend's chatlog. I want the player to be able to scroll up and view previous messages, as well as send pre-determined messages and receive new ones, hopefully with a gap to make it realistic that the other character could be typing.

    I don't plan on implementing multiple choices to current conversations, and instead the conversations will reflect how well the player is doing at the resource management side of things. The story will be told between backreading past conversations and engaging in conversations on both Chatterfox and in person NPC interactions.

    Games that are very similar to this mechanic are Sara Is Missing, the Simulacra games, the Emily Is Away games, the chat client from Night In The Woods. I'm sure there are more games in this sort of genre but those are the ones that I know of personally. I think it would be fun if the player can type pre-determined messages like in Emily Is Away, but since that isn't necessary for Chatterfox to work as intended, so it'll likely be a goal for when I get the main crux working.

    To recap: My primary issue is creating a backlog that you can scroll through to read previous conversations, and making it so that you can send and receive messages within this fictional chat client, which will then be added to the backlog.

    I'm not entirely sure what keywords to search for in order to find a tutorial for what I'm thinking. Looking up chat only brings up multiplayer chatroom tutorials and that's not what I'm aiming for. Any help is greatly appreciated!

  • I would probably use an array or JSON: 

    {
 "chat_Jamie": [
 { "sender": "User", "message": "Hey, did you finish the show last night?", "status": "delivered" },
 { "sender": "Jamie", "message": "Yeah, I stayed up way too late for it. Totally worth it, though.", "status": "delivered" },
 { "sender": "User", "message": "Right? That twist at the end?! I didn’t see it coming.", "status": "delivered" },
 { "sender": "Jamie", "message": "Same! I had to pause just to process it. Like, WHAT?", "status": "delivered" },
 { "sender": "User", "message": "I was yelling at my screen. My neighbors probably think I’m nuts.", "status": "delivered" },
 { "sender": "Jamie", "message": "Honestly, they’re probably used to it by now.", "status": "delivered" },
 { "sender": "User", "message": "Wow, okay, rude.", "status": "delivered" },
 { "sender": "Jamie", "message": "😂 You set yourself up for that one.", "status": "" },
 { "sender": "User", "message": "Fair. So... binge the next season this weekend?", "status": "" },
 { "sender": "Jamie", "message": "Obviously. Snacks are on you, though.", "status": "" }
 ]
}

    (Example generated by chatGPT)

    Multiple chats could be stored as sheets within one array, or as multiple array/JSON files.

    When the player enters a chat, immediately display all messages with "delivered" status. Then allow the player to send their next unsent message, wait a few seconds, display the response, mark both new messages as delivered in the array.

  • This is exactly the solution I was looking for! I was afraid the solution was gonna be a lot more complex than this but this should do just fine! Thank you so so much :)

  • Sorry to be back again, I've figured out how to set up the json file for an array but I cannot for the life of me figure out how to get it to display within the project itself. I have tried dragging the array in but it won't go. I can't get the text to display what I've written in the array.

  • You need to request the file with AJAX and load it into the array first. See events 2-3 in this example: 

    https://editor.construct.net/#open=languages-from-json

    I suggest studying some lessons and tutorials. There are also plenty of built-in examples in Constuct editor.

  • Try Construct 3

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

    Try Now Construct 3 users don't see these ads

  • I actually ended up looking into some tutorials and figuring this out just before I came back here. (I deleted the previous comment and yours didn't load in until I did that, oops!) Thank you though!

    My other question here is do I need to create a text object for every separate line? And how do I make it so you can scroll through entries that go off the page? Like say you're looking at messages from the ingame December 1, and you wanna go look back at messages from ingame November 30, how would I make it so you can scroll back and look at the older messages without completely eliminating the newer ones, and vice versa?

    This is what makes it more difficult than just the standard dialogue imo, the fact that I'd like you to be able to look back at what's been before and I'd like it to persist. Again thank you for your help! I'm rusty on programming since it's been so long and dialogue was a challenge even back then so this means a whole lot.

  • My other question here is do I need to create a text object for every separate line? And how do I make it so you can scroll through entries that go off the page?

    Here is a simplified explanation:

    1. Iterate the records in the array. Since they are stored on Y axis, you will need to use a system loop: 

    System for "y" from 0 to Array.Height-1
Array compare value at (2,loopindex)="delivered"

    2. For each chat message create a new Text object. Set its text to Array.at(1,loopindex)

    3. Resize the text object to its content - use Text.TextHeight expression

    4. Place each new text below the previous text.

    5. Attach all texts to a scrollable panel.

    6. Use a mask or blend modes to hide the top and bottom portions of the chat when scrolling.

    This will be difficult to make from scratch without any Construct knowledge. Here are some example projects which may be useful:

    howtoconstructdemos.com/scrolling-a-list-of-players-scores-images-etc-example-a-capx

    howtoconstructdemos.com/auto-resizing-speech-bubble-for-dialog-systems-capx

  • Thank you again! I didn't even think of looking into scrolling scoreboards, but that's absolutely perfect for what I'm thinking. It may be difficult, but that just makes me all the more determined to make it work! Time to give it a shot!

  • Good news! I was able to get the background to scroll only on the Y axis and the messages to stay on it just like I wanted! There's still a few kinks to work out, specifically getting the background to not scroll too far up or down and what it's gonna look like to send and receive new messages, but I think that'll be easier once I have more messages in mind with which to work.

    I mainly wanted to make sure I COULD make this mechanic work how I wanted it so that when it comes down to it, I can do it without much trouble. And hey, this helped me figure out how to use groups, and I was able clean up some of the messier event sheets too! And not to mention arrays, I think my dialogue coding both for messages and regular NPC dialogue is gonna look a lot cleaner from now on.

    Thank you so much for your help, I wouldn't have been able to do this without it and it means a lot! You're a lifesaver :)

  • No worries! Glad everything is working!

Post reply
  • 10 posts
Return to board index
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)