Category: Tips & Tricks

Export Anywhere

With Flexitive, you can export your animated HTML5 designs in a variety of different ways. Choose the export option that bests suits the platform you’d like to display your designs on and the audience that you’d like to reach. Once exported, you can then display your animated HTML5 designs on ad servers, websites, digital signage, social platforms, and more.

Ad Servers
You can export your HTML5 file package as a ZIP file or live ‘tag’, and the latest ad server code will be automatically added to your file. Live designs exported directly from the Flexitive Design Cloud reflect changes instantly. Flexitive currently supports over 40 of the leading ad servers and is constantly adding more.

See the full list of Flexitive supported ad servers here.

CMS
Exporting your design for CMS allows you easily host your design in an iframe, or as a generic HTML5 ZIP with no tracking information for ad servers. Export your designs for CMS when you want to use your Flexitive design as an element on your website.

Learn more about exporting your designs for CMS here.

Digital Signage
With Digital Signage you can display your Flexitive designs on any sized screen, across stadiums, conference stands, menu boards, and more. Digital Signage requires a flexible design that can to adapt to any screen. Since fixed size designs cannot do this, it is recommended that designs for Digital Signage be built to be fully responsive.

For more information, check out our article on Building a Design for Digital Signage.

Social Media
Most social media platforms do not accept HTML5 design uploads, so when you export your design for social media you should export static JPEG images or as a video export.

For more information on exporting, check out our Flexitive Tutorial Video Exporting a Design.

Control Element Visibility to Scale Your Design Faster

In Flexitive, when you add a new element to your design, that element will be added to all activated sizes. By adding your elements to all activated sizes, Flexitive makes the entire design process shorter.

When editing a size, you can choose what sizes you want a newly added element to appear on. Using the Visibility settings in the Customize Panel, you can set an element to hide an on a particular size, on all other active sizes, or by portrait and landscape orientation.

You can see the elements you’ve hidden on your canvas using the ‘Show Hidden Layers’ toggle in the Layers panel.

For more information, check out our article on Element Visibility.

Uploading Assets to your Flexitive Design

Flexitive combines assets like video, images, and text with features that include widgets, animation, and data feeds to create fully-responsive designs that look amazing.

You can upload JPG, PNG, SVG, GIF, and MP4 assets to your designs. The formats you choose to use for your assets will depend on how the element will be used in your design. For example, JPG images are oftentimes the best option for uploads in any scenario where you are not using an image with transparency and will compress better than any other image format on export.

Other design tools can complement the work you do in Flexitive when you prepare your assets for import.

When preparing your assets for Flexitive, check out our Asset Guidelines here.

 

Drive Collaboration With Shared Libraries

Now brands, agencies, and partners can easily collaborate across teams and markets. With Shared Libraries, users can build, edit and export designs across different Enterprise accounts.

What is a Shared Library?

Every Flexitive account has a Design library where your designs are stored in folders and sub-folders. A Shared Library allows you to share folders with members of teams on other Flexitive sites.

For example, if Adaptive Bean has teams based in Toronto, New York and London, Adaptive Bean can create a custom Flexitive Instance for each team (eg. https://app.flexitive.com/-/Adaptive Bean-Toronto). Adaptive Bean can then create accounts for all the Adaptive Bean-Toronto users. When Adaptive Bean-Toronto has finished a design concept and needs approval, they can move the design into the Adaptive Bean Global library, and an Adaptive Bean Global user can log in to https://app.flexitive.com/-/Adaptive Bean-Global and approve the design.

Likewise, a brand can manage the design output of multiple agencies through a single Flexitive instance.

Shared libraries are available under Flexitive Enterprise subscriptions. Contact your account manager or support@flexitive.com to share one or more of your Flexitive libraries with internal teams or partners.

Learn more about Shared Libraries here.

Scale Your Designs With Dynamic Content Feeds

Dynamic Content Feeds allow you to scale your design process by connecting elements in your design to a live XML data feed. With Live Content Widgets, your design will automatically update if a change is made to the feed, guaranteeing you’re always displaying the most up-to-date information in your design.

You can connect multiple designs with your content feed, allowing you to easily update multiple designs simultaneously.

The rich possibilities of using Dynamic Content Feeds range from sporting events to inventory updates – for content, digital signage, display ads, and more.  

Learn more about Dynamic Content Feeds.

Optimize Multisize Layouts Faster

Spend more time designing and less time building sizes by using the ‘Inherit From’ option in the ‘All Sizes’ view.

When activating a size in Flexitive, the size will be activated by taking the layout of the closest matching size and adapting its layout to fit with the new size.

You can easily copy a layout from any activated size, not just the closest size. Just click the ‘Inherit From’ drop-down menu next to the size you want to activate. You’ll then be able to choose any of the sizes you’ve activated so far in Flexitive.

After choosing a size, Flexitive will take the layout from that design and force the size you’re activating to adapt that layout to their size.

Learn more about the ‘Inherit From’ option in Flexitive here.

Adding Flexitive Widgets

In Flexitive, Widgets allow you to add interactive components to your designs, such as a rotating Carousel, or a Legal Widget. Flexitive Widgets can be added to a page by clicking the ‘Rocket’ icon on the left navigation bar.

The widgets available in Flexitive are:

If a widget is not available in your account, reach out to your account manager or to a member of the Flexitive Support Team (support@flexitive.com).

You can learn more about Flexitive widgets here.

The Benefits of Web Fonts

By adding text as a web font rather than as an image, your text elements will be responsive, easy to edit, and simple to scale across sizes. Web fonts can be easily edited inside Flexitive and include a scrolling option, which is perfect for large blocks of text.

Web fonts are also very light on file size and don’t compress on export.

With Flexitive, you’ll have access to over 700 free web fonts, including Google web fonts and fonts.com fonts. With a fonts.com subscription, you can access over 22,000 web fonts. You can also choose to upload your own custom webfont.

You can choose to embed web fonts directly into your design file when exporting your design. Embedding is ideal for displaying offline designs to digital signage or platforms that don’t allow third-party calls, like Google Ads (AdWords).

To learn more, check out our article on Text as Web Fonts vs Images.

Embedding Responsive and Interactive Content

With embedded pages, you can use any Flexitive design as a live element in your design.

A responsive embedded page adapts to any size or aspect ratios it’s displayed in. The adaptive nature of embedded pages makes it easy to scale your design across unlimited sizes.

With embedded pages, you can save hours of design time and ensure consistency across your designs. Learn more about embedding responsive and interactive content here.

Click-Through URLs

Drive more traffic and engagement by applying a click-through URL to your whole design or just a specific element. A click-through URL is a location the viewer is redirected to when they click on a certain part of the design. You can link to a website, a phone number, map location, app, and more.

In Flexitive, there are two main types of click-through URLs: Background URLs and Element URLs.

  • Background URLs make it so that the entirety of the design can be clicked on to redirect the viewer. Background URLs sit below any click-throughs you add to an element.
  • Element URLs make it so that only a certain element can be clicked on to redirect the viewer. A click-through URL on an element will override any click-through URL set on a background behind that element.

Flexitive also supports multiple click-through URLs so you can set a background click-through and an element click-through for each element. Learn more about Click-Through URLs here.