After playing Environmental Station Alpha, I decided I wanted to implement the screen tearing effect Hempuli is using in his game. I didn’t know how he achieved it so I had to start from scratch and think about different approaches.
Knowing nothing about shaders, I was left with surfaces. I jotted down some code and immediately hit a wall; after asking around in the yoyogames forums, reading other’s comments, I could finally come up with a pretty decentsolution.
I wrote the code so it could be easily hackable. This goes into the create event of your game controller object.
// handy shorter names
dw = display_get_width()
dh = display_get_height()
tearings_surface = surface_create(dw, dh) // We'll draw on this surface
tearings_y = 0
band_num = 16 // How many bands you want on screen
band_height = dh / band_num
tearings_x_offset = 32 // How much you want to displace the bands horizontally
tearing_speed = 4 // Change this to speed up/slow down the tearings
I place the following code inside a draw_post event of my controller.
// Create surface if it doesn't exits
tearings_surface = surface_create(display_get_width(), display_get_height())
// Let's set the target to our surface
// We draw parts of our application surface on tearings surface
for (var current_band = 0; current_band < band_num * 2; current_band++)
draw_surface_part(application_surface, 0, band_height * current_band - tearings_y, dw, band_height, sin( (degtorad(360) / band_num ) * current_band) * tearings_x_offset , band_height * current_band - tearings_y)
// Always reset the target surface
// Draw the actual surface
draw_surface_stretched(tearings_surface, -tearings_x_offset, 0, dw + tearings_x_offset * 2, dh)
// Move the Tearings
tearings_y = (tearings_y + tearing_speed) % (band_height * band_num)
And this is how I make that effect. I will implement a similar version for vertical tearings (for underwater levels? maybe?). Hope you find it useful.
A note about surfaces: remember to free the surfaces if you don’t need them anymore, otherwise it will lead to memory leaks.
As some of you might know, Fuzeboy’s project scope changed considerably during its development. There’s been an overhaul of features, specifications, goals and deadlines.
Originally thought to be a quick mobile only game, we then shifted our vision a bit to make it playable on desktops as well; now we decided to abandon the mobile world altogether to focus exclusively on the Desktop platform.
This opened up a ton of possibilities as we’re not limited to touchscreen inputs anymore. The very essence of the game changed, as we made changes to game mechanics, enriching and expanding the world of Fuzeboy.
Fuzeboy’s going to be a full fledged, complete platformer game for desktops (Win, Linux, Mac) but we’re not yet ready to show anything new to the world as I’m rewriting it from scratch in GameMaker Studio 2 while Darftey is reviewing (and adapting) all of the graphics.
We’re also starting a new project. Not because we suffer from shiny object syndrome (basically a disease of distraction) but because rewriting Fuzeboy from scratch, made it possible for us to reset our mental state.
Although far from a possible Fuzeboy-induced burnout, our mental state was then set for something new; different. That not only applied to Fuzeboy, but to both of us as a game development team. We took a step back and looked at our future as team Blocksword. And we saw things…
As we reviewed and re-started Fuzeboy, we reviewed our plans, projects and priorities as well. And we saw this…
Due to the overwhelmingly positive feedback we received, we’re now thinking about making it our primary focus. We’re also considering funding as I didn’t plan to live off of my savings for this long without publishing a commercial title.
Two projects, two options
Should we decide to crowdfund the new game, we will have to define a clear project scope and commit exclusively to that for the time it will take to ship it. In that case the development of Fuzeboy will be put on hold (let’s say we will change it’s queue priority). As of now this is the most probable scenario.
Should we decide to keep going without funding (or fail at funding), we’ll suffer from a bit of a slowdown. I will have to seek a part-time job (or something) while working on both games at our discretion (we would have zero deadlines and relatively more freedom in the way we manage and evolve our own projects).
All of this might annoy someone; especially those who were waiting for Fuzeboy anytime soon this year. Especially if they were waiting for a mobile game. We know it and we don’t like when people get annoyed because of us; we will make up for it.
To sum it up: we’re working on the new Fuzeboy while defining the scope of this second project and defining the resources we need to allocate to each of these projects. Just know that we could completely shift our focus toward this new RPG game very soon (we’re evaluating feedback).
When you try to import multiple images into a single sprite in GameMaker Studio 2, you could end up with unexpected results. Specifically, if the images have different sizes (width and height), the sprite size will be equal to that of the largest image, but all the other images will be imported stretched to fill the canvas (effectively ruining the sprite).
Let’s say that you have a sprite with a complex animation (i.e. variable frame rate). As you can see from the following image, each frame will play at a specific time (I use a simple Photoshop script to export the frames, I’ll write an article about it later).
Fuzeboy’s still in development so it’s only natural that sometimes I take time to rewrite stuff, to fix things, to experiment and so on. We try, we break, we fix, we extend, we change. We evolve.One issue we faced from the start, is the game resolution. What we knew was that we wanted pixel perfect scaling no matter what. Remember that this game will be both for mobile and desktop.Here’s my solution as of today.
Though parts of this article are still valid, we're no longer actively developing Fuzeboy for mobile. Indeed we're targeting the PC platform.
Not only that; I also wrote about a different way to scale surfaces in such a way I can avoid Pixel Decimation and achieve near perfect results with no notable distortions.
Fuzeboy cares about its height. The width depends on the monitor aspect ratio (within reasonable limits). The ideal height of Fuzeboy is around 240px. Keep this in mind.
Pixel Perfect, Full Screen, No Black Bars (didn’t work)
This approach was the first I used. Since not every device has a vertical resolution that’s a multiple of 240px, I allowed different devices to show more or less “game world”.First I get the display vertical resolution. Then I cycle from 200px to 300px to see which one fits perfectly the device vertical resolution. If I don’t find a perfect fit, I give up and just use 240px.
Fuzeboy on Devices, method 1
Game Vertical Resolution
Amazon Kindle Fire 7″
1024 x 600 (600)
Samsung S3 Mini
800 x 480 (480)
Asus MeMO Pad 7
1280 x 800 (800)
This doesn’t work. It’s pixel perfect most of the times, there are no black bars… but you might end up seeing an unplayable 200px vertical resolution on a 7″ tablet.Let’s have a look at an Amazon Kindle Fire 7″There’s a huge 100px difference in height from the Asus to the Kindle. The Fire users would have been able to see 50% more game world than the Asus players. That’s wrong. Especially since Asus has a higher screen resolution than the Amazon Fire.
Pixel Perfect, Black Bars (in use as of today)
First of all I decided to restrict the range of vertical resolution of the game. Now it’s from 230px to 260px. Still a 30px difference but it’s bearable.So I still ask for the device vertical resolution, of course. Then I check which number, from 230 to 260, fits best. By that I mean it either fits perfectly or has the lowest remainder.This is the initialization script. It goes inside the create event of the very first object created in the game.I also leave the view settings in the room editor as they are. Disabled. I enable them via code.
// Let's disable the drawing of the App Surface
dw = display_get_width() // Device Display Width
dh = display_get_height() // Device display height
ar = dw / dh // Aspect Ratio
min_h = 230 // Minimum Height
max_h = 260 // Maximum Height
height = min_h // We start from the minimum
fract = frac(dh / height) // This is the fractional part
mult = floor(dh / height) // This is integer multiplier
// We cycle from min_h to max_h
for (var h = min_h; h < max_h + 1; h++)
var new_fract = frac(dh / h)
var new_mult = floor(dh / h)
// If we have a lower remainder, we store
// the multiplier and the height we're testing
if new_fract < fract
fract = new_fract
height = h
mult = new_mult
// This will show you the found resolution in the debug console
show_debug_message("Found resolution: " + string(height))
// Width gets decided with a simple division
width = floor(dw / mult)
// And made divisible by 2
if width mod 2 != 0
SET THE VIEW AND THE PORT FOR ALL ROOMS
var i = true;
var rm = room_next(room);
room_set_view(rm, 0, true, 0, 0, width, height, 0, 0, width * mult, height * mult, 0, 0, -1, -1, -1)
if (rm == room_last)
i = false
rm = room_next(rm)
// Resize the application surface
surface_resize(application_surface, width, height);
// Let the GUI layer be as big as the device screen
gw = display_get_gui_width() // GUI width variable
gh = display_get_gui_height() // GUI height variable
// We'll need these to figure out the touch commands coordinates
wscale = width / (dw / mult)
hscale = height / (dh / mult)
// Let's figure out the App Surface offset (we want it centered)
Xoffset = floor((dw - (width * mult)) / 2); // Horizontal Offset
Yoffset = floor((dh - (height * mult)) / 2); // Vertical Offset
/// Go Fullscreen on desktop
if os_type == os_windows
Then we need to draw the App Surface. So in the game controller object, I have the following code in a Post Draw event.
///Draw the App Surface with correct offset
// This line prevents strange artifacts in Fuzeboy.
// The real drawing.
draw_surface_ext(application_surface, Xoffset, Yoffset, mult, mult, 0, c_white, 1);
If I run the game on the Amazon tablet, the result is this:
Fuzeboy on Devices, method 2
Game Vertical Resolution
Black bars top/bottom
Amazon Kindle Fire 7″
1024 x 600 (600)
Samsung S3 Mini
800 x 480 (480)
Asus MeMO Pad 7
1280 x 800 (800)
Now the game scales much better.
Let’s fix the Touch Controls.
Those touch buttons share the obj_touch parent so I can do this in the controller Begin Step event.
// Add these in the display init script
xoffsetmult = (Xoffset / mult)
yoffsetmult = (Yoffset / mult)
// Touch Controls
for (var dev = 0; dev < 4; dev++)
touch_dev = dev
var _xpos = (device_mouse_x_to_gui(dev) / mult) + view_xview - xoffsetmult
var _ypos = (device_mouse_y_to_gui(dev) / mult) + view_yview - yoffsetmult
var this_button = instance_position(_xpos, _ypos, obj_touch);
if this_button != noone
if device_mouse_check_button(dev, mb_left)
if device_mouse_check_button_pressed(dev, mb_left)
if device_mouse_check_button_released(dev, mb_left)
As of today, I still experiment with the resolution of the game. I haven’t found a perfect way to scale low res pixel graphic fullscreen with no black bars and no distortion… simply because such a way doesn’t exist.Things change frequently around here, so we’ll see if I’m going to stick with this method or not. Feel free to let me know your ideas on this matter.
As I said in a previous post about my platformer engine (the one I’m working on for Fuzeboy), I’m using Zack Bell‘s code as a base. Recently I started to look into ways to optimize such code without losing the functionality (slopes are a big feature of that simple collision/movement code).
And as someone once told me “sharing is how better games are made”… so here it is my “improved” version.
In November 2016 I met Denis (@darftey). He’s a pixel artist. One of the best I’ve ever met, actually. We teamed up to develop Fuzeboy.
It shouldn’t come as a surprise that since then, the development of KREN has been put on hold indefinitely.
We’re pushing hard on this mobile platformer game.
There is still no official release date but we’re making progress 24/7 on every front. From music and sound to gameplay mechanics, from platform specific issues to minor graphic details.
Lots of care is being put into making this game as fun as possible. We care about details. We care about story and gameplay. We are in love with this game and we’re making sure everything goes the way we envision.
Stay tuned for more Fuzeboy news in the near future.
This entry marks the first entry of a new Devlog Series.
I’m currently working on a couple of GameMaker projects and I thought it might be useful to document my development process. I’ve been inspired to do so by reading the Loadworld Devlog PT. 2 by @ZackBellGames