映画の架空PRサイト

石川和貴

制作年月日

2023年07月28日

使用ツール・言語

Photoshop / HTML / CSS / JavaScript / Dreamweaver

製作期間

3週間

サイトURL:https://k-iskw.com/moviesite

概要

「映画化して見てみたい作品を自分で探し、架空のPRサイトを作る」ということで、ジョジョの奇妙な冒険第7部STEEL BALL RUNを題材にした架空のアニメ映画公式サイトを制作した。

ターゲット

  • 既存、新規問わずジョジョの奇妙な冒険シリーズのファンへ向けて。
  • アニメ映画が好きな人へ向けて。

制作の目的

  • Webサイトの制作手順(題材の決定~コーディングまで)の習得と確認をする。
  • Webサイトのレイアウトについて(コンテンツの表示する順番やフォントのサイズなど)学習すること。

デザインおよび制作のこだわり

  • 作品の舞台、アメリカ大陸を横断する乗馬レースを行う物語であることや西部劇の時代であることから青空をイメージした背景色とした。
  • メインビジュアルには、主人公2人と深くかかわってくるメインキャラクター達を使用した。ロゴのフォントデザインに合わせた公開時期を右上に載せることで一目でわかるようにした。
  • IntroductionとStory部分は、タブ切り替えができ、ページ内でそれぞれのコンテンツを確認できるようにした。
  • CharacterセクションではjQueryプラグインであるslickを使いキャラクターを横並びにし、クリックするとモーダルでキャラクターの詳細を確認できるようにした。
ジョジョの奇妙な冒険第7部スティールボールラン
PC表示
STORY
intro&story切り替え
ジョニィ・ジョースター
CHARACTERモーダル表示
ジョジョの奇妙な冒険第7部STEELBALLRUN
スマホ表示
ジョジョの奇妙な冒険第7部STEELBALLRUN
ハンバーガーメニュー