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

Webサイトの背景に動画を流したりするケースが見られますが、動画はサイズが大きくなりがちです。もっと軽量で、見た目のインパクトがある方法もあるでしょう。そのためにはJavaScriptで動的に作り出す方法が考えられます。

今回はその一つの方法として、Ambient Canvas Backgroundsを紹介します。Canvasを使い、背景を動かします。

Ambient Canvas Backgroundsの使い方

オーロラというテーマです。

渦巻き。

シフト。

合体。

パイプライン。

Ambient Canvas BackgroundsはJavaScriptで作っているので軽量に動きます。動的に作り出されているので多少のランダム性もあります。インパクトが強いので、効果的に使ってみたいライブラリです。

Ambient Canvas BackgroundsはJavaScript製のソフトウェア(ライセンスは独自)です。

Ambient Canvas Backgrounds | Pipeline | Codrops

crnacura/AmbientCanvasBackgrounds: Five ambient webpage backgrounds created using the HTML5 Canvas API and jwagner's Simplex Noise library.

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2