Guide:MEB/Chapter3

From Starbounder - Starbound Wiki
Jump to: navigation, search

WORK IN PROGRESS

Chapter 3: Making a Custom Object Part 1

Now that we have learned the basics when it comes to editing a vanilla file, we are now going to create our own custom object, with our own custom graphics. This part is going to be divided into two parts. The first part deals with the graphics of the image, while the 2nd part deals with the code.
Now the first thing we need to do is get an image editor. There are many pixel based image editors available on the internet. The one you choose is up to you. Though my guide is going to be focusing around Gimp and occasionally some points on Photoshop.

Once you installed GIMP, start it up. There are some basic concepts you need to understand before we make our object.

  • All images in starbound are rendered in a factor of 8.
  • Though you can use images not based on a factor of 8, keep in mind you will have collision oddities. Especially objects which are meant to have things stacked on it, you should stick to 8. Or you will see floating objects.
  • Colours need to be picked in such a way where there is a reasonably significant difference from the adjacent block to be noticed in game. Though gradual changes can be more clearly if over a much larger area.
  • Make sure you disable anti-alliasing when working.


Now as GIMP is open lets see how to start us off.
INSERT IMAGE HERE 001
As you can see these are the 3 main windows we will be working with. The Toolbox contains all our tools necessary to create our image. The Main window is where our image will be edited, an the layers box is one of our most important assets at our disposal.

So lets go to File --N New
INSERT IMAGE HERE
As you can see this is the New Image window. The first thing we need to do is decide the size of our canvas. So lets break it down.

  • The player character is about 16 by 40
  • For animations we need to make the canvas size based on each frame. So say we want 5 frames for our animation. Our object is 16 x 16. So we want to create a canvas of 80 x 16.
  • Choose advanced options and make sure you choose "Fill with Transparency"
  • You can create a much larger image and scale it down. Which is explained at the end of this tutorial.


Press Ok. Now our canvas is set-up and you should see a chequerboard canvas. The chequerboard represents that area has no colour.
We are now going to create a decorative image. We will keep adding onto this image and we will later show you how to turn the image we created in to a crafting table \ furnace \ storage container in the next tutorial with a small change of code. Then the chapter after that we will cover custom user interfaces.

Now before we start making the image. Lets set-up our tools first
INSERT IMAGE HERE
The first thing we need to do is Zoom in. So increase the size of your Canvas window then go to View --> Zoom --> Zoom to Fit image in Window.
This will make it so we can clearly work with the pixels.
Now lets look at our Toolbox. The 2 tools we will be using mostly is the pencil and eraser tool. Which are marked by the coloured boxes. Below them you see a an Over lapping pair of boxes. These are our Colour boxes the top being foreground and the back being background. Don't worry about the background box, the foreground box is what decides the colour of the pixel we will be painting with.
Now choose the pencil tool and set-up the following settings. Make sure the mode is normal and choose the tiny square brush and set the brush to 1 pixel. Now set the size also to 1 pixel. Finally under Dynamic make sure it is set to Dynamic off. At this point we are almost ready to start drawing. <nr>
Now click on the Over foreground colour box mentioned earlier. A new window will appear which will let you choose a set of colours. The vertical colour box on the right sets the base colour of the large box. The box on the far right with an overlapping syringe is the colour picker tool. It lets you pick a colour from the canvas so you can set the colour exactly as the one you sampled. This is great tool to help you choose the exact colour you choose previously if you have forgotten which one you picked.

Next let us setup the eraser tool before you get started
INSERT IMAGE HERE
Now select the eraser tool and select the one pixel brush. Also make sure the Size is 1 pixel and finally make sure you check Hard Edges, that way you won't have any anti-aliasing erasing.

Now you are almost ready, you just need to decide what to make. There really is no way to help you decide that so here are some tutorials to help you out instead.


At this point you should have created an image you can be proud of. Remember Starbound supports Transparencies so you don't need to fill "every" block on the canvas.

Now the last Part of the Guide Deals with Saving and Exporting. Now go to File Save and create a new folder. All your work will be saved in this folder, but these files will not immedieatly work in starbound. You are saving the GIMP versions of the file for easier editing. So name them accordingly.

Once you have saved the image go to File-->Export
In select file type choose PNG and now save the PNG file. This is the file which we will be using in the game. The XCF file is a GIMP based format.

Retrieved from "https://starbounder.org/mediawiki/index.php?title=Guide:MEB/Chapter3&oldid=44724"