HP：PRO NAVI （プログラミングスクール）
キャリア更新を志す20〜40代に向けたプログラミングスクールの公式サイト。3名のチーム体制で開発し、私は「あなたの目的は？」~「選ばれる理由」、スクールの最大の特徴である「コミュニティ・ボイス（オフ会実績等）」の設計・実装を担当しました。
- _制作範囲
- Design / Coding / WordPress(担当範囲：TOP一部、下層2ページ)
- _使用ツール
- Figma / HTML / SCSS / JavaScript / WordPress
- _ターゲット
- 現状のキャリアに不安を抱き、新たな一歩を踏み出したい20〜40代の方。
- _目的
- 受講検討者の不安を解消し、信頼獲得と無料カウンセリング予約に繋げること。
- _デザインコンセプト
- 情報の整理を徹底し、余白を活かしたシンプルで洗練されたデザイン。コミュニティページの「オフ会レポート」や「受講生の声」では、実際の活動写真を効果的に配置。誠実さと共に学ぶ仲間の存在を感じさせる「温かな温度感」が共存する世界観を構築しました。
- _制作のポイント
- ・チーム開発での一貫性： 共通CSSとデザイン管理を徹底。他メンバーの担当箇所とシームレスに繋がる、違和感のないUXを追求しました。
・コミュニティの可視化： スクールの魅力でもある「横の繋がり」を伝えるため、Voiceページでは活動の多さを感じさせるレイアウトを採用。過去のオフ会レポートへ誘導し、スクールの信頼性と活気を伝えています。
・迷わせない導線設計： 忙しいユーザーが核心（選ばれる理由や仲間の声）に即座に触れ、そのままスムーズに相談予約へ進めるよう、固定CTAを最適化しました。
