Project Detail
Event Site
天神祭の船渡御予約サイトをデザイン・コーディングで制作。予約獲得を目的としたCTA設計とSEO対策を意識し、WordPressで運用しやすい構成に仕上げました。
制作サイトを見る（新しいタブで開きます）
Project Info
Overview
天神祭の船渡御予約を目的としたWebサイトをデザイン・コーディングから一貫して制作しました。
サイトの目的である「予約獲得」を最優先に設計し、スクロール中も常にCTAボタンを表示することでユーザーがどのページにいても予約へ誘導できる導線を構築しました。
SEO面ではtitleタグ・descriptionタグ・OGPタグを各ページ丁寧に設定し、検索流入と SNSシェア時の見栄えにもこだわりました。WordPressのカスタム投稿タイプで公演情報やブログを管理できる設計とし、クライアント様による継続的な運用を可能にしています。
Implementation Notes
読んだ先に、
予約の入口を。
祭りの魅力を伝えることと、予約まで迷わず進めること。
その両方を意識して、CTAの配置を設計しました。
01 / Keep the next step close
情報を読んだあとも、
予約の入口を探させない。
- 目的
- 公演の内容を読み、参加したいと思ったタイミングで予約へ進めるようにする。
- 実装
- スクロール中も予約への導線を保つ固定CTAを配置。ページ上部まで戻る手間を減らす構成にしました。
02 / Adapt to the screen
同じ目的を、
画面に合う形で。
- PC
- 右下の円形CTAで、祭りのビジュアルと予約への入口を両立。
- スマホ
- 画面下部の横幅を活かしたCTAへ切り替え、予約の入口をわかりやすく見せています。
画像は制作時の掲載画面です。
目的と画面の使いやすさを踏まえて、
次の行動につながる導線を実装しています。
Points
- 予約獲得を目的とした固定CTAボタンで常に予約への導線を確保
- titleタグ・descriptionタグ・OGPタグを各ページ丁寧に設定しSEOを強化
- カスタム投稿タイプで公演情報・ブログを管理画面から更新可能
- スライダー・スクロールアニメーションで祭りの雰囲気を視覚的に表現
- ページネーションで記事一覧を見やすく整理
- レスポンシブ対応でモバイルからの予約もスムーズに
デザインの見栄えだけでなく「予約を増やす」というビジネス目的を意識した設計を心がけました。CTAボタンの常時表示やSEO設定など、公開後の成果につながる実装を優先しています。