Picture Streams + Momentum Engine + Bézier Paths + Cross-Browser + Cross-Device
TremulaJS is a client-side javascript UI component providing Bézier-based content-stream interactions with momentum & physics effects for mouse, scroll and and touch UIs.
Put another way, TremulaJS can be thought of as an extremely bad-ass image carousel.
Watch the TremulaJS video demo here
While there are some monumental physics-based JS animation frameworks out there -- most notably, famo.us, gsap and velocity.js -- TremulaJS was built with a very specific end in mind: to enable the kind of long-running, low-friction user interactions one might enjoy when navigating large sets of visual data.
See TremulaJS in the wild: currently in production on Art.com.
TremulaJS is compatible with all recent versions of iOS Safari, Chrome, OS X Safari, FF, IE.
TremulaJS was created by Garris Shipon at Art.com Labs.
Licensed under GPLv3.
follow @garris
-
See the demo video (2.5 min), illustrating some of the visual possibilities.
-
Play with the live component demo
-
Experiment with the configuration file on CodePen
-
Get up-and-running with the fully-documented boilerplate file, includes a summary of all configuration settings.
-
Download, Fork, Contribute on GitHub
-
Learn how to create your own Grid Projections -- technical articles
coming soonhere!
follow @garris
cd to the root of your project then...
$ bower install tremulajs --save
Optional install for mocha test framework and local host server (this is just a convenience for testing on local phones and tablets.)
cd to the tremulajs directory then...
$ npm install
cd to the tremulajs directory then...
$ node server.js
with the test server running (or you can skip that part and use a browser with same origin policy disabled)
$ open http://localhost:3000/test.html
cd to the tremulajs directory then...
$ node r.js -o build.js; node r.js -o cssIn=src/Tremula.css out=dist/Tremula.css optimizeCss=standard
- HammerJS (A most awesome touch event component)
- JsBezier (Thank you Simon Porritt !)
- jQuery (jQuery is a little overkill at this point -- It would be very straightforward to remove the few remaining convenience calls. For now, still required. John Resig, I salute you!)
iOS Safari, Chrome, OS X Safari, FF, IE (recent versions)