# Bitmap Graphic Needs Smoothing

## Recommended Posts

Hello.  I have a 96 x 96 bitmap and want to make it four times bigger.  After it is this enlarged size I want to make all of it's edges smooth (probably using antialiasing.)  I have Gimp and Inkscape and can't get any real sort of workings.

Is it antialiasing and how is it be done?  The bitmap image is on a single color background, brown.

Thinking about it, I suppose it will be drawn on a single color background too!

Thanks,

Josheir

Edited by Josheir

##### Share on other sites

The operation you want is called "magnification filtering" or "resampling", not antialiasing. You can't avoid blockiness easily because the original image simply doesn't have enough data to uniquely fill the larger area, but you can choose a smooth filter like bicubic, to trade accuracy for visual smoothness.

Edited by Nik02

##### Share on other sites

In Gimp when you scale there should be a : Select Interpolation method. Try out a few and see if your happy, if not try downloading a new Interpolation method.

There is free software that focuses on this, but even they are limited.

If you want pixel perfect results, you should use no Interpolation method. That should just increase the pixel size. 1pixel -> 4pixels of the exact same color.

This allows screens to then scale it down again without breaking the image. If your making a pixel art game this is how you would do it.

##### Share on other sites

There are several algorithms for upscaling pixel art: https://en.wikipedia.org/wiki/Pixel-art_scaling_algorithms

##### Share on other sites

The cutting edge tech in image resizing is using neural networks:

##### Share on other sites
On 2/2/2018 at 7:06 AM, Kryzon said:

The cutting edge tech in image resizing is using neural networks:

It just uses cubic and some noise that I think it collects from images. Really bad results on both photos and hand drawn art. You will get better results with Photoshop and some filters.

Maybe one day it will be good, worth watching.

##### Share on other sites

Without you posting any proof I'm gonna have to call your bluff.

Someone else compared it with standard cubic resampling (using Photoshop, but cubic resampling is present in almost any image editor one can get). They had a different experience than yours.

"Photoshop 16x bicubic:"

"letsenhance.io 16x (ran twice):"

##### Share on other sites
17 hours ago, Kryzon said:

Without you posting any proof I'm gonna have to call your bluff.

With my first try I also used a image from the net, when I noted how near the two was I grew suspicious. The next two tests I ran using a image I drew and a photo of me.

I have no more images scaling left and I am not going to upload my photo, so here is only my hand made try with the "Boring" scale:

Original:

This is a jpg icon I used for a game I planned. It was very badly made as it was for planing, I can already feel the judgment.

Let's Enhance .io:

Now my result using Photoshop:

I used (Scale*2(Cubic)-> Remove noise)*4

The black is the difference between my Cubic scaling and there scaling.

I am not uploading the photo, it was taken at work and we are not allowed to take photos of the studio also I am ugly. The results using the "Magic" scaling with my photo was even worse than the "Boring" scale. (Once I can use the page again I will take a photo and show it here as well.)

Conclusion:

My scale trick is lower quality than most free scaling software out on the net, you can find tools that scale much better than me. Even so I was able to do better. Let'sEnhance.io < My Cubic scale < Free scaling software.

Why we should watch this software:

The image I used from the google search was near perfect. Now this could mean they where cheating and used google search to find the larger image.

What I am hopping is that because there was more info for that image the results was better, because this would mean that with time the software will get better as the developers improve and the AI collects data.

For now it's good, but anyone with Photoshop could do better and most other free scaling tools are much better.

Edited by Scouting Ninja

##### Share on other sites

Thank you for sharing. Your Photoshop scaling method is interesting.

When you compare both versions (letsenhance vs ps), they have some slight shape differences (at the outer edges of the ears, for example). One of these versions might be more faithful to your original design (the one named Original), in case you downscaled it to make that thumbnail, so this is a way to tell which method is best.
If you drew it small like that then I don't think there's a reliable way to know which method is best, it's subjective.

I'm not sure how they trained their AI. I would guess they took HD photos, downscaled them and then told the AI "to take this low-res image input and generate this HD image output". You do that a lot of times until you have a generic model for that AI to upscale small digital photos.

Maybe their model works best with photography (pictures taken with digital cameras), rather than man-made images.
For example, someone trained an AI model to specifically upscale anime-style images: http://waifu2x.udp.jp/

Edited by Kryzon

##### Share on other sites
28 minutes ago, Kryzon said:

If you drew it small like that then I don't think there's a reliable way to know which method is best, it's subjective.

The 128*128 is the large image, it was made for a Icon of 64*64. It was a Tiny study on shading. Never knew it looked that bad so large.

39 minutes ago, Kryzon said:

Maybe their model works best with photography (pictures taken with digital cameras),

As I mentioned I did try a selfie and the results wasn't good, blurry an noisy.

If the amount of images hasn't re-filled by this weekend I will donate to them. I want to see how good it is with outdoor images.

When you think about it there is more outdoor images on the net than indoor, so maybe it has better training with them. Either way I want to see what it really can do; this time I will be compare it to free software.

48 minutes ago, Kryzon said:

someone trained an AI model to specifically upscale anime-style images: http://waifu2x.udp.jp/

Thanks for this one. A quick try with a rough sketch shows it is great. It produces good results very fast, so you only need to use it once or twice.

## Create an account

Register a new account

• 10
• 17
• 9
• 13
• 41
• ### Similar Content

• By vvvvv
oh boy howdy howdy
i know little to nothing about game design and programming but i am a seasoned artist and am a huge gamer always have been
i recently got a very small taste of the industry if you can even call it that from the last UE4 game jam i helped with voice acting concept art writing and vector art
i absolutely loved it and am already itching to learn and do more but??? i have no idea how to go about it
the person i was working with during the game jam is years ahead of me and is already looking into getting me into some contract work and teaching me 3d modeling/painting/sculpting but at the moment hes currently busy with making a game for RTX!
while hes busy i thought id delve into some forums and get my feet wet
any info or tips on how or where to get started would be amazing thanks!
• By kirito
hey guys i wanna know how much of everything it costs to make a game kind of aberoth
if u haven't heared about it take a fast look here:http://aberoth.com

• Hey There,
I am a developer and Im working on a blockchain based infinite runner type game. Right now, I am working on releasing the beta version with a couple other game developers, but would love to expand the team and have other talented and bright people contributing. The game portion of the project isnt very complicated, and wouldnt require anyone to pull thier hair out for it.
Thank you!

• Overview
Welcome to the 2D UFO game guide using the Orx Portable Game Engine. My aim for this tutorial is to take you through all the steps to build a UFO game from scratch.
The aim of our game is to allow the player to control a UFO by applying physical forces to move it around. The player must collect pickups to increase their score to win.
I should openly acknowledge that this series is cheekily inspired by the 2D UFO tutorial written for Unity.
It makes an excellent comparison of the approaches between Orx and Unity. It is also a perfect way to highlight one of the major parts that makes Orx unique among other game engines, its Data Driven Configuration System.
You'll get very familiar with this system very soon. It's at the very heart of just about every game written using Orx.
If you are very new to game development, don't worry. We'll take it nice and slow and try to explain everything in very simple terms. The only knowledge you will need is some simple C++.
I'd like say a huge thank you to FullyBugged for providing the graphics for this series of articles.

What are we making?
Visit the video below to see the look and gameplay of the final game:
Getting Orx
The latest up to date version of Orx can be cloned from github and set up with:
git clone https://github.com/orx/orx.git Once cloning has completed, the setup script in the root of the files will start automatically for you. This script creates an $ORX environment variable for your system. The variable will point to the code subfolder where you cloned Orx. Why? I'll get to the in a moment, but it'll make your life easier. The setup script also creates several projects for various IDEs and operating system: Visual Studio, Codelite, Code::Blocks, and gmake. You can pick one of these projects to build the Orx library. Building the Orx Library While the Orx headers are provided, you need to compile the Orx library so that your own games can link to it. Because the setup script has already created a suitable a project for you (using premake), you can simply open one for your chosen OS/IDE and compile the Orx library yourself. There are three configurations to compile: Debug, Profile and Release. You will need to compile all three. For more details on compiling the Orx lbrary at: http://orx-project.org/wiki/en/tutorials/cloning_orx_from_github at the Orx learning wiki. The$ORX Environment Variable
I promised I would explain what this is for. Once you have compiled all three orx library files, you will find them in the code/lib/dynamic folder:
orx.dll orxd.dll orxp.dll Also, link libraries will be available in the same folder:
orx.lib orxd.lib orxp.lib When it comes time to create our own game project, we would normally be forced to copy these library files and includes into every project.
A better way is to have our projects point to the libraries and includes located at the folder that the $ORX environment variable points to (for example: C:\Dev\orx\code). This means that your projects will always know where to find the Orx library. And should you ever clone and re-compile a new version of Orx, your game projects can make immediate use of the newer version. Setting up a 2D UFO Project Now the you have the Orx libraries cloned and compiled, you will need a blank project for your game. Supported options are: Visual Studio, CodeLite, Code::Blocks, XCode or gmake, depending on your operating system. Once you have a game project, you can use it to work through the steps in this tutorial. Orx provides a very nice system for auto creating game projects for you. In the root of the Orx repo, you will find either the init.bat (for Windows) or init.sh (Mac/Linux) command. Create a project for our 2D game from the command line in the Orx folder and running: init c:\temp\ufo or init.sh ~/ufo Orx will create a project for each IDE supported by your OS at the specified location. You can copy this folder anywhere, and your project will always compile and link due to the$ORX environment variable. It knows where the libraries and includes are for Orx.
Open your project using your favourite IDE from within the ufo/build folder.
When the blank template loads, there are two main folders to note in your solution:
config src Firstly, the src folder contains a single source file, ufo.cpp. This is where we will add the c++ code for the game. The config folder contains configuration files for our game.
What is config?
Orx is a data driven 2D game engine. Many of the elements in your game, like objects, spawners, music etc, do not need to be defined in code. They can be defined (or configured) using config files.
You can make a range of complex multi-part objects with special behaviours and effects in Orx, and bring them into your game with a single line of code. You'll see this in the following chapters of this guide.
There are three ufo config files in the config folder but for this guide, only one will actually be used in our game. This is:
ufo.ini All our game configuration will be done there.
Over in the Orx library repo folder under orx/code/bin, there are two other config files:
CreationTemplate.ini SettingsTemplate.ini These are example configs and they list all the properties and values that are available to you. We will mainly concentrate on referring to the CreationTemplate.ini, which is for objects, sounds, etc. It's good idea to include these two files into your project for easy reference.
Alternatively you can view these online at https://github.com/orx/orx/blob/master/code/bin/CreationTemplate.ini and here: https://github.com/orx/orx/blob/master/code/bin/SettingsTemplate.ini

The code template
Now to take a look at the basic ufo.cpp and see what is contained there.
The first function is the Init() function.
This function will execute when the game starts up. Here you can create objects have been defined in the config, or perform other set up tasks like handlers. We'll do both of these soon.
The Run() function is executed every main clock cycle. This is a good place to continually perform a task. Though there are better alternatives for this, and we will cover those later. This is mainly used to check for the quit key.
The Exit() function is where memory is cleaned up when your game quits. Orx cleans up nicely after itself. We won't use this function as part of this guide.
The Bootstrap() function is an optional function to use. This is used to tell Orx where to find the first config file for use in our game (ufo.ini). There is another way to do this, but for now, we'll use this function to inform Orx of the config.
Then of course, the main() function. We do not need to use this function in this guide.
Now that we have everything we need to get start, you should be able to compile successfully. Run the program and an Orx logo will appear slowly rotating.

Great. So now you have everything you need to start building the UFO game.
If you experience an issue compiling, check the troubleshooting article for Orx projects    for help.

Setting up the game assets
Our game will have a background, a UFO which the player will control, and some pickups that the player can collect.
The UFO will be controlled by the player using the cursor keys.
First you'll need the assets to make the game. You can download the file  assets-for-orx-ufo-game.zip which contains:
The background file (background.png😞

The UFO and Pickup sprite images (ufo.png and pickup.png😞

And a pickup sound effect (pickup.ogg😞
pickup.ogg
Copy the .png files into your data/texture folder
Copy the .ogg file into your data/sound folder.
Now these files can be accessed by your project and included in the game.

Setting up the Playfield
We will start by setting up the background object. This is done using config.
Open the ufo.ini config file in your editor and add the following:

[BackgroundGraphic] Texture = background.png Pivot = center
The BackgroundGraphic defined here is called a Graphic Section. It has two properties defined. The first is Texture which has been set as background.png.
The Orx library knows where to find this image, due to the properties set in the Resource section:

[Resource] Texture = ../../data/texture
So any texture files that are required (just like in our BackgroundGraphic section) will be located in the ../../data/texture folder.
The second parameter is Pivot. A pivot is the handle (or sometimes “hotspot” in other frameworks). This is set to be center. The position is 0,0 by default, just like the camera. The effect is to ensure the background sits in the center of our game window.
There are other values available for Pivot. To see the list of values, open the CreationTemplate.ini file in your editor. Scroll to the GraphicTemplate section and find Pivot in the list. There you can see all the possible values that could be used.
top left is also a typical value.
We need to define an object that will make use of this graphic. This will be the actual entity that is used in the game:

[BackgroundObject] Graphic = BackgroundGraphic Position = (0, 0, 0)
The Graphic property is the section BackgroundGraphic that we defined earlier. Our object will use that graphic.
The second property is the Position. In our world, this object will be created at (0, 0, 0). In Orx, the coordinates are (x, y, z). It may seem strange that Orx, being a 2D game engine has a Z axis. Actually Orx is 2.5D. It respects the Z axis for objects, and can use this for layering above or below other objects in the game.
To make the object appear in our game, we will add a line of code in our source file to create it.
In the Init() function of ufo.cpp, remove the default line:
orxObject_CreateFromConfig("Object"); and replace it with:
orxObject_CreateFromConfig("BackgroundObject"); Compile and run.
The old spinning logo is now replaced with a nice tiled background object.

Next, the ufo object is required. This is what the player will control. This will be covered in Part 2.
• By xDanix
Hi guys, so im developing a game using GMS2, following shaun spalding tutorials from youtube, my problem is that he explains only the basics on the mechanics, and since i have almost 0 knowledge in code, i cannot derail far from what he writes.. the main issue that i have now is developing the character animation; i want to make a jump, something like: impulse, ascending, descending, landing and also some smooth transition between ascencion and descent. now, in the way he wrote the code i get as follows:
// animation
if (!place_meeting(x,y+1,oWall))
{
sprite_index = sPlayerA;
image_speed = 0;
if (sign(vsp) > 0) image_index = 1; else image_index = 0;
}
oWall is my collision object, sPlayerA is my jump sprite with two frames on it.
that gives me a basic and solid jump, but i feel like its too static.... Any ideas on how to write something to get a nice smooth jump with more than just two frames? i'm aiming at four or five frames total.
thanks in advance, here's a screenshot of the work in progress: