works

scroll

山本哲也オフィシャルウェブサイト

  • クライアント:山本哲也(タップダンサー)
  • 制作期間:1.5か月
  • URL:http://tetsutap.perma.jp/
  • 制作担当:企画・構成/デザイン/Illustrator/Photoshop/コーディング(HTML,CSS,jQuery)/サーバーアップロード

概要

知人でプロのタップダンサーとして活躍する山本哲也のオフィシャルサイトを制作。サイトの企画構成から、デザイン、コーディング、サーバーアップロードまで、全行程を担当いたしました。

目的

検索者に山本哲也のタップダンスのクオリティやパフォーマンス性を伝え、出演依頼やレッスン依頼につながるような信頼感を与えること。

作品のポイント

  • 訪問者にとってわかりやすいサイトにしたいとの要望があったため、載せる情報は必要最低限に留め、なるべくシンプルでスッキリとしたwebサイトを目指した。
  • 舞台出演を通じ、その場で(あるいは舞台終了後に)スマホ検索をかけるケースが多くなると予想されることから、モバイルファーストでデザインを制作。レスポンシブデザインでスマホでの閲覧にも対応させている。
  • 自身のタップダンス動画をサイト訪問者に見せたいとの要望があったため、ユーチューブ動画をサイトのトップに配置し、サイトに訪問後すぐに動画を閲覧できるように設計。
  • メニューバーをページ上部に固定し、見たいコンテンツへいつでもジャンプできるよう設計。
  • JavascriptではなくCSSアニメーションを使うことでサイトを軽量化し、閲覧者にとってストレスのかからないサイトを実現。
  • ファーストビューで閲覧者の興味関心を引くため、SVGアニメーションを導入。
  • 落ち着いたカッコいいテイストのものが良いとの要望があったため、モノトーン調のデザインを採用。またカラーレイヤーを使うことで、セクションごとのメインテーマを強調するとともに、山本哲也がタップダンスにおいて重点を置いている「アクセント」「リズム」といった要素を表現。
  • 本人の好きな青色をメインビジュアルに使用。