腑に落ちる、サービスの種

Claude × HubSpot × FUBUKI CMSで、爆速Web改修の現実。

作成者: EIJI KAKUGAWA|Sep 4, 2026, 1:55:26 PM

管理画面を介さず、爆速更新! 素人でもトークンを使わないでガンガンイケる証明!

今日から、記録を始めます。

この記事は、HubSpotに連携しているFUBUKI CMSツールにClaudeをつなぐことで、どれだけAI(Claude)を使ってホームページを構築できるかという実験です。

WordPressやWix、STUDIOなど、さまざまなCMSがある中で、直接ホームページを作るとなると「作ったものをサーバーにアップする」という発想になりがちです。しかし今回のコンセプトはこうです。

限りなくトークンを使わず、
素人がプロンプトで指示しても、壊れない。

この条件で、自身のサイトを使って更新実験を続けていく

すでに分かっていることとして、直接アップロードする運用には以下のような課題があります。

・個人では問題なくても、中小企業が情シスに利用承認をもらって運用する場合の障壁

・サーバーに個人情報が入っている場合の、AI連携における課題感

・一個人がAIで生成したファイルが、既存のホームページに混在するリスク

このように、企業がホームページ制作にAIを活用する上での障壁は多く、クライアントからもそうした声が聞こえてきます。

もともとFUBUKI CMSツールは内製化を推奨してきました。このタイミングで「AIを使って自分たちで作ろう」という機運が高まっている中、それらの障壁を取り払い、FUBUKIとしてどういった貢献ができるのかをコンセプトにして制作を進めています。

今回一回目では、以下のような更新が爆速で実現しました

管理画面を開かず、対話だけで

2日間で 10件 の更新

9月2日(火)

─ ブログ(Fubuki Journal)

  1. 新規記事を公開:AI活用で一番の無駄はここだった! スクショ&コピペの悪夢!?
    • 年間ロス時間の計算(5秒×30枚/日=年15時間)を本文に組み込み、タイトルにも反映
    • デザインに緩急を追加:キーキャップ風ショートカット表示、数字の大ボックス、蛍光マーカー見出し、言い切り文の拡大
    • 体言止めの解消、繰り返し表現の削減、とほほ系の締めに変更
    • OGP画像にフブキロゴを設定
  2. 過去記事2本の本文を中央寄せに修正(左寄りバグ):ゼロ社長。AI使ってる者同士が、話す。

─ トップページ(home)

  1. カスタムモジュールを新規作成し、最上段に設置
    • 最新ブログ記事のタイトルを自動表示(HubLで取得、全角スペース位置で2行改行)
    • 明朝の細字、センター、大きなグレーの引用符、上段から下段へのじわっとしたフェードイン
  2. スマホ表示の調整:英語キャッチ「We help you realize…」を2行に縮小

9月3日(水)

─ トップページ・スライダーの白空き問題(長年の持病)の決着

  1. 原因特定:テーマJSがページ読み込み時に一度だけスライダーの高さを計算するため、ウィンドウリサイズで白空きが発生
  2. 最終対応:SP(767px以下)はスライダーを非表示、タブレット・狭い窓(768〜1100px)は高さ380px固定、PCは無変更
  3. モジュール更新を「公開版+下書き版」の両方に反映する運用に変更(エディタプレビューに反映されない問題の解消)

─ その他(別セッションでの更新・履歴から検出)

  1. 新規記事公開:なぜ、ブログタイトルを、コーポレートのトップに置くのか。(9/3 0:09)
  2. WORKS配下3ページ更新:corporate/recruite/movies(9/3 1:35頃)、検証用ページ works-module-test(非公開)
  3. home を再更新(9/3 14:51)

長年放置していたスライダーの白空き問題が、原因特定から対応まで一気に片付いたのが象徴的でした。
管理画面を開かず、対話だけで、ここまで動きます。

── 次回に続きます。