私が作ったもの
Sloth Space は AIネイティブなワークスペースで、3つのモード — スライド、ドキュメント、そしてスプレッドシート。自然言語で必要なものを説明すると、AI が数秒で草案を作成します。
出典: github.com/enigmaticsloth/sloth-space
興味深い部分:統一アーキテクチャ
3つのモードは3つの別々のアプリをただくっつけたものではありません。1つの状態オブジェクト、1つのインテントルーター、1つのコンテキストメニューシステム、1つの保存パイプライン、そして1つのインタラクションモデル(クリック1回で選択、ダブルクリックで編集)を共有しています。AIはアプリ全体を3つではなく1つのシステムとして認識します。
約30個のESモジュールファイル、純粋なバニラJS、ビルドステップなし、フレームワークなし。
AIがUIを制御する
これが私が最も楽しみにしている部分です。LLMは単にテキストを生成するだけでなく、アプリケーションのインターフェースを直接操作します。
27個のホワイトリストに登録されたJS関数がモデルに公開されています。それはモードを切替え、プロジェクトを作成し、ファイルを整理し、ドキュメントを結びつけ、そしてナビゲートする — すべて1つのチャット入力から実行できます。
入力してみてください: 「Q2 という名前のプロジェクトを作成し、予算報告書を作成してそれをそこに置いてください」
システムはこれを多段階のシーケンスとして実行します:
- プロジェクト「Q2」を作成
- ドキュメントモードに切り替え
- 予算報告書を生成
- ドキュメントをプロジェクトに自動リンク
各ステップをリアルタイムで表示するモネ・オレンジのオーバーレイ付き。
仕組みの裏側
- インテントルーター(Groqの無料ティア上のLlama 8B)が、すべてのユーザー入力を11個のインテントのいずれかに分類します
- ルーターは関数名と引数を含むJSONを返します
-
executeUIActions()はホワイトリストチェック → スキーマ検証 → 実行を行います -
resolveActionRefs()はあいまいな名称からIDへの解決を処理します — 「そのファイルを開く」で正しいファイルを見つけます - 破壊的なアクションは実行前にユーザーの確認を必要とします
- コンテキストメモリにより、AIは最近の操作から「そのファイルを開く」などを解決します
ファイル間のコンテキスト注入
ファイルをプロジェクトにリンクすると、AIは新しいコンテンツを生成する際にそれら全てを読み取ります。
- 「このプロジェクトを要約する」 → 接続されているすべてのドキュメントとスプレッドシートを読み取ります
- 「研究からスライドを作成する」 → すべてのプロジェクトファイルを横断参照します
- チャットで任意のファイル名を言及すると、AIが自動的にそれをプロンプトに取り込みます
ファイル間のコピーペーストは不要。手動でのコンテキスト設定も不要。
技術スタック
- ReactもVueもバンドラもなし — 純粋な vanilla JS ESモジュール
- すべての状態を1つの
Sオブジェクトに(状態管理ライブラリなし) - すべてのモジュールエクスポートが
windowに自動的にバインドされます —Object.entriesループ経由 - CSSを14のモジュールファイルに分割
- クラウド同期のオプションとしてSupabase + GitHub OAuth
- BYO APIキー — Groq、OpenAI、Grok、Ollama、Claudeで動作
- PPTXエクスポート、5つのスライドテーマ、18のスプレッドシート数式
4日間で1人で構築
ご意見を伺いたいです — 特に「LLMをUIコントローラとして」パターンについて。モデルに直接(ホワイトリストに登録された)インターフェイス制御を与えるのは正しい方向でしょうか、それともサンドボックス化する別の方法があるのでしょうか?