はじめに
アドベントカレンダー初投稿となる UCN です。
今回はタイトルの通り、俺得なWebクリッパーを自作したものの、既存サービス（Notion）で代替できたため、供養も兼ねてまとめます。
背景
私は普段スマホでXを見ているのですが、そこで見つけた面白そうな記事を
Safariのタブで保管する癖がありました。
これを繰り返しているうちに、気づけばタブ数は300超えに…。
さすがにスマホにも良くないですし、
タブが消えたらすべて失われてしまうので、
「ちゃんと保管できる仕組みが欲しいな」と思うようになりました。
そこで、一時期話題になったObsidian × Notionを使った外部記事を参照しやすい環境を自分でも構築したいと考え、Webクリッパーについて調べ始めました。
PCでのWebクリッパーは、Chrome拡張など選択肢がいくらでもあります。
しかしどれも スマホからの操作がシームレスではない ことに不満を感じ、
「それなら自分で作ろう」と思い、ツール作成に至りました。
スマホWebクリッパーに求める条件
ツールに求めた条件は以下の通りです。
- スマホの共有機能からシームレスに情報収集できること
- すべて無料で完結すること
- 情報を一部、もしくは全文取得できること
作ったもの
これらを踏まえ、スマホ特化のWebクリッパーを自作しました。
アーキテクチャ構成は以下の通りです。
※ 現在は停止しています
iPhoneのショートカットアプリで作成したフローは以下の通りです。
おおまかな役割
-
iPhoneショートカット
- Safariやアプリの共有からURLを取得
-
FastAPI
- URLを受け取り、本文取得後にAIへ送信
-
Gemini 2.5 Flash
- 記事内容の要約生成（無料枠）
-
Notion Database
- タイトル・URL・要約を保存
デモ画像
共有画面（ここでデバッグを開く）
保存完了通知
Notionにクリップされた記事
※後述しますが、ちゃんとハルシネーションを起こしています。
作ってみて分かったこと
ハルシネーションがすごい
同じQiitaの記事でも、きちんと内容を抽出できるものと、そうでないものがありました。
プロンプトもいろいろ試行錯誤しましたが、大きな改善は見られず、かなり悪戦苦闘しました。
スライド共有系の読み取りに弱い
Geminiは基本的にHTMLに埋め込まれたテキスト情報を読み取るそうなので、
SlideShareなどのスライド共有サイトは情報取得がかなり厳しかったです。
後で気づいた既存サービス
Webクリッパーを作成した後で気づいたのですが、
Notionアプリ（iPhone）にはデフォルトでWebクリッパー機能がありました。
AIによる要約機能はないものの、URL保存用途としては十分にシンプルで使いやすいです。
欠点としては、こちらもスライド共有サイトの情報取得には弱い点があります。
解決したかった本質は何だったのか
改めて振り返ると、今回本当に解決したかったことは次の2点でした。
- Safariのタブに溜まっていく文献を、DB（Notionなど）に整理して保存したい
- 後から参照できる形で、内容をまとめたい
当初はこの2つを満たすために、
「URLをAIに投げて、要約まで自動で作ってくれるWebクリッパー」
を作ろうとしていました。
しかし実際に運用してみると、想像以上に問題がありました。
ハルシネーションの頻発
無料枠のAIを使っていたこともあり、ハルシネーションが頻発しました。
この状態では、
外部参照文献として使うには信頼度が低い
という結論に至りました。
運用でカバーする方針に転換
LLMはハルシネーションを起こす一方で、
「AIを使わずにWebクリップするだけ」なら十分に実用的だと気づきました。
そこで、
- 内容の理解や要約は、人間が読む段階で行う
- 必要になったとき、読んでいる途中でAIに投げる
という運用に切り替えることにしました。
そう考えると、
必要な機能は、URLとタイトルを確実に保存することだけ
という結論になりました。
まとめ
- 作る前に、事前調査をする
- 自分が本当に求めている機能を言語化する
- ツールで解決すべきか、運用で解決すべきかを見極める
LLMを過信しすぎるのも良くないですね(当たり前)。