概要 実案件。LP
作品名 福岡市民がつる大アート展
ターゲット 福岡市に住む小学生や中学生。またその親。
担当範囲 デザイン/コーディング（主にトップページ）
制作期間・制作完了日 デザイン…48時間/コーディング…24時間・2026年5月15日
使用ツール Figma/HTML/CSS/Vanilla JavaScript
工夫・サイト設計 　実案件のLPを制作しました。クラス内に2つのチームを作りコンペ形式でそれぞれのチームのサイトからどちらが良いかクライアントに選んでいただき当サイトが選ばれました。
　

1.期待感・高揚感を持たせるデザイン設計

イベントの世界観を直感的に伝えるため、視覚的にユーザーの興味を惹きつける「ワクワク感」のあるデザインを意識しました。
彩度や明度のバランスを緻密に調整し、ファーストビューからポジティブな印象を与えられるよう設計しています。
目玉がパチパチとまばたきする演出など、動きもデザインに取り入れました。
　

2.「情報の集約地点」として機能する網羅的な情報設計

SNSや他媒体など、様々な経路から流入するユーザーに対して、迷うことなくすべての情報にアクセスできる「受け皿」としての機能を重視しました。
各媒体で発信された点在する情報を整理・体系化し、1つのストーリーとして繋がる構成を採用しています。
ユーザーが求める「最新情報」「詳細内容」「よくある質問」などの重要コンテンツを直感的に探せるカテゴリ配置を行い、情報の検索性を高めることで、ユーザーの疑問や不安を完結・解消できる設計としています。
　

3. コンバージョン率を高めるイベント参加の動線設計

サイトの最終ゴールである「イベント参加」へユーザーをスムーズに導くため、ストレスのないUX設計を徹底しました。
スクロールに応じて常に視界に入る位置への追従ボタンの設置や、コンテンツの区切りごとに目立つカラーのコンバージョンボタンを配置し、ユーザーが「参加したい」と思った瞬間に迷わず行動を起こせるようにしています。
また、参加ステップをステップ図などで視覚的にわかりやすく可視化し、申し込みに対する心理的ハードルを下げる工夫を施しています。
　

4. 保守性とパフォーマンスを意識したコーディング

更新や改修がしやすいよう共通パーツはクラス設計を統一し、保守性・再利用性を高めています。
また、企業サイトでは表示速度や安定性も信頼性に直結すると考え、不要なライブラリは使用せず、シンプルな構成で実装しました。JavaScriptは必要最低限に抑え、軽量で安定した表示を実現しています。
サイトを見る