1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

NotebookLMのソース追加、まだ手動でやってるの? ── 1クリックで完了するChrome拡張を作った

1
Last updated at Posted at 2026-01-06

TL;DR

NotebookLMに「今見てるページ」をワンクリックで追加できるChrome拡張を作りました。
リサーチ中にタブを切り替えてURLをコピペする作業が消えて、知識のインプット速度が体感2倍になりました。

NotebookLMユーザーあるある、ありませんか?

NotebookLMを日常的に使っていると、こんな場面に遭遇しませんか?
技術ブログを読んでいて「あ、これNotebookLMに入れたい」と思う。NotebookLMのタブに切り替える。「ソースを追加」をクリック。「ウェブサイト」を選ぶ。元のタブに戻ってURLをコピー。またNotebookLMに戻って貼り付け。追加ボタンを押す。

1記事追加するのに、タブを4回切り替えている。
これが1日10記事、20記事となると、地味にストレスが溜まります。しかもリサーチに集中したいのに、この「作業」で思考が途切れる。
「いや、そのくらい我慢しろよ」という声も聞こえてきそうですが、個人開発者として「自分が毎日感じる小さな不便」を放置できなかったんです。

Before / After

Before(従来のフロー)

記事を読む → NotebookLMに切り替え → 「ソースを追加」
→ 「ウェブサイト」選択 → 元のタブでURLコピー
→ NotebookLMに戻って貼り付け → 追加
所要時間:約15〜20秒 / 1ソース
心理的コスト:思考の中断、タブ切り替えのストレス

After(拡張機能導入後)

記事を読む → サイドパネルで「Add Current Page」をクリック
所要時間:約2秒 / 1ソース
心理的コスト:ほぼゼロ(読みながら追加できる)
体感で 7〜10倍の高速化 です。でも本質的な価値は時間短縮じゃなくて、「読む」と「追加する」が同時にできること。リサーチの流れが止まらなくなりました。

使い方

  1. インストール
    Chrome Web Storeからインストールするだけ。特別な設定は不要です。
  2. サイドパネルを開く
    拡張機能アイコンをクリックすると、サイドパネルにNotebookLMが開きます。追加したいノートブックを選んでおきます。
  3. ページを追加
    追加したい記事やYouTube動画を開いた状態で「Add Current Page」をクリック。これだけ。
    その他の機能
    機能用途Manual URL別タブのURLを手入力で追加Text Pasteコピーしたテキストをソースとして追加History最近追加したソースを確認

こんなユースケースで刺さります

ユースケース1:技術ブログを読み漁る日

新しいフレームワークを調査するとき、Zenn・Qiita・公式ドキュメント・GitHubのREADMEを横断的に読みますよね。
従来は「後でまとめて追加しよう」と思ってブックマークしておいて、結局やらない。あるいは追加作業で30分溶かす。
この拡張機能があれば、読みながらポチポチ追加していくだけ。読み終わった頃には、NotebookLMに情報が整理されていて、すぐに「比較して」「要約して」と質問できる状態になっています。

ユースケース2:YouTubeのカンファレンス動画を知識化

Google I/OやAWS re:Inventの動画、積んでませんか?
YouTube動画もワンクリックで追加できます。NotebookLMはYouTubeの文字起こしを自動で取得してくれるので、動画を見なくても中身を把握できるようになります。
私はこれで「気になるけど見る時間がない動画」を、片っ端からNotebookLMに放り込んでいます。後から「この動画で○○について話してた?」と聞けるのが最高。

ユースケース3:「あとで読む」を「あとでAIに聞ける」に変える

Pocketやブックマークに溜まっていく「あとで読む」記事、正直に言って読まないですよね。
発想を変えて、「あとで読む」じゃなくて「あとでAIに聞ける」状態にしておく。記事を見つけた瞬間にNotebookLMに追加しておけば、必要になったときに「あの記事に書いてあった○○の詳細教えて」と聞ける。
読まなくても知識にアクセスできる。これがNotebookLMの真価だと思っていて、その入り口の摩擦を徹底的に減らしたかったんです。

技術的な話(個人開発者向け)

アーキテクチャ

Chrome Extension Manifest V3で開発。サイドパネル(Side Panel API)を使っています。
popup.html / popup.js ← メインUI
background.js ← URLの取得、タブ管理
content.js ← ページ情報の抽出

工夫したポイント

  1. サイドパネルの採用
    当初はポップアップで作っていましたが、「NotebookLMを開きながら操作したい」というニーズに応えるため、サイドパネルに変更。これでメインコンテンツを見ながら追加できるようになりました。
  2. YouTube対応
    YouTube動画のURLを検出したら、自動的に動画IDを抽出してNotebookLMのYouTubeソース追加機能に連携。ユーザーは何も意識せず、Webページと同じ操作で追加できます。
  3. 履歴機能
    「さっき追加したやつ、ちゃんと入ってたっけ?」という不安を解消するため、追加したソースの履歴を保持。chrome.storage.localを使って、タブを閉じても消えないようにしています。

苦労した点

NotebookLMのUIに依存する問題
NotebookLM側のボタンやフォームのセレクタが変わると動かなくなる可能性があります。現状はDOM操作で自動化していますが、今後NotebookLMがAPI提供してくれることを願っています(Googleさんお願いします)。

まとめ

NotebookLMは素晴らしいツールですが、ソース追加のUXには改善の余地がありました。この拡張機能は、その「小さな摩擦」を取り除くために作りました。
私自身、これを使い始めてから知識のインプット速度が明らかに上がったと感じています。特に「読みながら追加する」という体験は、一度味わうと戻れません。
NotebookLMを日常的に使っている方、ぜひ試してみてください。フィードバックや機能リクエストがあれば、X(Twitter)までお気軽にどうぞ。

1
1
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?