{"id":2254,"date":"2025-05-11T19:13:53","date_gmt":"2025-05-11T19:13:53","guid":{"rendered":"https:\/\/sites.wsagames.com\/ab15g23\/?p=2254"},"modified":"2025-05-12T23:56:33","modified_gmt":"2025-05-12T23:56:33","slug":"those-left-behind-v2","status":"publish","type":"post","link":"https:\/\/sites.wsagames.com\/ab15g23\/those-left-behind-v2\/","title":{"rendered":"Those Left Behind V2"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">With access to the project and reassurance from Sophie to keep working on it, my goals were to essentially shoehorn the UI assets I had created and adjust anything I needed to in order for the game to work alongside it.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><span style=\"text-decoration: underline\">How it started, the project as I received it:<\/span><\/strong><\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"1108\" style=\"aspect-ratio: 1968 \/ 1108;\" width=\"1968\" controls src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/Tlb-v2-gameplay-recording-1.mp4\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">I began by importing all of the assets and changing the background to the campsite. I duplicated the background and switched out the sprite for a reference image of my UI design that I could toggle on and off as I worked. <\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-UI-small-1024x576.png\" alt=\"\" class=\"wp-image-2217\" srcset=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-UI-small-1024x576.png 1024w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-UI-small-300x169.png 300w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-UI-small-768x432.png 768w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-UI-small.png 1200w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\">Reference background<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">I adjusted all of the existing game objects on screen to new areas according to the reference, then added in the panels and button sprites.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">The Camps<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The camps gave me a bit of trouble, but once I relocated the objects and switched out all of the sprites I was able to visualise the scene much better. In this version, all of the camps in the survival camp start as broken and unusable, the player must build them up to begin producing resources. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Because we didn&#8217;t have &#8220;broken visuals&#8221; of the camp to implement and we wouldn&#8217;t have time to design them, my solution was to reuse the existing asset of the camps and darken them to give the appearance that they were locked\/out of commission. Once they were constructed the sprite would then switch to the normal camp.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"874\" height=\"489\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-32.png\" alt=\"\" class=\"wp-image-2329\" srcset=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-32.png 874w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-32-300x168.png 300w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-32-768x430.png 768w\" sizes=\"(max-width: 874px) 100vw, 874px\" \/><figcaption class=\"wp-element-caption\">All &#8220;locked camps&#8221; and new UI elements<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Tasks Panel<\/h2>\n\n\n\n<figure class=\"wp-block-image alignright size-large is-resized\"><img decoding=\"async\" width=\"599\" height=\"799\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-16-edited.png\" alt=\"\" class=\"wp-image-2275\" style=\"width:177px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-16-edited.png 599w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-16-edited-225x300.png 225w\" sizes=\"(max-width: 599px) 100vw, 599px\" \/><figcaption class=\"wp-element-caption\">Original Task Panel<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The section in the top right of the original project is meant to portray the characters and their respective tasks. Admittedly, in the images of the UI designs I sent to Joe the way these tasks were meant to be displayed was never clarified. He hadn&#8217;t asked and I honestly hadn&#8217;t considered discussing it with him. However, it was clear that these tasks took way too much of the screen up and looked incredibly cluttered, calling for a change. Like the reference, I moved the characters to the bottom right of the screen in their own panel.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The information was still displayed horizontally and covered the screen so I opted to implement a panel containing all of the information that would open on button click (clicking on a character card). I used this simple tutorial to do it:<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Unity Tutorial: Open Panel on Button Click\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/LziIlLB2Kt4?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">After testing that the information was displaying correctly on one of panels, I duplicated them and changed the serialized fields in the task manager to work for the rest. This is how they turned out:<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"708\" style=\"aspect-ratio: 1262 \/ 708;\" width=\"1262\" controls muted src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/showing-panels-1.mp4\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">*<strong>Issue<\/strong>: panels could all be opened at once and clipped over one another. <\/p>\n\n\n\n<figure class=\"wp-block-image alignright size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"186\" height=\"196\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-35.png\" alt=\"\" class=\"wp-image-2337\" style=\"width:162px;height:auto\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Camp Menus<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Camp menus refers to the panels that would appear when the player clicked on a camp to either build or upgrade them. Originally, they were coloured squares displaying general information &#8211; camp name, cost and buttons (build, upgrade, close).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">I replaced the square and readjusted their position to appear above their respective camp.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"590\" style=\"aspect-ratio: 1194 \/ 590;\" width=\"1194\" controls src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/20250512-2220-01.3116796.mp4\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><span style=\"text-decoration: underline\">*Issues:<\/span><\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The camp menu looked almost merged with the camp sprite underneath it<\/li>\n\n\n\n<li>Camp menus displaying incorrect information &#8211; camp name variable in the menus doesn&#8217;t work<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image alignright size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"289\" height=\"532\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-36.png\" alt=\"\" class=\"wp-image-2341\" style=\"width:183px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-36.png 289w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-36-163x300.png 163w\" sizes=\"(max-width: 289px) 100vw, 289px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Narrative Scene<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">This scene did not have as much going on and was subsequently easier to work with, there was already a very handy manager (shown  right) implemented for each character scene where I could drag in the correct character and backgorund assets for each one, as well as an array that could be edited to display the dialogue.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">With the way this scene was designed the character name was not going to change as the dialogue progressed so instead of going into the code to make changes I made the decision to remove all player dialogue and kept the overall character dialogue shorter (this meant rewriting some of it, but this was for the best as we had received feedback on the dialogue lacking flow and feeling unnatural). Of course, the player would still be able to reply with dialogue options, but only at the end of the narrative scene, prompting them back to the main gameplay.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Using the same reference image method, I started moving things around and assigning assets to the serialized fields.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"610\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-ui-dia-small-1024x610.png\" alt=\"\" class=\"wp-image-2222\" srcset=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-ui-dia-small-1024x610.png 1024w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-ui-dia-small-300x179.png 300w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-ui-dia-small-768x457.png 768w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/new-ui-dia-small.png 1120w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\">Reference UI<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-gallery alignwide has-nested-images columns-default is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"766\" height=\"427\" data-id=\"2343\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-37.png\" alt=\"\" class=\"wp-image-2343\" srcset=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-37.png 766w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-37-300x167.png 300w\" sizes=\"(max-width: 766px) 100vw, 766px\" \/><figcaption class=\"wp-element-caption\">Before<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"572\" data-id=\"2344\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-38-1024x572.png\" alt=\"\" class=\"wp-image-2344\" srcset=\"https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-38-1024x572.png 1024w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-38-300x168.png 300w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-38-768x429.png 768w, https:\/\/sites.wsagames.com\/ab15g23\/wp-content\/uploads\/sites\/5\/2025\/05\/image-38.png 1143w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\">After<\/figcaption><\/figure>\n<\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Inspired by the level of polish in the other games at the showcase, I decided to create a new scene for a main menu but decided not to work on it further since it was late and not a priority in comparison to the work ahead. Plus, I had already done a considerable amount.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\" \/>\n\n\n\n<p class=\"wp-block-paragraph\">This was what I was able to complete on Friday 9th. Over the weekend I will be going home and focusing on\/catching up with work on the digital portfolio blog (which is what I&#8217;m doing right now, quite meta if you think about it).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">I will continue work on the game once I return on Monday and after joining the team meeting with Sophie.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-wp-embed is-provider-anna-bonadio-game-designer wp-block-embed-anna-bonadio-game-designer\"><div class=\"wp-block-embed__wrapper\">\n<blockquote class=\"wp-embedded-content\" data-secret=\"qHT7QKVPVK\"><a href=\"https:\/\/sites.wsagames.com\/ab15g23\/week-12\/\">Week 12<\/a><\/blockquote><iframe class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; visibility: hidden;\" title=\"&#8220;Week 12&#8221; &#8212; Anna Bonadio \u2727 Game Design Blog\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/week-12\/embed\/#?secret=Ey7Ses4kY4#?secret=qHT7QKVPVK\" data-secret=\"qHT7QKVPVK\" width=\"500\" height=\"282\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe>\n<\/div><\/figure>\n\n\n\n<figure class=\"wp-block-embed is-type-wp-embed is-provider-anna-bonadio-game-designer wp-block-embed-anna-bonadio-game-designer\"><div class=\"wp-block-embed__wrapper\">\n<blockquote class=\"wp-embedded-content\" data-secret=\"rlHkWoyvOo\"><a href=\"https:\/\/sites.wsagames.com\/ab15g23\/those-left-behind-v2-pt-2\/\">Those Left Behind V2 Pt. 2<\/a><\/blockquote><iframe class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; visibility: hidden;\" title=\"&#8220;Those Left Behind V2 Pt. 2&#8221; &#8212; Anna Bonadio \u2727 Game Design Blog\" src=\"https:\/\/sites.wsagames.com\/ab15g23\/those-left-behind-v2-pt-2\/embed\/#?secret=PRE8Ekqwc7#?secret=rlHkWoyvOo\" data-secret=\"rlHkWoyvOo\" width=\"500\" height=\"282\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>With access to the project and reassurance from Sophie to keep working on it, my goals were to essentially shoehorn the UI assets I had created and adjust anything I needed to in order for the game to work alongside it. How it started, the project as I received it: I began by importing all [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[44],"tags":[],"class_list":["post-2254","post","type-post","status-publish","format-standard","hentry","category-development"],"_links":{"self":[{"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/posts\/2254","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/comments?post=2254"}],"version-history":[{"count":14,"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/posts\/2254\/revisions"}],"predecessor-version":[{"id":2355,"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/posts\/2254\/revisions\/2355"}],"wp:attachment":[{"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/media?parent=2254"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/categories?post=2254"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sites.wsagames.com\/ab15g23\/wp-json\/wp\/v2\/tags?post=2254"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}