What is Tinimations and Klang?
Hi, my name is Tom-Ivar Arntzen, and I go by the artist name, Tinimations. My background prior to working on Klang was studying fine arts and 3D software. I made the euphoric rhythm platformer Klang, which I’ve been told is quite possibly the most ambitious Construct 2 game ever developed. With exception of composing the audio—which was done by EDM artist, bLiNd—I did everything in the game.
Klang took close to three years to develop, and I’m super stoked to finally release it on Steam for PC Sept. 22. I’m writing this post to spread awareness and shed light on how I was able to make it single-handedly using Construct 2.
Some Quick Links
Why Construct 2?
A friend and I used Construct 2 at a game jam in 2013. In the course of two and a half days, we made a little arcade-style collecting game.
Using Construct 2 was an eye opener for me. As an artist, I never thought making games was an accessible thing, but Construct 2 made it possible. Shortly after the jam, I began planning to bring to fruition a game idea I had been brewing for years.
Construct 2 was the best tool for me at the time.
I checked out my options. All engines I found were either too primitive, or way out of my league in terms of licensing fees and/or reliance on skilled programming staff. Unity wasn’t beginner-friendly enough, and UE4 with blueprint wasn’t out yet. Construct 2 proved super fast to work with during the prototyping and alpha phase, helping me set the game’s identity in stone within a few short months. I also liked the fact that it was 2D only, making it easier to narrow the game’s scope.
Me not being able to program (still can’t!), but having a very efficient art pipeline (which I’ll get to later), made Construct 2 seem like the perfect tool for me.
Default tools gave me very defined restrictions.
I’m usually Mr. Default when it comes to software. I don’t use plugins in fear of compatibility being broken down the line. Sticking to Construct 2’s built-in tools set very clear restrictions for me. If I dreamed up a feature that couldn’t be pulled off relatively easily with the tools given to me, I would scrap it and move on. Luckily the tools given proved to be flexible, reliable and easy to work with. The game’s core mechanic, the “klang,” for example, was made with events balancing the bullet behavior, distance expressions and audio playbacktime (for sync).
Making a rhythm platformer in Construct 2.
The side-scrolling platforming is definately Klang’s biggest link to other games, however, its rhythmic nature makes it quite unique. Keeping this in mind, Klang’s features that I’m most proud of are my custom-made walljump and the “klang” mechanic.
Jump to the beat! Trust me, it feels good!
I remember implementing the walljump in a few hours...err...maybe a day? This was possible thanks to the Platform behavior. Its pre-made features for box2D physics and full control of the X and Y vectors allowed me to make a system that felt super responsive, fast and euphoric. I also added some pinned collision boxes on the player’s sides to ensure one doesn’t have to hug the wall to pull off a jump. Unlike Super Metroid, Klang’s walljump is not a secret technique!
Then there’s THE klang mechanic.
Deflect incoming attacks while running and jumping!
The klang mechanic is the game’s namesake. The player deflects attacks from eight different directions in tempo with the music. It’s powered by a ton of events. In most games, turrets fire bullets at will, which fly aimlessly in the direction they were pointed. In Klang, however, all of this needed to be synced to the music. The turrets had to fire at the correct time and bullets needed to be in an exact location to be deflected to the tempo of the music. This also needed to look dynamic. If the player jumped, the horizontal turrets needed to be below him/her. If the player moved horizontally, the vertical turrets needed to fire at an angle. Anything else would have looked as if the player’s movement had no effect. All of this also had to be done while listening to the game’s soundtrack. I solved this problem by relying heavily on the audio.playbacktime expression, and custom timers set to the buildup and payoff of a beat. Nailing all of this down was a constant balancing act throughout development. Mechanics, however, weren’t the only things necessary to nail in order to make the gameplay feel right.
Smooth camera movement.
Notice the how the camera smoothly follows Klang, and zooms in appropriately.
What I see in a lot of Construct 2 beginners’ games is that the “scroll to” object has the constant exactly relative to the player. This makes movement seem very static. I was guilty of this as well...for a while. However, once I set up dynamic systems for camera panning and zoom, I never looked back. I realized this is an incredibly effecient way for making a game look more polished and professional.
Art
After researching more of the engine’s technical details, I quickly found it to be a perfect match for my pre-rendered 3D graphics pipeline. Construct 2’s preferred way of importing sprites was PNG sequences with alphas. It could even dynamically crop every sprite individually for optimized memory use!
This proved vital for allowing me to make such a large game on my own. 3D tools like Maya and Zbrush have evolved to the point where they’re potentially way faster than hand drawing art assets frame by frame in Photoshop. It’s easier to keep the art style consistent with reusable shaders, and it’s easily scaleable. I knew I would develop my skills as an artist during development, so swift iteration times were important. If I had to redraw every sprite by hand every time I was dissatisfied with minor details like hair length, head size, colors, etc., the game would never ship. Make the change once, click render and you’re done! Construct 2’s compatability with PNG sequences exported from After Effects is largely what makes Klang’s art style possible.
While pre-rendered 3D has been stigmatized over its poor aging from the 16-bit era, I’ll claim it works for Klang because it keeps it clean, void of muddy textures or poor attempts to look realistic.
WebGL effects
Another reason I was able to make Klang look so visually vibrant was the WebGl effects already available in the engine.
Adjust HSL at work while jamming to music!
Water and invert captures a moment of dizzyness.
Video playback during gameplay.
Aww...He’s so happy to see you!
One of my favorite features that got introduced mid development, was support for Webm video. This is something I’ve even had Unity developers express envy over. While video support isn’t necessarily anything new, having it run in parallell with gameplay without loosing performance has enabled me to make some visually memorable moments.
Finishing the game and pro tips.
I can safely say I relate with developers claiming that the last 10 percent of a game’s development is the hardest. Your code base is most likely a huge spaghetti mess at this point, and you’re stuck working on all those tasks you told yourself you’ll do later.
Thankfully, Construct 2’s regular update never broke my game in any way, or forced me to make any last minute changes. I’ve heard so many horror stories from developers how a major revision of their engine forced them to practically remake huge portions of their game from scratch due to a vital plugin being discontinued, or incompatible over night. While I may have encountered a bump every now and again (really wish the iteration times were shorter), Construct 2 is a very stable tool that enabled me to kickstart my game design career on my own terms.
Things I wish I knew when starting out.
I wish I knew from the get go how useful functions are. That alone could have cut my event count by maybe 70 percent.
I also recommend waiting for as long as possible with implementing your game’s art and sound. I threw in a lot of juicy art assets early on, which made iteration times slower due to preview loading times reaching impractical levels.
Learn how to make proper strings and function calls, and use expressions (sometimes your bug is caused by not specifying whether a number is “int” or “float”). Your code will be cleaner, you’ll work faster and you’ll feel like you’re actually programming.
Take the time to learn what all the pre-made behaviors do. Seriously, I spent so much time making my own features for what turned out to already be built-in. Pin and Sine, I’m looking at you!
Turning off image compression and minimizing script on export makes it super fast. Really useful if you want to test how the game’s holding up in its final game form.
Sick of long boot-up times after export? package.nw in your export is a .zip file. Unpack it before booting the game up and distributing it.
Press coverage so far.
While the game’s been in development, the composer and I have toured the world showing it off. So far, the reception’s been amazing, proving that Construct 2 can power competitive game projects in today’s market. Here are a few of my favorite pieces:
Goodbye for now.
Hope you found this post informative and inspiring. If you have any questions, I encourage you to reach out to me on Twitter. And, please check Klang out on Steam to wishlist it ahead of its Sept. 22 launch.
Until next time!
- Tom-Ivar