プロジェクト概要

「名刺代わりのWebサイト」というテーマのもと、情報の密度と伝達速度を極限まで高めることを目指したコーポレートサイト制作プロジェクトです。

掲載内容をあえて必要最小限に絞り込み、ユーザーに最も伝えたいコアメッセージを瞬時に届ける設計を行いました。コンテンツ量はコンパクトですが、GSAPを用いた滑らかで効果的なアニメーションを各所に配置することで、情報の少なさを感じさせない「見応え」と「プロフェッショナルな質感」を両立させています。

株式会社YMC コーポレートサイト

技術構成と品質管理

Nuxt 3 によるモダンな開発基盤

以前から Nuxt の利用を視野に入れられていた背景もあり、フレームワークには最新の Nuxt 3 を採用しました。

また、長期的な保守性とコード品質を担保するため、main ブランチへのコミット時にリンター（ESLint / Markuplint）が自動実行される CI/CD パイプライン を構築。常に一定以上の品質が維持された状態でデプロイが行われる、堅牢な開発ワークフローを実現しています。

  • Framework: Nuxt 3 / Vue 3
  • Animation: GSAP
  • Quality: ESLint / Markuplint
  • CMS: microCMS
  • Infrastructure: Git (CI/CD)
  • Design: Figma
  • Analysis: GA4 / GTM

戦略的なCMS選定とロードマップ

運用フェーズに合わせたハイブリッド設計

将来的なクラウドサーバーへの移行可能性を考慮し、WordPress などの自己完結型 CMS ではなく、API ベースの microCMS を選定しました。これにより、インフラ環境に依存しない柔軟なコンテンツ管理を実現しています。

現在は物件情報の頻繁な更新に対応するため、API 経由でコンテンツを動的に取得・レンダリングする構成をとっていますが、全情報の掲載完了後は SEO 効果を最大化するために、SSG（静的サイト生成）への移行を前提とした設計を行っています。

運用上の特徴

  • microCMS による物件管理: エンジニアの手を介さず、管理画面から直感的に更新可能。
  • 画像の自動最適化: アップロード後の WebP 変換・配信により、表示速度を向上。
  • 自動ルーティング: ファイルベースの管理により、ページ追加に伴う手動設定コストを削減。

この構成により、現状の「運用のしやすさ」と将来の「検索エンジンの最適化」を高い次元で両立させています。