3 ポイント 投稿者 GN⁺ 4 시간 전 | 1件のコメント | WhatsAppで共有
  • 文書・エディタ・ビューア・プレゼンテーションツールを1つの .bento.html ファイルに収め、ブラウザさえあれば開いて編集し、発表できる PowerPoint の代替
  • 570KB の単一ファイルが完全なアプリケーションとして動作し、アカウント・クラウド・インストーラなしで保存し、メールや AirDrop で渡せる
  • スライドデータはファイル内部の可読な JSON として保存されるため、Claude Code/Codex/Gemini/ChatGPT のような AI エージェントがファイルを直接修正できる
  • 既存の .pptx も AI に一緒に渡せば、単純変換ではなく Morph やリアルタイムチャートのような Bento 機能を活用したスライドとして書き直しできる
  • Morph トランジション・チャート・動画・音声・リアルタイム暗号化コラボレーションをサポートし、Slides に続いて DocsSheets も同じ単一ファイル方式で提供する予定

1つのファイルが文書でありアプリ

  • .bento.html の中にスライドと編集プログラム全体が一緒に入っている
  • ブラウザでファイルを開くと即座にエディタが起動し、保存すると文書データがファイル自体に再書き込みされる
  • フォント・画像・チャートも一緒に含まれ、ファイルのコピーだけで独立して開いて発表できる
  • Offline モードでは更新と協業を遮断し、すべての作業をローカルで処理する
  • Bento/Slides からブラウザで直接実行するか、単一アプリケーションファイルをダウンロードできる

AI エージェントのための文書形式

  • 文書データはファイル上部の <script type="application/bento+json" id="bento-doc"> ブロックにプレーンテキストの JSONとして保存される
  • window.bento.doc で現在の文書を読み取り、window.bento.loadDoc(json) で修正済みの文書を読み込める
  • AI エージェントはアプリケーションコードに触れず、JSON だけを修正してスライド・チャート・発表者ノートなどを追加できる
  • Claude Code/Cursor/Aider のようなコーディングエージェントだけでなく、ファイル添付をサポートする一般的なチャットボットでも使える
  • ファイルをサポートしないチャットボットでは、JSON をコピーして修正した後に再度貼り付ければよい
  • Ollama/llama.cpp/LM Studio を使えば、AI 編集も完全にローカルで実行できる
  • agents.md を提供し、AI エージェントが Bento を正しく活用できるよう案内している

PowerPoint より Web に近いプレゼン機能

  • 同じ id を持つ要素をスライド間で自然に動かす Morph トランジションをサポートする
    • 既存スライドを複製して要素を移動したりスタイルを変えたりすれば、別途タイムラインを作らなくてもトランジションを構成できる
  • 独自の依存関係不要なチャートエンジンで棒・線・円・散布図を描画する
    • 棒・線・円・散布図チャートは発表中でもツールチップ・ズーム・データ切り替えが可能な状態で動作する
  • 動画と音声をスライド内に含めることも、外部ファイルとしてリンクすることもできる
  • 既存の PowerPoint ファイルはそのまま取り込む方式ではなく、AI が Bento 文書として再構成する
  • 発表者画面・コメント・レイアウト・PDF 書き出し・複数ページサイズ・8つの UI 言語もサポートする
  • 編集はデスクトップ中心だが、スマートフォンでも閲覧と発表が可能

ローカル優先のコラボレーション

  • ファイルでライブセッションを開始すると、同じファイルのコピーを開いたユーザーがコラボレーション空間に参加する
  • コラボレーションデータは AES-GCM でエンドツーエンド暗号化され、中継サーバは暗号文のみを処理する
  • 独自の CRDT がリアルタイム編集とオフライン変更のマージを担当する
  • ファイル自体にコラボレーションキーが入っているため、ファイルを渡すことが招待方式として機能する
  • オフラインで分岐した編集内容も、再接続すれば双方向でマージされる

Bento/Suite のロードマップとライセンス

  • 現在配布中の Bento/Slides は Bento/Suite の最初のアプリケーション
  • Bento/DocsBento/Sheets も、それぞれ独立した自己完結型の .bento.html ファイルとして提供する予定
  • Bento 自体のソフトウェアは MIT License で公開されている

1件のコメント

 
GN⁺ 4 시간 전
Hacker Newsのコメント
  • Bentoの作者です。ファイル上部にはスライドデータである通常のJSONブロックがあり、読んだり grep したり自動化ツールで処理したりできます。アプリは小さなローダー経由で読み込まれる base64 blob で、ブラウザの DecompressionStream で展開することでパッケージを小さく保ち、実行時に外部ファイルを取得しません
    File System Access API で同じファイルにJSONを書き戻し、未対応なら通常のダウンロードに置き換え、すべての更新は ECDSA で署名しています。reveal.js をベースに GSAP/Flip と echarts を追加したものの、サイズと動作の問題からアニメーション機能とチャート機能はすべて自前で再実装しました
    特にCRDTコラボレーションが滑らかに動作しているのが満足です。Cloudflare Durable Objects 上で動く小さなブラインドリレーは、クライアントの暗号化されたデータしか見ず、招待ファイルを共有してセッションを開始するまではコラボレーションは無効です。ユーザーキーでアクセス権を管理することで読み取り専用ユーザーを設定でき、ユーザーごとのリアルタイム共同編集権限も取り消せます

    • このプロジェクトのために1週間前に新しい GitHub アカウントを作ったようですが、保守やセキュリティの履歴を確認できる別の GitHub アカウントもあるのか気になります
    • 単一ファイルだけを扱うのに CRDT がどこで動き、サーバーがどこにあるのか気になりました。TiddlyWiki は好きでしたが定着しなかった一方で、簡単に編集できるプレゼンテーションは分かりやすいユースケースです
      コラボレーション機能がすべてのユーザーにデフォルト提供されるなら、Cloudflare アカウントにトラフィックが集中するリスクはないのかも気になります
    • Reveal.js の魔法のような機能は、例のように上下に移動する縦スライドです。1つのスライドデッキの中で、聴衆に応じて下へ降りて技術的な内容を見せたり、飛ばしたりできます
      PowerPoint に似せる中でこの機能を外したようですが、Reveal.js で一番好きな機能なので忘れないでほしいです
    • Bento が v2 にアップグレードされたとき、v1 のスライドデッキはどうなるのか気になります。アップグレードを押したら、既存のJSONスライドデータを v2 シェルにエクスポートできるべきです
    • 悪魔的な Office 形式をサポートする道は地獄に通じているので、PowerPoint よりスライドショーと呼びたいです。こうした単純な形式が標準になり、古い形式は消えてほしいです
  • プレゼンテーションではなく小さな React アプリの作成に焦点を当てた、似たようなツールを作りました。サンプルアプリ入りの基本HTMLはこちら、ドキュメントはこちらにあり、まだ磨き込みは十分ではありませんが、実用には足ります
    JSX変換器とコードエディタを内蔵し、ファイルまたは localStorage 保存をサポートしており、ファイル保存・変換・編集を担当するシェルから JSX と JSON データを分離してエクスポートすることもできます
    ミニアプリを保存する iOSアプリ も作りました。localStorage だけに依存せず、データとコード変更を長期保存するので、保存・再読み込みの流れがスムーズです。サンドボックスが保存されたアプリのネットワーク呼び出しをブロックしますが、アプリごとに許可でき、今後はネイティブエディタのような便利機能も追加したいです

  • こういう形はもっと一般的になりそうです。多くのソフトウェアを HTML・TypeScript・React などで完全にローカル提供し、状態もローカルに置けますが、これまでは経済的な動機が不足していました
    個人的には Kimi K3 を使って、線形代数から量子物理まで扱うモバイル向けゲームを作っています。ニューロダイバーシティのあるユーザーに配慮し、状態はすべてローカルに保存し、GitHub Pages で配信してその分野に興味を持ってもらうのが目標です。多様な専門性と時間が必要なため、LLM がなければ採算の合わなかったプロジェクトであり、自分で遊んで改善してバグを取り除いた後に HN で公開する予定です

    • 編集制御機能とコンテンツが1つの HTML ファイルに入るハイブリッド文書について同僚と話しました。Feather Wiki のような wiki が先例で、SVG やスプレッドシートで実装するとどんな形になるのか気になります
  • リアルタイムゲストブック を楽しく使っていましたが、最終的に M1 Mac が固まって強制再起動する羽目になりました。HN 全体が同時編集する状況でなければ大半はうまく動くでしょうが、Figma が WASM とカスタムレンダラーを使っているのには理由があるようです
    他のユーザーが無関係な内容を変えたときに現在の入力フォーカスがリセットされるべきではありません。また、ランディングページとサンプルデッキの文言があまりにも LLM っぽく、HN の投稿文のほうがずっと読みやすいです。自由オープンソースソフトウェアとして公開した点は素晴らしいです

    • スパムのためゲストブックを初期化し、現在はepoch 4です。フォーカスのリセット問題は1〜2人だけを参加させたテストでは表れませんでしたが、すぐ修正する予定です
      文言の問題にも同意しますが、文章を書くのが得意ではなく、仕事と育児の合間で時間が足りないので、少しずつ直していくつもりです
  • この単一ファイルWebアプリという概念を広めていて、提案中の Wikipedia草案 に Bento を追加してもよさそうです

    • 2013年に作った mdwiki も該当しそうです。画像・アイコン・スタイルをすべてインラインで含み、オフラインで動作するたった1つの .html ファイルなので、冗談半分で最初の真のシングルページアプリと呼んでいました
    • この草案は、読者を you と呼ぶなど、Wikipedia の記事らしくありません。Wikipedia は確立させたい概念を宣伝する場所ではなく第三次資料であるべきなので、適切な場所ではない気がします
    • Ilograph のダイアグラムも、この例 のようにスタンドアロンHTMLとしてエクスポートできます。ちょっとしたスライド機能もあり、ファイルサイズは約 560KB です
    • Hyperclay も一覧に入れられそうです
    • Bento を始めたときは TiddlyWiki しか知らなかったので、この一覧を見てみます
  • Claude に Bento の技術 を教えるだけで使えるのがすばらしいです

  • draw.ioで長いこと図を作っていて、文書をエディタとファイルを含んだiframeブロブのように保存する方式は賢いと感じていた。ただ、draw.ioはエディタ自体がファイルに含まれておらず、Web接続でコードを読み込む必要がある
    この方式が主なユースケースになればいいと思っていたが、Bentoは想像していた姿にほぼ近い

    • draw.ioをよく使うのでこの方式も検討したが、まずは単一のローカルファイルから始めるほうがよいと判断した。後でSSOのような企業向け機能が必要になれば、ホスティングも妥当かもしれない
  • 企業環境で非常によくある要求を満たしている。社内のいくつかのチームは、既存のプレゼンテーション・可視化ソフトウェアのバグが修正されず、カスタム機能も追加されないため、クラウドやデスクトップ製品を捨ててHTML・JavaScriptベースのツールへ移行した
    社内IT組織の小さな権力者たちは緊張したほうがよさそうだ

    • うちの会社でも技術者たちが素晴らしいWebアプリのプレゼンテーションを作って皆を驚かせるが、数字が間違っていて午後の運営委員会の前に修正しなければならないと、ClaudeしかなくClaude Codeはない非技術担当者は途方に暮れる。Claude Codeを技術者とソフトウェアエンジニアだけが使えるようにしているせいだ
  • 空のBentoをブラウザの「サイトをアプリとしてインストール」機能でPWAとしてインストールし、作成者名などを自動入力したうえで読み取り専用にして、ユーザーに「名前を付けて保存」させる独立型プレゼンテーションツールを構想中だ
    作成者情報以外は読み取り専用の空の基本文書をPWAとしてインストールする機能がプロジェクトに含まれるとよいと思う

    • PWAも検討したが、全体的なホスティングの有無はまだ悩んでいる。企業向け活用を支援するには結局ホスティングが必要になるだろうが、今はシンプルでクールなツールを作ることに集中したい
      ホスティング版でユーザーが望む機能と、Bentoの特別な原則を維持する方法をさらに見ていく予定だ
  • コードエージェントでHTMLプレゼンテーションを作ると、結果はかなりよい。目的に応じてMarkdownベースのSlidevを使ったり、数式表現などが特に美しいTypstスライドをエージェントで作ることもできる
    ただ、タイトルを見てPowerPointと直接関係のあるツールだと思ったが、実際には「プレゼンテーション」の同義語としてPowerPointを使っただけだった。PowerPointを嫌う人が多いことを考えると、やや皮肉だ