Visual Basic Game Programming Tutorial – Part 3 – Graphics and Tile Mapping

In this Visual Basic 2010 game tutorial series, I’ll be covering the basics of simple, 2D game design, from the ground up. I’ll be focusing primarily on RPG style design; however, these techniques can be used with any 2D game.

(Note: Sorry about the muffled audio in the beginning, and the choppy quality. I kept getting interrupted on this one.)

This VB Game Design Tutorial will be focusing on:
1.) How To Design A Seamless Tile For Your Tileset
2.) How To Add Your Tiles To Game At Desired Coordinates

In this series we will be focusing on:
Game Loop Design
Handling Mouse Positions and Clicks.
Graphical Tile Maps
Character Movement & User Input
Creating Semi-transparent brushes
Creating stylized dialog boxes for chat, menus, etc.
Saving & Loading Data from Files
Object Animation





Aardaerimus D'Aritonyss says:

I’m using Visual Basic 2010, which is part Microsoft Visual Studio. If you don’t wish to pay for the professional edition you can download the free Express Edition directly from Microsoft. 🙂

soulkiss31 says:

Hello! I’m a little new to
Layer Graphics and I have gimp but never used it. Can I
draw the graphics in ms paint and then edit with gimp or can I do what you did in gimp alone? Can I just use paint and that’s it? Just wondering why layering is important? Thanks in advance!

Aardaerimus D'Aritonyss says:

That’s what almost all of my videos are about. 😀 What kind of game do you hope to create? GDI is most simple, but is not good for games with a great deal of movement and animation. It’s great for puzzle games, card games, etc. My oldest videos cover this topic.

If your games have a lot of movement and animation, you’ll need a more robust framework, like XNA. My newer videos demonstrate the use of XNA. 🙂

MrGamemasterman says:

Thank u now I need to learn how to program I dream to program my on game

Aardaerimus D'Aritonyss says:

You will want to familiarize yourself with the language, and then follow the XNA series. Alternatively, you can use SFML, though XNA stomps it in terms of performance.

kevnar says:


sRect = New Rectangle(5 * TileSize, 4 * TileSize, TileSize, TileSize)

Would have been much simpler. Plus if you change the tilesize later, it’s already coded in.

Agus Brollo says:

im having trouble with bmpTile = New BitMap(GFX.pbGFX.Image), pls help

Aardaerimus D'Aritonyss says:

I recommend watching the Adventures In XNA series that I made for this. 🙂

Kevin Bellamy says:

I love these series.. can VB 2013 Express do these?  can you explain the difference between some of the versions in capabilites?  Also, what is the GFX?  you started with the tiles already there… would be nice to see how you made your source bitmap, and how it gets put into the visual studio.

Chris Rivard says:

I am looking this tutorial because i want to learn VB and i know nothing about it, but i do know C++ and Java and i was looking at 22:35 in the GetSourceRect function

Instead of always counting the number of pixel, coudnt you just have the program do it for
ex : you defined as GetSourceRect(X,Y,w,h)… in your switch (case) have the pixel values in the new rectangle call be multiplied by TIleSize so instead of New Rectangle(32,0,TileSize,TileSize) –> New Rectangle (1*TileSize, 0*TileSize, TileSize, TileSize)(and not forgetting to Math.floor it) which woudl alway multiply it by the tile size and factually make you life easier, so you coudl use your graphics map the same way calling the rectangle 0,0 for example and not have to calculate the pixel everytime.

Arthur Baars says:


Haedrip says:

it dont work 

steven hicks says:

Can someone help me add the bmp photo to my folder that I created. I keeps saying “Cannot find file tileset.bmp”-
try saving it in your projectbindebug folder on the picture box control properties click on image you get dialog box check local source push import button and ok it should show your bmp in there if not trying send more info and what you have tried and not hope this helps.

Hersheyvin says:

sir aardaerimus may i ask a question? i made the form larger and when i load it the form seems to be slow and “choppy” especially when i move the character.. do i need to maintain the exact resolution of your work? how do i adjust in making the screen larger to make the program less laggy?

Dustin Gordon says:

Hi I’m having an issue with bmpTile = New Bitmap(GFX.pbGFX.Image)
Its saying no accessible “New” can be called without narrowing the conversation.
Any thoughts?

Hamood Hamood says:

i just wanted to make A 2d mapping and the input from my gps strings this strings are printed on the serial port so how i can )attach this data from serial port to my map to moving forword and reverse and righ and left(my robot

Aardaerimus D'Aritonyss says:

Hello, Hersheyvin. 🙂 What you’re running into is the limitations of using Windows GDI. Unfortunately, it is not hardware rendered – meaning that it does not utilize the capabilities of your graphics hardware and thus is not good for games that have a lot of movement, animation, and redrawing of the screen. This severely restricts the resolution and performance.

For such games, I highly recommend moving to a hardware rendered framework like XNA, SDL, or SFML.

TheJJ100100 says:

+Aardaerimus D’Aritonyss I would like to know how you imported the GFX.bmp file to the GFX.vb at 13:39. Thank You in advance 😀

Hershey. Vin says:

good day sir!  if i move to xna, can i import my gdi work to my xna? or should i start all over again?

ComputerTutorials says:

Hello sir, I followed your instructions in this video, and the code functions properly. However, the performance has been reduced drastically. My frames per second dropped to 1; it is incredibly slow. Any ideas to increase efficiency?

Ren BEE says:

Thanks for the Tutorial… your tutorials really helpful for graphic and so organize the code 😀

Levy And Andrew: Coding 101 says:

“Im not very good at this” “i could do better” BRO YOUR THE BEST! Honestly You’re the only one that actually had a solution to my problems in programming.

kevnar says:

For the select case about 20:00 minutes in, I just wrote the math into the code instead of trying to do it in my head.

Select Case Map(x, y, 0)
Case 0 ‘ grass
sRect = New Rectangle(1 * 32, 0 * 32, TileSize, TileSize)
Case 1 ‘ tree
sRect = New Rectangle(1 * 32, 4 * 32, TileSize, TileSize)
Case 2 ‘ mountain
sRect = New Rectangle(5 * 32, 4 * 32, TileSize, TileSize)
End Select

It saves hunting down errors later on, if your math happens to be off a bit. Plus it’s quicker.

Misha de Waal-Hart says:

These are so helpful thanks so much!!!! 

Aardaerimus D'Aritonyss says:

I’ve been thinking about doing a series for complete beginners. You should be able to pick up a bit from my videos, hopefully. Good luck! 🙂

Aardaerimus D'Aritonyss says:

I recommend watching the Adventures In XNA series that I made for this. 🙂

Aardaerimus D'Aritonyss says:

I recommend watching the XNA series that I made for this. 🙂

Aardaerimus D'Aritonyss says:

I recommend watching the Adventures In XNA series that I made for this. 🙂

notionSlave says:

Where did you learn visual basic from? you seem to know so much. im taking a vb class right now and i dont think i can even come close to designing a game like this LOL

Raz says:

ITS WORKING WITH .png IMAGE. I Write Map In Paint And Save It .png And I Follow Tutorial And Its Work 😀

Hersheyvin says:

aww thats really bad. but another question sir. is there a simple way to talk to an npc? what i did was just adding the sprite to the tilemap(the getsourcerect) and i am fine even though they dont move. i just want to trigger a dialog when facing them. is there a simple way of doing that?

devilzwishbone2013 says:

Im a software developer and have been working with VB since I was 13 (im now 31), never tried developing games involving graphics before its been mainly been telecoms, server based applications however im keen to learn how to do games as a hobby

Didnt like the missing GFX tutorial, I downloaded it in your URL in the description but feel i now need to get to understand what the GFX file contains and how it works to get a full idea of how this game gets developed, whilst im following a tutorial im learning a long the way, if im just inserting bits of script you have developed elsewhere then i cannot say ive learnt to make a game, just merely call upon 3rd party api scripts.

also a tip would be to improve the wording of your variables
Ie start every integer with int, every boolean with bl
Such as

dim intResWidth as Integer = me.width
dim intResHeight as Integer = me.height
dim stGameTitle as string = “First Game”
dim blRunning as boolean = true

This way later on in the code you can tell what each variable is simply by its name

Ive rated this video a thumbs down simply because of the GFX part, everything else has been thumbs up up until now hope i dont come across any more nasty surprises that end up putting me off as the end result of your videos seems pretty good which has got me wanting to learn how its done

ArcticDuck says:

What size is the image with all the textures on?

jens1o says:

can you make something similar photoshop?

MrGamemasterman says:

Oh do u have video on how to program a 2D game for beginners

VB6 Programming VBA Programming says:

VB6 programming tutorial

 Write a comment


Do you like our videos?
Do you want to see more like that?

Please click below to support us on Facebook!