The engine

Layer Magic is a powerful tool for creating interactive animations that run directly inside your browser.

It is a state-of-the-art 2D engine built on HTML5 using JavaScript.

Its power comes from 2 main sources:

  1. the flexibility it gives you regarding the nature of the projects you can create
  2. the comprehensive editor that allows anyone to build such projects



The WordPress

At the moment, Layer Magic comes as a plugin for WordPress, which it's required in order to run it.

It comes in 2 parts:

  1. the editor side
  2. the client side

The editor can be opened from the WordPress dashboard menu. It runs locally and all your changes are saved on your server.


The client represents the part that runs on your website created with WordPress.

The client contains the logic for displaying and animating a Layer Magic project, once introduced into the website via a WordPress shortcode. 

The flow is like this:

  1. you create a Layer Magic project from the editor
  2. you copy the shortcode of that project
  3. you introduce the shortcode into a page / post
  4. you allow WordPress to transform that shortcode into a Layer Magic canvas
  5. you can visualize your project on your website

 


For whom ?

Layer Magic is designed as a tool for masses, from total beginners who just want a simple parallax on their website, to the advanced artists to want to create immersive visuals.

The editor's interface is carefully designed to be intuitive to use.

To create basic projects, you need no more than the default settings and a bunch of clicks.


When it comes to advance stuff, Layer Magic orients more toward technical artists, since you will need to be able to create your assets and also to carefully adjust all the settings in your project to achieve the desired result.

It will indeed require a period of learning and practice to get used to the features and capabilities of Layer Magic, but we believe that the effort is well worth. And there are many of them.



The workflow

The workflow of Layer Magic refers to the way you can do things inside the editor, since that's where you will spend most of your time interacting with Layer Magic.

The way it is designed is as follows:

  1. you will open Layer Magic in Home page, where you will be received with some sort of motivational / inspirational help
  2. you will then move to Library page in order to manage your projects and your assets
  3. when ready, you will open a project and move to Builder page, where the Layer and the Magic becomes Layer Magic
  4. in the Builder page, you will first start with Layers tab, in which you will build your project
  5. you add layers, you add assets, you modify properties of layers, you create/change keyframes on timelines
  6. you will do all of that while previewing in real-time the changes 
  7. you will spend most of your time in this page playing around with all the settings
  8. when ready, you will move to Viewport tab from Builder page, where you will decide how your project will be displayed in your website
  9. you will probably want to add the shortcode to your WordPress page first
  10. in the Viewport tab, you will play around with all the settings there until you find some that fulfill your needs
  11. you will probably go back and forth between Viewport and Layers tabs until you are satisfied with the end result
  12. you will then open your website and enjoy your work in action


The steps presented are only an example. You will most probably create your own workflow that fits with your work style.

The important thing is to have a way of doing that is both fluid and enjoyable.