今週の気になるWEBサイト・アプリUI/UX&デジタル広告・サービス 6.14~6.20

今週の「気になる」シリーズはサイト:4、プラグイン:2、サンプルソース:2でお送りいたします。

Cedevita(WEBサイト)

150701_01

http://www.cedevita.com/en/index.html

クロアチアのスポーツドリンクcedevitaのWEBサイト。透過画像の組み合わせが工夫されていて、遊び心たっぷり。

Super Top Secret(WEBサイト)

150701_02

http://www.wearetopsecret.com/

マウスに反応して波紋が動くCANVAS要素が大胆。また各ページでのタイポグラフィーアニメもCOOLです。

Animate Plus(プラグイン)

150701_03

https://github.com/bendc/animateplus

アニメーションのライブラリです。サンプルがいくつかあり、パフォーマンステストでは250個のSVGを同時にアニメーションしてますが、かなりなめらか。イージングも豊富なので今後使う機会があればレビューしたいと思います。サイズは2.8KB

Page Scroll Effects(サンプルソース)

150701_04

http://codyhouse.co/gem/page-scroll-effects/

ウインドウいっぱいに広げるシングルページのスクロールアニメーションのサンプルソースです。全8種類用意されています。

Card Expansion Effect with SVG clipPath(サンプルソース)

150701_05

http://tympanus.net/codrops/2015/06/18/card-expansion-effect-svg-clippath/

非常にインパクトがあるページ遷移アニメーションのサンプルソース。幾何学的に配置されたSVGをガラスが割れるかの様にアニメーションさせています。

Legwork Studio(WEBサイト)

150701_06

http://www.legworkstudio.com/

アニメーションやインタラクションを生業としている制作会社のサイト。ムービー等を見るとモーショングラフィクスがすごいですが、ついついシュールなイラストに釘付けになっちゃう。

good to go(WEBサイト)

150701_07

オランダの通信会社kpnが運営するビデオオンデマンドのWEBサイト。小さいエリアにたくさんのコンテンツを重ねてアニメーションさせていて芸が細かい。

gradify(プラグイン)

150701_08

http://gradifycss.com/

画像から色を拾ってくれるプラグインです。特徴としては4つの色を拾ってグラデーションを作成する所。単色だけ拾う事も出来ます。

Share

  • このエントリーをはてなブックマークに追加
  • 28

Follow(SNSで定期購読)

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>