Log In  

Cart #49430 | 2018-02-19 | Code ▽ | Embed ▽ | No License

Introducing the Plum vector editor for PICO-8!


Update 4/2/18:
Made some UI changes based on feedback. Hopefully it's less painful to use now, although it still has a long way to go. You might have to clear your cache to see the changes.

The Canvas:

  • Drag an image onto the canvas to use as a reference.
  • Shift-click on the canvas to place a vertex.
  • Click and drag a vertex to move it.
  • Click and drag a midpoint to add a vertex there.
  • Polygons are smoothed by default. Click a vertex to pin/unpin it.
  • Click a midpoint to toggle the edge color.
  • Click and drag on the canvas to select multiple vertices.
  • Hold Shift and drag a selection box to add vertices to the selection.
  • Hold Alt and drag to remove vertices from the selection.
  • Hold Z and drag to delete vertices.
  • Press A to select all current vertices.
  • Press S to deselect all current vertices.
  • Press Q to show/hide edges.
  • Press W to toggle transparency.

Other Stuff:

  • Colors (below canvas) - Top row is fill color. Far right is no fill. Bottom row is line color.
  • Layers (right of canvas) - Layers are drawn from top to bottom. Drag to rearrange, drag to bottom to delete.
  • Polygons (right of layers) - Polygons on a layer have the same fill and line color. They also affect each other. For example, to create a hole in a shape, draw another shape inside on the same layer.
  • Save/Load - Copy the top text box for the current drawing. Paste into the bottom text box and press “enter” to load a drawing.

WARNING: Pressing “enter” will clear the current drawing.

Making Lines:


  • Drag a reference image onto the canvas instead of trying to draw freehand. Use transparency to see your reference.
  • There are only 16 layers, so try to group polygons with the same colors together.
  • The simpler the shapes are, the better. This isn’t really suited for detailed stuff, and small shapes are hard to work with at the moment.
  • Simple drawings means shorter strings, too.
  • You can paste the strings from the demo cart into the editor to see how they’re constructed.

I think that’s the important stuff to know. This is still super rough and there are a lot of features I want to add. The UI needs work, too.

Some features I want to add:

  • Objects and instances
  • Puppet animation
  • Interpolation

I’m still learning as I go, so it’s been a lot of trial and error.

P.S. The name “Plum” isn’t an acronym, just a character I’ve wanted to make a game about for a while. I couldn’t think of a good name for this editor and she was the first thing I drew in it, so I just named it after her.

And here’s a demo cart from an older version of the editor I was working on in LÖVE.

Cart #47300 | 2017-12-12 | Code ▽ | Embed ▽ | No License

Left and right to change images
Up and down to scale
Z and X to mirror

P#47301 2017-12-11 20:16 ( Edited 2018-04-03 01:59)

Don't know why no one commented about this but this is really cool!

Something similar to "Another World" cut-scenes could be made with this, if not even better since this support curves and outlines!

The editor is very minimalist with barely no UI but still functional and editing a vector path is quite friendly, in fact I personally like it more than using confusing bezier handles, specially when they are locked... o.O

Now what bother me is that I'm constantly creating new points accidentally while editing... i feel like selection (Ctrl+Click) and creating new points (Click) are backwards... because if Shift delete it so Ctrl should create it... uh... right? ... just my personal opinion.

Also kinda miss that the keys "Delete", "Ctrl+A" (select all), "Ctrl+D" (de-select) and other commons commands don't work in the editor... not to mention undo/redo ... but all those are secondary.

What should be primary is the canvas resizing with the window size, it's bigger than the window area on my monitor even when maximized, also the lonely blank right space could be used for information and input boxes for import/export... at least until you redesign completely the UI.

Lastly, keep it simple... sometimes simple things are the best (specially with very limited tokens)... like... Puppet animation should be left for the programmer if he actually needs it ... as long you expose a 2D matrix per object the sky will be the limit ;)

P#51113 2018-03-31 15:09 ( Edited 2018-03-31 19:09)

I second the "rework the editor" comment - as such, this is really a pain to use :[

P#51189 2018-04-02 12:08 ( Edited 2018-04-02 16:08)

Thanks for all the great feedback. I'm making some changes to the interface right now. Hopefully I can have a new version up later today.

P#51193 2018-04-02 12:55 ( Edited 2018-04-02 16:55)

New version is up. You might need to clear your cache.

You have to shift-click to add vertices now, and the canvas should resize with the window. I've also added a transparency option so you can see your reference image under the drawing. I've updated the guide in the main post with all of the changes.

P#51228 2018-04-02 21:59 ( Edited 2018-04-03 01:59)

[Please log in to post a comment]

Follow Lexaloffle:        
Generated 2020-09-18 16:47 | 0.022s | 2097k | Q:46