AIだけでWeb制作はここまで来た。Google NotebookLM × Manusで“嘘のない設計×プロ品質デザイン”を20分で完成させる方法

  • URLをコピーしました!
目次

AIでサイトを作ったのに「使えない」と感じたことはありませんか?

  • AIにサイトを作らせたら情報が嘘だらけ
  • デザインが素人っぽくてそのまま使えない
  • 結局、修正に時間がかかって人力の方が早い

正直、こう思ったことがある人は多いはずです。

「AIでWeb制作って言うけど、まだ実務では無理じゃない?」

もしそう感じているなら、それはAIの使い方が間違っていただけです。

実は今、
AI同士を正しく役割分担させるだけで、Web制作の常識が完全に変わる方法が登場しています。

それが今回紹介する

  • Google NotebookLM
  • Manus(マヌス)

この2つを組み合わせた、
失敗しようがないWeb制作フローです。


結論:AIは「1つで全部やらせる」と失敗する

まず大前提として、
1つのAIにWeb制作を全部やらせるのは無理があります。

理由は大きく2つです。


AI単体Web制作の致命的な弱点①|情報の正確性問題

経験ありませんか?

  • 存在しないデータを出す
  • 適当な競合分析
  • もっともらしい嘘(ハルシネーション)

ホームページやLPにおいて、
情報の正確性=信用そのものです。

どれだけデザインが良くても、

  • 情報が間違っている
  • 根拠がない

これだけで集客できないサイトになります。


AI単体Web制作の致命的な弱点②|デザインと構築の壁

文章は書けても、

  • そのまま使えるデザイン
  • 崩れないコード
  • 実際に公開できる状態

ここまで持っていけるAIは、
これまでほとんどありませんでした。

結果どうなるかというと、

「結局、直すのは自分」

この状態です。


そこで登場する“最強の役割分担”

今回の方法では、AIを完全に分業させます。

🧠 脳:NotebookLM

💪 腕:Manus

この考え方がすべてです。


NotebookLMとは?|嘘をつかない“超優秀なプランナー”

https://storage.googleapis.com/gweb-uniblog-publish-prod/images/NotebookLM_StudentBlogHeader_DiscoverSources_.width-1300.png

NotebookLMは、
指定したソースだけを根拠に回答するAIです。

つまり、

  • 勝手な想像をしない
  • 情報の出どころが明確
  • 裏取りが一瞬でできる

👉 嘘をつかないAI

Web制作で言うと、

  • サイト構成
  • コンセプト設計
  • コピーライティング
  • 画像の指示書

この「設計図」を作るのに最適です。


Manusとは?|設計図を一瞬で形にする“神の腕”

https://www.innovationtraining.org/storage/2025/06/Manus-Demo-to-build-a-website-and-research-with-AI-agent-scaled.png

Manusは、
自律型AIエージェントと呼ばれる次世代AIです。

すごいのは、

  • デザイン
  • コーディング
  • 画像生成
  • 実装
  • 公開

これを自分で考えて実行する点。

まさに、

設計図を渡したら
プロのWebデザイナーが横で全部やってくれる

そんな感覚です。


この2つを組み合わせると何が起きるのか?

答えはシンプル。

嘘のない最高品質の設計図
×
プロレベルの実装力

失敗しようがないWeb制作


実演①|NotebookLMで「嘘のない設計図」を作る

例として、
沖縄の海が見える絶景カフェのWebサイトを作るとします。

ポイントは「ソースを読み込ませる」こと

  • コンセプトメモ
  • メニュー情報
  • パンフレット
  • PDF資料
  • 競合サイトのURL
  • YouTubeリンク

これらをNotebookLMに読み込ませます。


さらに強力なのが「リサーチ機能」

NotebookLMには、

  • ファーストリサーチ
  • ディープリサーチ

という機能があります。

これを使うと、

  • 沖縄エリアの人気カフェ
  • トレンド
  • 競合情報

一気に自動調査してくれます。


出てくる設計図のレベルが違う

  • ファーストビューのキャッチコピー
  • どんな写真を使うべきか
  • なぜその構成なのか

すべて根拠付き

しかも、
右側の番号をクリックすれば
「どのソースを参照したか」も一瞬で確認できます。

👉 これで論理的に外さない設計図が完成。


実演②|Manusに設計図を丸投げする

https://static.wixstatic.com/media/e6ecb9_cd1cb61a532845f7a4289a62fc23313a~mv2.jpg/v1/fill/w_1920%2Ch_1080%2Cal_c/e6ecb9_cd1cb61a532845f7a4289a62fc23313a~mv2.jpg

やることは驚くほどシンプルです。

  1. NotebookLMで作った設計図をコピー
  2. Manusのチャット欄にそのまま貼る
  3. 「この設計図をもとにWebサイトを作ってください」
    と指示

これだけ。


Manusが勝手にやること

  • デザイン設計
  • 高品質画像生成
  • コーディング
  • レイアウト調整

しかも、
作業している画面が見えるので安心感もあります。


無料版と有料版の違い

  • 無料版
    • それなり
    • AI感は残る
  • 有料版(1.6 MAX)
    • プロが作ったレベル
    • 画像・余白・配色すべて別次元

実務で使うなら、
有料版一択です。


修正が革命的にラク

https://www.innovationtraining.org/storage/2025/06/Manus-Demo-to-build-a-website-and-research-with-AI-agent-scaled.png

Manusのすごいところは修正。

  • 画面上で修正したい箇所を選択
  • 「ここを縦並びにして」
  • 「この文言を沖縄向けに変更して」

👉 指示するだけでOK

コードを書く必要はありません。


公開までが異常に早い

  • 右上の「公開」を押す
  • 即インターネットに反映
  • スマホ対応も自動

さらに、

  • カスタムドメイン設定
  • Manus表記の削除

も可能。


実際にかかった時間

  • NotebookLM(リサーチ+設計):約10分
  • Manus(構築+微調整):約10分
  • 公開:1分

👉 合計20分ちょっと


Web制作者の仕事はなくなるのか?

結論。

仕事はなくならない
ただし、やり方は180度変わる

これから求められるのは、

  • 手を動かす人
    ではなく
  • AIを指揮するディレクター

このスキルを身につけた人だけが、
圧倒的に生産性を上げられます。


まとめ|これがAI Web制作の“正解ルート”

  • NotebookLMで
    嘘のない設計図を作る
  • Manusで
    プロ品質のサイトを一気に構築
  • 修正も公開も
    ストレスゼロ

これが、
2026年以降のWeb制作スタンダードです。

よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

目次