アニメーション
視覚効果コンテンツ

HOME

>    アニメーション・視覚効果コンテンツ

アニメーション・視覚効果を利用して
ユーザーの目を引きつつ、飽きのないWebサイトを

Webサイトにアニメーションや視覚効果のコンテンツを設置し、ユーザーに楽しさや導線を提供しながら目的のコンテンツを閲覧させていくという手法は、Web台頭期からWebサイトにとって重要要素の1つでした。
この手法は現在も変わらず、むしろ「よりよい効果はないか?」と、日々世界中のデザイナーが鋭意努力しています。

また近年ではサイトを閲覧しているユーザーにより多くの情報を提供したいという要望が高まる一方、限られた画面の領域にうまく情報をはめ込み、ユーザーに煩わしさを感じさせないサイトが求められています。多くの情報をまとめ、かつそこにユーザーの興味を沸かせるためにも視覚効果は欠かせません。

シェアを伸ばしているスマートフォンにはアニメーション表現の手法の一つであるFlashが使用不可の機種もありますが、代替技術としてJavaScriptが台頭してきており、スマートフォンが広まっても視覚効果が衰退するということはありません。

ただ視覚効果もどこでもここでも使えば良いというものではありません。
無駄に多い視覚効果はユーザーの目を疲れさせ、サイトの閲覧に飽きを感じさせてしまいます。

Flashの代わりにJavascriptを使用したスライドショーが主流です。
見難いWebページも当社にお任せ下さい!
  • ・ 豊富なアニメーション・視覚効果制作経験から各サイトに最適な効果を提案いたします。
  • ・ 経験豊富なデザイナー、プログラマーを擁する弊社だからこそ見た目にも動作にもこだわった視覚効果を実現可能です。
  • ・ 既存サイトに設置されている動作の改修も可能です。
実績はこちら

シーン別

  • ● 製品の紹介を最後まで楽しみながら見てもらうための【パララックス効果】(視差効果)
  • ● 画面を下にスクロールすると、それに伴ってカラフルなアイコンが動いたり画像が切り替わったりします。
  • ● ユーザーに飽きさせることなくスクロールを促すことができるので、商品の説明など、ひとつの事柄について多くの
      情報が必要になる場合に向いています。

スクロールに伴って、複数の画像を使い、奥行きを感じる事ができます。

  • ● 月ごとのお知らせを切り替えるための【スライドショー効果】
  • ● 複数の画像が1箇所で移り変わります。
  • ● ユーザーの操作無しに画像が切り替わっていくので、キャンペーン広告などユーザーに閲覧してほしい情報が多い場合に
      向いています。
  •  
  •  
  • ● ブランドイメージを動画で表示する【背景動画再生効果】
  • ● サイトの背景に静止画像ではなく動画を設置します。
  • ● ユーザーにインパクトを与え、サイトそのものやサイトの運営企業・ブランドを印象づけたい場合に向いています。
  • ● 画像やページを画面上に拡大して表示する【モーダルウィンドウ効果】
  • ● 閲覧しているページを離れることなく、画像、動画、お問い合わせフォームなどを拡大して表示します。
  • ● ページの離脱率を抑えつつ、商品写真や広告動画を綺麗に見せたい、各種登録フォームを表示させたいという場合に向いています。
  • 1クリックで画像を拡大し閲覧できます。

  •  
  • Youtubeやストリーミング動画も表現できます。

  •  
  • ログインやメールマガジン登録の画面をページ移行する
    事なく表示できます。

  • ● 限られたスペースにメニューを納める【アコーディオン効果】
  • ● ボタンを押すとアコーディオンのように領域が広がり、下層コンテンツへの導線が表示されます。
  • ● 表示領域が狭いスマートフォンサイトに、多くのメニューを配置する場合に向いています。

ナビゲーションボタンをタップすると、メニューがアコーディオンのように開きます

領域を取ってしまうコンテンツを通常は非表示にしておき、ユーザーが
必要と感じた時に閲覧できるようにします。

実績紹介

霧島天然泥湯の宿 さくらさくら温泉

・さくらさくら温泉様の美しい外観
・推しの1つでもある硫黄泉の泥パック
・四季折々の旬の素材を使った料理

の3点をメインビジュアルに使い、表現方法も温泉の湯気をイメージしたエフェクトを使用し、サイト上でさくらさくら温泉様の雰囲気を表現しています。

使用したアニメーション 【スライドショー】

ファーストリビング株式会社 デザリノ

リノベーション(改築)を行った際の実績写真を、有効的かつ綺麗なまま閲覧していただくためにモーダルウィンドウを導入しました。
数多くの写真がありながらも、1枚1枚を拡大して表示しているので、ユーザーにインテリアの良さを最大限にお伝えする事が出来ています。

使用したアニメーション 【モーダルウィンドウ】

ご相談はこちら