Project
木の家と暮らし
Overview（概要）
デイトラが主催するチームクリエイティブ企画に参画し、建築会社を想定したコーポレートサイトを企画・制作しました。AIを活用して仮想クライアントの企業像や要件を設定し、週次ミーティングを重ねながら、企画・情報設計・デザイン・実装までチームで進行しました。
想定クライアントは、創業以来地域に根ざして建築業を営み、事業承継を機に古民家販売とリノベーションを主軸とする建築会社です。ブランド刷新の一環として、屋号やロゴを含めたWebサイトのリニューアルを行いました。
ユーザー名：demo
パスワード：demo
Description（詳細）
- 概要
- チームクリエイティブ企画における、仮想クライアントのWebサイト制作
- 課題
- 古民家の情緒的な魅力と、施工会社としての信頼性をどう両立して伝えるか
- 目的
- 30〜40代子育て世帯への認知拡大
資料請求・お問い合わせの増加 - ターゲット
- 30〜40代の子育てファミリー
古民家暮らしに興味がある移住検討者 - 担当範囲
- ディレクション / アートディレクション / 実装
- 制作期間
-
企画 / 情報設計 / WF 4週間デザイン 4週間実装 4週間
- 使用ツール
- Figma / Photoshop / Cursor / WordPress / GSAP
- 使用言語
- HTML / CSS（Sass） / JavaScript / PHP
Architecture（情報設計）
AIを活用して仮想クライアントを設定し、事業内容や課題、ターゲットを整理したうえで要件定義を行いました。チームで週次ミーティングを重ねながら意見を交わし、企画や情報設計の方向性をすり合わせています。
事業内容は、地域に残る古民家を次世代へ受け継ぐという価値に着目し、古民家販売とリノベーションを主軸に設定しました。木の家と暮らしという屋号には、家だけでなく、その先の暮らしまで提案する想いを込めています。
サイト構成では古民家販売を主軸に据え、リノベーション事業を施工品質や技術力を伝える役割として配置しました。競合が機能や性能を中心に訴求する中で、古民家ならではの暮らしの魅力から施工会社としての信頼性へと段階的に伝える構成とし、情緒と安心感の両立を目指しました。
Design（デザイン）
古民家そのものだけでなく、その先にある暮らしまで想像できる世界観を目指し、チームで意見を交わしながらデザインの方向性を整えていきました。
配色はアースカラーを軸に、情報過多で無機質になりがちな不動産サイトとは異なる、温かみと安心感のある印象を目指しました。写真選定や暮らしの質感の伝え方についても意見を交わし、生活のイメージが自然と膨らむよう調整しています。
見出しの Montserrat Subrayada と Zen Old Mincho、本文の Zen Kaku Gothic New といったフォントルールに加え、余白や行間についても整理し、落ち着いた雰囲気の中にスタイリッシュさと読みやすさを両立できるよう調整しました。
Development（実装）
実装では、デザインの再現だけでなく、アニメーションを通してサイト全体の世界観や空気感まで表現することを意識しました。私はTOP・ABOUTページを中心としたレスポンシブ実装と、サイト全体のアニメーション実装を担当しました。
サイトはチームでWordPressのオリジナルテーマとして構築し、更新性にも配慮しました。また、共同制作を円滑に進めるため、FLOCSSをベースに設計ルールやクラス命名を統一。GitHubによるブランチ管理、Gulpによるビルド環境、READMEでのセットアップ共有など、チームで開発しやすい環境を整備しました。
