Skip to main content

Documentation

Welcome to Loopic's documentation! On these pages, you will find a lot of instructions about how to use Loopic. The documentation is divided into two parts:

  • User guides
  • Actions API

If you are just a beginner, it is recommended that you first check this User guide section. Once you get some understanding of what is Loopic and how it works, you can explore the API. API understanding is not mandatory and you don't need it if you are creating just simple, linear graphic templates. But once you get to the point where you need some dynamic behavior, advanced animation controls and so on, API will help you achieve anything you can imagine.

If you still don't understand some Loopic concepts - no worries! We are always looking forward to extending and improving our documentation, so feel free to send us any questions or suggestions.

What is Loopic?​

Let's start with the basics. Loopic is a visual Javascript animation creator whose primary goal is to make the process of building animated broadcast graphic templates as easy as possible. Templates produced by Loopic are all built in HTML5 technology (HTML5, CSS3 and JS), which makes them future-proof and universal - you are not limited to a certain graphics playout solution. You can just use your web browser, or you can use some of the graphics playout solutions Loopic supports out of the box, as listed here.

The fact that templates are built in HTML does not mean you need to have any coding skills - just the opposite! Loopic's UI is specially built for users with zero coding skills, and to create text or shape animations, import images and image sequences, fonts, and SVGs, you can just use your mouse.

No Flash​

Loopic is a purely modern HTML tool and it does not need Flash. Worrying about Flash's "End of life" and missing installations and configurations is over!

HTML graphic templates​

As we already mentioned, graphic templates exported from Loopic are all built-in HTML. If you open your HTML template with a web browser (fingers crossed it's Chrome), and if you open Dev Tools and execute play() command - you will see your template playing there (the same you can see if you play the template with one of the supported CG engines). If you inspect DOM elements with the Inspector tool, you will see a lot of DIV elements all around, as well as inline CSS.