FANDOM


m
m
 
Line 1: Line 1:
{{Tocright}}__NOEDITSECTION__
+
{{Tocright}}
 
{{Version|0.99.4.2a}}
 
{{Version|0.99.4.2a}}
   
Line 22: Line 22:
 
* decrease the number of colors
 
* decrease the number of colors
 
<br />
 
<br />
Why resize the image? Because each MagicaVoxel object cannot exceed <s>126</s> <code>256</code> voxels in any dimension.<br />
+
Why resize the image? Because each MagicaVoxel object cannot exceed <s>126</s> <code>256</code> [[voxel]]s (vx) in any dimension.<br />
As each pixel of an imported image fills <code>1</code> voxel of a new object, we need to resize down our image so its biggest dimension will be less than <s>126</s> <code>256</code> pixels.<br />
+
As each pixel of an imported image fills <code>1</code> voxel of a new object, we need to resize down our image so its biggest dimension will be less than <s>126</s> <code>256</code> pixels (px).<br />
<nowiki>[EDIT]</nowiki>: MagicaVoxel [[Version|v0.99.5]] objects can now go up to 256 vx in any dimension.<br /><br />
+
<nowiki>[EDIT]</nowiki>: Since MagicaVoxel [[Version|v0.99.5]], objects can now go up to <code>256</code>vx in any dimension.<br /><br />
 
And why decrease the number of colors? Because the image we use has a color depth<ref>[https://en.wikipedia.org/wiki/Color_depth Color depth] on Wikipedia</ref> of 24-bit (RGB), which means a color palette of more than 16.7 millions colors.<br />
 
And why decrease the number of colors? Because the image we use has a color depth<ref>[https://en.wikipedia.org/wiki/Color_depth Color depth] on Wikipedia</ref> of 24-bit (RGB), which means a color palette of more than 16.7 millions colors.<br />
 
MagicaVoxel's [[Interface|Model editor]] works with a color palette of 256 colors. Lowering the color depth of our image allows to precisely control its render, as each color will have an equivalent in MagicaVoxel's palette.
 
MagicaVoxel's [[Interface|Model editor]] works with a color palette of 256 colors. Lowering the color depth of our image allows to precisely control its render, as each color will have an equivalent in MagicaVoxel's palette.
Line 47: Line 47:
   
   
[[file:Tutorial_0.99.4.2_PatrikRoy-textures05_gimp.jpg|256px]]
+
[[file:Tutorial_0.99.4.2_PatrikRoy-textures05_gimp.jpg|256px]]<br>{{caption|Image resized with <code>Interpolation: Cubic</code>}}
 
 
 
 
{{caption|Image resized with <code>Interpolation: Cubic</code>}}
 
 
 
 
 
 
   
 
Note:<br />
 
Note:<br />
 
<code>Interpolation: None</code> will give you a more pixellated effect with more contrast.<br />
 
<code>Interpolation: None</code> will give you a more pixellated effect with more contrast.<br />
   
[[file:Tutorial_0.99.4.2_PatrikRoy-textures06_gimp.jpg|256px]]
+
[[file:Tutorial_0.99.4.2_PatrikRoy-textures06_gimp.jpg|256px]]<br>{{caption|Same resize with <code>Interpolation: None</code>}}
 
 
 
 
{{caption|Same resize with <code>Interpolation: None</code>}}
 
 
 
 
 
 
   
 
=== Decrease the number of colors ===
 
=== Decrease the number of colors ===
Line 72: Line 72:
 
[[file:Tutorial_0.99.4.2_PatrikRoy-textures08_gimp.jpg|300px]]<br />
 
[[file:Tutorial_0.99.4.2_PatrikRoy-textures08_gimp.jpg|300px]]<br />
   
[[file:Tutorial_0.99.4.2_PatrikRoy-textures09_gimp.png|256px]]
+
[[file:Tutorial_0.99.4.2_PatrikRoy-textures09_gimp.png|256px]]<br>{{caption|Final image in 16 colors ready for MagicaVoxel}}
 
 
 
 
{{caption|Final image in 16 colors ready for MagicaVoxel}}
 
 
 
 
 
 
   
 
We need now to save this image in [[PNG]] format.<br /><br />
 
We need now to save this image in [[PNG]] format.<br /><br />
Line 90: Line 90:
 
Note how the palette is entirely updated, and how colors <code>index:1</code> to <code>index:16</code> are replaced by the exact number of color we chose in Gimp.<br />
 
Note how the palette is entirely updated, and how colors <code>index:1</code> to <code>index:16</code> are replaced by the exact number of color we chose in Gimp.<br />
   
[[file:Tutorial_0.99.4.2_PatrikRoy-textures12_mv.gif]]
+
[[file:Tutorial_0.99.4.2_PatrikRoy-textures12_mv.gif]]<br>{{caption|Importing a new palette from an image file}}
 
{{caption|Importing a new palette from an image file}}
 
   
   
Line 100: Line 100:
 
*MagicaVoxel color palette ready and matching exactly our texture file colors
 
*MagicaVoxel color palette ready and matching exactly our texture file colors
 
We can create our new object:
 
We can create our new object:
*switch MagicaVoxel in {{#switchtablink:World editor|World editor|Interface}} mode with <kbd>TAB</kbd>
+
*switch MagicaVoxel in [[World editor]] mode with <kbd>TAB</kbd>
 
*<kbd>RButton</kbd> drag your texture file and drop it over the [[World window (interface)|world window]]
 
*<kbd>RButton</kbd> drag your texture file and drop it over the [[World window (interface)|world window]]
 
<br />
 
<br />
Line 106: Line 106:
 
<u>You can also drag and drop that texture file in Model editor</u>, but it will [[Resize model (interface)|resize]] the active object according to the texture resolution, and replace all existing voxels in that object.<br />
 
<u>You can also drag and drop that texture file in Model editor</u>, but it will [[Resize model (interface)|resize]] the active object according to the texture resolution, and replace all existing voxels in that object.<br />
   
[[file:Tutorial_0.99.4.2_PatrikRoy-textures13_mv.gif]]
+
[[file:Tutorial_0.99.4.2_PatrikRoy-textures13_mv.gif]]<br>{{caption|Importing a new object from an image file}}
 
{{caption|Importing a new object from an image file}}
 
   
   

Latest revision as of 09:25, May 5, 2020


This tutorial will explain how to

  • edit an image so it can be imported in MagicaVoxel
  • import a new color palette to correctly display that image
  • import your image as a new MagicaVoxel object

To manipulate image files, we'll here use Gimp. It's an open-source software that works on Windows and MacOS.
You can of course use any other program you'd be more familiar with.

This tutorial may be easier to follow on a computer.

Edit an image before importation Edit

Choose a texture example Edit

Tutorial 0.99.4.2 PatrikRoy-textures02 gimp
Let's browse, for example, texturex.com and choose a simple wood plane surface like this one.

Download the small version: 640 x 427 pixels (px).
Open the image in Gimp (if you get a dialog window about the color profile, click Keep).

The software's interface may seem complex, but don't worry, every step needed will be explained.


To be able to import it in MagicaVoxel, we need to:

  • change the image's resolution
  • decrease the number of colors


Why resize the image? Because each MagicaVoxel object cannot exceed 126 256 voxels (vx) in any dimension.
As each pixel of an imported image fills 1 voxel of a new object, we need to resize down our image so its biggest dimension will be less than 126 256 pixels (px).
[EDIT]: Since MagicaVoxel v0.99.5, objects can now go up to 256vx in any dimension.

And why decrease the number of colors? Because the image we use has a color depth[1] of 24-bit (RGB), which means a color palette of more than 16.7 millions colors.
MagicaVoxel's Model editor works with a color palette of 256 colors. Lowering the color depth of our image allows to precisely control its render, as each color will have an equivalent in MagicaVoxel's palette.


Change image resolution Edit

To change the image resolution, use the top menu Image / Scale image.

Tutorial 0.99.4.2 PatrikRoy-textures03 gimp


Then choose these settings:

  • Width: 64
  • Heigth: 43
  • Interpolation: Cubic

Then click Scale.

Tutorial 0.99.4.2 PatrikRoy-textures04 gimp


Tutorial 0.99.4.2 PatrikRoy-textures05 gimp
Image resized with Interpolation: Cubic


Note:
Interpolation: None will give you a more pixellated effect with more contrast.

Tutorial 0.99.4.2 PatrikRoy-textures06 gimp
Same resize with Interpolation: None


Decrease the number of colors Edit

To decrease color depth, use the top menu Image / Mode and choose Indexed...

Tutorial 0.99.4.2 PatrikRoy-textures07 gimp


Then, we'll choose:

  • Generate optimum palette with a maximum number of colors of 16
  • Check Remove unused and duplicate colors from colormap
  • Choose Dithering: None

Then click Convert.

The number of colors can be changed depending on:

  • the texture quality you need
  • the amount of palette colors you want to reserve for this object in MagicaVoxel

Tutorial 0.99.4.2 PatrikRoy-textures08 gimp

Tutorial 0.99.4.2 PatrikRoy-textures09 gimp
Final image in 16 colors ready for MagicaVoxel


We need now to save this image in PNG format.

Use File / Export As or CTRL+SHIFT+e and choose your filename and saving location.
Be sure to add a .png extension to your filename and click Export twice (leave the default settings).

Tutorial 0.99.4.2 PatrikRoy-textures10 gimp

Tutorial 0.99.4.2 PatrikRoy-textures11 gimp


Import a new MagicaVoxel palette Edit

Now that our texture file is resized and color optimized, we can easily create a new palette:

  • Activate the 3rd palette index
  • RButton drag your texture file and drop it over the palette cells


Note how the palette is entirely updated, and how colors index:1 to index:16 are replaced by the exact number of color we chose in Gimp.

Tutorial 0.99.4.2 PatrikRoy-textures12 mv
Importing a new palette from an image file


Import an image as a new object Edit

For this final step, we have:

  • a .png image of less than 126 256 pixels wide, a.k.a. our texture file
  • that texture file color depth equal or less than 8-bit/256 colors (4-bit/16 colors in our example)
  • MagicaVoxel color palette ready and matching exactly our texture file colors

We can create our new object:


Note how a new object of 64 x 1 x 43 voxels (x/y/z) has been added to our project.

You can also drag and drop that texture file in Model editor, but it will resize the active object according to the texture resolution, and replace all existing voxels in that object.

Tutorial 0.99.4.2 PatrikRoy-textures13 mv
Importing a new object from an image file


Pros and cons of this technique Edit

Should you consider using this kind of texture import?

  • YES, if you're beginning a new project, and need a color palette close to an existing reference (portrait, movie scene, landscape, etc.)
  • YES, if you're planning to use small flat elements or patterns you don't want to model from scratch, and which share the same palette
  • YES, if you use imported images as proportion canevas (like top, front, side silhouettes), don't change your color palette, and will delete these objects after use
  • NO, if you're at the end of your project, with palette and materials already ordered and assigned
  • NO, if you need bigger textures than 126 256 px wide, i.e. for a ground map - use Zarbuz's FileToVox instead!
  • NO, if you're afraid to micro-manage your colors when importing objects like editing your palette file manually


I hope this tutorial will be of any help... Feel free to comment or ask for help in our discord.
Thanks for reading!


PatrikRoy, november 2019

  1. Color depth on Wikipedia
Community content is available under CC-BY-SA unless otherwise noted.