/
Working with Images as the GM

Working with Images as the GM

Owned by Derek Batting
Last updated: Oct 29, 2024
20 min read

Fantasy Grounds VTT Images

Note: Fantasy Grounds VTT is still in active development and new features are being added and improved all the time. Some screenshots below may not yet be updated to match the current tool sets available, but the functionality should be the same or similar.
We are working to update this and our entire wiki to match current features and visuals.

Image Sizes, Types, and Specifications

Fantasy Grounds VTT supports any JPG and PNG images, as well as Google’s next-generation media-rich WEBP and WEBM formats, and Universal VTT file formats – DD2VTT, DF2VTT and UVTT used by such applications as Dungeondraft, Dungeon Fog, Dungeon Alchemist, Hero Forge, and others.

For GMs, we recommend using the same images types, sizes and specs that we give to asset and module developers to keep images loading quickly without unnecessarily large files.

You can read all image recommendations in the Developer’s Guide at the link below:
Link: https://fantasygroundsunity.atlassian.net/wiki/x/AYByeQ

NOTE: Currently, WEBM files are only supported when compressed with VP8.
VP9 will be supported in a future release. Please make sure any WEBM files are in VP8 or convert them from VP9 if necessary.

Importing Images into Fantasy Grounds

These will appear in the Assets window under Images when you add them to your campaign. From there, you can copy them into your campaign, set a grid, define line of sight and use them in your campaign.

image-20240904-211216.png

Follow either of these two methods to include new images in your campaign from outside of Fantasy Grounds. If the image is online, you should first save it to your local disk.

Method 1 - Import File (Recommended)

The example is using the 5E ruleset and the built-in Leather theme. Your screen may look slightly different depending on the ruleset you chose.

  1. Open the Images window using the sidebar button for the ruleset you are using.

  2. (Optional) Click on the Group dropdown and choose which group to place the image or create a new group and choose that.

  3. Click the Import button (the blue and white “up arrow” button next to the All button).

    image-20240904-212016.png

     

  4. Browse for the file. You can filter file types by selecting any of the individual file types from the dropdown, or leave the default “All Files” to see all files eligible for import.

Method 2- Import Assets (Bulk Import)

  1. Open your Assets window

  2. Click on the Folder button to open your Data folder

  3. Navigate to your campaign’s image folder.
    Default paths to campaigns:
    Windows: C:\Users\[YourUsername]\AppData\Roaming\SmiteWorks\Fantasy Grounds\campaigns\[YourCampaign]\images
    macOS: /Users/[YourUsername]/SmiteWorks/Fantasy Grounds/campaigns/[YourCampaign]/images
    Linux: /home/[username]/.smiteworks/campaigns/[YourCampaign]/images
    Note: the .smiteworks folder may be hidden by default. Enable "Show Hidden Files” in the file manager settings.

  4. Place any images you want to use there. This will add a folder called Campaign to your Assets window under Images.

  5. Open the Images screen from the Sidebar buttons

  6. (Optional) Click on the Group Dropdown and choose which group to place the image or create a new group and choose that.

  7. Click on the Create From Campaign Assets button at the top and answer Yes at the Prompt.

Method 3 - Manual Import from Assets

See Using the Assets Window for Tokens, Portraits and Images for more information.

For images created outside of Fantasy Grounds, follow these steps to add it to your Assets and then to your campaign.

  1. Open your Assets window

  2. Click on the Folder button to open your Data folder

  3. Navigate to your campaign’s image folder

  4. Place any images you want to use there.

  5. Return to the Assets window and change to the Images Mode

  6. Locate and open the Campaign folder

  7. Drag the images from there to your Images window

Image Windows and Icons

Once an image is opened and ready for use, there are several options available before you even get into altering the image, adding PCs/NPCs, etc. Here is what each section of the Image Window means:

  1. Record Link - You can drag and drop a direct link to the open image almost anywhere; on the Hot Bar at the bottom for quick reopening, onto the chat window for all to see and use, into other open documents or notes, etc.

  2. Image Name icon - Denotes the Image Name field.

  3. Module Name icon - Shows what module the image was loaded from.

  4. Revert Changes To Module Record - Allows you to easily revert the image to the one contained in the module.

  5. Image Name field - Where the name of the image is. This can be the name of the corresponding file, or can be edited to be whatever you like.

  6. Unidentified Name icon - Denotes the Unidentified Name field

  7. Unidentified Name field - You can edit this field to name the image what you would like your players to see if the image is unidentified.

  8. Identified / Unidentified toggle icon:
    Highlighted with Checkmark - Identified
    Unhighlighted with X - Unidentified

  9. Locked / Unlocked toggle icon:
    When unlocked, you can fully edit or alter the image with the complete Image Controls explained below. When locked, editing is no longer possible.
    Highlighted with Lock Closed - Locked
    Unhighlighted with Lock Open - Unlocked

  10. Public / Not Shared toggle icon:
    Public - Can be shared with players and reopened by them if shared.
    Not Shared - Has not been shared and cannot be opened by Players if previously shared.

  11. Open Help icon - Will take you to the corresponding area of the wiki for this particular window. In this case, the page you are reading right now.

  12. Minimize Window - Will reduce the window to a single round icon on the FGVTT desktop that you can move around and click to reopen.

  13. Increase Size - Will increase the size of the window to fill the desktop between the chat box on the left and the Sidebar on the right. If clicked again after the size is increased, the image will fill the desktop, going behind the chat box and filling all other available space, but will not cover the Sidebar. If clicked a third time, the window will increase to fill all available space including covering the chat box and Sidebar.

  1. Close icon - This will close the window completely and without warning.

  2. Toggle Toolbar icon - This will open a bar directly above the Image Controls below. These icons and how they can change depending on what a window is used are explained in the Toggleable Toolbar section below.

Toggleable Toolbar

The Toggleable Toolbar will show or hide different icons depending on the use case of the image.

For example, if an image is open, but the image isn’t being used as an active map with PCs and NPCs added from the Combat Tracker, the toolbar will look like this:

If an image is being used as a map with players and NPCs on the map, additional icons will be available:

To illustrate each icon’s function in a visual manner without overloading this page, please click over to the Toggleable Toolbar Functions page.

Link:Toggleable Toolbar Functions

Using the Image Control

You can unlock the image to access the Image Control. Within the Image control, you have a main mode, sub-mode and then additional controls dependent upon the submode.

Modes

Icon

Description

Icon

Description

Play Mode

 

Play Submode

This is the default mode that allows the mouse to pan the window.

 

Token Selection

Single click to choose a token or draw a rectangle around a group of tokens that you want to select for movement.

 

Token Targeting

Use this mode to select targets for an action.

In most rulesets you can simply CTRL+Click on a target

 

Drawing Mode

This mode allows simple drawing in your chosen dice color. For more advanced drawing, refer to the Paint mode.

 

Erase Drawing

This mode changes the cursor to an eraser. The eraser removes parts of a drawing you have made.

 

Ping Mode

This mode allows GMs and players to display radial pings on the map.

 

 

 

 

Additional Play Controls

View Type - Changes between 2D (Top Down) mode, Free Camera 3D mode and Token View 3D mode

Zoom Extents - resizes the image to fit inside the Image window

Show/Hide Shortcuts - toggle pin visibility for the GM

Enable/Disable Player Vision Preview - toggles GM and Player view of the map

Enable/Disable Line-of-Sight - turns on or off Dynamic Line of Sight.

Toggle Token Lock - turns on or off token locking for movement planning and approval.

Toggle Grid Snap - turns on or off snapping to grid centers, corners and edges of grids.

Layers Mode

 

 

 

Layers-Transform Submode

Here you can manipulate a layer (see Layers below) to rotate it, scale it, flip it, or change the color.

 

 

 

Layers-Tile Submode

Used to add tile images onto the map. You can rotate, scale, flip or color the tile before it is placed. Each time you click on the map, a new tile layer will be added to the Layers section.

To place a tile:

  1. Drag a tile image from the Assets - Images window to the Graphic Asset area.

  2. Set a default settings for this and all future tiles

    1. Default size in grid coordinates

    2. Default rotation

    3. Color Tint

  3. Click on the map to place the tile.

  4. Continue clicking to add more of the same tile

  5. You can now drag new tiles directly from the Assets window to the map and they will inherit all the Tile settings from Step 2.

 

Paint Mode

 

 

Duplicate Selection As Walls - copy and paste selection as a wall piece.

Duplicate Paint Layer As Walls - copy and paste paint layer as a wall piece.

Remove Selected Points - Select multiple points to delete from the line.

Simplify Selected Strokes - Reworks selection to be less complicated

Reverse Selected Strokes - Inverts the stroke selection direction.

 

 

 

Drawing Lines

You can adjust the default brush size, color tint, size, angle, shadow and fade strength, how it overlaps other parts, end cap type and corner type of your line. Rotating, flipping, snapping to grid and magnetic snapping are also available options.

Any drawing will add a new Paint layer if you don’t already have one selected.

Free-form Drawing: left-click and hold to draw a line using the mouse.

Straight-lines: single click on each point where you want it to draw a straight line. Double-click or press Enter to end the line.

Draw with Image

Switch from Brush Mode (default) to Image Mode in the Image Control. Drag an image from the Assets window to the Graphic Asset area. Adjust the size, color and rotation and then draw free-form or straight lines.

 

 

 

Draw Rectangle

Click and drag from the starting corner of your rectangle to the opposite corner of your rectangle.

 

 

 

Draw Circle or Ellipse

Click and drag from the starting boundary of the ellipse to the ending boundary of the ellipse.

 

 

 

Adding Image Stamps

Image Stamps switch from Brush Mode to Image Mode automatically.

To place a stamp:

  1. Drag an image from the Assets window to your Graphic Asset area.

  2. Set the default color, size, rotation and orientation.

  3. click on the map to stamp the image.

  4. All stamps are added to the current Paint layer. If there is no paint layer, one will be created for you.

 

 

 

 

 

Erasing Drawings

  1. Set the size of your eraser

  2. Choose the paint layer you want to erase (if you have multiples)

  3. Hold down the left mouse button with your erase cursor over the section you want to erase.

 

Edit Filled Strokes - Provides several keyboard and mouse combinations to achieve different fill effects.

FX Mode

 

 

Layers list

 

FX Type

 

 

The FX Type dropdown will be blank by default. You must first add a new FX layer by using the layer controls at the bottom of the image control.

To add a new Fx layer:

  1. Click the Add FX Layer button to add a new FX layer

  2. Select the newly added layer

  3. Select the FX you want from the FX Type dropdown menu

Each FX Type will have it’s own specific adjustment. For example:

 

Layer Line of Sight (LOS)

 

 

 

 

 

LOS Drawing Mode

The 2nd toolbar allow Selection, Draw Line, Draw Rectangle and Draw Ellipse. They function just like drawing in Paint Mode.

 

 

 

LOS - Wall Mode

Walls block line of sight and movement for players.

Walls are shown in Red.

 

 

 

LOS - Terrain Mode

Players can see into the first terrain in their vision. The back edge of the terrain blocks line of sight much like a wall.

Players inside of terrain can see out of it in all directions.

Terrain is shown in Green.

 

 

 

LOS - Door Mode

Players can see the contents of a door, but not beyond it. Hovering over a door will allow the option to Open or Close the door.

* The GM can shift+click on the door to lock or unlock it.

Doors are shown in Blue.

 

 

 

LOS - Secret Mode

Secret areas will act just like a wall to players. The GM, however, will have the option to open the secret door. This will allow players to see through the area an