0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

15年前に Excel + IE で作っていた YouTube サムネ一覧が、Sheets を使わない GAS Webアプリで帰ってきた話

0
Last updated at Posted at 2026-05-31

はじめに

前回(記事5)の末尾で、こう書いて締めました。

俺は Excel VBA が好きなんじゃない。Lotus 1-2-3 も大好きだったし、ずっと表計算が好きなんだ。だから Google のスプレッドシートも結構好きだ。次は Google スプレッドシート関係の話もしていきたい。

この一節、今回ちょっと訂正させてください。

正確に言うと、私がやっているのは「Google スプレッドシートを使う側」の話じゃなくて、むしろ「Sheets を使わない側」の話でした。書きながら自分でも気づいていなかったのですが、最近薄々そう思うようになってきて、ちょっと前に「あ、これそういうことか」と腑に落ちました。

連載第2部の入口として、今回はその話を書きます。題材は、私が今年2月中旬の「Gemini 3 アプリ大会」(締め切りぎりぎり)に応募した GAS Webアプリ「Q-クイック」です。YouTube の登録チャンネルを巡回して最新情報を取得するためのツールです。

※ ChromeでGoogleアカウントにログインしていれば、こちらからもお試しできます。Q-クイック のリンク  右クリックで動画を視聴できます。

ただし、Q-クイック は急に出てきたものではありませんでした。15年程前から Excel + IE のコピペで作っていた YouTube「サムネ一覧」が、IE 滅亡、Python 挫折、スプレッドシート版での妥協、Excel 版での速度比較、Gemini Antigravity での再構築、Claude Code での磨き込みを経て、ようやく「やりたかった形」に戻ってきた、という15年アークの話になります。

少し長くなります。

※ この記事の解説動画も作りました


TL;DR

  • 15年程前、Excel + IE のコピペで作っていた YouTube「サムネ一覧」。これが GAS Webアプリ「Q-クイック」の原型です。
  • スプレッドシート版はクラウドの遅延で重かった。**Sheets を使わず GAS 単独(JavaScript だけ)**でデータを持たせたら、検索が爆速になりました。
  • サムネ付き一覧が15年越しで復活。シートを捨てて、シート的な構造を表計算ソフトの外で動かす——AI と組めば、事務員でもこれが1日でできます。

1. 15年程前から、Excel + IE で YouTube「サムネ一覧」を作っていた

15年程前、私は Excel と Internet Explorer の組み合わせで、YouTube のチャンネル一覧を Excel に貼り付けて管理するマクロを作っていました。「サムネ一覧」と呼んでいました。サムネイル付きで一覧表示するのが肝でした。

仕組みは至ってシンプルで、コピペです。API ではありません。

当時の IE には、Web ページから画像を含むHTMLをコピーすると、画像本体(JPEG)まで一緒にクリップボードに運んでくれる、という挙動がありました。クリップボードに「HTML Format」だけでなく「画像オブジェクト」も同時に乗せていた、ということです。それを Excel に貼り付けると、画像がオブジェクトとしてセルに埋め込まれました。タイトルや視聴回数といったテキストデータは、HTML 由来のテキストとして別のセルに入りました。

今の Chrome ではこの挙動は再現できません。正確に言うと、コピペしても 何かしらは貼り付く のですが、見えなかったり、やたら巨大だったりで、とても整形して一覧に使える状態にはならないんです。当時の IE は、クリップボードにサムネ画像の本体(JPEG)を、Excel が素直に飲み込める形で乗せてくれていました。今の YouTube のサムネは WebP 形式ですし、Chrome のクリップボードの渡し方も当時とは違う。IE と Excel と、サムネを JPEG でシートに貼り付けできることの、3つが揃って初めて成立していた力技でした。

具体的な操作手順はこうです。ブラウザで YouTube のチャンネルページを開きます。動画タイトルが並んでいる領域を手作業ですべて表示して Ctrl+A で選択して、Ctrl+C。Excel に切り替えて、先頭セルで Ctrl+V。すると、サムネ画像とタイトルがバラバラに貼り付きます。うまく一列に並ぶので、画像がセルの境界に収まるよう、あらかじめセルの高さを調整しておいて、次の VBA 整形がやりやすい形で取り込みます。

そこから先が VBA の仕事でした。Worksheet.Pictures から画像オブジェクトを順番に拾って、Picture.TopLeftCell でアンカーセルを設定し直し、サムネが綺麗に並ぶよう一行ずつ整列させる。テキストは正規表現で動画タイトルと再生回数を分離する。最終的に「チャンネル名・サムネ・タイトル・再生回数」が一行に並ぶ表になる、というのが整形マクロの仕事でした。

整形マクロは結構大変でした。チャンネルごとにレイアウトが微妙に違うので、例外処理が積み重なっていきました。処理時間もそれなりにかかりました。それでも、当時の自分にとっては「サムネ付きでチャンネル巡回できる、自分専用の道具」が手元にあるという満足感は大きかったです。

これが Q-クイック の原型です。


2. IE が死んで、Python は難しくてできなかった

IE がサポート終了になりました(2022年6月)。同じやり方は物理的にできなくなりました。

ここで Python に行こうとしたのは覚えています。スクレイピングを書いてみたかった。requests でページを取って、BeautifulSoup で動画情報を引っこ抜いて、画像はURLから個別にダウンロードして、というのが定石です。やってみました。実はちょっと難しくてできませんでした。「YouTube の規約に引っかかるからやらなかった」と恰好よく書いてもいいのですが、本当のところは私の手に余って書けなかった、というのが正直なところです。Python は今もそんなに上達していません。

代わりに、Google スプレッドシート + GAS で似たようなものを作りました。スプレッドシートには YouTube サービスが標準で繋がるので、データ取得自体は楽勝です。動画タイトル、再生回数、投稿日時、サムネURLは取れます。

ただ、サムネ画像を Excel のときみたいに並べて表示することはできませんでした。Sheets のセルに画像を埋め込むには =IMAGE(url) 関数があるのですが、当時の使い勝手だと表示が遅かったり描画が崩れたりで、安定しませんでした。仕方なく、シート上に動画リンクのURLだけ並べて、マウスを乗せるとサムネがプレビュー表示されるSheets の hover 機能で凌いでいました。当時の私はそれで「まあいいか」と思っていました。サムネ付き一覧という15年程前の原型は、ここでいったん諦めた形になっています。


3. Excel vs スプレッドシート、速度を比較してみた

しばらくスプレッドシート版を使っていたのですが、AI(Gemini)を使い始めた頃に、AI に手伝ってもらって、同じツールを Excel でも作ってみました。実は、Excel から YouTube Data API を叩く構成には、以前から興味はあったのですが、API キーの取得や認証の手順を調べるのが面倒で、ずっと手を出していませんでした。それが、AI に聞いたら、やさしく教えてくれる。AI を使い始めてから、こういう「これまで諦めていた領域」が、どんどんできるようになってきた、という体感があります。

そうやって出来上がったのが、「ユーチューブ最新情報.xlsm」というファイルです。狙いは速度比較でした。クラウド側(スプレッドシート + GAS)とローカル側(Excel + VBA + YouTube Data API)、どちらが本当に速いのかを、はっきりさせたかった、ということです。この検証は、自分の YouTube チャンネル「しゅう」でも動画にしています:

材料には人気チャンネルを使いました。動画1300本超えのチャンネルを相手に、両者で同じ「全動画リストアップ」をやらせて、時計を測ります。

結果はこうでした:

スプレッドシート版 Excel 版
1300本のリスト取得 約30秒 10秒未満
データのクリア 3秒 ほぼ即時
検索(フィルター) もっさり重い 標準フィルターで一瞬

Excel の圧勝でした。

原因はシンプルで、クラウドの遅延です。スプレッドシート + GAS の構成だと、データを取りに行くたび、検索を1回打つたび、PC とサーバーを何度も往復します。クライアント(ブラウザ)→ GAS → Sheets API → スプレッドシート → ブラウザ、というラウンドトリップを毎回挟む。通信の待ち時間そのものが、本体の処理よりも長くなる。これが、データが重くなるほど効いてきます。

Excel に同じツールを置いてみたら、これが全部消えました。シート上に並んだデータを Find するだけ、あるいは VBA で配列を舐めるだけ。サーバーは挟まらない、メモリ上で完結する。

ここで一つ、はっきり体感したことがあります。クラウドが便利なのは間違いない。ただ、データが重くなる作業では、クラウドの遅延そのものが足かせになる。私の場合、YouTube チャンネル巡回というのは、一覧の取得と検索を何度も繰り返す作業です。検索が「もっさり」だと、ツールとして手が止まります。

このときはまだ、「だったらクラウドそのものを抜けばいい」という発想までは行きませんでした。「Excel のほうが速い」という体感を掴んだ、というだけです。でも、この体感が、後で効きます


4. Q-クイック を作った(Gemini で)

第3章の比較で「Excel のほうが速い」とわかりました。ただ、Excel ファイルは配布しづらいし、スマホでは開けません。他人が気軽に使える形にしたいとなると、結局 Webアプリにしないと届かない、という話です。

ちょうどそのタイミングで、ユーチューバーのこーすけ先生が「Gemini 3 アプリ大会」を開催されていました。応募条件は、ざっくり言うと2つでした:

  1. Gemini 3 を使うこと
  2. 誰もが使える Webアプリ であること

応募してみることにしました。Gemini 3 を使うのは決まりなので、当時使い始めていた Antigravity(Gemini を組み込んだ IDE)で書くことになります。

問題は ② の「Webアプリ」のほうでした。Excel や スプレッドシートでやってきたことを、どう Webアプリ化するか。最初はスプレッドシートで Webアプリ化を試しました。スプレッドシートでも GAS Webアプリは作れますから。でも、第3章で見たクラウド遅延がそのままついてきて、結局これも遅い。

ここで AI に相談しました。返ってきた答えは、GAS 単独(JavaScript だけ)で作る、というものでした。スプレッドシートを介さず、Webアプリの土台だけ GAS に置いて、データはアプリ側に持つ。

最初に試したのは、本命の G-クイック(Google Drive のファイル一覧を、フォルダ関係なくサブフォルダ含めて全部取って更新日順に並べるアプリ。次回の記事で書きます)のほうでした。G-クイックでシート抜きの構成を組んでみたら、検索が爆速になりました。これは効くな、と気付きました。

その方針を、今回の話 — Q-クイック にも適用してみることにしました。Q-クイックのほうは、Webアプリ化が割と簡単に進みました。ユーチューブ最新情報.xlsm という Excel の下地もありますし、扱う構造も単純(チャンネルごとに動画一覧を束ねるだけ)です。

大会の結果は、結果発表動画で発表されました。私の Q-クイック への直接の言及は、特にありませんでした。それはそれで、応募した側として完結しています。


5. Claude Pro で作業場を移して、15年越しでサムネ付き一覧が帰ってきた

応募してしばらく経った頃、私は Claude Pro を契約しました。評判がいいという話を聞いていたので、試してみたかったのです。それまでの作業場が Antigravity + Gemini だったので、別に Gemini が悪かったから乗り換えたわけではありません。契約のタイミングと、評判で、作業場が変わっただけです。

実は前々回(番外編)で書いたように、私は Claude に「秀.xlsm」の配布版を直してもらえず、Antigravity の Gemini に救ってもらった、という経験があります。あの記事で「Claude完敗」と書いてますが、どうやらGemini がバージョンアップしたというのが真相かと思っています。Gemini も Claude も、どっちも使う、というのが今の私の運用です。

Q-クイック NEXT の改良を Claude Pro で続けました。サーバー側を git diff 的に見ると、応募版(Gemini 版)から改良版(Claude 版)への差分は、こんな感じです:

Gemini 応募版 Claude 改良版
サーバー側関数数 8 9
GQuick_Server.js サイズ 15,393 bytes 19,363 bytes (+26%)
GQuick_UI.html サイズ 104,812 bytes 130,357 bytes (+24%)

Claude に磨いてもらった主なポイントは、こんな感じです:

  • @handle 対応:2024年以降 YouTube が推している @handle 形式を解決するため resolveChannelHandles 関数を新規追加
  • サーバー側の並列化UrlFetchApp.fetchAll() で複数チャンネルを並列で取りに行くように
  • クライアント側のキーボード操作:↑↓ Enter Space Home End / Escape で全部操作できるように
  • 堅牢化:フォールバック処理(UC→UU で失敗したときの再試行)、エラーハンドリングの厳格化、キャッシュ周辺の堅牢化

応募版(Gemini 版)の中核は、データを UserProperties で持つことと、UC→UU の変換で API を1回省略することGemini で立てた骨格はそのまま残して、Claude がその周りを磨き込んだ、という分担です。骨格が良ければ細部の磨き込みで完成度が上がる。骨格に問題があれば、いくら磨いてもどうにもなりません。Gemini で骨格が立っていた、というのが大きかったです。

コードは GitHub の Qquick-NEXT リポジトリ を見てください。

PC で使うときは、マウスを使わず ↑↓ Enter Space Home End / Escape で全部操作できます。これは秀.xlsm の「メニューから呼ぶ」「キーボード駆動」の系譜です。Lotus 1-2-3 のメニュー構造をマクロで自動化していた1988年から、私はずっと キーボードだけで完結する道具 を作りたかったみたいです。

そして、ここで15年程前から取り戻したかったものにようやく辿り着きました。

サムネ付き一覧、です。

Q-クイック を作っているとき、私は「サムネを取得して画面に表示することって、簡単にできるんですか」と AI に聞きました。「できますよ」と即答されて、驚きました。

15年程前は IE × Excel のコピペじゃないとできないことだと思い込んでいました。スプレッドシート時代も、Excel 版を作った後も、**「サムネ表示は Excel じゃないと無理だ」**と勝手に思っていました。ところが、AI が返してきた説明はこうでした。

YouTube API のレスポンスに thumbnails.medium.url というフィールドがあります。これを <img> タグの src に入れるだけです。

const thumbnail = item.snippet.thumbnails.medium.url;
// later:
`<img src="${thumbnail}">`

これだけです。15年間「壁だ」と思っていたものは、壁じゃなかったわけです。

実際にやってみたら、本当にすぐできました。サムネ付き、検索瞬時、しかもスマホからもアクセスできる。15年程前の Excel + IE 版でやりたかったことが、当時はできなかった機能まで合わせて、戻ってきました

VIP機能(先頭チャンネルを優先表示)、ダーク/ライトモード切り替え、@handle 対応、視聴回数バッジ、相対時間表示(「NEW・6時間前」のようなやつ)。これらは当時の Excel 版にはなかったものです。


6. シート的構造を、表計算ソフトの外で動かす流派

ここまで書いてきて、自分でも整理がついてきました。

私がやってきたことは、Excel と Google スプレッドシートのどっちが優れているかの話ではありません。シート的なデータ構造を、表計算ソフトの外で動かすという、流派の話です。

データの持ち方 表計算の役割
秀.xlsm(Excel編) Sheets を使わず、VBA だけで完結 Sheets は「作業の場」
Q-クイック Sheets を使わず、UserProperties で持つ Sheets は「使わない」

連載第1部で書いた 秀.xlsm の「Sheets を作業の場として使う」設計と、今回の Q-クイック の「Sheets を使わずに UserProperties で持つ」設計は、同じ思想の Excel 側と Google 側の実装になっていました。私は40年近く、ずっと同じことをやっていたのです。

今、職場では Gmail を対象にした同じ構造の Webアプリも作っています。M-クイックという名前で、Gemini Flash 3.5 と一緒に書いています。Drive、YouTube、Gmail と、対象は変わっても、設計の骨格は同じです。シート的なデータ構造を、表計算ソフトの外、JavaScript 側で動かす。

15年程前の下地があるから今の形が見える

Q-クイック みたいなアプリは、誰か他の人が作ればいいのに、とずっと思っていました。「サムネ付き一覧の Webアプリなんて、誰でも作れるはずだ」と。でも最近気づいてきたのは、私が15年程前から「サムネ一覧」を作り続けてきた下地があるから今の形が見えるということです。

下地のない人には作るのは難しい。15年程前の IE × Excel のコピペ整形がなければ、「サムネ付き一覧」というゴールイメージが固まっていません。スプレッドシート版の hover 凌ぎがなければ、「妥協ではダメだ」という感覚も持てません。5ヶ月前の Excel 版との速度比較がなければ、「クラウドの遅延こそが本体だ」という体感もありません。

そして Google 系は発表する文化がないので、下地がある人がいても作品が世に出てこない。発表する文化(Excel VBA文化)で育った自分が、発表する文化のない領域に作品を出している。それをやっているだけのことかもしれません。

私は Excel と Google の両方を使う側です。二刀流で作っているからこそ、片方だけ触っている人には書きにくいコードになっているのかもしれない、というのは、私の勝手な解釈です。でも、最近薄々そう思うようになってきた、というのは事実です。

私は事務員です

私は事務員です。15年程前は、サムネ一覧を作るのに 何年もかけて 改良し続けました。コピペで貼り付けて、VBA で画像を整列させて、エラー処理を足して、また壊れて直して、を繰り返していました。

今は、AI と一緒なら 同じものが1日でできます。Q-クイック も、基本は1日で形になりました。5ヶ月前の Excel 版「ユーチューブ最新情報.xlsm」も、AI のおかげですぐにできました。Gemini が骨格を出して、Claude が細部を磨いて、私が判断する、という分担です。

シート、いらないんです

普通の事務員は、シートを使います。シートの範疇から抜け出せません。でも、シートを捨てて、シート的な構造を JavaScript で動かせば、爆速のアプリが事務員でも作れます。爆速で作れれば、仕事に役立ちます。

このやり方が、まだほとんど知られていません。「Webアプリはプログラマーが作る分野」だと思われています。でも違います。AI ができたから、事務員でも JavaScript だけでソフトが作れるようになったんです。

15年程前は 何年もかけて やっていたことが、今は 1日でできる。これは事務員にとっての革命です。

このことに気づいてほしい。それが、Q-クイック NEXT を公開して、この記事を書いた一番の理由です。


おわりに

Q-クイック NEXT のコードは、GitHub に公開 しました(MIT ライセンス)。

手っ取り早く使いたい人は、Drive の共有リンク を開いて、ドライブで**右クリック →「コピーを作成」**すれば、自分のドライブに丸ごと複製できます(コードのコピペは不要)。できたコピーを自分のアカウントでデプロイするだけ。サムネ付きで、検索瞬時で、スマホからも開けます。

15年程前の Excel + IE のコピペ整形マクロから、5ヶ月前の Excel 版との速度比較を経て、Q-クイック NEXT の現行版まで、結局やりたかったのは「シート的な構造を、自分の道具に組み込んで、サムネ付きで動かす」ことでした。

道具は時代によって変わりますが、芯はずっと同じだったようです。Lotus 1-2-3 のときも、Excel + IE のときも、秀.xlsm のときも、Q-クイック のときも、シートの形を借りた何かを、自分の手元に置いておきたかっただけだった、ということが、Claude Code と話しているうちに見えてきました。

次回からは G-クイック(Drive)の話になっていく予定です。クイック系の家族紹介、ということになります。


0
0
0

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
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?