⚫︎ デザイン意図

このサイトは、デザインカンプからのコーディング課題を元に制作した作品で、セクション構成は課題の内容を踏襲しています。HTML/CSSでのコーディングからWordPress化までを担当しました。

コーディングには HTML5、SCSS、jQuery を使用し、BEM命名規則でクラス設計を行いました。要素の役割や階層を明確化し、ネストや変数を活用して可読性と保守性を確保。SCSSは1ファイル構成ながら、カラーやフォントサイズの変数化、mixinでの共通処理化により、後からの修正・拡張にも対応しやすい構造としています。

jQueryでは、ホバーやスクロールに応じたアニメーションを実装。スマートフォン表示にも対応し、フォントサイズや余白、要素の配置などのUI調整を行い、各デバイスでレイアウト崩れが起きないよう最適化しています。

デザイン面では、色使い・フォント選定・要素間隔・サイズ感・視線誘導を全体的に見直し、元のビジュアルとは異なるコンセプトに再構成しました。税理士法人としての「信頼感」と「専門性」を軸に据えつつ、親しみやすさも持たせた配色とレイアウトを採用。落ち着いた色調と洗練されたタイポグラフィにより、プロフェッショナルでありながら堅苦しさを感じさせないデザインに仕上げています。スマートフォンやタブレットでも快適に閲覧できるよう、レスポンシブデザインで最適化しました。