First Look: Map Editor

Posted by Thomas Lackemann and Kurtis Kemple on February 21, 2017

One month ago, we launched the Power VTT private beta with one goal in mind: build the best damn virtual tabletop, period.

Since the initial launch, many of you have provided us with support and feedback to help us figure out what features are lacking most and what tools could be improved on in current VTT software.

Today, we are excited to share with you the first ever look into our powerful map editor as well as announce the launch of our new blog! This blog will be used to keep you up to date on what we are building, what we are prioritizing, and what we are doing to improve Power VTT.

If you like gifs, keep scrolling.

Simple & Powerful

As a GM, you have probably spent countless hours building highly-customized maps for your group. Tweaking fog of war, adding dynamic lighting, putting assets in just the right place … it takes a lot of time. The tools you use in your current VTT are probably fine, but chances are you have spent more time working around the tools provided instead of with them. This has caused you to spend more time building maps that obey the limitations of the software.

We are aiming to do better. We want you to spend hours building a map because it is actually fun and not because the tools provided are cumbersome or limited in what they can do.

So here is what we have done so far. We hope what we are building will make it simple to build immersive and complex maps without making things too complicated.

Areas

Areas are different destinations you can send your players. Each area is built using a unique set of layers and options giving you unlimited flexibility from area to area. Switching areas is generally fast since all assets are rendered using shared textures (less memory usage.)

Layers

Layers allow you to easily arrange, edit, and manage the different components of your map.

Unlike other VTT software, we have built a layer system that makes little assumptions about how you build your maps. Special layers like grid, fog of war, dynamic lighting, and triggers are kept on top and are clearly marked to provide special functionality to your map. Additional layers such as assets, shapes, and text can easily be added - there is no limit to how many layers you can have.

Since we want our GMs to build impossibly huge maps, we needed a system that was highly performant in order to run smoothly on almost any computer. We think we are almost there.

As a real-world example/stress-test, a map we built contained 50 layers (roughly 20MB of assets) and still performed above 50FPS on a Macbook Pro (early-2013) while resizing, panning, rotating, and navigating the map editor. The same map performed at a steady 60FPS on desktop with a dedicated graphics card (GTX 780). There is obviously room for improvement but so far we think it is pretty fluid.

Drop-in Assets

Adding assets to your map is as easy as dropping them in. Any asset you drop into Power VTT will automatically be tagged and managed by the Vault so you can reuse it in any map or area (more on the Vault in an upcoming post.) Each file you drop onto Power VTT will be automatically added as a new layer for easy management. You can currently import almost any image file and we want to eventually support audio files for use in triggers.

Layer Arrangement

Layers can be rearranged so that assets might appear on top of each other. To rearrange a layer, simply click and drag the layer on the sidebar to the desired position. The map will update automatically.

In addition to managing asset order, layers can also be used to lock or make layers invisible.

Layer Visibility

Toggling the visibility of the layer hides the object from the current area as if it does not exist, useful for item drops or assets that “magically” appear - feel free to be creative.

We plan to also utilize visibility in-game, giving you the ability to hide/show key layers (that you might choose) using key-bindings - useful for quick item drop/pick-ups.

Locking Layers

Locking a layer can be helpful when moving small items over larger items, such as torches or webs on top of a floor. Locking prevents the layer from being selected or moved accidentally so you can ensure you only move the right assets when selecting a group of assets.

Rotate / Resize

Clicking on an asset will select the asset and the associated layer. A selected asset contains a bounding box (standard to most editing software) that allows you to rotate or resize the asset.

By default, rotating and resizing and asset will force it to snap to the grid but this can easily be overridden by holding “Control” while performing the action to allow more precise control.

Precision Moving

Precision Rotation

Copy / Delete Layers

Rename Areas / Layers

Undo / Redo

Of course we allow you unlimited undo/redo.

Layer Editor

Not yet implemented but in the works is a small edit pane feature on the sidebar to expose much-needed configuration options for each layer. For example, clicking on the grid layer should allow you to edit the grid size, color, transparency, and background. Clicking on a layer with a graphic on it should allow you to edit the (x,y) position, rotation, tint, and more. If you are familiar with Sketch/Photoshop, something like that (minus all the bells and whistles).

Map Navigation

In additional to unlimited layers, we also allow you to build a map on an unlimited (yes, really … unlimited) canvas.

To navigate this massive area, simply right-click and move the cursor. You can easily zoom in/out with the scroll wheel to effortlessly navigate to different sections of your map. Zoom all the way in to get precise customizations and zoom out to get a global view of your map.

We also plan to implement an “auto-focus” feature to make finding your assets easier in this massive world. For example, if you moved the camera far away from your map and lost your way, simply click the layer you want to find and press “F” to auto-focus (zoom/pan) in on that asset.

We think this is the easiest way to build and navigate around a map without enforcing limitations.

Save / Load

We have a very basic version of saving and loading working but it is far from being perfect.

Our plan is to eventually save all maps to your Vault where it can be easily shared and managed.

Thoughts?

We want to make Power VTT the easiest, most powerful virtual tabletop on the market. To do this, we need your help.

If you like what we’re doing, please consider sharing us with your friends, sign up for the private beta if you haven’t already, like us on Facebook, follow us on Twitter, and stay tuned for more updates!

If you have any questions, comments, or suggestions for the map editor let us know in the comments below! We look forward to hearing what you all have to say.

Adventure on, friends.

Tom & Kurt

Ready to roll?

We're currently in private beta. If you can't wait to get started, enter your email to receive an exclusive limited-release asset pack and reserve your spot on the invite list.

Comments

It's FREE?

Absolutely. We don't believe in charging to unlock features. We want everyone to have a great tabletop experience.

After launch, we plan to launch a marketplace where we'll offer high-quality assets such as audio, graphics, stories, characters, items, and more to expand your tabletop experience. Content creators will also be able to make money by selling their content on our marketplace.

About Us

We're a couple of developers who really like playing tabletop games and have experience building fast, functional apps for the web. Talk to us on Twitter, we always welcome your feedback!

@tlackemann / @kurtiskemple