Hermes KanbanWebUI - Hermes Agent KanbanにAI Workflow Designerを加えたカンバンボードスタイルのWebUI

Hermes AgentのKanban機能をブラウザで見やすく、使いやすくしたくて、Hermes KanbanWebUIを作りました。

Hermes Agentには、taskをtriage、todo、ready、running、blocked、doneのような状態で管理するKanban機能がありますが、基本の利用フローはCLI中心です。複数のtaskの状態や依存関係をひと目で見たかったので、この機能をTrelloのようなカンバンボードUXで包んでみました。

このプロジェクトは別のtaskシステムを新しく作るのではなく、Hermes Agentが使う既存のhermes_cli.kanban_db SQLite DBをそのまま読み書きします。つまり、CLIやダッシュボードで見ていたtaskと、WebUIで見るtaskは同じデータです。

主な機能は次のとおりです。

• Hermes Kanban taskをTrelloスタイルのボードで表示
• taskの作成、状態変更、担当agent profileの指定
• running、blocked、doneなどのHermes Kanban状態を表示
• parent-child dependencyを線で可視化
• 実行中のtaskの進行状況、run、log、eventを確認
• 複数boardの切り替え、検索、フィルター、bulk createをサポート

既存のHermes Kanbanに追加で実装したのがAI Workflow Designerです。

目標や要件をプロンプトで入力すると、AIが作業を複数段階のtaskに分解し、task間の依存関係を持つDAGのドラフトを作成します。各taskの性格に合ったHermes Agent profileもあわせて割り当てます。

たとえば「この機能を設計して、実装して、QAして、ドキュメント化して」といった依頼を入力すると、企画・開発・QA・ドキュメント作成taskに分け、それぞれのtaskを適切なagent profileに割り当てたうえで、先行作業の関係まで作ってくれるイメージです。

生成されたworkflowはすぐには適用されず、まずドラフトとして表示されます。内容を確認して修正したあとに適用すると、実際のHermes Kanban taskとdependencyとして生成されます。