新作アルバムの告知用特設ランディングページです。SNSや動画サイトの映像広告からリンクで飛んだ際に遷移するサイトです。

URL

http://ky0419.stars.ne.jp/website/site03/index.html

担当

デザイン・コーディング

制作期間

2023年9月5日～10月19日

サイトの目的

アルバム情報の宣伝、販売数増加、ダウンロード数増加、ブランド認知、イベントの宣伝

ターゲット

アルバムの購入層、配信サイトの利用者・SNS利用者・若年層

デザインについて

[全体]
ロゴタイプとメインイメージをファーストビューで表示して世界観を訴えかけました。近未来「サイバーパンク」をイメージして作られた楽曲集・アルバムなので夜景の大都会をモチーフとしています。イラストは全てAI生成です。世界観に入りやすいよう背景でテーマソングを流せるようにしています。
[ロゴ]
ロゴマークはヘッドホンと音の波形を取り入れました。グッズ展開も考慮して直線的で硬いかっこいい造形を意識しました。アルバムタイトルの「アンチ」は反対という意味なので象徴的にモノクロを反転させました。用途に応じて使い分けられるようモノクロのシンプルなロゴ、RGBをずらしたもの、グリッチノイズというエフェクトをかけた3種類を制作しました。
[アルバム告知PV]
プロモーションビデオに誘導するために一番最初のコンテンツに配置しました。プロモーションビデオの詳細は制作物－映像の別ページに掲載しております。
[SNS]
若年層がメインターゲットのためサイト離脱後もSNSで情報を追いやすいよう、直接公式アカウントへのリンクを埋め込みました。さらにSNSの存在を認知させやすいよう投稿されたページごと配置しました。最終的にはタイムラインをスクロールで操作できることが理想です。

コーディングについて

[全体]
YouTubeから映像を埋め込んでいるのでアスペクト比の調整が大変でした。音やモーションを多くしたので正常に動作するよう何度も試行錯誤を繰り返しました。
[オープニングアニメーション]
再生後自動で遷移するかスキップできるか選べるようにしました。基本的にCSSで動作しています。