2026年9月30日(水)掲載 4,714件/本日 0件
HN11975

Hacker Newsの記事がすべて動画に!生成AI×HTMLで作る高速・低コストな「Scrimba Explain」を公開

Show HN: HN.watch – Videos of all Hacker News posts

mrborgen・1日前

議論

11件
0:mrborgenスレ主▲1191日前

皆さん、こんにちは!Scrimba(YC S20)のファウンダー、Perです。私たちは過去10年にわたり、HTMLベースの動画形式を活用してプログラミング教育を行ってきました。今回、この技術にLLMを統合し、あらゆるトピックを解説動画に変換できる「Scrimba Explain」をリリースしました。

その技術デモとして、Hacker Newsの各投稿を動画化する「HN.watch」を公開しています。リンクをクリックすると、その場で動画が生成される仕組みです。

動画生成に拡散モデル(Diffusion Models)ではなくHTMLを用いることには、以下のような大きなメリットがあります。

  • スピード:ピクセルベースの動画よりも遥かに高速(クリックから再生まで数秒)
  • コスト:1動画あたり約0.04ドル(画像生成を除く)
  • 編集の容易さ:AIによる編集も安価かつ高速に実行可能

動画生成が「数ドル・数分」から「数セント・数秒」の世界になれば、以下のような新しいユースケースが生まれると考えています。

  • プルリクエスト(PR)の自動動画解説(弊社で実践済み)
  • ドキュメント全ページの動画化
  • Chrome拡張機能で複雑な記事を約4秒で動画変換
  • レッスン動画の下書き作成
  • 子供向けの物語、結婚式の招待状などパーソナルな用途

技術スタックには、弊社のCTO Sindre Aarsætherが開発したオープンソース言語「Imba」を採用しています。JavaScriptにコンパイルされるため、npmやNode.0のエコシステムとも完全に互換性があります(詳細は https://imba.io/ を参照)。

また、自社開発の同期エンジン(OP)と、エージェント用のコンテキスト管理システム(Q)を組み合わせています。LLMの学習データにImbaが含まれていないため懸念もありましたが、実際には非常に高いパフォーマンスを発揮しました。スタックが非常に高密度で、宣言一つでストレージ、同期、権限、UI、AIが参照すべき情報を一元管理できるため、モデルが混乱する余地がないのが理由だと考えています。

正直に言えば、React.jsやExpress、Supabase、LangChainを使わず、すべてゼロから自作しました。「Not Invented Here(自前主義)症候群」の極みですね(笑)。モデルにはGemini、GPT、Inworld、ElevenLabsなどを活用しています。

ぜひ以下のツールから試してみてください。

  • Web UI: scrimba.com/explain
  • MCP: お使いのコーディングエージェントに追加
  • ChatGPTプラグイン
  • Chrome拡張機能

詳細はドキュメント( https://docs.scrimba.com/explain/introduction )をご覧ください。また、ツールの実演動画も公開しています( https://www.youtube.com/watch?v=k6rbHmBxSEs )。

皆さんのフィードバックや、新しいアイデアがあればぜひ教えてください!

追伸:テキスト愛好家の皆さんが多いHNでこのツールを紹介するのは勇気がいりますが、若年層を中心にテキストよりも動画を好む層は確実に増えています。

1:harvey91日前

頼むから、誰も hn.watch 内のこのHNアイテムのリンクをクリックしないでくれ。Googleで「google」って検索するよりも遥かに危険だから。

2:scosman1日前

こういうAI解説ツールがどんどん増えてるね。5月に自分でもやってみたんだけど、モデルは悪くないもののあと一歩という感じで、かなり手間がかかったよ。Opus 5.5あたりが転換点になったのかな。

単発じゃなくて本格的にやりたい人向けにOSSフレームワークを作ったから貼っておくね:https://github.com/scosman/videowright

  • 音声合成:アニメーションと音声を同期できる。ElevenLabsでの生成や、既存音声の書き起こしとタイムスタンプにも対応。

  • シーンの並び替え:コードからも、ffmpegを使った音声編集からも可能。

  • インタラクティブな制御:制作中に細かい修正や再生成を指示できる。

  • MP4エクスポート:エンコーダーも搭載。

  • 動画生成:プロンプトから動画を作成できる(当然だけどね)。

3:dverlaeckt801日前

エンジニアの視点から見るとかなりすごいよね。ただ、AI特有の単調な音声のせいで、すぐに飽きて退屈になってしまう気がする。もし動的な変化をうまく取り入れられたら、最高に素晴らしいものになると思う。

4:fishtoaster1日前

人は矛盾する感情を抱えられるものだから、自分の中の二つの気持ちを同時に認めようと思う。

  1. AI生成の動画よりもテキストの方が圧倒的に好きなので、この仕組み自体は嫌い。
  2. 動画を好む人にとっては価値あるものだろう。

技術的にはクールなプロジェクトだし、動画1本あたりのコストが驚くほど低いのもすごい。成功を祈るよ!

5:vbernat1日前

人に好みのメディアを選ばせるというのは良いアイデアだと思う。自分も動画派ではないんだけど、最新のブログ記事をClaudeを使って動画化してみたんだ。「簡単だろう」と思ってね。記事内のインタラクティブな図を表示したブラウザをスクリーンキャストし、タイトルを追加するように指示したら、一種の録画アプリを作ってくれたよ。結局何時間もかかったけど、次はもっと早くできるはず。手早くやってくれるならお金を払ってもいいけど、要約じゃなくてテキストの主導権は自分で持っておきたいんだ。

記事はこちら:https://vincent.bernat.ch/en/blog/2026-spanning-tree-video

Claudeが作った動画作成ツール:https://github.com/vincentbernat/vincent.bernat.ch/tree/28085c0eab7b846cb2685b288edb939267ac9f19/scratch

6:adrianwaj1日前

素晴らしい。Wordpressプラグインならうまくいくはず。パブリッシャーに記事のトップに動画を埋め込ませて、微調整や修正ができるようにするんだ。マイクロペイメントを導入してオンデマンド生成すれば、読者がより質の高い動画や「深掘りコンテンツ」にお金を払うこともできる。

これなら若い読者や読み書きが苦手な人、感覚障害のある人、外国語話者にも役立つはず。全部カバーできるね!

7:mrborgen1日前

ちなみに、ノルウェーのオスロで新しい開発者を募集してるよ。給与はいいし、在宅やオフィス勤務の自由度も高い(ハイブリッド)。HTMLベースの動画生成を、1秒の遅延で1分あたり1セントまで落とし込めるなら、per@scrimba.com までメールして。

8:wewewedxfgdf約24時間前

解説ページを作るのに新しいプログラミング言語が必要な理由がよく分からないな(実際には動画じゃないし)。

オーバーエンジニアリングじゃない?普通にJavaScriptかHTMLでやればいいのでは。

9:indigodaddy約23時間前

これはめちゃくちゃクールだね。

関係者じゃないけど、trymyrepo.com もすごくイケてる。似たような領域みたいだね。

あと、Museエージェントで動画を作れるスキルを作成したんだけど、かなりうまく動いたよ。この界隈は本当に熱くなってる。

最後に、この領域が好きな人はこれも楽しめるかも:(自分のプロジェクト)

https://github.com/jgbrwn/mst3k-anything

10:totallygeeky約22時間前

「ローマ帝国の衰退の原因は何か?」というデモをクリックしてみたけど、この種のシステムに共通する不完全さがすぐに見えたよ。ポイントを視覚化しようとしても、結局どれも支離滅裂になる。グラフィックやチャートは理解を助けるどころか混乱させるし、語られている内容と矛盾することすらある。

結局のところ、こうしたシステムは何も理解しておらず空間的な推論もできないから、乗り越えられない壁があるんだと思う。視覚的な説明を謳うこれらのシステムは学習者にとって大きな足かせになるだけで、誰にも勧められないな。