{"id":312,"date":"2024-03-18T18:56:18","date_gmt":"2024-03-18T18:56:18","guid":{"rendered":"https:\/\/abdoubouam.com\/?p=312"},"modified":"2024-03-18T19:57:09","modified_gmt":"2024-03-18T19:57:09","slug":"devlog-week-13","status":"publish","type":"post","link":"https:\/\/abdoubouam.com\/index.php\/2024\/03\/18\/devlog-week-13\/","title":{"rendered":"Devlog Week 13"},"content":{"rendered":"\n

This week was spent mostly prototyping an interaction system. Here’s a full list of what I’d done<\/p>\n\n\n\n

1 – Narrative Design Course<\/h2>\n\n\n\n

I followed a few video lessons from Unreal Engine 5 Visual Novel and Narrative Design<\/a> . It’s not exactly what I’m aiming for, but it shows enough of the basics and tools. I realized it is much more different than what I intended to do for dialog and script management so I stopped at about a third\/halfway through it and started making my own system instead.<\/p>\n\n\n\n

2- Object Interaction<\/h2>\n\n\n\n

This is where most of my time this week went. I decided to just dive in and make the interaction system from scratch myself, that way it will suit my needs and workflow exactly the way I want it, and also I will practice programming. The course above (what I followed of it, at least) helped me know just enough to start experimenting, especially how to reference an actor from another. What I was missing was for a way to talk with any arbitrary object, without hard-coded references in my code, and for that I found out about Interfaces<\/a> . I was familiar with the concept of C++ interfaces from a long time, so it wasn’t hard to start using them. Unreal offers an “Implements Interface” node, which can be used to check if an actor implements it in its blueprints, and that’s all I was missing.<\/p>\n\n\n\n

Here’s a demo of the finished system.<\/p>\n\n\n\n

\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button>
Interact Interface Function<\/figcaption><\/figure><\/div>\n\n\n

I made a construction script that changes the position and rotation of camera, focuses it on the object, add offsets, and set collision sphere radius.<\/p>\n\n\n

\n
\"\"\/<\/a>
Construction Script. Click to expand.<\/figcaption><\/figure><\/div>\n\n\n

In the Player Blueprint, there’s a tick event that executes the following :<\/p>\n\n\n\n

    \n
  1. Check if there’s enough time has passed since last execution (>0.10 seconds for example), to save some resources. I’m not 100% sure of the impact of this, but it’s based on the assumption that “Get Overlapping Actors” is too expensive to run on every tick. Please note that this step is skipped in the screenshot below.<\/li>\n\n\n\n
  2. Get a list of all actors the player is overlapping with, using a “Get Overlapping Actors” node (each interactable actor has a sphere collision). <\/li>\n\n\n\n
  3. Use list of actors, and check for the first actor satisfies both conditions : 1- Has implemented an interaction interface. 2- The player is looking in its direction (I compared the camera angle vs what the angle would be if you looked straight at its origin, using a dot product).<\/li>\n\n\n\n
  4. When an object satisfies both conditions, show the interact icon, and change its material to be highlighted, and also set the “Active Interaction Object” variable to reference it. Otherwise clear that variable and undo the highlight and hide the interact icon.<\/li>\n<\/ol>\n\n\n
    \n
    \"The<\/a><\/figure><\/div>\n\n\n

    <\/p>\n\n\n\n

    In addition to that, there’s an “On Click” event that acts independently, triggered by the key “E”. It does the following :<\/p>\n\n\n\n

      \n
    1. When the player presses the interact key, it checks first if the active interaction object is valid to proceed, otherwise do nothing.<\/li>\n\n\n\n
    2. The code gets a list of variables from the active interaction object, such as dialog\/description lines, use camera, custom camera, internal camera, camera offsets…etc.<\/li>\n\n\n\n
    3. If “use camera” is true, the active camera switches to the interactive object camera or external camera if specified.<\/li>\n\n\n\n
    4. Show the text UI, and load each line of the dialog with a typewriter effect, one by one. Play a sound every nth letter (every 2nd or 4th tends to work well, depending on speed), and delay slightly longer if the current character is a period or comma (more punctuation will be handled later).<\/li>\n\n\n\n
    5. When all the characters of a dialog line are loaded, pause for 1 or 2 seconds (To do : change this to wait for user confirmation instead). If there’s still another line of dialog, repeat the step but with that line instead. Repeat until all the lines are exhausted.<\/li>\n\n\n\n
    6. Remove UIs, clear active interaction object, stop camera shake animation if still playing, and switch back to the player’s main camera.<\/li>\n<\/ol>\n\n\n\n

      <\/p>\n\n\n

      \n
      \"\"<\/a>
      Interaction logic. Click to expand.<\/figcaption><\/figure><\/div>\n\n\n

      That’s pretty much what I did this week. I was a little bit worried I won’t like programming with nodes in UE5, considering I like low-level languages with text, but it felt very easy to get into and the logic behind things made sense. But it’s just another way of writing code, the implementation is really good.<\/p>\n\n\n\n

      Don’t hesitate to ask if you have any questions, and I’ll hopefully see you next week<\/p>\n","protected":false},"excerpt":{"rendered":"

      This week was spent mostly prototyping an interaction system. Here’s a full list of what I’d done 1 – Narrative Design Course I followed a few video lessons from Unreal Engine 5 Visual Novel and Narrative Design . It’s not exactly what I’m aiming for, but it shows enough of the basics and tools. I realized it is much more different than what I […]<\/p>\n","protected":false},"author":1,"featured_media":326,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"_links":{"self":[{"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/posts\/312"}],"collection":[{"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/comments?post=312"}],"version-history":[{"count":12,"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/posts\/312\/revisions"}],"predecessor-version":[{"id":335,"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/posts\/312\/revisions\/335"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/media\/326"}],"wp:attachment":[{"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/media?parent=312"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/categories?post=312"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/abdoubouam.com\/index.php\/wp-json\/wp\/v2\/tags?post=312"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}