Indie-Resource.com

And here we are, as previously stated, I have a first release of the integrated pixel editor:

https://www.dotworldmaker.com/Home/pixel_editor.html
Selections, translation, multi-layer, rotation and flipping and more is covered. The editor supports sprite editing in multi-layer, which means each sprite can have all the layers needed and while saving the engine saves both the composite image as PNG and the work data as JSON. To reduce the size of the JSON, each layer is stored as a separated PNG / base64.

To access the pixel editor from within the game, you head to "Art" => "Characters", select one, and press the "Edit image" button at the bottom. Or from the tiles "Edit image" at the bottom. Map objects will soon be added (if not already when you read this).

The next will be, being able to add new tiles for background tiles and new map objects. Then being able to create new images from scratch as well.

Support for pixel opacity is also in the todo as well as changing layer opacity.

You may never have a full Photoshop experience here (as I will not code in all the filters for example), but you should have already a quite nice pixel editor.

Comments, suggestions are welcome.

Any chance of an undo button? People like me that suck at art desperately need that

Yes the undo is definitively something I want to build in. However I'm not 100% how I want to code it and for which operations. For example, I do allow size change, which re-pack the sprites... undo would be quite difficult to do as it change also the reference of the engine to the sprites.

So undo / redo of the pixel work, quite certainly but for the remaining I don't think so.

BTW thanks for the feedback

This is super awesome!

Thanks

The basis are nearly finished. Tomorrow I hope to be able to let you create brand new content directly instead of uploading. This will be valid for map objects and characters.

Very nice!

As for undo/redo, I made a pixel editor in Python for a class in college, and I implemented undo/redo by maintaining a stack and creating an "Action" object that would be created and filled out with all of the details of the action the user just made. I also wrote a reverseAction() method that could be fed an Action and would return an Action that is the reverse of the Action passed in (these were not saved into the stack; rather these were used to immediately reverse the image in the editor and all of the redos in the stack above that action would be truncated off). The editor was just a graphical representation of the final image. When the user would save, I would create a blank image and convert all of the Actions on the stack into real bitmap manipulations to spit out the actual image to file. Doing it this way you can have an infinitely large undo/redo stack, and you can even make a pretty cool feature that not many tools have: you can save the entire Action stack to a file and allow undo/redo to persist between sessions using the editor. In that case you would likely generate the entire image from scratch every time it is saved, even if the user is opening the image again from a saved state.

Given the quality and state of your projects, I assume you have already thought of all of this and it is more of an issue of implementation considering your existing editor code

Thanks Jackolantern, that's normally called a "command pattern" and it's indeed a good way to be able to undo / redo actions. However as the actions could affect multiple parts of the engine I'm somewhat not all that interested to do it that way. Maybe a simple undo / redo (with multi-level) for the current sprite would be more than enough and therefore limit the possible actions to store in the command pattern.

And.... Multi-level undo / redo done.

Result as coder: It's a mix of a command pattern and simply an history of the layer. Why? Because if I need to store all the pixel changes it may actually take more memory than making a PNG of the current layer and store it.

For the user it's transparent and he/she has multi level undo / redo, from the keyboard or from the interface.

There is 3 operations which actually stop the undo:
- Resize of a sprite: as I need to repack the sprite sheet and modify also the map object database.
- Add new sprite: as it touch either the tiles database or the map object database.
- Save: as I think when you save I can drop the undo / redo stack.

Added automatic shades of color which can be selected via the 0-9 keys. This allows to quickly switch from one shade to the other and therefore speedup your editing.

The shades are based on the color selection and therefore picking a color or choosing it will change the shade, however choosing a shade only change the current color not the whole color selection.

This mostly end up my current run with the pixel editor and I will now go back on other parts of the engine.

That is so awesome. You could post something like this as a standalone online pixel editor and make some ad revenue.