DAUB MCPサーバーは、ClaudeがJSON仕様書を通じてUIを生成・レンダリングできるようにします。

DAUBは、Claude専用に構築されたMCPサーバーで、従来のUI開発ワークフロー（ClaudeがJSX/HTMLなどのコードを生成し、開発者がそれをコピー、貼り付け、コンパイル、デバッグする）をバイパスします。代わりに、Claudeは直接ユーザーインターフェースを生成・レンダリングできます。

仕組み

ClaudeとDAUBを使用する場合のワークフローは以下の通りです：

• Claudeがgenerate_ui("支出チャート、フィルター、データテーブルを含むダッシュボードが必要です")を呼び出します
• DAUBのMCPサーバーが構造化JSON仕様を生成します
• DAUBがこの仕様をライブインターフェースとして即座にレンダリングします—コンパイルやコピー＆ペーストは不要です
• Claudeはその後、validate_specやrender_specを呼び出して、複数の会話ターンにわたってデザインを反復改善できます

MCPサーバーツール

Cloudflareエッジで実行されるMCPサーバーは、以下の4つの特定ツールを公開しています：

• generate_ui：自然言語の記述をレンダリングされたインターフェースに変換します
• render_spec：JSON仕様を受け取り、ライブレンダリングを返します
• validate_spec：Claudeがレンダリング前に自身の出力を確認できるようにします
• get_component_catalog：Claudeが34カテゴリーにわたる76コンポーネントを閲覧し、適切なUI要素を選択できるようにします

技術詳細

JSON仕様フォーマットは、Claudeが確実に生成できるように意図的にシンプルに設計されています。レイアウト、タイポグラフィ、フォーム、テーブル、ナビゲーション、データ表示、オーバーレイをカバーしています。Claudeはターン間で仕様を比較し、ゼロから始めずに反復改善できます。

レンダリング側では、daub.cssとdaub.jsの2つのCDNファイルのみが必要です。20のビジュアルテーマファミリーを含み、ビルドステップは一切不要です。

プロジェクト全体は開発中にClaude Codeを使用して構築され、仕様フォーマットはClaudeと徹底的に反復改善され、コンポーネント名を幻覚生成することなく一貫した生成を保証しています。

利用可能性

DAUBは無料で使用できます。GitHubリポジトリはhttps://github.com/sliday/daubで利用可能で、Claudeなしで試せるプレイグラウンドがhttps://daub.dev/playground.htmlにあります。ロードマップはhttps://daub.dev/roadmapで確認できます。