BoardUI/boardui

解決する課題

BoardUIは、AI駆動型インターフェースを構築するために特別に調整された、一貫性のあるデザインシステムを提供します。標準的なダッシュボードコンポーネント（テーブルやフォームなど）と、エージェント特有のUI要素（チャットストリーム、思考インジケーター、エージェントログなど）の間のギャップを埋め、AI製品全体で一貫したビジュアル言語を保証します。

仕組み

BoardUIは、Tailwind CSS v4とReact Ariaの上に構築されたReactコンポーネントのコレクションです。標準的なライブラリの依存関係としてインストールするのではなく、CLI (npx boardui@latest add) を使用してソースコードをプロジェクトに直接コピーします。これにより、特定のニーズに合わせてコンポーネントを自由に変更できます。また、MCP (Model Context Protocol) サーバーが含まれており、CursorやClaude CodeのようなAIコーディングエージェントが、定義済みの設計ルールに従いながら、コンポーネントを自動的にブラウズ、インストール、配線できるようになります。

対象ユーザー

AIネイティブなアプリケーションを構築しており、一般的なエージェント特有のUIパターンをゼロから構築することなく、プロフェッショナルグレードのインターフェースを迅速にプロトタイプ作成またはリリースしたい開発者向けです。

ハイライト

• エージェントネイティブコンポーネント： ストリーミングチャットインターフェース、エージェントの思考インジケーター、実行ログなど、AI製品向けの専門的なUIが含まれています。
• ソースファースト統合： コンポーネントはソースファイルとしてプロジェクトに追加されるため、コードを完全に制御できます。
• エージェント対応： MCPサーバーと専用のルールファイル (AGENTS.md) を備えており、AIコーディングアシスタントがシステムのデザイン・トークンを使用してUIを構築できます。
• アクセシビリティとローカライズ： React Ariaに基づいて構築されており、アクセシビリティを確保し、アラビア語やヘブライ語などの右から左へ記述する言語 (RTL) を組み込みでサポートしています。
• 柔軟なバックエンド： 単一のAPIキーで主要なLLMプロバイダー（OpenAI、Anthropic、Google、Groqなど）をサポートする、すぐに使えるストリーミングチャットエンドポイントが含まれています。