インタラ会のおさらい ・インタラクティブコンテンツを作るための小技を共有する ・その小技を使った作品をつくる ・小技の数学的説明はしない。作品を作ることを重視する 第２回のテーマ「反復」 ・動作をいい感じに繰り返す いい感じに繰り返す ・Math.sin…

第１回インタラクティブ勉強会の資料

11月17日公開の映画アニメゴジラのPRのための特設サイト「ゴジラvsバズラ」のメインビジュアル部分の実装を担当しました。

contents.netbk.co.jp住信SBIネット銀行さまの10周年を記念したスペシャルコンテンツのフロントエンドの実装を担当いたしました。 ぜひPCとスマホ両端末でご覧ください。⁢

www.descente.comデサント公式ブランド『ALLTERRAIN（オルテライン）』の2017AWプロダクトサイトのフロントエンドの実装を担当いたしました。 全体的にあえて余計な演出を省くシンプルな実装になっておりますが、一番の見せ場であるTOPに関しては、WebGLを使…

three.jsでディスプレイスメントマップフィルタ実装したデモ作ったら思った以上に使えそうなのでメモ&共有。 (自信ないけどディスプレイスメントマップフィルタってこうことやってると思う。たぶん、、)ikeryou.github.ioまず、planeなmeshを敷き詰めたscene…

xxxxxxxx.descente.comDESCENTE(デサント) スペシャルコンテンツの背景演出部分のWebGLプログラミングを担当いたしました。 再形成を繰り返し、日が経ち成長していいくにつれ、ユーザーの期待感を高められるような力強いビジュアルを目指しました。 スマホは…

schl.co.jpクリエイティブチームschoolのwebサイトのフロントエンドを担当いたしました。 TOPのWebGLを使った動画加工エフェクトやメニューの展開時アニメーション、トランジションエフェクトなど細かい部分にこだわりました。ぜひご覧ください。

いわゆるvideo要素のcurrentTime進めてキャプチャしてcanvasへ表示するやつ。 もっと手間かかるかと思ってたけど、THREE.VideoTextureのおかげでだいぶスマートに実装できた。 使用頻度高そうなので忘れないようにメモる。・デモはこちら https://ikeryou.gi…

参考サイトを忘れないようにメモシェーダー 定義済値 http://qiita.com/edo_m18/items/591925d7fc960d843afaカスタムイメージエフェクト http://www.f-sp.com/entry/2015/08/11/185815スクリプトリファレンス https://docs.unity3d.com/jp/540/ScriptReferen…

ある程度太めのライン(2D)をうにょうにょさせたいっていう要望があって、 それならthree.jsのLineBasicMaterialのlinewidth設定すれば一発だろうと思ってて、 即「できます！」って答えたんだけど、 このプロパティまったく効かへん。。。 なに設定してもず…

DESCENTE(デサント)2017SS特設サイトTOPページのフロントエンドを担当いたしました。

ikeryou.jp僕のやってることや仕事の実績などは完全にこのブログに集約することにして自分のサイトもリニューアル。このブログへの扉ページ的な位置付けにしました。背景とか結構自分好みにぐにょぐにょさせてます(テキストは日々思ってることがランダムで表…

そろそろ.jadeじゃなくて.pngに切り替えようと思ったけど.pngだとSyntaxThemeがjadeじゃなくてplanetextになってしまうので、pngファイルをjadeファイルとして認識させる。 file-types packageをインストール Preferences/Open Config Folder → .atom/config…

iPhoneでマナーモードにしてても音がなってしまう現象。 調べたのでわすれないようにメモ。qiita.comwebaudioAPI単体なら問題ないが、HTMLAudioを一回でも使うとマナーモード無視で音が鳴ってしまう。今回はhowler.js使っててこのライブラリの場合どうやらラ…

mozztokyo.jp MOZZ TOKYOコーポレートサイトのフロントエンドを担当いたしました。 レスポンシブでありながらスマートフォンとPCで別々のUIを実装したTOPページ(もちろんワンソース)や、使いやすさと見た目のバランスを考慮した最低限の演出など、シンプルで…