Tag Archives: renpy

Making a Visual Novel in Game Maker

Posted on by

My first three games (Serafina’s Saga, Quantum Conscience, and Serafina’s Crown) were all made with Ren’Py. Ren’Py is fantastic software that is free, easy to use, and reasonably versatile. When I first started making Serafina’s Saga, I knew very little coding outside of HTML, and I was very grateful for a program that required no programming knowledge to get started. After going through the typical tutorials and regularly checking the forums for help, I was well on my way to completing my project.

With Quantum Conscience, I wanted to make something more unique, and to do that I needed to push beyond the standard VN boundaries into the land of programming. I was lucky enough to get some programming assistance from “CheeryMoya” & FunnyGuts” (twinturtlegames.com), who already had a basic infoscreen system I could use, and they gave me some helpful tips on adding a system for reading thoughts. At this point I still had no idea what I was doing with the code, but I was able to get a system up and working. Gradually, as I began to customize and tweak the code, I learned what each line or function meant and what purpose it served. Eventually I was able to add a little code of my own.

Around the time I finished Quantum Conscience, I knew enough coding to be dangerous, but I still couldn’t program something new on my own; I just knew how to mess with other people’s code. So I decided to take programming seriously. Inspired by a local group of women called Coder Girl, I signed up for Harvard’s free CS50 course online. I made it a little over halfway through the course, and although I never finished, I learned enough about programming to jump-start Serafina’s Crown and add the mini-game debate system completely on my own.

By the time I finished Serafina’s Crown, I felt confident enough to call myself a programmer. I also wanted to keep pushing into new boundaries and add more “gamifying” elements to future visual novels. Specifically, I wanted to add a simple world for the player to roam and explore in between cutscenes. Although I could add these elements to Ren’Py with a lot of programming, I wondered if it was time for me to try a new engine. I considered RPGMaker, but it doesn’t yet have enough graphics or porting options for my tastes. So I turned to Game Maker.

My first few attempts to start a visual novel in Game Maker were extremely difficult and overwhelming. It took a ridiculously long time for me to get the tiniest parts of a text system working correctly. Then I found the Edge VN Engine by ThinkBoxly. It was well worth the price to get some solid code to start building a visual novel in Game Maker.

The Edge VN system was a sleek and solid platform from which to start building. But I still needed to build a lot; I remained a long way from the comfortable environment of Ren’Py to which I’d grown accustomed. I needed to add an in-game choice menu, a character costume layer system, character expression changes, branching dialogue systems, and a basic menu system altogether … all things that come default with Ren’Py. Fortunately, the EdgeVN creator, Luke Chasteen, was very helpful to me in my endeavors, and has since continued to add related features to his Edge VN engine.

Altogether, the transition from Ren’Py to Game Maker has not been an easy one. It has taken me several months to set up a coding environment from which I can comfortably write and expect to run smoothly like Ren’Py. Personally, I wanted to grow as a programmer, so I accepted the challenge along with the time sacrifice required. I continue to code other aspects of the game beyond the visual novel scenes, which in my case involves adding a 2D side-scrolling world with parallax layers, animations, and an inventory system. But now that I finally have a foundation with which to build my next visual novel, I am excited about all the possibilities ahead. The flexibility of Game Maker will allow me to add almost any gaming element to my visual novels that I desire.

post

How to set up a panning system (like Danganronpa) in Ren’py

Posted on by

For my next release, Serafina’s Crown, I want to use the programming knowledge I’ve accumulated from my first two games to add a lot of fun and new features to the experience. One really big thing I wanted to add was a scene in a large room that pans from one character to another, sort of like the game Danganronpa. But if you’ve ever used Ren’py, you know that setting this up isn’t easy.

Picture something like what’s in my picture above, but zoomed in so only one character shows on the screen at a time. Sounds simple, right? But this is actually difficult to achieve in Ren’py if you want to keep your characters dynamic (changing expressions or moving if needed).

I went to the Ren’py forums for help, and they suggested I try using the layer systems. It required a lot of tweaking, but I finally got it to work. So I thought I would share my system here in case anyone else finds it useful.

For reference, my background is a 5000 pixel-wide layer. My characters are sized 800 x 1200 pixels. The screen size of my game is 1280 x 720.

First, I defined my own layer called pan in the options script:

Code:

init -1 python hide:

config.layers = [ ‘master’, ‘pan’, ‘transient’, ‘screens’, ‘overlay’ ]

Then I defined camera angles and character placements using transforms in my own init code. This part required a whole lot of trial and error. The “a_characters” position the overall layer, or camera angle; the “p_characters” place the character on a certain point. For some reason, the xpos needed to be very different for each, even though you’d think they’d be the same. But these are the coordinates that worked for me:

Code:

init python:

def cameraMove(x):

global currentX
currentX = x
return currentX

transform a_center:

xpos currentX
linear 0.4 xpos -1700 yalign 0.0
cameraMove(0)

transform a_Arken:

xpos currentX
linear 0.4 xpos 0 yalign 0.0
cameraMove(0)

transform p_Arken:

xpos 50 yalign 0.0

transform a_Serafina:

xpos currentX
linear 0.4 xpos -1250 yalign 0.0
cameraMove(-1250)

transform p_Serafina:

xpos 1400 yalign 0.0

transform a_Reuben:

xpos currentX
linear 0.4 xpos -2000 yalign 0.0
cameraMove(-2000)

transform p_Reuben:

xpos 2200 yalign 0.0

transform a_Kendal:

xpos currentX
linear 0.4 xpos 1700 yalign 0.0
cameraMove(1700)

transform p_Kendal:

xpos -1450 yalign 0.0

I created the function cameraMove(x) so that I would have a global variable keeping track of the camera’s location. Otherwise, when the camera panned from one direction to another, it would always start at the center and *then* pan to a character (very headache-inducing). This way it’s a lot smoother each time.

And finally, here’s the code I use for the scene itself:

Code:

label Duma:

$ currentX = -1700

with None
show Arken onlayer pan zorder 1 at p_Arken
show Serafina at p_Serafina onlayer pan
show Reuben at p_Reuben onlayer pan
show Kendal at p_Kendal onlayer pan
show Duma onlayer pan zorder 0 at a_center behind Arken, Serafina, Reuben, Kendal
with dissolvea “Praise be upon the gods; praise be upon Darzia. I call to form a special session of the Royal Duma of Queen Belatrix Grandil… who can no longer preside, may she rest in peace.”
a “Members of the Petit Duma, please announce your presence.”show layer pan at a_Serafina
s “Serafina, of House Elborn.”

show layer pan at a_Reuben
r “Reuben, of House Jeridar.”

show layer pan at a_Kendal
k2 “Kendal, of House Terrace.”

show layer pan at a_Arken
show Arken 2 onlayer pan at p_Arken
a “May it be heard …”

And there you have it. The camera pans around the room from one character to the next.

I noticed that while using the layer system, you need to mention the layer and sprite placement every time (hence I couldn’t just say “show Arken 2” when he changed expressions; I needed to say “show Arken 2 onlayer pan at p_Arken.” But if it works, it works. So I’m just excited I’ll be able to pull this off!