【概要】 英会話スクールの架空ランディングページを制作しました。 実際のサービスを想定し、想定顧客や訴求ポイントを整理したうえで構成・デザインを設計。 英語に苦手意識を持つユーザーを想定し、「安心感」と「信頼感」を軸に黒×ゴールドで上質な印象を演出。 初見で離脱されにくい導線と、行動につながる視覚設計を意識しています。 【デザインのポイント】 ① ヒーローイメージ ・課題　 英会話を学びたい人は「自分にできるか不安」「失敗したくない」と感じやすく、最初の印象で離脱する可能性があった ・目的　 英会話に苦手意識がある人でも「自分にもできそう」と感じ、安心してページを読み進めてもらうきっかけを作る ・工夫　 講師の笑顔の写真を使用し、信頼感と安心感を演出。ポジティブな印象を与え、学習への心理的ハードルを下げた ② 黒×ゴールドの配色 ・課題　 競合が多く、ユーザーが「どのサービスを選べば安心できるか」と迷いやすかった ・目的　 上質で信頼できる印象を与え、「ここなら頑張れそう」と思ってもらう ・工夫　 黒とゴールドで高級感を表現し、CTAに赤を配置して自然に目が留まるようにした ③ フォント選定 ・課題　 信頼感と読みやすさを両立できるフォント選びが必要だった ・目的　 幅広い年齢層に安心感を与え、最後までストレスなく読み進めてもらう ・工夫　 キャッチコピーは太めの明朝体で上品さと力強さを、本文はゴシック体で可読性を確保した ④ 情報整理と視線誘導 ・課題　 情報量が多く、途中で「読むのが大変」と感じて離脱されるリスクがあった ・目的　 知りたい情報をスムーズに見つけられ、自然に最後まで読みたくなる構成にする ・工夫　 余白やブロック構造を工夫し、視線の流れを自然に誘導。重要な情報がすぐ目に入る設計にした ⑤ スマートフォン閲覧を前提とした設計 ・課題　 スマートフォン閲覧時に文字の小ささや見づらさで離脱する可能性があった ・目的　 移動中や隙間時間でも快適に閲覧できるようにし、「読みにくい」を理由に離脱させない ・工夫　 文字サイズや余白を調整し、「見やすさ」「わかりやすさ」「行動につながるUI」を意識して設計した ⑥ 直感的に理解できる情報設計 ・課題　 テキストだけでは内容が伝わりづらく、読む前に離脱されるリスクがあった ・目的　 視覚的に理解しやすくし、読む前からサービス内容を直感的に把握してもらう ・工夫　アイコンや囲み枠で情報を整理し、読む前から要点がつかめるようにした 【ターゲット】 英会話に興味を持ちながらも、学習への不安を感じている社会人層 【使用ツール】 ・Adobe Photoshop ・Figma（ワイヤーフレーム制作時に使用）