A Kiss For The Petals: Remembering How We Met – Programmer’s Corner

FacebookPR_OnSaleNow-450x376

Greetings. This is Craig Donson once again, and I hope you are enjoying A Kiss For The Petals – Remembering How We Met. The English version is a somewhat unusual case – it was made possible by a combination of fan demand and over a year of work on the Ren’Py project that would become the first English release of A Kiss For The Petals. By this, I mean that it began well before the license was finalized and even before the founding of St. Michael Girls’ School, as an ambitious fan project to improve the experience for fans of the Japanese products. Despite the quality of the content of the visual novels, the programs that delivered them were less than ideal.

The majority of visual novels in the A Kiss For The Petals series use an engine that I believe is known as MScripter. Little information is available about it, as I could not find any public websites or documentation for it. I am unsure even of its exact name, as I’ve seen both “MScripter” and “MScenario” used to refer to it, both of which may simply be abbreviations. In addition to the usual problems of engines created for Japanese text being unsuitable for non-Japanese systems, the programs were partly unstable especially on versions of Windows released after the first visual novel’s release in 2006 – Fuguriya even recommended customers to use the compatibility settings in Windows Vista and later to mitigate stability issues. The engine has many bugs as well that have never been addressed, most notably involving the heart symbol in dialogue: Any line that contains it will be cleared prematurely when the auto-advance switch is enabled, resulting in voice clips that play without on-screen text. Given how frequently the heart is used in the text of a love story, this is obviously a major issue for non-speakers. There was also a desire to make them playable in Mac OS X and Linux, and while that was possible with PlayOnMac and Wine respectively, the script data required additional processing with specialized tools written by other fans before they could be played. Even without the prospect of a translation, the flaws in the original engine were great enough that I decided to challenge myself with bringing A Kiss For The Petals into a modern engine that it deserves.

Early Efforts

In August 2014, I undertook a project on my own accord to port the visual novels to Ren’Py. Ren’Py is an open-source cross-platform engine written in Python 2.7 and SDL2 that is well-supported and actively developed. I sought to insert the original art, text, and audio in an engine that is compatible with all recent versions and languages of Windows without the many bugs in the original engine, and Ren’Py was capable of that and much more, such as native Mac OS X and Linux support. Because the original visual novels are rather basic in structure, I knew that it was possible to automate the conversion of their binary script data into Ren’Py language, even if I did not have the capability to do that on my own. Despite a lack of experience in computer programming, I was prepared to reimplement entire visual novels solely by having the program, the Ren’Py documentation, and my text editor of choice open side-by-side, willing to learn any skills necessary along the way.

Thankfully, I would not have to do this, as very shortly after I started, Bash scripting enthusiast and fellow A Kiss For The Petals fan Procyon joined me and wrote a Bash script that would extract the written dialogue from the binary script file and wrap them in Ren’Py statements based on the control codes that surrounded them. In a single pass, all text was laid bare in a human-readable text file, complete with associated image and voice file names. I am very fortunate to have found such a talented ally early into this endeavor, and it is thanks to Procyon’s expertise that this project was completed so quickly. Even with this valuable asset, however, the process of converting binary data into human-readable script was complete guesswork. When we encountered a distinct sequence of hex codes in the binary script, I would refer to the Ren’Py documentation and write commands until it matched the corresponding behavior in the original program. Procyon would then add a definition for those hex codes to the Bash script and reprocess the entire script file, and then I would check it in Ren’Py for consistency. In the course of a few months, we built a library of control codes used by this engine and corresponding Ren’Py code. While we made great progress, a growing shortage of free time on my part slowed the effort down considerably, but an opportunity arose some time later that would make heavy use of our findings.

image1

 

In early 2015, I contacted MangaGamer to offer our work in progress to them, hoping that it could be used in negotiations for an English license for A Kiss For The Petals, and it was a success. We were to port Remembering How We Met to personal computers, but not in the way I expected. Rather than art assets and script files for an iOS or Android app, we were given a prototype and the original source code for a Windows version of the visual novel based on the same engine we had been working on the year prior. Development was done on this familiar engine by St. Michael Girls’ School and converted for iOS and Android, and our job was to port this program to Ren’Py. The source code did not include an SDK or any documentation, but Procyon and I were able to use what we learned the past year to very quickly produce a Ren’Py prototype of our own without them.

Converting the Source

This is a sample of the original source code from the first chapter of the story:

image2

To our surprise, this engine uses assembly language.  The words on the start of each line are macros that perform many instructions at once with the given parameters. As noted above, we did not have access to any documentation, so we had to determine the exact meaning of these statements on our own. Of course, we had already done this with compiled scripts from past releases, so converting this source code was a simple matter of adjusting the Bash script from parsing binary patterns to these statements. The above block of assembly translates into the following Ren’Py script (with comments inserted by me for this post and our translation replacing the original Japanese text):

image4

As you can see, multiple Ren’Py statements are needed to recreate a macro called in a single line. Ren’Py’s specialized language can perform all of the same functions at a high level, allowing us fine control over each statement in exchange for a higher line count. In the final line of the original code block, the second argument is given in two parts with the line of dialogue followed by the control code “100”. This code represents the heart symbol, which is a graphic and not a character of text. Ren’Py supports embedding images within dialogue, which is shown above as the tag “{image=font}.”

image5

Through continued trial and error, Procyon and I worked to decipher all commands used in the original assembly language and completed the conversion in about two months. After this was finished, I implemented the remainder of the program myself. This included the menus, text box, ending credits, and the eyecatches, which warrant special attention.

Everything Else

We were provided art assets for a complete menu system based on previous releases, so this was a matter of studying Ren’Py’s Screen Language and putting the pieces together into a working menu system. The result is an interface that is nearly identical to the original visual novels, with changes made to accommodate the translation and Ren’Py features. One of these is the text box modified to span the entire width of the screen.

image6

In this familiar text box, the in-game menu is in a dedicated area to the right, and the voice and line scroll are in a corner in the top right of the text area. Much space is wasted in this arrangement, particularly by the voice and line scroll arrows, which reserve the entire horizontal line they’re located in.

image7

I moved all commands to a thin strip on the bottom, which frees the entire horizontal space for text. The quick save, quick load, voice and line scroll controls are relocated to the corners for fast access. This layout resembles the text box used by Yurin Yurin’s visual novels.

While coding the menu system, I took the opportunity to add a number of features not possible in the original programs from 2006:

  • By default, Ren’Py will reduce the volume of music while a voice clip is playing. This feature is called Emphasize Voice. Most of the older visual novels do not use this feature, but it can be toggled here.
  • Ren’Py uses a default control scheme to manipulate the menus and the appearance of the text box. This release uses the controls from the original visual novel, but for the benefit of long-time Ren’Py players, I added an option to change between the original controls and the default Ren’Py controls.
  • I added the ability to remove the text box, leaving only the text. An outline is added to the text automatically to improve readability. This is intended to maximize the view of the CGs, and I predict this function will get more use in later releases, should we have the opportunity to produce them. The rearrangement of the in-game menu controls above are partly in service of this feature.

image8

More Than Meets the Eye

At the start of this article, I wrote that the port to Ren’Py was going to be straightforward, if tedious, due to the visual novels themselves being simplistic. As is often the case in programming, this turned out to be a faulty assumption. To illustrate the unexpected challenge posed by the lack of documentation, one major obstacle was implementing the eyecatches. These are interstitial images that display after major segments of the story and cannot be interrupted or skipped. (In anime, these are bumpers placed before and/or after commercial breaks.) In the original source, the eyecatch is called with the following:

image9

My task was to temporarily disable all input and animate the eyecatch graphics as closely as possible to the original program. In the end, the above line became the following in Ren’Py:

image10

This code is the result of a large number of attempts to ensure that the first time the player sees an eyecatch, they cannot bypass it using mouse or keyboard input, open menus, or scroll lines, as all of these would disrupt the timing of the animations and fades to and from the main story. Ren’Py supports using Python code directly, so I used it here as multiple commands are needed to alter the game state to make the eyecatches unskippable, in part or in full.

The above routine was created over the course of several days for a sequence that will take a maximum of 7 seconds. Seasoned Ren’Py developers could likely produce a more elegant solution for such a minor part of the presentation, but I was relieved to finally produce a reasonable facsimile of the original eyecatch behavior all the same. Other challenges presented themselves in the final stages of UI development, the last of which required the assistance of the developer of Ren’Py, PyTom.

Long-time players of the A Kiss For The Petals visual novels are likely aware that the music in the visual novels do not loop seamlessly, but rather fade out after a few minutes of playback. I sought to change this by defining a loop point for each music track that needed one and discarding any redundant loops in the music files. This would allow us to greatly reduce the file size used by the music. The Extra menu combines the replay gallery and the music test, but after a replay ends and returns to the Extra menu, the music resumed from the beginning of the loop point. I was unable to work around this, so I opened a support request on Ren’Py’s community forum. This resulted in a new feature in Ren’Py 6.99.6 that allows code to be run after a replay ends (the variable “config.after_replay_callback,” for Ren’Py developers). To my knowledge, Remembering How We Met is the first Ren’Py game to use this feature, and I am grateful to PyTom for implementing it solely at my request to improve the experience that much more.

Conclusion

The opportunity to work on a project I’ve sought for many years has been both exhilarating and educational, and the support from talented people who shared my passion made it all the more enjoyable. To see many people from around the world share their enthusiasm for A Kiss For The Petals through screenshots and discussions of our Ren’Py port not only gives me great pride in our work, but fills me with anticipation for further opportunities to use it. As you know, there are many opportunities indeed…

But for now, please enjoy the first fruit of our hard work.

 

Bookmark the permalink.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.