Overlap2D: Level/UI Editor for games with libGDX support

Engines, Libraries and Tools Tools Discussion
#1

yeD8lVYwAWQ

I’ve been doing game dev for a long time, and I really loved working with libGDX lately - awesome stuff.
There was a need in a good Level/UI editor that you can drag and drop assets with to make your game levels or elements faster.
And so we built a tool for ourselves in our small team. And then decided to share.
It’s in a very deep alpha, but i thought we should give it to community as soon as possible for you to try it out. You can already use it for your games, and hopefully create some cool stuff.

Overlap2D is a visual editor to compose your scenes. It works with simple drag and drop, you can put images, particle effects, lights and ui components. There is a way to combine actors into composite groups, and give them names and id’s, create library items and most importantly you can also import spine animations and put them inside your scene. This should be a great tool for making both complex big game levels, as well as just a UI components, dialogs, bars, whatever.

As the main idea is to be language/framework/engine independent, the output is JSON file, and we managed to make a simple libGDX runtime (opensourced on github) that you can use to load and display the scene in your existing libGDX projects.
In future I hope you would be able to load Overlap2D build level/UI data in any engine of your choice. Which is a big difference between other “game engines” that make you stick to their engine if you like their UI/Entity management tool. Which I believe is a wrong approach.

I hope you guys will like it. I will try to help in any way if it does not work.

You can download Overlap2D here: http://overlap2d.com

On site there is a tutorial video, a download link for Overlap2D jar file itself, and also a link to github page for libGDX runtime. With the download zip, there is an example demo project for you to play.

You need to have Java installed for jar file to work, this works on Windows 64, osX version works too but with huge CPU lag, which we will fix soon.

I guess this is it, love to hear more, and
Happy coding everyone.

#2

This is really awesome!

I will try it when I finish up my plane game physics engine! Would be really cool to try something new like this, as I have never really used any scene editor before.

#3

Thanks!

I hope by then we will have the physics tools in the editor already.

#4

This is great… It is very cool to see yet another cool tool added to the libgdx content pipeline. Great to see how quick you create the scene in the youtube video (you need to have the assets first :wink: ).
Looks like you have put quite some effort into this (I did something very similar for a game, but much less polished and without physics or lighting directly included, and that took me a big amount of time…).

Currently I’m stuck with tiled as it is the best pick for my current game. But I will definitely try this out when I find the time. I appreaciate the work you have put in to this.

Edit: Just for the lulz, a screenshot of my editor in action: http://i.imgur.com/vzeaAdm.png … Basically the same thing XD
Note the very fine programmer art :wink:

#5

Thanks! It is as polished as we could do in few months. The main core I did in 2 weeks though after office hours, and then we just kept adding stuff to it. And I hope we will bring it to a whole new level soon.

Btw even if your game is tile based you still have UI and dialogs to make, and you can do that with Overlap2D :stuck_out_tongue:

This is some creepy look from behind the trees :)) Btw, you had the node system I can see, it’s great stuff!

#6

Just tried the editor out. Some things I noticed:

  • I can’t scroll or pan the scene around. Don’t know if it is not implemented yet or if it is a bug.
  • I clicked on “root scene” and the whole scene shifted to the top right.
  • I find the scroll panes a bit strange. Had the same behavior in my editor first. You have to focus the scroll pane so it scrolls, but then it scrolls even if you are outside of the scroll pane. This interferred with my zooming controls (used the mouse wheel for that). I fixed this for all my scroll panes by adding an event handler to the ui stage with following code: http://www.java-gaming.org/?action=pastebin&id=1058 … It worked like a charm in my case.

But actually, it’s cool when you start up the editor and already see this nice scene :smiley: Makes me want to try out the runtimes :wink:

The node approach worked very well for me. Had to do some tweaking until I got the transformations and the rendering done correctly (and don’t mentiony the cloning of an existing node with all children :|)

#7

  1. Panning the scene works similar to photoshop. Press and hold space button - and then drag scene with mouse. I am not sure though how to make this more intuitive. But maybe for artists that would be a default thing to try?
    On the other hand, scroll to zoom-in/zoom-out functionality is not implemented yet, but is not a necessity when you have resolution support (top right).

  2. Clicking on root scene just reloaded the root scene, which is for some reason shifted it right… I need to fix this, thanks!

  3. for the scroll pane, wow, thanks! I tried to figure this out, but then I changed my focus to other stuff, and left that one behind, so thanks a lot for making my life easier, gotta put the fix in next version. That’s the cool thing about devs, you guys know why the thing that is not working is not working :smiley:

  4. Node system is a must, but there are some more pushing issues, so maybe not in next version, but next next.

#8

Btw, got first section of documentation done:

http://overlap2d.com/getting-started/

I hope this helps.

And the next version with more features like Sprite Animations and 9Patch support is coming up in next week!