障害年金サポートLP制作で得た学びと成果
はじめに
前回、こちらの記事で案件を獲得した記事を書きました。
今回は、その案件を通じて得た学びと成果についてご紹介します。この案件は、Web制作の一連の流れを初めて一人で担当したもので、技術面でもデザイン面でも多くの挑戦と成長を実感できた案件でした。
1. プロジェクトの背景と目的
このLP制作は、障害年金代行請求をする社労士事務所からの依頼でスタートしました。クライアント様が抱える課題を解決するため、ジモティーを通じた依頼をきっかけに、実績を積むことを目的として無償で引き受けました。
クライアント様自身もメンタルの不調を経験されており、同じような悩みを抱える方々に寄り添いながら障害年金の請求を支援したいという熱い想いをお持ちでした。その想いを形にするため、安心感と信頼感を高めるLP制作を目指しました。
ターゲットは、障害年金の申請に不安を感じている20代から40代の男女。既存のHPでは伝えきれなかった「寄り添いの姿勢」や「専門性」を、デザインや構成を通じて効果的に伝えることが求められました。
2. 制作のプロセスとデザインへのこだわり
「温かみ」と「信頼感」を表現したデザイン
デザインの要となったのは、「悩んでいる人に寄り添う温かみ」をどのようにビジュアルに落とし込むかという点です。柔らかさや親しみを感じさせるために、秀英丸ゴシックや角丸の図形を使用し、全体のトーンを調整。メインビジュアルには柔らかい色味を採用し、視覚的に「安心感」を伝えられるよう工夫しました。
また、構成としては「共感から始まり、解決策を提案する」という流れを意識し、ユーザーに寄り添う姿勢を強調しました。
「LINEでの相談」を最大限に促進する設計
今回のLPの最大の目的は、LINEでの相談・問い合わせにつなげることでした。そのため、画面下部には固定バナーを配置し、視認性を高めました。また、ホバー時に色が変わるアニメーションを追加することで、クリックしやすさを演出。問い合わせボタンには「受給判定を依頼する」といった具体的な文言を使い、ユーザーが行動を起こしやすい設計にしました。
信頼感を高めるSNS連携
さらに、通常のLPではリンクを極力少なくするのが一般的ですが、クライアント様がX（旧Twitter）やInstagramで積極的に発信している内容をあえてリンクとしてLPに取り入れました。スライダーでSNS投稿を表示させ、クリックすると各投稿に飛べるように設計。また、noteに投稿されたお客様の声もLPに取り入れ、信頼性を補強しました。
3.苦労した点と克服方法
制作では、スライダーや問い合わせフォームの実装時にJavaScriptやjQueryのエラーが発生するなど、技術的な課題に直面しました。特に、スライダー導入後に問い合わせフォームが正常に動作しない問題が発生し、コードの記述を見直すことで解決しました。また、横スクロールが意図せず発生するなど、エラーの修正と改善を繰り返し、スキルを向上させる良い機会となりました。
レスポンシブ対応においても苦労があり、特に画面の小さい端末でメインビジュアルがファーストビュー内に収まるように調整するのに時間を要しました。それでも諦めず試行錯誤を続けた結果、クライアント様にもご満足いただける仕上がりとなりました。
4. 成果と学び
公開後、クライアント様からは「非常に満足」との評価をいただきました。以下は、実際にいただいたコメントの一部です。
「最初のページのインパクトが大きくとても良いと思います。こだわりのポイントであったところも最後に修正いただき、今のところほぼ何も言うところはありません。」
「他の競合と比べても遜色なく、むしろ優位に立てるような素晴らしいLPが出来上がり、非常に満足です。この度はありがとうございました！」
また、初めてヒアリングからサーバーへの実装までを一貫して担当したことで、タスク管理やスケジュール調整の重要性を学ぶとともに、自己解決力も大きく向上しました。これらの経験を次の案件に活かし、さらにスムーズな制作プロセスを実現したいと考えています。
終わりに
今回のLP制作の機会をいただいたクライアント様には、改めて感謝の意を表します。このLPが、障害年金の申請に不安を感じている方々の一助となり、少しでも悩みを解消するきっかけになれば幸いです。
また、このプロジェクトを通じて得た経験と学びを糧に、今後はLP制作だけでなく、HP制作やその他のWebデザインにも積極的に挑戦していきたいと思います。クライアント様の期待を超える成果を提供できるよう、さらなるスキルアップを目指して努力を続けていきます。