webclips

魅力的なテキストエフェクトを実装できる「Blotter.js」

JavaScript エフェクト

2019/04/16

5種類のテキストエフェクトを実装できる「Blotter.js」が心地よい動きをしてたので忘備録。 Three.jsとUnderscore.jsを使用しChannelSplitMaterial / FliesMaterial / LiquidDistortMaterial / RollingDistortMaterial / SlidingDoorMaterialと5種のエフェクトを実装することができます。

Blotter.js

Materialsの各エフェクトページから右上のコントローラーでエフェクトを確認しながら調整できるのもうれしい。サイトにインパクトを出したい時など使用してみたいもんです。

Blotter.js

PICK UP

入力フォームを実装するためのテンプレート「Boilerform」
水中の歪みを表現したエフェクトが気持ちいい「Liquid Distortion Effects」
様々なスニペットがまとめられたサイト「LittleSnippets.net」
Google Fontsの使い方とおすすめ日本語フォント -初心者向け-
【jQuery】スクロールで画像に3D効果を掛けられる「tiltedpage_scroll.js」
レスポンシブのチェックに役立つサービス「Resizer」