DEVELOPMENT UPDATES - week 4-9 - UI/UX & PROGRAMMING | Game Build

UI/UX | Programmer/Developer | Script/Story Writer

The development and change logs for the development week process’s week 4 to 9 are condensed into the following subsections below since we’ve found that there is a limit to the amount of logs that can be displayed and accessed on the game page. 

 UI DESIGN & IMPLEMENTATION 

 Making the sprite sheets and other elements of the UI was spread out during the development process and will be discussed in the following sections below.

SPRITE SHEET

Making the sprite sheet was straightforward since the drafts already contained the planned design for the assets that will be put in it. The design was simply fine-tuned inside illustrator. Inside unity, this sprite sheet was sliced up inside the 2D sprite editor and labeled accordingly to be able to properly reference it later in script or the inspector. The images contained inside the sprite sheet were white in color in order to easily manipulate a color change from within the unity editor inspector. The UI was setup to roughly follow the color scheme shown previously on the draft drawn out, but the hue and saturation of the colors had been adjusted later in the game to better blend in with the lighting implemented inside the game scenes.

LOGO & CURSOR

The logo and the cursor were an added design that came in the later stages of the development process when test builds of the game were finally being built. The logo makes use of the typeface selected and sourced for the game’s title, and already build assets in illustrator, while the custom cursor’s design follows the same style the current UI assets have to ensure design cohesion.

SPRITE SHEET

Making the sprite sheet was straightforward since the drafts already contained the planned design for the assets that will be put in it. The design was simply fine-tuned inside illustrator. Inside unity, this sprite sheet was sliced up inside the 2D sprite editor and labeled accordingly to be able to properly reference it later in script or the inspector. The images contained inside the sprite sheet were white in color in order to easily manipulate a color change from within the unity editor inspector. The UI was setup to roughly follow the color scheme shown previously on the draft drawn out, but the hue and saturation of the colors had been adjusted later in the game to better blend in with the lighting implemented inside the game scenes.

MENUS

The UI Menus such as the landing/title screen, chapter select, pause menu, and others were rather straightforward to implement. Since the UI for these have already been roughly blocked out in the earlier development week, replacing the sprites and moving them around slightly to copy the positions shown in the draft was simple. 

CASE LOG

Setting all the elements of the case log which displays the pertinent information the players may want to review had also been simple, but as an added feature, the various information contained in the log would also only appear after discussing certain topics with the interactable characters or objects. During earlier game testing iterations, it was found that texts in the other information section of the case log sometimes had information cut out from the text box because the text contained inside was too long for the allocated space. This problem was also encountered on the narrative UI that tells the beginning and the various endings of the story. To fix this, the text boxes were set to resize the text to the best fit for the allocated space. In order to prevent the text from being resized too large or too small the minimum and maximum size had been set to 10 and 16 respectively.

NARRATIVE IMAGES

Development for the images that come with the story text for the introduction to chapter 1 and the 4 different endings were done during the 7th week of the project development. A sketchy black and white style with splashes of color was used as a throwback and reference to the Film Noir style used by movies set in the game’s setting era. These images were then placed together into one sprite sheet and implemented into the narrative UI setup in the previous development weeks

GAMEPLAY

This section discusses the changes and development process that the scripting and development in unity underwent. These took place during week 5 of the development process although further changes were made throughout the next couple of weeks up until the final week of development. 

MOVEMENT

A persistent bug where the movement of the player inverts had been encountered and there had been many attempts to fix it during week 6 - 8 of the development process, though the solution to this problem was found on week 8 of the project development. The main issue had to do with the fact that the camera controlled by the player’s mouse movement lacked lines of code that would prevent it from rotating over the 360 axis of itself and it therefore seemed like the player’s movement controls had somehow been inverted. The issue has been resolved.

DIALOGUE OPTIONS & ENDING CHOICES

One of the main challenges in setting up the character dialogues through the UI and code was to switch between texts depending on the character that the player has been interacting with or the object the player is interacting with, the topic the player is trying to discuss with the characters, and which dialogue options are available depending on if the player has the key items they need to talk to the characters or not, as well as if the player is in the correct phase.

The process of coding this entire setup took the majority of the remaining weeks of the project development, this included fixing the various bugs encountered. Some of which include: dialogue cutting off at the first sentence if the option selected last has multiple lines, dialogue options for another character showing on a different character’s interaction, and the input button used to trigger the next part of the dialogue being so sensitive that it skips twice. All encountered bugs of course have now been fixed.

NAVMESH

One of the problems encountered later in rebaking the navmesh was that the character models do not register as navigation static in the scene. To work around this, several capsules roughly the size of the characters inside the game were placed on the characters’ locations and those placeholder models were used to bake the navmesh paths. Two planes were also used on the second floor to mark a border on the wall to make sure that the player cannot walk too near the archways in the ballroom and basically clip through.

GAME COMPILATION

The compilation of the game which took place in the last week of development is discussed briefly below.

LEVEL DESIGN

The level design had mainly been left up to another member of the team, however, during the final 2 weeks of the project development, assets such as the characters and the objects that serve as clues were moved around accordingly when met with problems observed. A few of which consist of having to move around objects to rebake the navmesh, and move a character to a more accessible location that didn’t interfere with immersion. This problem mentioned mainly affected the character called Julie who stands at the top of the staircase in a position that was at first difficult to interact with. She was hence moved near the portraits on the second floor of the scene. The trash can that had the bottle that contains the poison was also found to be difficult to find for a number of players, hence it was moved to a location that gave it a little more visibility. 

LIGHTING

Setting up and baking the lighting was a team effort to ensure that the quality of the visuals further improved. In earlier bakes, the scene had too much yellow and orange in it that it looked unnatural. It also made the UI blend into the current color scheme. Complementary blue colors were added to the lights which was then rebaked. 

SOUND

Sounds added to the game just consist of background music at the moment.