bilza
v0.1.2
Published
A Javascript Animation Engine for creating responsive animations on HTML5 Canvas
Downloads
895
Maintainers
Readme
Core Props Examples Comp Projects
What is Bilza
A Javascript Animation Engine for creating responsive animations on HTML5 Canvas.
Bilza.js Basic Idea
Bilza.js will enable you to create JavaScript animation that behave like a video. You can "play", "pause", "stop", "skip forward" and "skip backward" the animation just like a video. You can also draw any random frame from in between the animation or save that as an image.
Bilza.js will enable you to create slide (presentations, lesson plans, advertisements etc) and then share them as html / javascript file.There are many content types (e.g. educational slides, business presentations etc.) which we want to be presented like a video but should be editable like normal text (or a PowerPoint presentation). In case of video format; editing is very expensive and time-consuming. Bilza.js final product is a simple JavaScript file that will run in any (decent) browser anywhere.
In case you want your message / presentation to reach millions of viewers and the message is in videos format: the file size will be in Mega Bites (and this is on the lowest side). Imagine how many people will be reluctant to download such a heavy file or to share it. On the other hand, a JavaScript animation is very lightweight as compared to video format. A JavaScript animation carrying the same message may have a file size of few kilo Bites. The heaviest thing in a JavaScript animation is the sound file.
The single main "pain point" of creating JavaScript animation is creating responsive animations. We like our animations to fit all screen sizes. For this the bilza.js has been written with responsiveness in mind and (almost) every thing grow and shrink according to the screen size.
Animation is code and Code is Reusable : One of the basic purpose of this library is to enable users to stitch together small pieces of animation and create complex animations.
There is NO installation, NO plugins and NO dependencies (on any other library). This will enable your clients to consume your content with out any hassle.
It is NOT morally and ethically correct for any developer / app to hold the data of its users as hostage. The hard work and effort that a user has put into creating an animation makes him the creator and owner of that animation. For this there will always be some command present in the library (working on it currently) which should enable the user to get their animation data in json format.
Basic Feature
- Ease of use
- Responsiveness
- Composable Animations
- Behave like a Video
Important Sections of Documentation
How Bilza.js Works
Hello world Example
All Components Core Props Examples
Projects to showcase every component
Bilza.js Documentation (work in progress)
Selected Examples
Six Arrows
Colored Circles
100 Rectangles
Lines Animation
Text and Grid Example
Random Lines
Four Pics
Grid Lines Width
Dancing Circles
100 Circles
Circles Component Demo
Animating Grid
Font Size Animation
Line Animation
If you want to be in touch or send me a bug report please use github issues.