2022年01月25日(火)
Three.js(WebGL)3Dアニメーションの背景を作成できる「Vanta.js」
Webサイト上でも3Dを使った表現が最近とても増えてきている中、Webページの背景として設置する3Dアニメーションを簡単に作成できる「Vanta.js」が便利だったので、自分用のメモ書きとして紹介してみます。
Vanta.js – Animated 3D Backgrounds For Your Website
Vanta.js「Vanta.js」はThree.jsを使ったWebGLの3Dアニメーションを作成できるJavaScriptライブラリです。
使用方法はとても簡単で、Three.jsとVanta.jsを読み込んで「Vanta.js」サイトのプレビューで設定した値をコピペするだけで設置することができます。
3Dエフェクトは「Birds」「Clouds」「Dots」「Rings」など13種類。
(2022年1月現在)ライブラリファイルは各エフェクトごとに用意されています。
author:
BlackFlag
マークアップエンジニア矢次悟郎さんによる、jQueryをはじめとしたWebサイト制作に役立つで技術やサービスの情報発信ブログ
関連記事
Ads
マークアップエンジニア矢次悟郎さんによる、jQueryをはじめとしたWebサイト制作に役立つで技術やサービスの情報発信ブログBlackFlagの記事『Three.js(WebGL)3Dアニメーションの背景を作成できる「Vanta.js」』についてまとめています。
この記事は特にjavascript・アニメーション・写真について書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のBlackFlagで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとBlackFlagの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。