ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Transm.jsはJavaScript製のフリーウェア(ソースコードは公開されている)。Webサイトでヘッダーの画像が定期的に入れ替わったり、写真のスライドショーのように切り替わる表示方式がある。ただ入れ替わるだけでは面白くなく、そこにイフェクトが加わってこそ意味があるだろう。


ピクチャ 68.png

黒目の部分だけ入れ替わる

 

そんなイフェクトが110種類を越えて利用でき、さらに画像の透過処理を使って一部だけで差し替えもできるライブラリがTransm.jsだ。非商用であればフリー、商用利用のライセンスも用意されているソフトウェアだ。


Transm.jsを知るにはサンプルを見るのが一番早いだろう。フェードアウトしたり、上下左右から新しい画像が出てきたりと様々なイフェクトが可能だ。画像の中央から円形に沿って表示が切り替わる、HTML5を使った効果も多数あるので、対応していないブラウザもある。


ピクチャ 69.png

Transm.jsの紹介プレゼン

 

プレゼンで使ってみても面白そうだし、Webサイトの画像差し替えにも使えそうだ。画像がただ切り替わるだけでは思考が中断されてしまい、連続的に楽しめなくなる。Transm.jsを使って効果的なプレゼンテーション、スライドショーを提供したい。

執筆時のバージョン

 1.0

 

transm.js (javascript programmable image transitions)

 http://www.netzgesta.de/transm/


 

MOONGIFTの関連記事

  • DevRel
  • Com2