Sprit3r - 3D model viewer for spritesheets

[evgiz]

Sprit3r

Hi everyone!

I'm happy to share my little software called Sprit3r!
Sprit3r is a 3D "model viewer" for viewing models composed of 2D spritesheets.

This is what a loaded model looks like:



This 3D model is rendered using this sprite:


The style can be very unique and good looking if done well, for instance in this game, called NIUM:



Now thats cool and all, but why would you wanna use Sprit3r? Well: making this type of art can be incredibly hard! It is very difficult to imagine what your 2D spritesheet will look like when rendered in 3D, especially for tall objects. Sprit3r can help you with this because the model updates in real time while you edit!

Features
- The model updates in real time while you edit in another software
- Two display modes, flat and voxel
- Zoom, rotate or flip the model
- Linear and nearest filter for both pixel art and high resolutions
- Supports any editing software you like. It simply acts as another window with a preview.
- Automatic rotation and hidden UI provides a clean workspace
- Supports .png, .jpg and .vox files

The software was created entirely in LÖVE, using the fantastic UI library SUIT by @vrld.


New version, drag and drop files!
Support for MagicaVoxel files!

Sprit3r.love

(1.54 MiB) Downloaded 805 times

Github repository: https://github.com/evgiz/sprit3r

Thanks for reading, and tell me if you find the software useful!

[Alexar]

wow ,it's really cool. I am looking forward to make some voxel game with it. but any tool for building the models? something like 3d max?

[evgiz]

wow ,it's really cool. I am looking forward to make some voxel game with it. but any tool for building the models? something like 3d max?

Unlike regular voxels, the models are made from 2D spritesheets, not polygons. They can be edited with any image editor you want. Even though LÖVE doesn't support traditional 3D this method is easy to use. Its limited in a number of ways however, most notably the models can only rotate around a single axis and true perspective is not possible as far as I know.

This 3D model is rendered using this sprite:

Simply put the artist imagines how the object would look, then draws each individual slice. Sprit3r stacks them on top of each other creating the 3D effect. This gives you instant feedback on how the object will look in your game. The models have volume like regular voxel models so I imagine its possible to convert these to polygons, however its not something I know how to do.

[Fuzzlix]

I like your idea and i am wondering noone cam up with sooner. It seems to me its a perfect fit to love2d. The result looks very good. I will shurly try it.

[kikito]

It's funny because I have been working on a similar idea. Where you inspired by a post on reddit, as I was?

Anyway, I think I'll share what I have now, because it matches well what you have done.

As @Alexar was asking, I too felt that editing the sprites by hand was too difficult for my (already limited) artistic capabilities. So I started investigating and found this open source voxel editor: Magicka Voxel.

Magicka Voxel uses a binary file format (extension: .vox), but it's relatively easy to write a parser for it, given that it is opensource. Generating a "sliced raster" from the model is simple too. Here it is:

vox.love

(12.71 KiB) Downloaded 414 times

I think you should be able to adapt it to your program, if you are so inclined.

- No file browser, is it even possible with LÖVE? Place images in Sprit3r folder.

As far as I know, LÖVE allows drag-and-dropping files on top of the LÖVE game via [wiki]love.filedropped[/wiki]

The next step I want to take is where our paths divert: Instead of rendering the slices directly, I want to try using the texture as a 3d texture and render it using a shader, as explained here and here. But I don't know if I will be able to do it.

[evgiz]

It's funny because I have been working on a similar idea. Where you inspired by a post on reddit, as I was?

Yeah I was! I saw the post on reddit and found the concept really cool. It makes it easy to make pseudo-3D in a 2D engine/framework and the style can be really cool and unique.

Magicka Voxel uses a binary file format (extension: .vox), but it's relatively easy to write a parser for it, given that it is opensource. Generating a "sliced raster" from the model is simple too. Here it is:

I'm familiar with MagickaVoxel and I've played around with it a bit. I had no idea it was this simple to generate a sprite sheet from the files though, thats really cool! Its probably an even better way to model as you can edit in 3D. I'll look into .vox files a bit more.

One advantage with using sprit3r + photoshop or whatever is that you're not limited to "pixel art" and can easily create high res models.

As far as I know, LÖVE allows drag-and-dropping files on top of the LÖVE game via [wiki]love.filedropped[/wiki]

I didn't know about that callback! It's exactly what I've been looking for, thanks for pointing it out!

The next step I want to take is where our paths divert: Instead of rendering the slices directly, I want to try using the texture as a 3d texture and render it using a shader, as explained here and here. But I don't know if I will be able to do it.

I don't know enough about shaders to do this myself, but I look forward to seeing what you can come up with!

[evgiz]

I used your code for importing and slicing vox models and came up with this pretty quickly:



If its okay for you I'll continue using your code to support voxel models as well.
I don't think I'll be able to implement it myself, looks complicated... hahah

[kikito]

If its okay for you I'll continue using your code to support voxel models as well.

Permission granted! Consider the code released under the MIT license.

I am glad I could help!

[evgiz]

I've come across a minor issue that I'm pretty sure isn't on my end
Take a look at this, left is Sprit3r and right is MagickaVoxel:



It seems like the .vox parser ignores the last line of each layer somehow (or something like that). The results were a bit different on other models, so I couldn't figure out exactly whats wrong. I'll try taking another dive in your code but you'll probably find the error much faster than I can.

EDIT: After experimenting a bit more it seems like the last voxel placed is not included, very strange...

[kikito]

It's probably that my parser has a bug. I'll give it a look, thanks!