今週の気になるWEBサイト・アプリUI/UX&デジタル広告・サービス 2016/3.13~3.19
Hochburg. The Design Force.(WEBサイト)
DESIGN FORCEのコピーが随所に。CEO自らメインビジュアルになり全面にブランディングさせています。ヨーダっぽいのは狙いですかね?
Sonikpass(WEBサイト)
セキュリティー関連会社のWEBサイト。CANVASで描かれたトップの波紋と背景の極太フォント、ミニマルなデザインに注目しました。
Somerset(WEBサイト)
封筒を明けると1枚の厚紙が。ページ内のアニメーションを全てスプライトシートで作られていて非常に手間暇かけてらっしゃいます。MAPもちゃんと動きます。
Monocromo(サンプルソース)
https://codyhouse.co/gem/ink-transition-effect/
先ほど取り上げたスプライトシートのafter effectを使ったパラパラマンガ風アニメーションのサンプルサイト。以前書いた「png、jpgアニメーション(Javascript + AfterEffects)でデバイス、ウインドウサイズに縛られないアニメーション」と似た方法です。
Rotate(WEBサイト)
マウスインタラクションでシャドウを動かすギミックが会社名を上手く表現していますね。詳細ページのスクロール進捗度を表すUIも面白いアイディア
jQuery Hover3d(サンプルソース)
http://ariona.github.io/hover3d/index.html
hover時の3d視差インタラクションのサンプルソース。要素毎にCSS3で異なるtranslateZを指定しておき、JSで操作する方法。
Hear My Story(WEBサイト)
聴覚障害者を取り上げたWEBサイト。各記事毎にメインビジュアルにムービーが埋め込まれています。特にナビのUIに注目しました。
Vodka Alaska(WEBサイト)
トップメインビジュアルに3Dに雪を降らせています。各セクションでドラッグ出来るタイムラインUIに注目しました。