ドライブゲーム「頭文字D THE ARCADE（イニシャルD ジ・アーケード）」公式サイト制作

概要
ドライブゲーム「頭文字D THE ARCADE（イニシャルD ジ・アーケード）」の公式サイト制作をデザインからコーディングまで担当しました。現在も運用更新を担当しています。

制作期間
2020年12月～2021年3月

制作体制
3名／ディレクター1名、デザイナー兼コーダー1名、システムエンジニア1名

役割
デザイナー兼コーダー

担当内容
ページデザイン
ページコーディング
LPデザイン
LPコーディング
広告バナー制作
サイトの制作進行管理
他部署との連携

使用ツール・言語
Adobe Photoshop
Adobe Illustrator
Visual Studio Code
Backlog
Google アナリティクス
Excel
WordPress
HTML5
CSS3
JavaScript
Vue.js

制作のポイント

「頭文字Dの原作漫画っぽくしたい」というオーダーをいただき、それに合うようにデザインを制作しました。

背景に実際の漫画のコマの素材を使用したり、公道を走るストーリーなので、道路をデザインしたり、漫画内で出てくる走行音の擬音「ギャアァァァ」の文字を動きを付けて背景に配置したり、勢いを表現するため斜めのデザインを多く取り入れたり、などの工夫をしました。

車種やコースページでも、漫画のコマ割りっぽいデザインにし、世界観を大事に制作にあたりました。

できあがったサイトは依頼先からも「イメージにあっている」と好評をいただくことができました。
その後の更新対応も運用しやすいよう、ページコーディング時は、cssだけで表現している部分をなるべく増やしました。

ユーザーがよく利用するランキングページでは、フロントエンドエンジニアと協業し、ユーザーにとっても使いやすく、運用側にとっても更新がしやすいものを制作しました。
アクセス数全体のうち32%のユーザーがこのランキングページにアクセスして、SNSなどでも話題にあげてくれています。