23/10/2021 Patreon Devlog

10/23/2021

This Week's Summary:

• Flowchart revamp
  • Remade Common Route charts
  • Remade Ari's charts
  • Remade Caleb's charts
  • Updated Magnus Flowchart images
  • Started coding them
• Magnus corrections

The Ramble:

So as you can see from the bullet list this week, there was a minor change of plans and I ended up re-doing some of the previously completed flowcharts. And that's...pretty much all I did.

OWO; *sweats*

So here is what happened:

First, a few things have been kind of piling up a little in regards to flowcharts.  I've been needing to remake the common route flowcharts for a while. I changed the look of the flowcharts a while ago and have also re-named some of the personality traits ("bold" became "confident", for example). I had never gone back to update the common route flowcharts, just kind of putting it off to some future date.

But there were some other issues piling up as well.

Ari's flowcharts were also slightly inconsistent with later flowcharts. Mostly some minor aesthetic things but I kept thinking I should go back and fix them as well.

And finally, I had been running into a size issue where the flowchart branching was occasionally making it difficult to fit the modules within the 393 pixel height. This was becoming enough a problem that in one case I had to edit the modules and move the icons to be in front of them instead of above them (Something that looked both inconsistent and...unpleasant.)

But there was a bigger issue building with the flowcharts - that is. . .the sheer amount of time going into saving the individual files.

So here is the backstory on that.

When I first decided to include flowcharts, I was unsure exactly how to handle them. There were a couple of options:

Layered images

Image maps

Layered images essentially take a group of individual images and layers them together into a single composite image via code. This is how the sprites work, actually.

The benefit of layered images is that I don't have to mess with coordinates of individual components and the code is very straightforward. The drawback is the amount of images needed. Each route's flowcharts (not including the common route) included around 215 (or more!) images for each full route (about half that for the common route).

This meant that all together, the flowcharts were going to be comprised of over 2000 individual images in the finished game. That is a *lot* of images that have to be saved and named manually. And that saving of files was incredibly tedious. It was literally several hours of work for each route.

The other option I initially considered was what's called an "image map" - this method uses multiple versions of a single image then defines a series of "hotspots" that are defined in the code by coordinate and dimensions. This reduces the flowcharts to 3 images per chapter, for a total of 42 images per route. This means the flowcharts would be comprised of around 400 images for the total game.

That's still a lot of images to save but it's also still five times fewer images than the layered image method.

When I was first starting to code GS, I didn't actually understand image maps very well. I knew the basics of how they worked, but had never really gotten into the details. And I didn't think I could actually make them work with the flowcharts given the strange shape of the connecting lines between the "modules" in the flowcharts.

So I went with the layered image method.

Fast forward to the last couple of weeks where I've been much more focused on flowcharts.

The thing about some of these little problems you encounter as a developer is that sometimes they sort of get swept under the rug until you start actively focusing on that area of game development.

Then you suddenly realise this THING really isn't going to work. Cue...Morgan's eyebrows, or the layered image flowchart system. All it takes is a little bit of focus in those areas to come to the conclusion you have to change something before you can continue.

And sometimes changing things means re-doing work you've already done.

That's what happened this week.

I just realised I could not keep saving 200+ images per route for flowcharts. It was wasting hours and hours of time. And keep in mind that despite having Ari, Caleb, and Magnus done....there are six more love interests. I may only be focusing on three more LIs to get the base game done, but there are three additional LIs lurking in the shadows.

And I had to re-do the common route as well since it was already inconsistent with the rest.

With the other problems also building up, I decided it was time to revisit the flowcharts.

I am now more familiar with the details of image maps and realised I should be able to make it work. With a little help from a friend, we were able to figure out the coding syntax to make it do what I wanted.

The flowcharts are now saved as a complete image. There is a fully opaque "unlocked" version and a 85% transparent "locked" version. Each module is defined by a set of coordinates (x,y) and a set of dimensions (w,h). The individual "hotspots" change appearance when the scene is unlocked.

(The blue areas show how the hotspots are defined. But, of course, as the player you can't actually see the hotspot since it's just a set of numbers defined in the code).

Here are the changes I've made which will be noticeable to the player:

• A slight re-design of the modules.
  I've moved the icons into the module and slightly re-sized the text to make it fit. This makes the flowcharts look a little neater overall and also solves the problem of me occasionally running out of vertical space for branching.
• I've made sure to remove Morgan's default name out of the scene descriptions. Now it should say "MC" (I may have missed a few instances of "Morgan" but for the most part, it should be more neutral now).
• Corrected some inconsistencies with how the personality variations were displayed in Ari's flowcharts (mostly small changes in spacing and placement. Most people won't notice this. But a few observant types might.)

Here are the changes I've made which will not be visible:

• Switched to image maps vs layered images.
  This will massively reduce the amount of images needed to create each flowchart. The reduction in file size is negligible (route flowcharts are reduced from 5 MB to 2 MB each), but the amount of time needed to save the files is also drastically reduced.

As far as what all I actually got done this week:

I  had started coding Caissa's route the old way - which is what prompted me to revisit the flowcharts. Caissa's route is currently on pause until I get the other routes updated.

I finally updated the Common Route. This includes adding in the newly designed scene modules and connecting lines as well as converting the flowcharts to image maps.

Updated Ari's route with the new modules and converted his flowcharts to image maps. I should note that Ari's route took longer to update that the others because in addition to updating it with the new modules, I had to make a lot of corrections in placement and spacing. I also was using a bizarre naming method and had to do a lot of double checking to make sure I was defining the right things.

Updated Caleb's Route with the new modules and converted his flowcharts to image maps.

Updated Magnus' images and started updating his flowchart code.

Sneak Peeks and Previews:

New flowchart design. You can see it's not that different than the current one. Just placed the icon within the individual boxes. Overall, the flowcharts look al little more tidy and, more importantly, I won't have issues fitting them in the flowchart image dimensions going forward.

Upcoming Week:

Obviously this past week I ended up backtracking a fair bit and working on things I wasn't planning to work on which means I didn't make the forward progress I wanted to make.

But once I get Magnus' routes coded (about an hour and a half of work) I'll be caught back up to where I was.

I'll be able to get Caissa's flowcharts done.

Then I'll make another round of Magnus corrections and try to push out Caissa's route for testing finally.

I'm really happy with the flowchart changes and I think it'll save me a lot of time for the remaining routes.

Previously I was spending about 2 hours saving images (!!!) and another couple of hours coding the flowcharts. Now I spend about 20 minutes saving the images and an hour and half coding the images.

Either way I intend to finish Magnus' coding this weekend and move on to re-doing what I have of Caissa's route then moving forward to fully code his flowchart with the new method.

No CG work yet as I've been wrapped up in flowcharts. Sometimes I intend to multi-task but one element of the game takes over. And that is what has happened with flowcharts for now.