Character Vault
Any Concept / Any System
Compendium
Your System Come To Life
Roll20 for Android
Streamlined for your Tablet
Roll20 for iPad
Streamlined for your Tablet

Personal tools

Difference between revisions of "Art Library"

From Roll20 Wiki

Jump to: navigation, search
m (Image Storage Quota)
 
(130 intermediate revisions by 11 users not shown)
Line 1: Line 1:
 +
{{revdate}}{{HCbox|{{hc|articles/360039675113-Art-Library Here}} }}{{clear}}{{SidebarNav}}
 +
The {{Art Library}} is the second tab from the left of the [[Sidebar]], and is accessible to you for any game where you are a '''[[GM]]''' .
  
[[File:sidebarart.jpg|right]]
+
This tab allows you to search, upload, and organize any JPG, PNG, GIF and other image files that you wish to use in your game.
 +
[[File:The Art Library Screenshot.jpg|thumbnail|right|The Art Library|500px]]
 +
==Searching For Art Assets==
 +
[[File:Art_Library_Tab.png|thumb|500px|The Art Asset Search|right]]The first part of the Art Library tab is the image search section. After running a search, the results will list below the search bar in this descending order:
 +
# '''My Library''': Any image you have personally uploaded to Roll20 and stored on your account's allotted image storage (quota)<br /><br />
 +
# '''Marketplace Purchases:''' Any available image from an art set you have bought off the [[Marketplace|Roll20 Marketplace]] <br /><br />
 +
# '''Pro Sets:''' When a user has a {{Pro}} subscription, [https://marketplace.roll20.net/browse/search/?keywords=exclusive Exclusive Token Sets] becomes available in-app.<br /><br />
 +
# '''Free Assets:''' Images from art sets made available to the Roll20 community to use for free in their games. ''(Note: Not for commercial resale purposes)''<br /><br />
 +
# '''Premium Assets:''' This initially lists a cross section of popular packs from the {{market| Roll20 Marketplace}}, highlighted in pale yellow. These assets have been created specifically for use in Roll20 by community members like you. [[Marketplace]] assets can be expanded by clicking on '''More Premium Assets »''' to show up to 100 different items and can be purchased directly by clicking on any image which opens up its pack's [[Marketplace]] listing in a new window. <br /><br />
 +
# '''From the Web''' This section is shaded in light blue and pulls images cached from various TTRPG image resources around the web.<br /><br />
 +
{{mbox | text = '''Note:''' Images found ''From the Web'' are using search results collected in the first year of Roll20's existence while the Google Search API was freely available. This list of search results are four+ years old at this point, so at times this makes search results occasionally archaic.}}
 +
<div style="clear:both;"></div>
 +
<br />
 +
===The Search Bar===
 +
This is where you run your search for art assets. An art search matches your keywords with image file names, tags, or the folder names your assets are stored in.
 +
====Roll20 Search Parameters====
 +
Searching with more than one keyword is inclusive, helping you refine your search to only assets that match both words.<br />
 +
ex.<br />
 +
<code>red dragon</code> ...will return results that match "red" AND "dragon" together, but not just "dragon".
  
The Art Library is the second tab of the Sidebar and is access to you while in any of your games. This tab allows you to search for images to use as tokens, tiles, and maps for your Campaign.  
+
'''Boolean Searches'''<br />
 +
Optionally, you can use the ''OR'' keyword to get an boolean search, where results will be returned if either word matches any criteria.<br />
 +
ex.<br />
 +
<code>water way or swamp</code> ...will return results that match "water" AND "way", OR "swamp", but not "water" AND "swamp".
  
To find assets, just type a keyword into the searchbox. Roll20 will automatically search through any files you have uploaded, the Roll20 Marketplace, and popular RPG forums and sites on the webs to find assets matching those keywords. When you find an asset you want to use, just drag and drop it from the Art Library area onto the tabletop to add it to your Campaign.
+
'''Exclusive Searches'''<br />
 +
You can also refine your search further by adding a "-" symbol before a word to exclude all results that keyword matches.<br />
 +
ex.<br />
 +
<code>giant -fire</code> ...will return results that match "giant" only if that item does not also have the keyword "fire".
 +
<br /><br />
  
== Tutorial Video ==
+
===Image Search Type Drop-Down Menu===
 +
[[File:Image_Search_Type_Menu.png|thumbnail|right]]
 +
Above the search bar is a drop-down menu where you can choose the Image Search Type. This narrows the search to specific tags assigned to images on the Roll20 Marketplace, Pro & Free Assets, and collected resources from various tRPG image sites. This is broken down into four categories: '''Tokens''', '''Maps, Tiles, Textures''', '''Portraits''', and '''Everything'''. If you want to cast the broadest net with your search, choose the '''Everything''' option.
 +
<div style="clear:both;"></div>
  
This is a tutorial on the Art Library in Roll20.
+
===Search Style Toggle===
 +
[[File:Thumbnail Size Toggle.png|thumbnail|right]]
 +
Also above the search bar is an expanding icon beside the word '''Search:'''. This is the Search Style toggle. Clicking on this icon will swap between small and large thumbnail display of the images found in the search results.
 +
<div style="clear:both;"></div>
  
{{#evp:youtube|4Qu5OfHZw9M|Art Library Tutorial|center|700}}
+
[[File:Art-library-drag-graphics.gif|thumbnail|600px|drag-n-drop images from your {{Art Library}} to the map.]]
 +
<br>
 +
<br>
 +
==Placing Graphics onto the Tabletop==
  
 +
Once you’ve found, purchased, or uploaded the art assets you’d like to use to your {{Art Library}}, simply drag and drop it from either the folder view, the Recent Upload list, or from a sub folder onto the Tabletop/map.
  
 +
If you want to use to images for your [[Journal#Bio_.26_Info_Tab|Character Portrait]], or {{Journal}} Handout, you need to have their menu open instead.
 +
<br>
 +
<br><br><br><br><br>
  
'''Favorites'''
+
==Premium Assets & My Library==
 +
[[File:Premium Assets View.png|frame|right|The Premium Assets View]]
 +
When not searching for images, below the Search Bar is your image index. There are two indexes that you can swap between at any time are '''Premium Assets''' and '''My Library'''. Everything under '''Premium Assets''' are images that you have ''not'' uploaded to Roll20 nor do they count towards your account's image quota when you use them in your games. Folders for '''Marketplace Purchases''', '''Pro Assets''', and '''Free Assets''' are listed here. <br /><br />
 +
Everything listed under '''My Library''' is content that you have personally uploaded into your games and stored on your Roll20 account. These images in My Library ''do'' count towards your image quota.
 +
<div style="clear:both;"></div>
  
By clicking the star next to any result, you can add the image to Your Library. The image will automatically appear at the top of the results the next time you search for the same keyword.
+
==My Library==
 +
[[File:My Library View.png|framed|right|My Library View]]
 +
Any and all image content you upload to Roll20 will be added to '''My Library'''. When you toggle to the My Library view in the {{Art Library}}, you'll first have two buttons for uploading images and for creation of folders. Underneath that is an area that shows the folder tree (if you have created any). Underneath that is the Recent Uploads image list.
  
'''Your Library'''
+
Roll20 supports the following image file types: jpg, png, gif, animated gif, mp4, webm & PDF (upon upload, you'll be asked which page from the PDF will be converted to an image).
  
If you select the star icon next to the search box, you access Your Library. Your Library includes images you have uploaded, images you have starred from search results, and assets you have purchased in the Roll20 Marketplace. You can add multiple tags to any asset in Your Library, and it will appear in search results for that tag in the future. You can also click the &quot;Upload&quot; tab at the top to upload images to Your Library by dragging and dropping or choosing them from your file system. You can upload ten images at a time in a batch. There is a 5MB maximum limit to an image upload (this is for a singular graphic or for a batch of them).
+
For information on [[Best Practices for Files on Roll20|optimizing your files for use on Roll20, see the Best Practices guideline]].  
  
'''Your Quota'''
+
<br />
  
Roll20 allows 100MB worth of art assets to be used by a base account (the default account type). Note that only images you've uploaded to Your Library (not including assets from the Marketplace) count toward your quota.
+
===Uploading Art===
 +
There are two methods for uploading art to Roll20. The first way is to click and drag a single image from your file explorer/computer to the Tabletop and it will upload as well as place the graphic where you designated on the Tabletop.
  
[[File:ArtLibrary.jpg|thumb|500px|right]]
+
The second way is to click on the '''Upload''' button underneath '''My Library'''. This pops open a dialog box called '''Upload Files...'''. This dialog box has a dashed-border rectangle where you can drag a maximum batch of ten images at a time to upload them all at once. You can also select images one at a time with the '''Choose a file...''' button which brings up a file selection menu to browse for files on your computer/device.  
To free up space in your quota, access the Art Library icon from the Sidebar in your game. Select the star icon next to the search box. This will take you to Your Library.
+
  
Click the red trash can icon next to the image(s) you'd like to remove. The system will prompt you prior to deleting the data to confirm that you wish to continue.
+
'''File Size Cap:''' If you have a [[Free]] account, no single image or batch upload can exceed 5MB. For {{Plus}} & {{Pro}}-subscribers, this cap is raised to 10MB.
[[File:ArtLibrary1.jpg|thumb|500px|left]]
+
  
You can check your current quota usage on your [https://app.roll20.net/account My Account page]
+
 
 +
{{mbox | text='''Note:''' While your image or batch of images might not reach 5/10MB exactly, if the total file size is very close to the cap, the upload may not process. This is because a small percentage of extra bytes is required to process the upload, which can make you hit or exceed the cap.}}
 +
<br />
 +
All uploaded art, regardless of upload method, is automatically placed into '''Recent Uploads''' in chronological order with the most recently uploaded image added to the top of the list.
 +
 
 +
====Animated====
 +
[[File:Animated-token-stop-play.gif|thumb|450px| Animated crystalgolem showcasing stop/play,<br>from the {{market|set/7445/demonic-horde-animated Demonic Horde Animated}} set]]
 +
 
 +
If you create your own animations, it's probably best to have at least 3 frames in the animation, as there is at least one user who had visual issues with a {{c|.gif}} that only had two frames.
 +
 
 +
Some people experience extremely slow upload speeds for animated <code>.mp4</code> and <code>.webm</code>-files, or the upload might time out repeatedly.
 +
 
 +
One Roll20 Dev seems to suggest [https://app.roll20.net/forum/permalink/7567870/ .webm files cause less trouble], but generally seems {{c|.gif}} just works best.
 +
 
 +
Forum threads discussion issues around uploading animated assets to Roll20:
 +
* {{forum|permalink/8469184/ issue with mp4 and video uploads}}
 +
* [https://app.roll20.net/forum/post/10501485/slug%7D Uploading gifs to game detail pages] Nov 2021
 +
* [https://app.roll20.net/forum/post/10469930/slug%7D .gif upload question]
 +
* [https://app.roll20.net/forum/post/8569006/slug%7D Problems Uploading Gif or Webm archives]
 +
* [https://app.roll20.net/forum/post/9212155/slug%7D Uploading Videos to Roll20]
 +
* [https://app.roll20.net/forum/post/7389412/slug%7D .gif and .webm are taking obscene amounts of time to upload.]
 +
<br />
 +
{{clear}}
 +
 
 +
===Recent Uploads===
 +
When you upload an images, it is placed in a location in My Library called Recent Uploads. You can see the Recent Upload list at the bottom of My Library and will list the images chronologically from the most recently uploaded image to older.
 +
 
 +
Every single piece of art remains in here even if you move them into a folder or subfolder. Organizing art into folders is only making a ''reference'' of the image. You can filter your view of Recent Uploads to hide any image that's already been organized into the folder tree by clicking on the icon beside the Recent Uploads heading that looks like two windows overlapping.
 +
 
 +
To permanently delete an image from My Library, it ''must'' be deleted from Recent Uploads to actually clear it from your Storage Quota.
 +
<br />
 +
 
 +
===Image Storage Quota===
 +
[[File:Storage-donut.gif|thumbnail|right|400px|You can see a visual breakdown of your Storage Quota. (April 2022)]]
 +
Your storage quota is the amount of art assets that you can upload. It doesn't include art that you use from built-in sets or from web searches, it only includes the space used by images you upload from your computer.
 +
 
 +
[[Marketplace]] content doesn't count against your storage, and neither does things in your [[campaigns]] like [[characters]], [[handouts]], etc.
 +
 
 +
'''Storage Quota:'''
 +
* [[free]] account -- '''100 MB'''
 +
* {{Plus}} account -- '''3 GB'''
 +
* {{Pro}} account -- '''8 GB'''{{source|https://help.roll20.net/hc/en-us/articles/360037772613-Change-Log#july-27-2022-0-6 1}}.
 +
 
 +
You can check your Storage Quota usage on your [[Account]]-page underneath the '''Account Type & Subscription''' section on the right side of the page. You can also see it at the top of the Recent Uploads Folder View Window, directly above the first row of image thumbnails and below the red deletion warning message.
 +
 
 +
Going over your quota will not delete anything from your library, just stop you from upload more.
 +
 
 +
====Freeing Up Storage Space====
 +
Once you hit your storage quota capacity, Roll20 will prevent any further upload,s until storage space is freed up for new content. This is either done by deleting some of your art assets from My Library, or upgrade your account to {{Plus}} or {{Pro}} subscriber status for a larger storage quota.
 +
 
 +
To delete art assets, you can right click on an image in the Recent Uploads list and choose '''Delete Item'''. This will permanently remove that art asset from My Library and ''any game that is currently using it''. With that in mind, you will want to make certain that the images you are deleting are not necessary for current game content you're actively playing with.
 +
 
 +
{{mbox | style = white-space: nowrap; | text = '''Note:''' Need more storage?  Get '''[https://app.roll20.net/why-subscribe-to-roll20 subscription]''' to get more space.}}
 +
<br />
 +
 
 +
==Organizing Your Images==
 +
There are two different ways to help organize the images in My Library: Folders and Tags.
 +
===Folders===
 +
[[File:Art Library Folder Nest.png|framed|right|An example of nested image folders under My Library]]
 +
Much like the [[Journal]] tab of the Sidebar, folders can be used in the Art Library to help organize your images into subgroups.
 +
 
 +
'''Adding Folders:''' Add a new folder using the '''Add''' button underneath '''My Library'''. Follow the instructions on the prompt to name the folder and hit '''OK''' to add the folder to My Library.
 +
 
 +
'''Folder Options:''' Right click the folder to reveal this list of options: Add Subgroup, Sort A-Z, Rename Folder, Delete Folder
 +
 
 +
:: ''Add Subgroup:'' This behaves exactly like clicking on the folder Add button. You'll get a prompt to enter a name for the new folder and once confirmed will create a new subfolder underneath the current one.
 +
{{mbox | text = '''Note:''' Due to the limited space on the (RESIZEABLE)Sidebar, the nested folders can only go three sub folder levels deep.}}
 +
<br />
 +
:: ''Sort A-Z:'' This will sort any images within the folder to be sorted alphanumerically. Any subfolders will be sorted and listed before any images.
 +
:: ''Rename Folder:'' This will bring up the prompt again to change the name of the folder.
 +
:: ''Delete Folder:'' This will delete the folder. Deleting folders will '''not''' delete any images contained inside. Those images will be moved back to Recent Uploads. Using the '''Delete Folder''' option requires your approval upon use, confirm when prompted to initiate your action.
 +
<br />
 +
{{clear}}
 +
====Sorting Subfolders and Images====
 +
::'''Expanding and Collapsing the Folder Nest:''' Each folder and subfolder has an icon directly to the left of its folder name. This icon toggles between a '''+''' and a '''-''' symbol. Clicking on this icon either collapses the folder/subfolder (-) or expands it (+).
 +
 
 +
::'''Moving Folders:''' That same +/- icon beside the folder name is also a handle where you can click and drag to move the folder to a different location in the folder nest. A folder needs to be in its expanded state for a folder to be nested inside it.
 +
 
 +
::'''Adding Images into a Folder:''' Much in the same fashion you move a folder into a folder, you can click and drag images into an expanded folder. You can drag them directly from the Recent Uploads list, or drag a batch selection from within the Folder View window. Just like adding subfolders, you need to make certain your target folder location for your image(s) is in its expanded state to place them inside.
 +
<br />
 +
====Folder View====
 +
Clicking on an image in the Recent Upload list, an image in a folder, or on a folder/subfolder name, will open up a new window displaying larger thumbnails of available subfolders and all images contained within the selected folder (In Recent Uploads, it will show all uploaded images sitting at Root). In this view you have the ability to do several batch actions like mass deletion, mass selection, and mass image relocation. This is where you can also add and remove Tags to images.
 +
 
 +
::'''Navigating to Nested Folders:''' Double clicking on a subfolder in Folder View will navigate and open the chosen subfolder in Folder View.
 +
 
 +
::'''Batch Image Selection:''' To select multiple images, click on each desired thumbnail while in Folder View. This will highlight each selected image in pale blue. To remove an image from a selection, just click on the image thumbnail to remove it from the current selection.
 +
 
 +
::'''Right Click Options Menu:''' While inside Folder View, right clicking inside it brings up the following options menu:
 +
 
 +
::::''Select All:'' This will select every single image in the folder.
 +
::::''Add Subfolder:'' This will add a subfolder (if able to do so) and prompt you to create a name for it.
 +
::::''Tag Selected:'' This will add a Tag to all images currently selected. (See the Tags section for more info)
 +
::::''Remove Tag:'' This will remove a specific Tag from all images currently selected. (See the Tags section for more info)
 +
::::''Sort A-Z:'' This sorts all folders and images into alphanumerical order, folders are sorted first.
 +
::::''Delete Selected:'' This will remove images from the folder. NOTE: If you delete images from the Recent Uploads Folder View, you will delete them ''permanently'' and this can not be undone.
 +
 
 +
::'''Batch Image Relocation:''' While you have a collection of images selected, you can click and drag the entire batch to a folder or subfolder in My Library to relocate them to that folder:
 +
::::* The items to be moved should be selected as thumbnails in the pop-out view, and the destination folder should be in the right-panel of My Library
 +
::::* Your target folder location must be in expanded state to place images inside it
 +
::::* If you are having trouble moving the items into the folder, try nesting the first item in the series, then dragging the contents over the nested item
 +
{{clear}}
 +
<br />
 +
 
 +
===Tags===
 +
[[File:Adding Tags to an Image.png|framed|right]]
 +
Tags are keywords that you can assign to various objects in Roll20, images included. When you run an image search, it will try to match your keywords with any tags you've added to your images. This makes it easier to locate previously uploaded images without having to recall their filename from memory.
 +
 
 +
::'''Adding Tags:''' To add tags to an image, you must first be in folder view, either in Recent Uploads or a subfolder of your choice. For adding a tag on a single image, click on the smaller version of the image's file name that sits right above the upload date and file size information (the filename automatically becomes its own tag upon upload). This opens up the tag field to enter new tags for the image. Hitting the space bar or enter/return key will create the tag and allow you to enter another. If you want a multi-word tag with spaces, you'll need to copy and paste the multi-word phrase in rather than type it out as a direct press of the space bar auto-completes the tag. If there's a tag you made previously for other images, suggestions of previous tags will appear below the tag field as you type. Pressing the up or down arrow will page through the available choices and hitting the Enter/Return key will set the chosen one as the new tag.
 +
 
 +
::'''Removing Tags:''' To remove tags from an image, you first need to bring up the tags field as if you were to add more. Each tag has an X following the tag name. Clicking on this X deletes the tag from the image. Sometimes due to tag length, the name may stretch past the boundary of the tag field. In this instance you may not have access to the X to delete the tag. In this situation, you can also click on a tag, which highlights it in a dark blue and then hit the Delete or Backspace key to remove the tag.
 +
 
 +
::'''Batch Tagging/Tag Deletion:'''* You can click on multiple images at a time in folder view to select them as a group. They will highlight the selected images in pale blue. Click on any image a second time to remove it from this selection. While a batch of images is selected right click anywhere among them to bring up an options menu. Two of the available options is '''Tag Selected''' and
 +
 
 +
::'''Remove Tag'''. Selecting either of these two options will pop up a new dialog box asking you to type your desired tag to add or delete respectively from the selected batch of images. Note: You can only add or remove one tag at a time.
 +
::''*We're aware that this feature currently doesn't work in the Recent Uploads folder view. This is a known bug we hope to address soon.''
 +
<br />
 +
 
 +
===Optimal Organization Method===
 +
We recommend this methodology every time you upload artwork:
 +
# Upload your art for a given game/page/system
 +
# Tag your images in the Recent Uploads
 +
# Sort your images out of Recent Uploads into a sub-folder
 +
<br />
 +
If you stay on top of this process each time you upload new images, you'll have an easier time maintaining your art library and your storage quota.
 +
<br />
 +
===Favoriting Premium Assets into My Library===
 +
[[File:Premium Art Assets - Copy To Library.png|framed|right]]
 +
If there's a token, tile, or other image from the Premium Assets that you'd like to integrate into My Library, you can do this by right clicking on an image from Marketplace Purchases, Pro or Free Assets, or From the Web. This will bring up two options: '''Copy to Library''' and '''Copy to Folder'''. Copy to Library will create a reference to this image and place it above the Recent Uploads list and above any image folders you have. Copy to Folder will add a text entry below the option for you to type the name of the folder you wish to add the image to. Folder suggestions (when available) will list below after typing a few characters.
 +
 
 +
These images you'll be able to Tag, sort, and organize just like any other uploaded image asset in My Library. The important distinction with these copies is that these images are ''referring'' back to content in Premium Assets. They are not copying the images to My Library and therefore does ''not'' count towards your Image Storage Quota.
 +
<br />
 +
 
 +
{{clear}}
 +
=[[Sidebar]]=
 +
* {{Text Chat}}
 +
** [[Complete Guide to Macros & Rolls‎]]
 +
* {{Art Library}}
 +
* {{Journal}}
 +
** [[Character Sheets]]
 +
* {{Compendium}}
 +
* {{Jukebox}}
 +
* {{Collections}}
 +
** [[Macros]]
 +
** [[Playing Cards]]
 +
** [[Rollable Tables]]
 +
* {{My Settings}}
 +
** [[Advanced Shortcuts|Advanced Keyboard Shortcuts]]
  
 
[[Category:Docs]]
 
[[Category:Docs]]
 +
[[Category:Sidebar]]
 +
[[Category:Roll20]]
 +
[[Category:Account]]

Latest revision as of 04:33, 11 July 2023

Attention: This page is community-maintained. For the official Roll20 version of this article, see the Help Center for assistance: Here .

The P Art Library is the second tab from the left of the Sidebar, and is accessible to you for any game where you are a GM .

This tab allows you to search, upload, and organize any JPG, PNG, GIF and other image files that you wish to use in your game.

The Art Library

Contents

[edit] Searching For Art Assets

The Art Asset Search
The first part of the Art Library tab is the image search section. After running a search, the results will list below the search bar in this descending order:
  1. My Library: Any image you have personally uploaded to Roll20 and stored on your account's allotted image storage (quota)

  2. Marketplace Purchases: Any available image from an art set you have bought off the Roll20 Marketplace

  3. Pro Sets: When a user has a
    Pro
    info subscription, Exclusive Token Sets becomes available in-app.

  4. Free Assets: Images from art sets made available to the Roll20 community to use for free in their games. (Note: Not for commercial resale purposes)

  5. Premium Assets: This initially lists a cross section of popular packs from the Roll20 Marketplace(Market), highlighted in pale yellow. These assets have been created specifically for use in Roll20 by community members like you. Marketplace assets can be expanded by clicking on More Premium Assets » to show up to 100 different items and can be purchased directly by clicking on any image which opens up its pack's Marketplace listing in a new window.

  6. From the Web This section is shaded in light blue and pulls images cached from various TTRPG image resources around the web.


[edit] The Search Bar

This is where you run your search for art assets. An art search matches your keywords with image file names, tags, or the folder names your assets are stored in.

[edit] Roll20 Search Parameters

Searching with more than one keyword is inclusive, helping you refine your search to only assets that match both words.
ex.
red dragon ...will return results that match "red" AND "dragon" together, but not just "dragon".

Boolean Searches
Optionally, you can use the OR keyword to get an boolean search, where results will be returned if either word matches any criteria.
ex.
water way or swamp ...will return results that match "water" AND "way", OR "swamp", but not "water" AND "swamp".

Exclusive Searches
You can also refine your search further by adding a "-" symbol before a word to exclude all results that keyword matches.
ex.
giant -fire ...will return results that match "giant" only if that item does not also have the keyword "fire".

[edit] Image Search Type Drop-Down Menu

Image Search Type Menu.png

Above the search bar is a drop-down menu where you can choose the Image Search Type. This narrows the search to specific tags assigned to images on the Roll20 Marketplace, Pro & Free Assets, and collected resources from various tRPG image sites. This is broken down into four categories: Tokens, Maps, Tiles, Textures, Portraits, and Everything. If you want to cast the broadest net with your search, choose the Everything option.

[edit] Search Style Toggle

Thumbnail Size Toggle.png

Also above the search bar is an expanding icon beside the word Search:. This is the Search Style toggle. Clicking on this icon will swap between small and large thumbnail display of the images found in the search results.

drag-n-drop images from your P Art Library to the map.



[edit] Placing Graphics onto the Tabletop

Once you’ve found, purchased, or uploaded the art assets you’d like to use to your P Art Library, simply drag and drop it from either the folder view, the Recent Upload list, or from a sub folder onto the Tabletop/map.

If you want to use to images for your Character Portrait, or N Journal Handout, you need to have their menu open instead.





[edit] Premium Assets & My Library

The Premium Assets View

When not searching for images, below the Search Bar is your image index. There are two indexes that you can swap between at any time are Premium Assets and My Library. Everything under Premium Assets are images that you have not uploaded to Roll20 nor do they count towards your account's image quota when you use them in your games. Folders for Marketplace Purchases, Pro Assets, and Free Assets are listed here.

Everything listed under My Library is content that you have personally uploaded into your games and stored on your Roll20 account. These images in My Library do count towards your image quota.

[edit] My Library

My Library View

Any and all image content you upload to Roll20 will be added to My Library. When you toggle to the My Library view in the P Art Library, you'll first have two buttons for uploading images and for creation of folders. Underneath that is an area that shows the folder tree (if you have created any). Underneath that is the Recent Uploads image list.

Roll20 supports the following image file types: jpg, png, gif, animated gif, mp4, webm & PDF (upon upload, you'll be asked which page from the PDF will be converted to an image).

For information on optimizing your files for use on Roll20, see the Best Practices guideline.


[edit] Uploading Art

There are two methods for uploading art to Roll20. The first way is to click and drag a single image from your file explorer/computer to the Tabletop and it will upload as well as place the graphic where you designated on the Tabletop.

The second way is to click on the Upload button underneath My Library. This pops open a dialog box called Upload Files.... This dialog box has a dashed-border rectangle where you can drag a maximum batch of ten images at a time to upload them all at once. You can also select images one at a time with the Choose a file... button which brings up a file selection menu to browse for files on your computer/device.

File Size Cap: If you have a Free account, no single image or batch upload can exceed 5MB. For
Plus
info &
Pro
info-subscribers, this cap is raised to 10MB.



All uploaded art, regardless of upload method, is automatically placed into Recent Uploads in chronological order with the most recently uploaded image added to the top of the list.

[edit] Animated

Animated crystalgolem showcasing stop/play,
from the Demonic Horde Animated(Market) set

If you create your own animations, it's probably best to have at least 3 frames in the animation, as there is at least one user who had visual issues with a .gif that only had two frames.

Some people experience extremely slow upload speeds for animated .mp4 and .webm-files, or the upload might time out repeatedly.

One Roll20 Dev seems to suggest .webm files cause less trouble, but generally seems .gif just works best.

Forum threads discussion issues around uploading animated assets to Roll20:


[edit] Recent Uploads

When you upload an images, it is placed in a location in My Library called Recent Uploads. You can see the Recent Upload list at the bottom of My Library and will list the images chronologically from the most recently uploaded image to older.

Every single piece of art remains in here even if you move them into a folder or subfolder. Organizing art into folders is only making a reference of the image. You can filter your view of Recent Uploads to hide any image that's already been organized into the folder tree by clicking on the icon beside the Recent Uploads heading that looks like two windows overlapping.

To permanently delete an image from My Library, it must be deleted from Recent Uploads to actually clear it from your Storage Quota.

[edit] Image Storage Quota

You can see a visual breakdown of your Storage Quota. (April 2022)

Your storage quota is the amount of art assets that you can upload. It doesn't include art that you use from built-in sets or from web searches, it only includes the space used by images you upload from your computer.

Marketplace content doesn't count against your storage, and neither does things in your campaigns like characters, handouts, etc.

Storage Quota:

  • free account -- 100 MB
  • Plus
    info account -- 3 GB
  • Pro
    info account -- 8 GB.

You can check your Storage Quota usage on your Account-page underneath the Account Type & Subscription section on the right side of the page. You can also see it at the top of the Recent Uploads Folder View Window, directly above the first row of image thumbnails and below the red deletion warning message.

Going over your quota will not delete anything from your library, just stop you from upload more.

[edit] Freeing Up Storage Space

Once you hit your storage quota capacity, Roll20 will prevent any further upload,s until storage space is freed up for new content. This is either done by deleting some of your art assets from My Library, or upgrade your account to
Plus
info or
Pro
info subscriber status for a larger storage quota.

To delete art assets, you can right click on an image in the Recent Uploads list and choose Delete Item. This will permanently remove that art asset from My Library and any game that is currently using it. With that in mind, you will want to make certain that the images you are deleting are not necessary for current game content you're actively playing with.


[edit] Organizing Your Images

There are two different ways to help organize the images in My Library: Folders and Tags.

[edit] Folders

An example of nested image folders under My Library

Much like the Journal tab of the Sidebar, folders can be used in the Art Library to help organize your images into subgroups.

Adding Folders: Add a new folder using the Add button underneath My Library. Follow the instructions on the prompt to name the folder and hit OK to add the folder to My Library.

Folder Options: Right click the folder to reveal this list of options: Add Subgroup, Sort A-Z, Rename Folder, Delete Folder

Add Subgroup: This behaves exactly like clicking on the folder Add button. You'll get a prompt to enter a name for the new folder and once confirmed will create a new subfolder underneath the current one.


Sort A-Z: This will sort any images within the folder to be sorted alphanumerically. Any subfolders will be sorted and listed before any images.
Rename Folder: This will bring up the prompt again to change the name of the folder.
Delete Folder: This will delete the folder. Deleting folders will not delete any images contained inside. Those images will be moved back to Recent Uploads. Using the Delete Folder option requires your approval upon use, confirm when prompted to initiate your action.


[edit] Sorting Subfolders and Images

Expanding and Collapsing the Folder Nest: Each folder and subfolder has an icon directly to the left of its folder name. This icon toggles between a + and a - symbol. Clicking on this icon either collapses the folder/subfolder (-) or expands it (+).
Moving Folders: That same +/- icon beside the folder name is also a handle where you can click and drag to move the folder to a different location in the folder nest. A folder needs to be in its expanded state for a folder to be nested inside it.
Adding Images into a Folder: Much in the same fashion you move a folder into a folder, you can click and drag images into an expanded folder. You can drag them directly from the Recent Uploads list, or drag a batch selection from within the Folder View window. Just like adding subfolders, you need to make certain your target folder location for your image(s) is in its expanded state to place them inside.


[edit] Folder View

Clicking on an image in the Recent Upload list, an image in a folder, or on a folder/subfolder name, will open up a new window displaying larger thumbnails of available subfolders and all images contained within the selected folder (In Recent Uploads, it will show all uploaded images sitting at Root). In this view you have the ability to do several batch actions like mass deletion, mass selection, and mass image relocation. This is where you can also add and remove Tags to images.

Navigating to Nested Folders: Double clicking on a subfolder in Folder View will navigate and open the chosen subfolder in Folder View.
Batch Image Selection: To select multiple images, click on each desired thumbnail while in Folder View. This will highlight each selected image in pale blue. To remove an image from a selection, just click on the image thumbnail to remove it from the current selection.
Right Click Options Menu: While inside Folder View, right clicking inside it brings up the following options menu:
Select All: This will select every single image in the folder.
Add Subfolder: This will add a subfolder (if able to do so) and prompt you to create a name for it.
Tag Selected: This will add a Tag to all images currently selected. (See the Tags section for more info)
Remove Tag: This will remove a specific Tag from all images currently selected. (See the Tags section for more info)
Sort A-Z: This sorts all folders and images into alphanumerical order, folders are sorted first.
Delete Selected: This will remove images from the folder. NOTE: If you delete images from the Recent Uploads Folder View, you will delete them permanently and this can not be undone.
Batch Image Relocation: While you have a collection of images selected, you can click and drag the entire batch to a folder or subfolder in My Library to relocate them to that folder:
  • The items to be moved should be selected as thumbnails in the pop-out view, and the destination folder should be in the right-panel of My Library
  • Your target folder location must be in expanded state to place images inside it
  • If you are having trouble moving the items into the folder, try nesting the first item in the series, then dragging the contents over the nested item


[edit] Tags

Adding Tags to an Image.png

Tags are keywords that you can assign to various objects in Roll20, images included. When you run an image search, it will try to match your keywords with any tags you've added to your images. This makes it easier to locate previously uploaded images without having to recall their filename from memory.

Adding Tags: To add tags to an image, you must first be in folder view, either in Recent Uploads or a subfolder of your choice. For adding a tag on a single image, click on the smaller version of the image's file name that sits right above the upload date and file size information (the filename automatically becomes its own tag upon upload). This opens up the tag field to enter new tags for the image. Hitting the space bar or enter/return key will create the tag and allow you to enter another. If you want a multi-word tag with spaces, you'll need to copy and paste the multi-word phrase in rather than type it out as a direct press of the space bar auto-completes the tag. If there's a tag you made previously for other images, suggestions of previous tags will appear below the tag field as you type. Pressing the up or down arrow will page through the available choices and hitting the Enter/Return key will set the chosen one as the new tag.
Removing Tags: To remove tags from an image, you first need to bring up the tags field as if you were to add more. Each tag has an X following the tag name. Clicking on this X deletes the tag from the image. Sometimes due to tag length, the name may stretch past the boundary of the tag field. In this instance you may not have access to the X to delete the tag. In this situation, you can also click on a tag, which highlights it in a dark blue and then hit the Delete or Backspace key to remove the tag.
Batch Tagging/Tag Deletion:* You can click on multiple images at a time in folder view to select them as a group. They will highlight the selected images in pale blue. Click on any image a second time to remove it from this selection. While a batch of images is selected right click anywhere among them to bring up an options menu. Two of the available options is Tag Selected and
Remove Tag. Selecting either of these two options will pop up a new dialog box asking you to type your desired tag to add or delete respectively from the selected batch of images. Note: You can only add or remove one tag at a time.
*We're aware that this feature currently doesn't work in the Recent Uploads folder view. This is a known bug we hope to address soon.


[edit] Optimal Organization Method

We recommend this methodology every time you upload artwork:

  1. Upload your art for a given game/page/system
  2. Tag your images in the Recent Uploads
  3. Sort your images out of Recent Uploads into a sub-folder


If you stay on top of this process each time you upload new images, you'll have an easier time maintaining your art library and your storage quota.

[edit] Favoriting Premium Assets into My Library

Premium Art Assets - Copy To Library.png

If there's a token, tile, or other image from the Premium Assets that you'd like to integrate into My Library, you can do this by right clicking on an image from Marketplace Purchases, Pro or Free Assets, or From the Web. This will bring up two options: Copy to Library and Copy to Folder. Copy to Library will create a reference to this image and place it above the Recent Uploads list and above any image folders you have. Copy to Folder will add a text entry below the option for you to type the name of the folder you wish to add the image to. Folder suggestions (when available) will list below after typing a few characters.

These images you'll be able to Tag, sort, and organize just like any other uploaded image asset in My Library. The important distinction with these copies is that these images are referring back to content in Premium Assets. They are not copying the images to My Library and therefore does not count towards your Image Storage Quota.

[edit] Sidebar