Jump to content
  • Advertisement

Project: Project Taival

Dev Diary #041 - Slicing Images

ProjectTaival

1307 views

Hello and welcome to this weeks dev diary!

Today I'll show a couple of ways to slice up your images into smaller portions, one that doesn't require any plugins and one that need you to download a script.

The following tutorial uses the default settings for GIMP, just like a fresh installation with no previous installations that might have retained some of your old settings.

The GIMP Version is 2.10.12

 

The Manual Way

Slicing the image manually can be really work intensive, depending how many parts you want to slice your image to and is by no means an efficient way to do it, but will suffice for anyone who wishes to divide their image to 4 x 4 tiles or less.

1. When you have loaded up the image you want to slice into smaller pieces, go to image > Guides > New Guide...

pic01.png.7c666ecfda65fb48eee708b23aaa75fa.png

 

2.a When you click on the "New Guide..." the following box appears.

pic02.png.0b7c3d08858bda770d9bcf2dd3b676c5.png

2.b Now you have to do some math and divide your image into as many parts as you want. You have to do this both horizontally and vertically as many times as you need guides. For this tutorial I'll make the image into 4 x 4 tiles, meaning 3000x3000 pixels in size, as per 12000 / 4 = 3000 - this means that I need to space all the guides 3000 pixels apart from each other, adding 3000 to each position.

i.e. the first guide to 3000, the second guide to 6000, and the third guide to 9000.

3. After you have added your guides, your image should look like this;

pic03.thumb.png.db4ae3fd8b79b0aa36de71bd9cb7e648.png

 

4. Go to Image > Slice Using Guides - Click it and GIMP will divide the image for you into separate images and switch your view to the last piece. The original image will still be intact.

pic04.png.69584ea8ee67a5762111312c2447bc7e.png

pic05.thumb.png.d1f63b45ef39a05a7c4ebc57c0559a0e.png

GIMP will use the same filename that your original file has, but add to the row and column number to the end of the name, like seen in the above image filename, on the top right corner.

Original filename in this example is; M5213A-texture-12000x12000.png

The last piece has an addition at the end of it; M5213A-texture-12000x12000-3-3.png

The below image showcases how GIMP organizes the tiles. First number represents the Column and the second number represents the Row;

pic06.thumb.png.7f28da6695e7db66eeec2a0da4ad4aaa.png

 

5. Save each image separately, by going to File > Export As... (or using shortcut of Shift + CTRL + E). The file extension is the same as the original file's, so no need to change any setting when saving the files. The default export path is the one that the original image resides in, so you may want to create a new folder for the image slices.

pic07.thumb.png.e21f1c15d9589606dd14d0f14fb7c37e.png

There is also several plugins that helps with saving multiple tabs in GIMP.

 

The Much More Automated Method

1. First, download these plug-ins;

2. Install both plugins into C:\Users\"Your-Username"\AppData\Roaming\GIMP\2.10\plug-ins

Note that the "2.10" folder is the version of the GIMP you have installed and will change after each update that changes the first or second version number.

Now your plug-ins folder should have these files.

pic08.png.c6af1403964688a9915dd48af9caab3c.png

 

3. After opening GIMP and your image file, remove the ".png" from your layer name. This will ensure that the "Export Layers" plugin names the layers correctly.

4. Go to Layers > Tiles > Split tiles (by rows and columns)...

pic09.png.17668c0b458db66f2a32529ab9b8bc2d.png

 

5. Choose how many rows and columns you want, no need to change other settings, unless you want to specify different naming schemes. Read the plugin instructions for more information on that.

pic10.png.d934ab528a39aa7b083ade5e0e5f3c16.png

For the purpose of this tutorial, I will be splitting the image into 4 x 4 tiles, just like before.

By default, the slicing process named the files with the same logic as GIMP, the first number represent the Column and the second one is the ROW. The only difference is, that the plugin starts the numbering from 01 instead of 00, that GIMP starts from.

This can be changed in the settings how ever, if this is important to you. To make the numbering start from 0, change "{column1:02d}-{row1:02d}" to "{column0:02d}-{row0:02d}".

 

6. Press the "OK" button and the plugin will change the image into separate layers.

7. Go to File > Export Layers...

pic11.png.190a71ae7cc0b04727c78aeaa2ebb584.png

Choose the folder you would like to save the images to and your preferred file format. After you are done, click "Export". The Plugin will save each layer as a file and depending on the size of your original file, this could take some time.

 

Conclusion

For my needs, these plug-ins are gems. I'm just surprised how come GIMP does not include these kind of functionalities out of the box. But then again, open source programs tend to rely more on community to add more functionality to the core program in the form of plug-ins and scripts. One thing that should be a out-of-the-boc functionality, is the "Save All" option for saving all open documents easily and fast.

Hope this was of use to you and I'll see you on the next one!

You can check out every possible mid week announcements about the project on these official channels;

• YouTube • Facebook • Twitter • Discord • Reddit • Pinterest • SoundCloud • LinkedIn •




0 Comments


Recommended Comments

ok this is really helpfull, can save alot time to me to when slizing animation sprites.

Thankies

Share this comment


Link to comment

You are most welcome, I'm glad it helped you out :)

Edited by ProjectTaival

Share this comment


Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Advertisement
  • Advertisement
  • Blog Entries

  • Similar Content

    • By N1H1LU5_k
      Greetings. Thank you for opening this thread. Long post ahead. I am a High School student trying to get into game development. I would like to ask you a set of questions, but I think giving a context first will be the best. So, this is what's happening:
       
      In recent time, about 3 weeks ago, I started learning how to use Unity Game Engine and Blender. I always loved to draw and design all kinds of weapons, armors but also levels (unfortunately, all of those are on paper only, FOR NOW, of course) and when I started to think about how to apply this trait of mine, I concluded I could try creating a game. Since it's only been three weeks, my game-making skills are extremelly poor (as expected). Fast forward to yesterday. We were supposed to pick up a topic for our graduation thesis which we will hand in closely to our school-leaving examinations in year 2021. There is a TON of stuff to choose from. As long as it is part of IT, it's fine. And I chose to make a game. Well, it's more of a one level of a game in my case. More students before me have taken this topic and passed totally OK with Flappy Bird-style game they made. They were satisfied with it. I wouldn't be. I want this game to be best possible, that is why I also want to start working on it as soon as possible. In fact, I am starting right now, but I figured it would be better to ask here first. I have roughly 17 months to make a game worthy of passing. Of course, it could be some Flappy Bird. But I want to go further. Excuse me if this all sounds stupid, but I simply would not be satisfied with just any game I would make. I am well aware I won't be able to make a game like Battlefield alone, that there is a ton of people and budget behind such games. But I want it to be as best as possible.
       
      Now, my question is: What kind of game would I be able to make in this time of 17 months ? You have probably rolled your eyes after this question, don't worry, I understand how subjective the answer is. But I will at least try to state some metrics that can help with answer. I believe I have some fundamentals of programming, willing to learn the language needed (I believe in this case it's c#), I will be hooked on creating, animating and further improving 3D assets as needed for sure. I am able to dedicate at least 2 hours every day, a lot more so on weekends. I have to prepare for school and I also work, so that would be 2 hours of time on workdays right now. I would be able to get music and voice samples for characters in the game. 
       
      Here is my current plan. Please, if you see this as unreal to make in my deadline, tell me about it. I want to make one level of a FPS shooter, kinda sci-fi game with approximatelly 4-5 cutscenes and a small bossfight at the end of the level. Graphical quality would be that of a current CS:GO. Favored play-time would be, I think, around 15-20 minutes. Map would be a destroyed urban area. I have a lot of concepts (characters, weapons, rooms and so on) already drawn and if not, envisioned. If this is not possible, what would be the best game I would be able to make in 17 months ?
       
      Thank you for reading. Please, be honest. I know my idea can sound stupid, and answer I am looking might seem too subjective, but I want to get corrected if I am wrong with all of this. I highly value any reply that will be able to help in the slightest.
       
      Until then, have a nice day.
       
    • By RoKabium Games
      Weapons - Magnacer is the first basic weapon that your Alien has equipped from the start. It shoots single bullets with a medium range that makes moderate damage to most enemies.
    • By CursedPhoenix
      I'm thinking on developing my own breeding game. Should be easy enougth to create the basic game mechanics and mostly the planning phase is done. I'll use "NimbleBit"s "Pocket Frogs" (https://en.wikipedia.org/wiki/Pocket_Frogs and https://play.google.com/store/apps/details?id=com.nimblebit.pocketfrogs&hl=de) as example, because my idea is in some ways quite similar. Android is the first platform I want to target, with optional expanding later to IOS and perhaps Windows.

      First Problem:
      I'm quite not sure about what language or engine I should use. I know this question is mainly based on opinion, but based on what I plan to do, is there an engine to prefer and why, or should I build it from scratch and wich language should I use then? At the moment my best bet would be on unity or python. Any suggestions here?

      Second (and most significant) Problem:
      I want to create a large amount  of - let's call it - monsters, that differs in color, pattern, color of the pattern and partly shape, but I don't get the trick behind it. So the question here is: How to create reusable monsters that differ in the above mentioned characteristics, with the lowest possible number of graphics.
      My thoughts and attempts on that topic: I looked at Pocket Frogs, and except shape they do exact the same with their frogs what I want to do. But I really don't get how they created over 38.000 (!!!) individual frogs, and the game still doesn't use that much space. I first tried to extract the graphics from the games files to puzzle together what they did. But I could not find them. However I think I figured out some parts of this secret just by looking at the frogs ingame: I think they used a basic frog model. 16 to be exact, to create 16 background frogs in all the colors. On top of them they just displayed the different patterns. But - and thats the mystery - the patterns are in different colors too and  I still dont believe they made 16*104=1664 different pattern graphics. So what trick am I missing here? Some kind of mask? Can I use the same technique to create different additional shapes for my monsters? And how did they made the feet moving. If the pattern on the feet are extra graphics, that would be another 1664 graphics.
      Any idea on how I can make this work, or on how did they make this work will be very appreciated! Thx
    • By Alessandro
      Hello, I have a spline and I'd like to generate connected tubes along the path. I've followed the method explained here  ("building two perpendicular vectors which are added to each point and scaled with sin/cos multiplied with the radius") which partially works because in some occasions the points are flipped and mess up the mesh (see screenshot), choking the tube. I'm not sure why that happens but I'd like to ask if you guys can suggest another method (maybe using matrices?), or a solution to it. Thanks for any help.
       

  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!