タグ

アニメーションとモーションに関するmut00tumのブックマーク (2)

  • Wixのテンプレートに学ぶソフトモーションなどのデザイントレンド

    あなたはフラットデザインが好きかもしれませんが、美しく魅力的なWebサイトを作るにはさらに良い方法があります。それは、ソフトモーションです。この方法は、ユーザーを一瞬で夢中にさせることができます。 数年前、フラットデザインがWebデザインにおける一番のトレンドになる以前のことです。私たちは腹を立てていました。なぜなら、その当時のWebサイトは見た目は似通ったものばかりで、どれもパッとしないものだったからです。もちろんその責任はデザイナーの私たちにありましたし、今もあり続けています。 その後、もう一度デザインで遊び始めたWebデザイナーが現れました。余白やグラデーション、マイクロインタラクション、モーションなどを求め続けるデザイナーもいました。私たちは、再び可能性を見つけたのです。 フラットデザインの問題点は、ミニマリズムの哲学に起因します。ミニマリズムは包括的に徹底されるべきです。実際、フ

    Wixのテンプレートに学ぶソフトモーションなどのデザイントレンド
  • 高機能なモーション制作用JSライブラリGSAP/TweenMaxを使ったタイムリマップ表現 | ICS MEDIA

    皆さんはHTMLでモーションを作るときにどのトゥイーンライブラリを使用していますか? GSAP(グリーン・ソック・アニメーション・プラットフォーム)は、Flash全盛時代から存在する歴史あるトゥイーンライブラリです。 GSAPCSS/HTML Canvas/WebGLなどさまざまなアニメーション作成に利用できます。類似トゥイーンライブラリよりも高機能であり、かつ実行パフォーマンスも優れているのが魅力的です。GSAPの詳しい使い方は次の記事で解説しているので、使い方を知りたい方は以下の記事から参照ください。 GSAP入門(前編) - 基的な使い方 GSAP入門(後編) - タイムライン機能など この記事では、GSAPのタイムスケールという機能を中心に解説します。 作成したモーションデモを紹介 今回はGSAPの機能の1つ「タイムスケール」を使って、3Dの表現を試してみました。まずは次の2つ

    高機能なモーション制作用JSライブラリGSAP/TweenMaxを使ったタイムリマップ表現 | ICS MEDIA
  • 1