【制作実績】シロハル様|2nd Anniversary LIVE 特設ページ制作

シロハル 2nd Anniversary LIVE「夜を越えて、君に会いにきた。」の特設ページを制作させていただきました。

ライブの世界観が伝わるファーストビューを中心に、開催情報、チケット案内、プロフィール、キャンペーン情報を1ページに整理。

会場チケット・オンライン配信・スポンサー・アーカイブなど複数の申込み導線も、迷わず進めるように設計しました。

概要

シロハル 2nd Anniversary LIVE特設ページのファーストビュー(PC表示)
  • ヒアリング
  • 構成提案
  • デザイン
  • HTML
  • CSS
  • レスポンシブ対応
  • 画像最適化
  • チケット導線設計
  • 公開後修正
  • フライヤー制作
項目内容
お客様シロハル 様
制作物2nd Anniversary LIVE 特設ページ
ページタイトルシロハル 2nd Anniversary LIVE「夜を越えて、君に会いにきた。」
サイトURLhttps://shiroharu.com/live/yoruwokoete/
ご依頼内容・2周年ライブに向けた特設ページ制作
・ライブ情報
・チケット案内
・プロフィール
・キャンペーン情報
・申込み導線を1ページに整理
制作方法HTML / CSS

制作した特設ページ

今回制作したのは、シロハル結成2周年を記念したライブイベントの特設ページです。

ライブタイトルである「夜を越えて、君に会いにきた。」の世界観が最初に伝わるよう、写真・コピー・開催情報・申込みボタンをファーストビューにまとめました。

シロハル 2nd Anniversary LIVE特設ページのPC表示デザイン

スマホでも見やすく調整

スマートフォンで閲覧されることを前提に、文字サイズ、余白、ボタンの押しやすさ、画像とテキストの重なり方を調整しました。

特にファーストビューは、PCとスマホで見え方が大きく変わるため、それぞれの画面に合わせてバランスを整えています。

シロハル 2nd Anniversary LIVE特設ページのスマホ表示デザイン

フライヤーも制作

「特設サイトのデザインを元に、フライヤーをPDFデータでいただくことは可能でしょうか?」

と、ご相談を受け、フライヤーも作らせていただきました。

LOFT9 Shibuya に掲載していただきました!

出展:LOFT9 Shibuya

お客様のご感想

サイトの完成後、シロハルさんより、ご感想をいただきました。

お客様のご感想
HPに引き続き、特設サイトの制作をお願いしました☺️🌸

あっという間にカッコ良すぎるページが出来上がり、大満足❣️
あまりに素敵なデザインのため、HPのデザインをそのままフライヤーにさせていただきました🩷

ニックさん、いつも素晴らしい‼️✨
本当にありがとうございます😆💐
シロハルさんのご感想
Xのポストより

制作のポイント

  • ライブの世界観が伝わるファーストビュー
    ライブタイトル「夜を越えて、君に会いにきた。」の雰囲気が伝わるよう、写真・コピー・開催情報を一画面に整理しました。
    PCとスマホで見え方が変わるため、人物写真と文字が干渉しないよう細かく調整しました。
    申込みボタンをファーストビュー内に配置し、興味を持った方がすぐにチケット導線へ進める構成にしました。
  • 想いが伝わってから申し込めるページ構成
    チケット情報の前にMESSAGE・CONCEPTを配置し、ライブに込めた想いや背景が自然に伝わる流れにしました。
    note記事へのリンクも、独立したボタンではなく本文の流れに沿って自然に設置しました。
    単なる告知ページではなく、「なぜこのライブを行うのか」が伝わる特設ページに整えました。
  • 複数の申込み導線を分かりやすく整理
    会場チケット、オンライン同時中継、スポンサー、ブース出展、アーカイブ、DVD予約をカード形式で整理しました。
    Googleフォームや外部ページへのリンクを設置し、申込み者情報の管理もしやすい導線にしました。
    公開後の追加要望にも対応し、アーカイブチケット予約やプレミアムDVD予約ボタンも追加しました。
  • キャンペーン・寄付の取り組みも掲載
    シロハルキャンペーンへの導線を設け、ライブと関連企画を一体的に伝えられる構成にしました。
    売上の一部をユニセフへ寄付する案内ビジュアルを掲載し、イベント参加の意義が伝わるようにしました。
    スポンサー特典バナーも追加し、応援・協賛を検討する方にも情報が届くようにしました。
  • スマホ表示と画像最適化まで対応
    スマホで読みやすいよう、文字サイズ・余白・ボタンの押しやすさを調整しました。
    ファーストビュー、プロフィール、バナー画像などをWebP化し、表示速度にも配慮しました。
    納品時には不要な作業データを除外し、扱いやすい構成に整理しました。

まとめ:シロハル様|2nd Anniversary LIVE 特設ページ制作ページ制作

シロハル 2nd Anniversary LIVE特設ページのファーストビュー(PC・スマホ表示)

最後に、今回の制作についてまとめます。

項目内容
お客様シロハル 様
制作物2nd Anniversary LIVE 特設ページ
ページタイトルシロハル 2nd Anniversary LIVE「夜を越えて、君に会いにきた。」
サイトURLhttps://shiroharu.com/live/yoruwokoete/
ご依頼内容・2周年ライブに向けた特設ページ制作
・ライブ情報
・チケット案内
・プロフィール
・キャンペーン情報
・申込み導線を1ページに整理
制作方法HTML / CSS
お客様のご感想
HPに引き続き、特設サイトの制作をお願いしました☺️🌸

あっという間にカッコ良すぎるページが出来上がり、大満足❣️
あまりに素敵なデザインのため、HPのデザインをそのままフライヤーにさせていただきました🩷

ニックさん、いつも素晴らしい‼️✨
本当にありがとうございます😆💐
筆者

特設サイトの制作をさせていただきまして、どうもありがとうございました!いつも誠実にご対応いただき、大感謝です🙇✨

シロハル 2nd Anniversary LIVEの世界観と、チケット申込みまでの導線を両立した特設ページを制作させていただきました。

イベントやキャンペーンの告知ページでは、情報をただ並べるだけでなく、想い・開催情報・申込み方法を分かりやすく整理することが大切です。

ライブ、講座、キャンペーン、期間限定企画など、情報量の多い特設ページ制作も、目的に合わせて構成からサポートいたします。

この記事が気に入ったら
フォローしてね!