Index
- What type of asset can I upload to Flexitive?
- Upload an asset to Flexitive
- Asset Guidelines
- Reducing File Size
- General Recommendations for Images
When creating a design in Flexitive, you’ll first build out a master design that can be scaled across any size you require.
You should upload image and video assets with the highest resolution for the largest output that you will require. As a best practice, try to keep the highest quality with the lowest file size.
What type of asset can I upload to Flexitive?
Image Assets:
Flexitive supports JPG, PNG, SVG, and GIF image formats. Different file types have different use cases, so the image formats you choose to use will depend on each image and the file size limitations of your project.
Video Assets:
Flexitive supports MP4 video uploads. You can also embed YouTube videos into your design. Learn more about embedding YouTube videos here.
Flexitive Designs:
Flexitive designs can be added to the Assets Panel as Global Assets. Learn how to Use a Flexitive Design as an Asset.
Upload an asset to Flexitive:
Image and MP4 video elements can be added to Flexitive from the Assets Panel on the right-hand side;
Upload an Image
You can upload an image from a file or a URL. To upload the image, open the Assets Panel and select the Images tab.
Image file
To upload an image file;
- Select the Upload Local File tab
- Select the Upload Images button
- Choose the images you'd like to upload to your Flexitive project.
You can also upload files to your design by dragging and dropping them from your desktop folder onto the Assets panel or the canvas.
Image from URL
To upload an image from a URL;
- Select the Upload From URL tab
- Paste the URL into the Paste URL Here field
- Click the arrow button to upload the image.
Note: Uploading an image via a URL is available under Enterprise subscriptions or on request. Reach out to support@flexitive.com for more information.
Upload an MP4 Video
To upload an mp4 video;
- Open the Videos tab
- Click the Upload Videos button
- Select the video you'd like to upload to your Flexitive project
Upload a Flexitive Design
Learn how to upload a Flexitive design: Use a Flexitive Design as an Asset
Asset Guidelines
When uploading assets to Flexitive, we recommend uploading assets in the following formats:
| FORMAT | USE CASE | EXAMPLE | MORE INFO |
| Vector Image (.SVG) | Logos, text, icons, call to action buttons, etc. Even use Animated SVGs. |  | .SVGs create high-quality, transparent images that scale to unlimited resolutions, but complex SVGs can be large files. |
| Transparent Static Image (.PNG-24) | If you require image transparency and have real photos with lots of colors eg. product images. e.g Products, models, design elements, etc. |  | Transparent images are great for creating responsive designs as they can help create high-quality flexible layouts. However, file sizes can be much larger with transparency. |
| Solid Static Image (.JPG) | Real photos with lots of colors, and that don’t require transparency. e.g Backgrounds and custom-designed typography, etc. |  | .JPG are great for backgrounds or layers that will be behind other layers that use transparency (PNGs). |
| Static or Animated (.GIF) | Static GIFs are best for images with solid colors, or short animated GIFs can be used provided they have minimal frames. |  | Be careful with file size as .GIFs can be large, especially if using transparency. Generally, try to avoid using .GIFs in HTML5 designs. |
| Video (.MP4) | Best for very complex animation or real footage. Just like any Flexitive element, videos can be embedded as part of a Flexitive design, or as a background. |  | If you are planning to use videos for display ad HTML5 exports, make sure that your ad server supports videos and check the serving costs. |
Reducing File Size
Flexitive uses smart compression to automatically resize images when you export design, although Flexitive does not apply compression to SVGs, GIFs, or MP4s.
Because of this, we recommend that any image assets you upload to Flexitive be the highest resolution versions that you have access to.
If you are still running into concerns with the final file size of your project, the best way to reduce the file size is to take a closer look at the images that you have uploaded for your project. Below are some tips on how to optimize your image assets to have the lowest possible file size for your exported projects.
General Recommendations for Images
One of the most common causes of larger file size is using transparency in the image. Sometimes using transparency is unavoidable, but it does significantly increase the file size of images and should be avoided where possible.
Some recommendations for how to limit your use of transparency are:
- If your assets will not be layered over each other or they sit on a solid color background, make sure to save them with the background color inside the image.
- If you have a pattern background that won’t look odd if it repeats in an unpredictable position, such as a grass field, then save the background pattern with your asset.
- If the asset must have transparency, evaluate whether the transparent areas need to blend with multiple background colors or if adding a matte around the asset is an option. Adding a matte can help reduce the file size. If this approach is feasible, use a PNG-8 format instead of a PNG-24 to further minimize the file size.
In addition to carefully considering transparency with images, it can be helpful to consider whether or not an image is required for an asset at all. In Flexitive, you can always use shapes or text to reduce file size.
JPG Images
JPG images are oftentimes the best option for uploads in any scenario where you are not using a transparent image and will compress better than any other image format on export. Because of this, we generally recommend that this image format is used for any large images in your project such as a background image, but we typically recommend against using a JPG for any images that require fine details, such as a company logo.
Wherever possible, it is recommended that you use a JPG image in Flexitive.
PNG Images
PNG Images are the best option for images where transparency is required. PNG images are compressed less than JPG images when they are exported, but offer better compression than SVGs.
SVG Images
SVG Images are the best option for uploading vector shapes, illustrations and text as they offer infinite scaling without loss of quality, and are uncompressed when exported from Flexitive. However, this does mean that you will need to be aware of file size when using SVGs.
GIF Images
GIFs allow for animated image assets in Flexitive. However, they are also the largest image in regards to file size and are not compressed on export. It is important to be aware of your file size limitations when using a GIF in your design. As an alternative, you could choose to use an animated SVG. Some animations can also created with animated SVGs and often at a lower file size.