デザインのための DeepSeek Harness。
モデルは JSX を記述できますが、実用的なデザインエージェントには、モデルの出力以上のものが必要です。ブランドルール、リファレンス、ツール、権限、そして結果をレンダリングして確認するループが欠かせません。DeepSeek Harness は、そうした周辺要素を隠さずに公開します。
インターフェース作業では、要件と受け入れ確認のループを明確にします。デフォルトの DeepSeek ルートはテキスト専用なので、最も信頼性の高い基本形はコードと仕様を中心としたワークフローです。スクリーンショットを添付するのは、画像入力対応を明示するモデルルートを選択した後にしてください。
この柔軟性はデザイン作業に役立ちます。生成される UI の品質は、モデルを取り巻くハーネス、つまり永続的なプロジェクトルール、再利用可能なスキル、テキストまたは画像入力に適したプロバイダー、ファイルおよびシェルツール、検証ループに左右されるためです。このガイドでは、最短で動かすためのセットアップ、UI タスクで重要となる制約、Open Design との正確な境界を説明します。dsh にはまだ Open Design のファーストパーティアダプターがなく、既存の DeepSeek TUI アダプターは別の CLI です。
DeepSeek Harness をゼロからセットアップ
公開プレビューには Node.js `^22.19.0` または `>=24.0.0` が必要です。npm コマンドは初回使用時に Web プロファイルを初期化するため、リポジトリをクローンしなくても、動作するローカル UI をすぐに利用できます。
# 1. Start the official DeepSeek Harness Web UI
# Requires Node.js ^22.19.0 or >=24.0.0
npx @deepseek-ai/dsh web
# 2. Open the local UI (default)
# http://127.0.0.1:3080
# 3. In Settings → Models, add a DeepSeek API key
# or configure another supported provider.
# 4. Choose the project directory as your workspace.
# Optional: run one headless job after the profile is initialized
npx @deepseek-ai/dsh --profile headless "Audit this UI against AGENTS.md"
- 認証情報は参照として保持: Web UI はプロバイダーのシークレットを `$DSH_HOME/.credentials.yaml` に保存します。設定には認証情報への参照だけが保持され、UI が受け取るのは実際のキーではなくマスクされた記述子です。
- プレビュー版はバージョンを固定して運用: メンテナーは、互換性を破る変更が行われることを明示しています。チームのワークフローではバージョンを固定し、更新前にリリースの変更点を確認してください。
プラグインファーストのハーネスがデザイン作業に適している理由
モデルは JSX を記述できますが、実用的なデザインエージェントには、モデルの出力以上のものが必要です。ブランドルール、リファレンス、ツール、権限、そして結果をレンダリングして確認するループが欠かせません。DeepSeek Harness は、そうした周辺要素を隠さずに公開します。
- 永続的なデザインコンテキスト: デフォルトの指示ローダーは、プロジェクト階層から `AGENTS.md` と `CLAUDE.md` を読み込みます。トークン、コンポーネントルール、レスポンシブのブレークポイント、レビュー基準を、すべての実行から参照できる場所に置きます。
- 再利用可能なスキル: ローカルスキルは `.dsh/skills` または `.agents/skills` 配下に配置できます。フロントエンドスキルに、具体的な要件、チェックリスト、サンプル、スクリプトをまとめておけば、UI タスクを毎回ゼロから始めずに済みます。
- タスクに応じたプロバイダーの選択: Web UI では、DeepSeek、Anthropic や OpenAI などのカタログ掲載プロバイダー、カスタムの OpenAI 互換エンドポイントを設定できます。スクリーンショット入力には、画像対応を明示したルートを使用してください。テキスト、コード、DOM、仕様駆動の作業には、ネイティブの DeepSeek ルートを使用します。
重要な制約は、どのエージェントでも同じです。組み合わせやすさとセンスは同じではありません。タイポグラフィ、余白、コンポーネント、インタラクションに意図的な制約がなければ、ランタイムはありきたりな結果を忠実に自動生成します。Open Design の役割は、そうしたデザイン入力を提供し、整理することです。
実践的な DeepSeek Harness の UI・フロントエンドワークフロー
インターフェース作業では、要件と受け入れ確認のループを明確にします。デフォルトの DeepSeek ルートはテキスト専用なので、最も信頼性の高い基本形はコードと仕様を中心としたワークフローです。スクリーンショットを添付するのは、画像入力対応を明示するモデルルートを選択した後にしてください。
- リポジトリから dsh を起動し、そのディレクトリをワークスペースとして選び、このタスクで使用するモデルルートを選択します。
- ブランドの取り決めを `AGENTS.md`、`CLAUDE.md`、または参照先の `DESIGN.md` に記載します。トークン、プリミティブ、余白、書体、ブレークポイント、状態、禁止パターンを定義してください。
- `.dsh/skills` または `.agents/skills` から、目的を絞ったフロントエンドスキルを読み込みます。サンプルと検証スクリプトは、指示と同じ場所に置きます。
- エージェントに既存コンポーネントを再利用し、アプリケーションを実行し、プロジェクト固有のテストまたはブラウザツールでレスポンシブ状態を検証するよう依頼します。
- 表示された結果をレビューし、具体的な差分を記録して、小さなコミット単位で反復します。良くない結果に修正を重ねるのではなく、その変更を取り消してください。
効果的なプロンプトでは、ビジュアル上の制約と検証の根拠を両方明示します。
Implement the account dashboard in React + TypeScript.
Reuse the components and tokens named in AGENTS.md and DESIGN.md.
Use a 240px sidebar, a 12-column content grid, and the documented
mobile navigation pattern. Include loading, empty, error, and focus states.
Run the app and existing UI checks, inspect desktop and mobile breakpoints,
and report the exact files and states you verified.スクリーンショットが不可欠な場合は、まず画像対応のプロバイダーを設定してください。DeepSeek Harness は、選択したルートが画像対応を宣言していない場合、送信前に画像を拒否します。リファレンスを黙って破棄することを防ぐ、便利な仕組みです。
プラグイン、スキル、プロジェクトコンテキスト
DeepSeek Harness の最大の特徴は、チャット画面の下層にあります。プラグインツリーにより、デザインワークフローを毎回セッションに貼り付けるプロンプトではなく、ランタイムの一部にできます。
- AGENTS.md と CLAUDE.md: 指示プラグインは、ユーザー全体に適用されるファイルとプロジェクト階層を読み込み、ファーストパーティのファイル操作後には関連するネストされた指示ファイルも検出します。単発の依頼ではなく、継続的なデザインルールに使用してください。
- ファイルシステムスキル: スキルレジストリは、プロジェクトとユーザーのルートを検出し、重複するスキルに優先順位を付け、モデルから利用できる `skill` ツールを公開します。フロントエンド制作、アクセシビリティ、レスポンシブ QA、デザインシステムの手順を置くのに適した場所です。
- プロファイルとバンドル: プロファイルは、順序付けされたプラグインバンドルとユーザーパッチを積み重ねます。チームは、実際に必要なプロバイダー、ツール、権限ポリシー、スキルソースを含む、デザインに特化した構成を維持できます。
- MCP と外部機能: ソースツリーには MCP クライアント機能が含まれていますが、ユーザー向けの設定は依然として開発者向けです。プレビュー期間中は、連携機能を安定したチェックボックス式のワークフローではなく、バージョン管理されたプラグイン作業として扱ってください。
長期運用する社内ワークフローを構築する前に、`dsh --profile web --dump-config` で実際に有効なツリーを確認してください。この出力から、何が実際にマウントされ、パッチ可能なのかを把握できます。リポジトリ内のすべてのパッケージが、同梱プロファイルで有効になっていると想定するより確実です。
開発者プレビューとデザイン上の落とし穴
大きな失敗は、プレビューを安定版製品のように扱うこと、テキスト専用ルートをビジョンモデルのように扱うこと、柔軟なハーネスにビジュアルセンスまで期待することから生じます。
- カスタマイズ前にバージョンを固定: 互換性を破る変更は、プレビューの方針として明示されています。npm のバージョンを固定し、アップグレード後にレビューできる範囲にプロファイルのパッチを抑えてください。
- 選択したモデルのモダリティを確認: ネイティブの DeepSeek chat-completions ルートはテキスト専用です。スクリーンショットからコードを生成する場合は、添付画像が理解されると決めつけず、画像対応のプロバイダールートを選択し、明示してください。
- センスをデータとして提供: エージェントにトークン、標準コンポーネント、状態のリファレンス、禁止パターンを与えてください。デザイン上の取り決めがなければ、モジュール式のランタイムでも生成される UI はありきたりなものになります。
- プロファイルが実際にマウントするものを検証: リポジトリ内のパッケージは利用可能な機能を示しますが、デフォルトプロファイルで有効になっている証拠ではありません。連携機能を文書化したり依存したりする前に、構成済みの設定を確認してください。
どの対策も、コンテキストと検証に関する判断です。まさにデザインレイヤーが、各プロジェクトに毎回再発見させるのではなく、再現可能にすべき作業です。
DeepSeek Harness の正体
DeepSeek Harness (`dsh`) は、DeepSeek AI が開発した MIT ライセンスのエージェントハーネスです。公開中の開発者プレビューには、ローカル Web UI とヘッドレスランナーが含まれています。これはモデルでも、単なるターミナルの外観でもありません。モデル、ツール、コンテキスト、権限、セッション、ユーザーインターフェースを組み合わせてエージェントを構成するランタイムです。
中核となる考え方は、「すべてがプラグイン」というものです。Cordis は、モデルアダプター、ツールレジストリ、エージェントループ、ファイルシステム、シェル、サンドボックス、スキル、サブエージェント、永続化、UI を、プロファイルやバンドルを通じてマウント、交換、パッチ適用できるツリーとして構成します。同梱の `web` および `headless` プロファイルは固定された製品ではなく、出発点です。
- ローカル Web UI: `npx @deepseek-ai/dsh web` を実行すると、デフォルトでは `127.0.0.1:3080` でブラウザワークスペースが起動します。モデルを追加し、ワークスペースを選択して、会話 UI からタスクを実行できます。
- ヘッドレスモード: `headless` プロファイルは、永続化される新規セッションを 1 つ実行し、最終回答を出力して終了します。スクリプト化した監査、ビルド、再現可能なデザインチェックに役立ちます。
- 組み合わせ可能なランタイム: プロファイルでは、プラグインバンドルと独自のパッチを積み重ねられます。そのためチームは、エージェントループをフォークせずに、プロバイダー、ツール、ポリシー、UI の動作を変更できます。
- 開発元：DeepSeek AI（公式プロジェクト）
- ステータス：開発者プレビュー。互換性を破る変更が予想されます
- ライセンス：MIT
- 主要コマンド：`npx @deepseek-ai/dsh web`
DeepSeek Harness と DeepSeek TUI、その他のデザインエージェントの比較
名前が似ているため、混同しやすい点に注意が必要です。DeepSeek Harness と、現在 Open Design に掲載されている DeepSeek TUI は、実行ファイルも連携状況も異なる別々のプロジェクトです。
| ツール | 概要 | デザインに最適な用途 |
|---|---|---|
| DeepSeek Harness (`dsh`) | ローカル Web UI とヘッドレスプロファイルを備えた、DeepSeek AI 公式のプラグインファースト型ハーネス。現在は開発者プレビュー | デザインワークフローを中心に、ランタイム、スキル、プロバイダー、ポリシー、UI を構成したいチーム |
| DeepSeek TUI (`deepseek` / `codewhale`) | 独立したターミナル型コーディングエージェントで、Open Design が現在対応している DeepSeek アダプター | 現時点で Open Design 内から DeepSeek を使用する場合 |
| OpenCode | 成熟したオープンソースのプロバイダー非依存ターミナルエージェント | AGENTS.md と MCP を備えた安定した TUI ワークフロー内でモデルを切り替える場合 |
| Claude Code | ターミナル、IDE、デスクトップ、Web で利用できる成熟したコーディングエージェント | フロントエンドの推論、画像を多用するリファレンス、確立されたデザイン連携 |
| Open Design | 対応するコーディングエージェントを中心とした、エージェントネイティブなデザインワークスペースとライブラリ | 厳選されたデザインシステム、スキル、ビジュアル成果物、単一のモデルベンダーに依存しないローカルワークフロー |
ハーネス自体を拡張したい場合は dsh を選んでください。現在対応している DeepSeek アダプターとすぐに使えるデザインレイヤーが必要な場合は、Open Design 内の DeepSeek TUIを選びます。将来のアダプターによって両者が統合される可能性はありますが、現時点では互換性がありません。
DeepSeek Harness をエージェントネイティブなデザインワークスペースと併用する
Open Design と DeepSeek Harness は隣接するレイヤーを担います。dsh はエージェントランタイムを構成し、Open Design はエージェントをビジュアル作業に役立てるためのデザインシステム、スキル、ローカル成果物ワークフローを厳選して提供します。Open Design にはまだ専用の `dsh` アダプターがないため、現時点で正確なワークフローは両者の併用です。
- Open Design をインストールし、そのデザインシステムとスキルを使って、プロジェクトのビジュアル上の取り決めを確立します。
- 作成した `DESIGN.md`、リファレンス、プロジェクトの指示を、DeepSeek Harness がワークスペースとして開く同じリポジトリに置きます。
- プラグインファーストの実験とコードタスクには dsh を実行します。別のデザイン要件を管理するのではなく、同じトークン、ルール、アセット、検証基準を再利用してください。
- 現時点で Open Design 内から DeepSeek を直接使う必要がある場合は、既存の DeepSeek TUI アダプターを選択します。将来の dsh アダプターは、現在の動作ではなく、別の連携機能として扱ってください。
その結果、2 つのローカルファーストツールで、1 つの所有するコードベースと 1 つの持ち運び可能なデザイン上の取り決めを共有できます。Open Design は DeepSeek AI から独立しています。DeepSeek および DeepSeek Harness は、それぞれの所有者の商標です。
DeepSeek Harness のよくある質問
-
01 DeepSeek Harness とは何ですか？
DeepSeek Harness (`dsh`) は、DeepSeek AI が公式に提供するオープンソースのエージェントハーネスです。Cordis プラグインツリーを通じて、モデル、ツール、コンテキスト、セッション、ポリシー、オーケストレーション、UI を組み合わせます。公開版は現在、MIT ライセンスの開発者プレビューです。
-
02 DeepSeek Harness をインストールして実行するにはどうすればよいですか？
対応する Node.js バージョンをインストールし、`npx @deepseek-ai/dsh web` を実行します。デフォルトでは、ローカル Web UI が `http://127.0.0.1:3080` で起動します。Settings → Models でモデルを追加し、ワークスペースを選択して、セッションを開始してください。
-
03 DeepSeek Harness は DeepSeek の公式プロジェクトですか？
はい。リポジトリは GitHub の `deepseek-ai` Organization で公開されており、dsh は DeepSeek AI が開発したエージェントハーネスと説明されています。MIT ライセンスで提供され、開発者プレビューであることが明記されています。
-
04 DeepSeek Harness はスクリーンショットから UI を構築できますか？
選択したプロバイダールートが画像入力対応を宣言している場合に限ります。dsh における DeepSeek 独自の chat-completions ルートはテキスト専用であり、ハーネスはテキスト専用ルートで画像添付を送信前に拒否します。スクリーンショットには画像対応のプロバイダーを使用するか、コード、DOM、トークン、記述した仕様を通じて対象を説明してください。
-
05 DeepSeek Harness は AGENTS.md とスキルに対応していますか？
はい。指示プラグインは、AGENTS.md および CLAUDE.md 互換のプロジェクトファイルを読み込みます。ファイルシステムスキルプロバイダーは、設定済みのユーザールートと同梱ルートに加え、`.dsh/skills` および `.agents/skills` 配下のプロジェクトスキルを検出します。
-
06 DeepSeek Harness と DeepSeek TUI の違いは何ですか？
両者は別のツールです。DeepSeek Harness は `dsh` 実行ファイルを使用する、DeepSeek AI 公式のプラグインファースト型 Web UI・ヘッドレスランタイムです。DeepSeek TUI は `deepseek` または `codewhale` ディスパッチャーを使用する、Open Design が現在対応している別個の DeepSeek アダプターです。
-
07 Open Design は DeepSeek Harness に対応していますか？
専用のファーストパーティアダプターとしては、まだ対応していません。Open Design は現在、別製品である DeepSeek TUI アダプターに対応しています。それでも、Open Design のデザインシステム、スキル、DESIGN.md ファイル、成果物を、同じローカルリポジトリ内で dsh と併用できます。
-
08 DeepSeek Harness は API キーをどこに保存しますか？
公式のモデルガイドによると、プロバイダーのキーは `$DSH_HOME/.credentials.yaml` に保存されます。設定に保持されるのは認証情報への参照だけで、Web UI が受け取るのは実際のシークレットではなくマスクされた記述子です。
DeepSeek ワークフローを支えるデザインレイヤーを構築しましょう。
今すぐ Open Design のローカルデザインシステム、スキル、成果物ワークフローを活用し、次にどのエージェントランタイムを選んでも使えるよう、同じプロジェクトの取り決めを維持しましょう。