参考リンク
DeepSeek Harness に関する参考資料
公開ガイドに記載されている、DeepSeek Harnessで設計するためのチュートリアル、ドキュメント、ステップバイステップのウォークスルー。
DeepSeek Harness 
OpenDesign OpenDesign で
DeepSeek Harness と
デザインする。
OpenDesignでDeepSeek Harnessを使ってインターフェースを設計する方法：再利用可能なコンソールプロファイル、スキルとプロバイダーの選択、ブリーフからレビュー済みファイルまでの管理者ユーザーテーブル1件、そして始める前に知っておくべき制限事項をご紹介します。
DEEPSEEK HARNESS の3つの出発点
DeepSeek Harness の入口を選ぶ
このガイド・UIデザイン
DeepSeek Harness でインターフェースを構築する
ここでの道筋は、ブリーフと参照資料から設計ルールを経て、あなたが確認する HTML の結果へと至ります。
このガイドを読む セットアップ前提条件なしで DeepSeek Harness をインストールする
Node.js、pnpm、dsh の事前インストールは不要です。お使いのオペレーティングシステム用のワンラインインストーラーを実行してください。DeepSeek Harness がインストールされます…
セットアップに進む 比較DeepSeek Harness の違いを見る
設計タスクにおいて DeepSeek Harness が DeepSeek TUI（`deepseek` / `codewhale`）、OpenCode、Claude Code とどこで一線を画すのか、そして別のワークフローがより良い選択となるのはいつか。
比較を見るDeepSeek Harness の設計タスクを全体像で
DeepSeek Harness でブリーフからインターフェースへ
1つの設計タスクを、あなたが引き渡すブリーフと制約から、返ってくる成果物まで、そして完了と呼ぶ前にあなたが実行するチェックまで追跡します。以下のインターフェースはこのページ用に作られた例示であり、記録された DeepSeek Harness の実行ではありません。
1設計ブリーフと制約条件
ブリーフ管理コンソールのユーザーページを作成する: 役割、チーム、ステータス、最終アクティブを網羅する検索可能なテーブルに加え、一括操作とページネーション。再利用可能なプロファイルを通じて console スキルを使用する。デスクトップとスマートフォン。
- デザインシステムOpenDesign のペーパーキャンバス、Albert Sans と単一のグリーンのアクセント
- ブレークポイントデスクトップは 1440px、モバイルは 390px、横スクロールなし
- インタラクション検索、フィルター、行の選択、一括操作、ページネーション
- 出力安定した
data-od-idフックを使った単一の自己完結型 HTML ファイル
2誰が何をするか: あなた、DeepSeek Harness、OpenDesign
- あなた
あなたはブリーフを書き、デザインシステムを選び、受け入れ基準を設定します。
- DeepSeek Harness
DeepSeek Harness はレイアウトを計画し、HTML、CSS、JavaScript を書き、要求に応じて修正します。
- OpenDesign
OpenDesign はデザインシステムとスキルを提供し、プレビューをレンダリングし、各バージョンをプロジェクトファイルとして保持します。
- レビュー
引き渡し前に、視覚的階層、8px グリッドのスペーシング、両方のブレークポイント、すべてのインタラクションを確認します。
3DeepSeek Harness の成果物: 1440px と 390px の管理テーブル
4ハンドオフ前のレビュー
レイアウト
グリッドとスペーシング
ツールバー、テーブル、ページャーは 8px グリッドに整列し、固定された列幅が行の跳ねを防ぎます。
階層
視覚的階層
名前と役割が先導し、アクセントはオーナー役割にのみ現れます。
レスポンシブ
モバイルレイアウト
テーブルは名前、メール、役割を表示するリストに変わり、フィルターはシートに移ります。
インタラクション
インタラクションの確認
検索し、役割でフィルターし、2行を選択し、一括操作を実行し、次ページへ進みます。
適合性
DeepSeek Harness が適する場面——そして適さない場面
DeepSeek Harnessが適しているのは次の場合です
- プロジェクト指示。 ブランドとコンポーネントのルールを AGENTS.md または CLAUDE.md から取得します。
- 再利用可能なスキル。 フロントエンドの技巧と検証を `.dsh/skills` または `.agents/skills` に置きます。
- プロバイダーの選択。 コード/仕様の作業はテキスト専用の DeepSeek へ、スクリーンショットは画像対応のルートへ振り分けます。
- 組み合わせ可能なプロファイル。 ワークフローが必要とするツール、ポリシー、UI プラグインから焦点を絞ったランタイムを組み立てます。
別のワークフローを選ぶべきケース
- 編集可能なベクターファイルが必要。 出力は HTML であり、編集可能なデザインドキュメントではありません。必要なアセット形式には別のベクターワークフローを検討してください。
- 参照も制約もない。 デザインシステムや例がなければ、結果は汎用的な見た目になりがちです。生成する前にブリーフを書いてください。
- このエージェントが必要とする認証情報がない。 DeepSeek API キー、または設定済みの別のプロバイダー認証情報が必要です。OpenDesign は認証情報を提供もプロキシもしません。
- チームが DeepSeek や Reasonix で作業している。 これらのエージェントには専用ページがあります。設計ワークスペースは一貫していても、セットアップはエージェントごとに変わります。関連エージェントを参照してください。
互換性
始める前に: DeepSeek Harness の要件
本ページは、OpenDesign のデスクトップアプリが接続点となる場合の DeepSeek Harness を扱います。2026年9月6日時点で公開されている参考資料を参照しました。
ツールの範囲DeepSeek Harness（DeepSeek AI提供）
DeepSeek Harness（`dsh`）は DeepSeek AI の公式オープンソースエージェントハーネスです。モデル、ツール、セッション、権限、ファイルシステム、スキル、サブエージェント、UI は、そのローカル Web UI とヘッドレスランナーによって Cordis プラグインとして組み立てられます。ここでの焦点は、OpenDesign 内で DeepSeek Harness を使ってインターフェースを設計することであり、DeepSeek Harness 自体のインターフェースを操作することではありません。OpenDesign が使用できるエージェントは、そのセットアップノートに記録されています。
アカウントと認証DeepSeek APIキーまたは他に設定済みの
DeepSeek API キー、またはすでに設定済みの別のプロバイダー認証情報。OpenDesign では、設定 → モデル & プロバイダー → ローカル CLI に進み、再スキャンします。本ページではクォータや価格を約束するものではありません。
システムとバージョンデスクトップアプリまたはソース
デスクトップビルドはダウンロードページに掲載されています。ソースからの quickstart にある Node.js と pnpm の要件は、ソースから実行する場合に関係します。デスクトップパッケージのインストールには適用されません。ここで互換性のある DeepSeek Harness の最低バージョンは検証されていません。
接続確認成功の目安
インストールされたバージョンが表示する接続手順を使用し、DeepSeek Harness にささやかなタスクを1つ与えてください。DeepSeek Harness がそれを実行したか、成果物を開けるかを確認します。単にダウンロードしただけでは接続が機能することの証明にはなりません。
デスクトップアプリから始める
DeepSeek Harness をセットアップする3つのステップ
まずダウンロードし、インストールしたバージョンに合った DeepSeek Harness のセットアップを完了させ、最後に小さな結果を1つ検証します。この手順に従うのに、OpenDesign をソースからビルドする必要はありません。
- 1
OpenDesignデスクトップアプリをダウンロードする
お使いのマシン用にビルドされたインストーラーを選び、インストールしてアプリを起動します。
OpenDesignをダウンロードチェックポイントデスクトップアプリが開くはずです。すでにインストール済みなら、再度ダウンロードせず次のステップに進んでください。 - 2
DeepSeek Harnessの接続を準備する
インストールしたバージョンに付属する DeepSeek Harness の手順を使用します。OpenDesign では、設定 → モデル & プロバイダー → ローカル CLI を開き、再スキャンを選びます。
deepseek-ai/deepseek-harnesscurl -fsSL 'https://open-design.ai/install-dsh.sh?version=1' | sh公開ガイドにある DeepSeek Harness のセットアップノートから引用。現在のコマンドはベンダーのドキュメントで確認してください。
チェックポイント使用するつもりのエージェントとアカウントを確認します。利用できない場合は、より大きなタスクに移る前にまず互換性を見直してください。 - 3
小さな DeepSeek Harness タスクを1つ実行する
ブリーフを控えめに保つと、修正1回を含むループ全体を判断できます。
スターターブリーフプロファイルフォームと保存確認を含む設定画面を作成する。私の設計ルールを適用する。デスクトップとモバイル幅で検証する。
チェックポイント結果を開き、保存状態を確認し、具体的な変更を1つ依頼します。生成されたファイルはレビューの出発点であり、ゴールではありません。
OpenDesign をソースから実行する場合は、代わりに技術的な quickstartを使用してください。
DeepSeek Harnessのデザインワークフロー
DeepSeek Harness の設計ワークフロー: 5つのステップ
このウォークスルーでは、管理ユーザーテーブルをブリーフからレビュー済みファイルまで追います。各ステップでは、あなたの入力、DeepSeek Harness の作業、OpenDesign の貢献、そしてあなたが検証することを示します。
- 1
デザインブリーフ
平易な言葉による短いブリーフ——3〜6行。誰がその画面を使うのか、何を達成する必要があるのか、どのプラットフォームが重要かを述べます。
- あなたブリーフを下書きします。参照スクリーンショットがあれば添付します。
- DeepSeek Harnessブリーフとプロジェクトの指示ファイルを解析し、要件が曖昧な場合は進める前に質問します。
- OpenDesignプロジェクトとプロンプトのサーフェスをホストし、成果物の種類に合ったスキルを提供します。
- 確認ブリーフが受け入れ基準を明記していることを確認します。生成前にそれらを確定させる方が、後から修正するよりコストがかかりません。
- 2
デザイン制約
デザインシステムと、いくつかの譲れない事項。この組み合わせが、出力を汎用的ではなくブランドに沿ったものに保ちます。
- あなたデザインシステムを選び、ブレークポイントと必ず表示すべきコンポーネントを述べます。
- DeepSeek Harnessコードを書く前に、DESIGN.mdトークンとデザインの姿勢ルールをコンテキストに読み込みます。
- OpenDesignデザインシステムライブラリを提供し、選択したシステムをスキルテンプレートにバインドします。
- 確認トークンがブランドに一致することを確認します。単一のアクセント、正しいフォント、正しい角丸です。
- 3
インターフェースを生成する
DeepSeek Harnessは、レイアウト、スタイル、インタラクション、安定したフックを備えた自己完結型のHTMLファイルを1つ生成します。
- あなた待つか、明確化の質問に1つ答えてください。設定するものはありません。
- DeepSeek Harnessセクションを計画し、HTML、CSS、JavaScriptを書き、ファイルを実行し、失敗したものを修復します。
- OpenDesign成果物をプロジェクトフォルダに保存し、プレビューが見つけられるようにインデックスします。
- 確認待ってください。ソースを読むのではなく、レンダリング後にファイルを判断してください。
- 4
プレビュー
OpenDesign内で、ファイルは要求した幅でレンダリングされます。ここがデザインが判断されるポイントです。
- あなた幅を変更し、インタラクションをクリックして確認し、個々の要素にコメントを残します。
- DeepSeek Harnessプレビューのコメントを読み取り、次のリビジョンを準備します。
- OpenDesignプレビューをレンダリングし、
data-od-idターゲットを公開して、コメントや編集を要素に添付できるようにします。 - チェック階層、コントラスト、390pxでのオーバーフロー、フォーカス状態、アクセント使用の抑制を確認します。
- 5
修正と検証
プレビュー内の要素を指して変更を依頼します。各リビジョンは新しいファイルとして届き、痕跡なしに上書きされることはありません。
- あなたコメントをリクエストに変換し、タスクがいつ終了するかを決定します。
- DeepSeek Harness変更をその場で適用し、ファイルを再実行します。
- OpenDesignバージョンを並べて保持し、終了したら画像またはHTMLをエクスポートします。
- チェック変更された領域のみを再確認し、その後、各ブレークポイントで一度フルページを確認します。
リソース
DeepSeek Harness デザインリソース
制限事項
DeepSeek Harnessの制限、手動チェック、フォールバック
- 対象範囲このページは、OpenDesignに接続されたエージェントとしてのDeepSeek Harnessについてであり、DeepSeek Harnessのすべての機能についてではありません。
- 利用制限使用制限とコストは、使用する資格情報（DeepSeek APIキーまたは別の設定済みプロバイダー資格情報）によって異なります。ここでは無料枠についての主張はしていません。
- ネットワークローカルプロジェクトファイルはオフライン推論を意味しません。機密性の高い入力を共有する前に、エージェントのプロバイダー設定とデータポリシーを確認してください。
- 出力は HTML です成果物はHTMLファイルとして提供され、ベクターデザインファイルではありません。
- 手動レビュープレビューでアクセシビリティ、実際のコンテンツ、ブランド適合性、インタラクションの正確性を確認します。エージェントによる自己チェックはあくまで最初のパスにすぎません。
- フォールバックエージェントが利用できない場合、またはタスクが失敗した場合は、インストールされているバージョンの接続手順と認証を参照してください。構成を変更する前に、エラーと最後に機能した成果物を保存してください。
よくある質問
DeepSeek Harness と OpenDesign に関するよくある質問
DeepSeek Harness とは何ですか？
DeepSeek Harness（`dsh`）は、DeepSeek AI が公式に提供するオープンソースのエージェントハーネスです。モデル、ツール、コンテキスト、セッション、ポリシー、オーケストレーション、UI を Cordis プラグインツリーを通じて統合しています。公開版は現在、MIT ライセンスの下でのデベロッパープレビューです。
DeepSeek Harness のインストールと実行方法は？
お使いの OS 用のワンライン インストーラーを実行してください — macOS/Linux: `curl -fsSL 'https://open-design.ai/install-dsh.sh?version=1' | sh`（PowerShell と CMD 用のワンライナーは上記のセットアップ セクションにあります）。事前に Node.js、pnpm、dsh をインストールしておく必要はなく、`sudo` も不要です。インストーラーは最後に `dsh web` を開きます。プレビュー通知を進み、Settings → Models → DeepSeek → API Key に API キーのみを保存してください。プロバイダーとモデルが正しく動作することを確認したら、`Ctrl+C` で Web UI を停止し、OpenDesign 0.19.1 以降をインストールし、ローカル CLI エージェントを再スキャンして Harness カードを接続し、Test をクリックしてください。
インストーラーは既存の Node.js を上書きしますか？
上書きしません。環境が存在しない場合、インストーラーはユーザーディレクトリ内に独立した Node.js と DeepSeek Harness のツールチェーンをインストールし、システムの Node.js を変更したり、他のプロジェクトが使用しているバージョンを置き換えたりすることはありません。互換性のある Node.js、pnpm、dsh がすでにある場合は、インストーラーがそれらを検出して再利用するため、再度ダウンロードされることはありません。
インストール後にターミナルが Dsh を見つけられない場合はどうすればよいですか？
まず新しいターミナルウィンドウを開いてください。OpenDesign は一般的なユーザーレベルのツールディレクトリを自動でスキャンするため、通常は PATH を編集する必要はありません。すでに OpenDesign を開いている場合は、Local Agent ページで「Rescan」をクリックしてください。それでも検出できない場合は、インストーラーの最終画面で DeepSeek Harness が準備完了と表示されたことを確認し、その出力を OpenDesign のテストメッセージと一緒にサポートに共有してください。
DeepSeek Harness は DeepSeek の公式プロジェクトですか？
はい。リポジトリは `deepseek-ai` の GitHub 組織下で公開されており、dsh は DeepSeek AI が開発したエージェントハーネスであると説明されています。MIT ライセンスで、明確にデベロッパープレビューと記載されています。
ハーネスがデザインにもたらすもの
DeepSeek Harness（`dsh`）は、DeepSeek AI が開発した MIT ライセンスのエージェントハーネスです。公式プロダクトページではプロジェクトが紹介されており、GitHub リポジトリにはソース、リリース履歴、メンテナンスされているガイドが置かれています。公開されている開発者プレビューには、ローカル 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`
その中心となる考え方は「すべてはプラグイン」です。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 Harness は、ランディングページ、製品インターフェース、ダッシュボード、フロントエンドのプロトタイプを構築できます。リポジトリを読み取り、実際の UI コードを編集し、コマンドを実行し、プロジェクトの指示を読み込み、反復をまたいでセッションを維持できるからです。単独では提供しないのは視覚的なセンスです。有用なデザイン作業には、ブランドルール、リファレンス、ツール、権限、そして結果をレンダリングして確認するループが依然として必要です。
永続的なデザインコンテキスト: 既定の指示ローダーは、プロジェクト階層から `AGENTS.md` と `CLAUDE.md` を読み込みます。トークン、コンポーネントルール、レスポンシブのブレークポイント、レビュー基準は、すべての実行から見える場所に置いてください。
再利用可能なスキル: ローカルスキルは `.dsh/skills` または `.agents/skills` に置けます。フロントエンドスキルは、各 UI タスクがゼロから始まることを防ぐ、正確なブリーフ、チェックリスト、例、スクリプトをまとめることができます。
タスク別のプロバイダー選択: Web UI では、DeepSeek、Anthropic や OpenAI などのカタログプロバイダー、カスタムの OpenAI 互換エンドポイントを構成できます。スクリーンショット入力には画像対応を宣言したルートを使用し、テキスト、コード、DOM、仕様駆動の作業にはネイティブの DeepSeek ルートを使用してください。
ハーネスは入力を受け持ちますが、センスは依然としてデザインシステム、焦点を絞ったスキル、具体的なリファレンスから生まれます。
重要な限界はどのエージェントにも共通です。構成可能性はセンスではありません。意図的なタイポグラフィ、スペーシング、コンポーネント、インタラクションの制約がなければ、ランタイムは汎用的な結果を忠実に自動化してしまいます。OpenDesign の役割は、そうしたデザイン入力を提供し、整理することです。
永続的なデザインコンテキスト: 既定の指示ローダーは、プロジェクト階層から `AGENTS.md` と `CLAUDE.md` を読み込みます。トークン、コンポーネントルール、レスポンシブのブレークポイント、レビュー基準は、すべての実行から見える場所に置いてください。
再利用可能なスキル: ローカルスキルは `.dsh/skills` または `.agents/skills` に置けます。フロントエンドスキルは、各 UI タスクがゼロから始まることを防ぐ、正確なブリーフ、チェックリスト、例、スクリプトをまとめることができます。
タスク別のプロバイダー選択: Web UI では、DeepSeek、Anthropic や OpenAI などのカタログプロバイダー、カスタムの OpenAI 互換エンドポイントを構成できます。スクリーンショット入力には画像対応を宣言したルートを使用し、テキスト、コード、DOM、仕様駆動の作業にはネイティブの DeepSeek ルートを使用してください。
ハーネスは入力を受け持ちますが、センスは依然としてデザインシステム、焦点を絞ったスキル、具体的なリファレンスから生まれます。
重要な限界はどのエージェントにも共通です。構成可能性はセンスではありません。意図的なタイポグラフィ、スペーシング、コンポーネント、インタラクションの制約がなければ、ランタイムは汎用的な結果を忠実に自動化してしまいます。OpenDesign の役割は、そうしたデザイン入力を提供し、整理することです。
ステップ 1: DeepSeek Harness のインストールと構成
Node.js、pnpm、dsh を事前にインストールしておく必要はありません。お使いのオペレーティングシステム向けの 1 行インストーラーを実行してください。OpenDesign が検証済みの DeepSeek Harness ツールチェーンをインストールし、その後 API キーのセットアップページを開きます。インストーラーはシステムの Node.js には一切触れず、`sudo` や管理者権限も必要ありません。互換性のある既存の環境があれば自動的に再利用されます。
macOS / Linux — ターミナルを開き、この行を貼り付けて Enter を押します（Apple Silicon、Intel Mac、および主要な x64/arm64 Linux ディストリビューションに対応。Alpine Linux はまだ対応していません）:
Windows PowerShell — PowerShell を開き、この行を貼り付けて Enter を押します:
Windows CMD — コマンドプロンプトを開き、この行を貼り付けて Enter を押します:
互換性のある Node.js、pnpm、DeepSeek Harness のバージョンを確認し、存在すれば再利用します。同じものを二度ダウンロードすることはありません。
環境が存在しない場合は、ユーザーディレクトリ内に分離された Node.js と DeepSeek Harness のツールチェーンをインストールします。
OpenDesign が検証したリリースに固定するため、自動アップグレードで互換性が壊れることはありません。
Node.js のダウンロードの SHA-256 を検証し、不一致の場合はインストールを中止します。
OpenDesign が検出できる `dsh` エントリを作成し、グローバルの Node.js は上書きしません。
通信先は OpenDesign のインストールエンドポイント、nodejs.org、npm レジストリのみです。プロジェクトファイルや API キーはアップロードしません。
Harness Web UI を開く: インストーラーは終了時に `dsh web` を自動で実行します。通常は `http://127.0.0.1:3080` を開きます。ブラウザが開かない場合は、ターミナルに表示されたアドレスをコピーし、そのアドレスをそのまま使用してください。後で再構成が必要になったときは、いつでも `dsh web` を再度実行してください。
DeepSeek API キーを追加する: プレビューの通知をそのまま進み、プロンプトが表示されたらキーを保存または適用します。プロンプトが表示されない場合は、Settings → Models → DeepSeek → API Key を開いてください。貼り付けるのはキー本体のみで、`DEEPSEEK_API_KEY=...` や引用符は含めないでください。変更は即座に反映され、`dsh web` を再起動する必要はありません。必要な場合は DeepSeek Platform で作成してください。
モデルを確認してからセットアップ UI を閉じる: DeepSeek プロバイダーが構成済みとして表示され、そのモデルがセレクターに現れるはずです。`MISSING_CREDENTIAL` が表示された場合は、DeepSeek カードを再度開いてキーを保存し直してください。テストプロンプトが動作したら、`Ctrl+C` を押します。OpenDesign を使用している間、`dsh web` を開いたままにしておく必要はありません。
DeepSeek Harness はプロバイダーの資格情報を書き込み専用のシークレットとして保存します。UI はキーが構成されているかどうかを報告できますが、平文のキーを読み取ったり表示したりすることはできません。OpenDesign は、このユーザーがインストールした dsh とそのモデル構成を、キーを OpenDesign にコピーすることなく再利用します。インストーラーはすでに OpenDesign が検証したリリースに固定しているため、手動でのバージョン管理は不要です。上流の資格情報の動作については、公式プロバイダーガイドを参照してください。
コマンドとバージョン固有の詳細については、現行のセットアップセクションを参照してください。これらは変更される可能性があります。
以前のガイドにあった過去のコマンド例です。現在の構文はリンク先のベンダードキュメントで確認してください。
以前のガイドにあった過去のコマンド例です。現在の構文はリンク先のベンダードキュメントで確認してください。
macOS / Linux — ターミナルを開き、この行を貼り付けて Enter を押します（Apple Silicon、Intel Mac、および主要な x64/arm64 Linux ディストリビューションに対応。Alpine Linux はまだ対応していません）:
Windows PowerShell — PowerShell を開き、この行を貼り付けて Enter を押します:
Windows CMD — コマンドプロンプトを開き、この行を貼り付けて Enter を押します:
互換性のある Node.js、pnpm、DeepSeek Harness のバージョンを確認し、存在すれば再利用します。同じものを二度ダウンロードすることはありません。
環境が存在しない場合は、ユーザーディレクトリ内に分離された Node.js と DeepSeek Harness のツールチェーンをインストールします。
OpenDesign が検証したリリースに固定するため、自動アップグレードで互換性が壊れることはありません。
Node.js のダウンロードの SHA-256 を検証し、不一致の場合はインストールを中止します。
OpenDesign が検出できる `dsh` エントリを作成し、グローバルの Node.js は上書きしません。
通信先は OpenDesign のインストールエンドポイント、nodejs.org、npm レジストリのみです。プロジェクトファイルや API キーはアップロードしません。
Harness Web UI を開く: インストーラーは終了時に `dsh web` を自動で実行します。通常は `http://127.0.0.1:3080` を開きます。ブラウザが開かない場合は、ターミナルに表示されたアドレスをコピーし、そのアドレスをそのまま使用してください。後で再構成が必要になったときは、いつでも `dsh web` を再度実行してください。
DeepSeek API キーを追加する: プレビューの通知をそのまま進み、プロンプトが表示されたらキーを保存または適用します。プロンプトが表示されない場合は、Settings → Models → DeepSeek → API Key を開いてください。貼り付けるのはキー本体のみで、`DEEPSEEK_API_KEY=...` や引用符は含めないでください。変更は即座に反映され、`dsh web` を再起動する必要はありません。必要な場合は DeepSeek Platform で作成してください。
モデルを確認してからセットアップ UI を閉じる: DeepSeek プロバイダーが構成済みとして表示され、そのモデルがセレクターに現れるはずです。`MISSING_CREDENTIAL` が表示された場合は、DeepSeek カードを再度開いてキーを保存し直してください。テストプロンプトが動作したら、`Ctrl+C` を押します。OpenDesign を使用している間、`dsh web` を開いたままにしておく必要はありません。
DeepSeek Harness はプロバイダーの資格情報を書き込み専用のシークレットとして保存します。UI はキーが構成されているかどうかを報告できますが、平文のキーを読み取ったり表示したりすることはできません。OpenDesign は、このユーザーがインストールした dsh とそのモデル構成を、キーを OpenDesign にコピーすることなく再利用します。インストーラーはすでに OpenDesign が検証したリリースに固定しているため、手動でのバージョン管理は不要です。上流の資格情報の動作については、公式プロバイダーガイドを参照してください。
コマンドとバージョン固有の詳細については、現行のセットアップセクションを参照してください。これらは変更される可能性があります。
& ([scriptblock]::Create((irm 'https://open-design.ai/install-dsh.ps1?version=1')))以前のガイドにあった過去のコマンド例です。現在の構文はリンク先のベンダードキュメントで確認してください。
curl -fsSL "https://open-design.ai/install-dsh.cmd?version=1" -o "%TEMP%\install-dsh.cmd" && call "%TEMP%\install-dsh.cmd"以前のガイドにあった過去のコマンド例です。現在の構文はリンク先のベンダードキュメントで確認してください。
UI のビルドとレビューのループを実行する
インターフェース作業では、ブリーフと受け入れのループを明示してください。既定の DeepSeek ルートはテキスト専用のため、最も信頼できる基準はコードと仕様のワークフローです。スクリーンショットを添付するのは、画像入力を宣言したモデルルートを選択した後だけにしてください。
リポジトリから dsh を起動し、そのディレクトリをワークスペースとして選択し、このタスク用のモデルルートを選択します。
ブランドの契約は `AGENTS.md`、`CLAUDE.md`、または参照される `DESIGN.md` に記載します。トークン、プリミティブ、スペーシング、タイプ、ブレークポイント、状態、禁止パターンなどです。
`.dsh/skills` または `.agents/skills` から焦点を絞ったフロントエンドスキルを読み込みます。例と検証スクリプトは指示のそばに置いてください。
エージェントに、既存のコンポーネントを再利用し、アプリケーションを実行し、プロジェクト自身のテストやブラウザツールでレスポンシブな状態を検証するよう依頼します。
目に見える結果をレビューし、具体的な差分を記録し、小さなコミット単位で反復します。悪い土台に修正を重ねるのではなく、弱いパスは巻き戻してください。
有用なプロンプトは、視覚的な制約と検証の根拠の両方を明示します:
スクリーンショットが不可欠な場合は、まず画像対応のプロバイダーを構成してください。選択したルートが画像サポートを宣言していない場合、DeepSeek Harness は送信前に画像を拒否します。これはリファレンスが黙って失われることを防ぐ有用なガードです。
以前のガイドにあった過去のコマンド例です。現在の構文はリンク先のベンダードキュメントで確認してください。
リポジトリから dsh を起動し、そのディレクトリをワークスペースとして選択し、このタスク用のモデルルートを選択します。
ブランドの契約は `AGENTS.md`、`CLAUDE.md`、または参照される `DESIGN.md` に記載します。トークン、プリミティブ、スペーシング、タイプ、ブレークポイント、状態、禁止パターンなどです。
`.dsh/skills` または `.agents/skills` から焦点を絞ったフロントエンドスキルを読み込みます。例と検証スクリプトは指示のそばに置いてください。
エージェントに、既存のコンポーネントを再利用し、アプリケーションを実行し、プロジェクト自身のテストやブラウザツールでレスポンシブな状態を検証するよう依頼します。
目に見える結果をレビューし、具体的な差分を記録し、小さなコミット単位で反復します。悪い土台に修正を重ねるのではなく、弱いパスは巻き戻してください。
有用なプロンプトは、視覚的な制約と検証の根拠の両方を明示します:
スクリーンショットが不可欠な場合は、まず画像対応のプロバイダーを構成してください。選択したルートが画像サポートを宣言していない場合、DeepSeek Harness は送信前に画像を拒否します。これはリファレンスが黙って失われることを防ぐ有用なガードです。
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 が最も差別化されているのは、チャット画面より下の層です。そのプラグインツリーにより、チームはデザインワークフローを、毎回のセッションに貼り付けるプロンプトではなく、ランタイムの一部にできます。
AGENTS.md と CLAUDE.md: 指示プラグインは、ユーザーグローバルのファイルとプロジェクト階層を読み込み、その後、ファーストパーティのファイル操作の後に該当するネストされた指示ファイルを認識します。単発の依頼ではなく、持続的なデザインルールに使用してください。
ファイルシステムスキル: スキルレジストリはプロジェクトとユーザーのルートを検出し、重複をランク付けし、モデル向けの `skill` ツールを公開します。これはフロントエンドの作り込み、アクセシビリティ、レスポンシブ QA、デザインシステムの手順にとって自然な置き場所です。
プロファイルとバンドル: プロファイルは、順序付けられたプラグインバンドルとユーザーパッチを積み重ねます。チームは、実際に必要なプロバイダー、ツール、権限ポリシー、スキルのソースを備えた、デザイン重視の構成を維持できます。
MCP と外部機能: ソースツリーには MCP クライアント機能が含まれていますが、ユーザー向けの構成は依然として開発者向けです。プレビュー期間中は、統合を安定したチェックボックス操作ではなく、バージョン管理されたプラグイン作業として扱ってください。
長期間使う社内ワークフローを構築する前に、`dsh --profile web --dump-config` で実際に有効なツリーを確認してください。その出力は、実際に何がマウントされ、パッチ可能かを示します。リポジトリ内のすべてのパッケージが同梱プロファイルで有効だと決めつけるより信頼できます。
AGENTS.md と CLAUDE.md: 指示プラグインは、ユーザーグローバルのファイルとプロジェクト階層を読み込み、その後、ファーストパーティのファイル操作の後に該当するネストされた指示ファイルを認識します。単発の依頼ではなく、持続的なデザインルールに使用してください。
ファイルシステムスキル: スキルレジストリはプロジェクトとユーザーのルートを検出し、重複をランク付けし、モデル向けの `skill` ツールを公開します。これはフロントエンドの作り込み、アクセシビリティ、レスポンシブ QA、デザインシステムの手順にとって自然な置き場所です。
プロファイルとバンドル: プロファイルは、順序付けられたプラグインバンドルとユーザーパッチを積み重ねます。チームは、実際に必要なプロバイダー、ツール、権限ポリシー、スキルのソースを備えた、デザイン重視の構成を維持できます。
MCP と外部機能: ソースツリーには MCP クライアント機能が含まれていますが、ユーザー向けの構成は依然として開発者向けです。プレビュー期間中は、統合を安定したチェックボックス操作ではなく、バージョン管理されたプラグイン作業として扱ってください。
長期間使う社内ワークフローを構築する前に、`dsh --profile web --dump-config` で実際に有効なツリーを確認してください。その出力は、実際に何がマウントされ、パッチ可能かを示します。リポジトリ内のすべてのパッケージが同梱プロファイルで有効だと決めつけるより信頼できます。
DeepSeek Harness、DeepSeek TUI、OpenDesign
DeepSeek Harness と DeepSeek TUI は、実行ファイルが異なる別々のプロジェクトです。OpenDesign は現在どちらもローカルエージェントとしてサポートしているため、選択の基準はどちらのランタイムを使いたいかであり、どちらがデザインワークスペースに入れるかではありません。
DeepSeek Harness（`dsh`） — ローカル Web UI とヘッドレスプロファイルを備えた DeepSeek AI 公式のプラグインファーストハーネス。ファーストパーティの OpenDesign アダプター — OpenDesign のアーティファクトワークフロー内で Harness のセッション、プロバイダー、プラグイン構成を活用する
DeepSeek TUI（`deepseek` / `codewhale`） — 独自の OpenDesign アダプターを備えた別個のターミナルコーディングエージェント — Harness のプロファイルアーキテクチャを伴わない、ターミナルファーストの DeepSeek ワークフロー
OpenCode — 成熟したオープンソースでプロバイダー非依存のターミナルエージェント — AGENTS.md と MCP を使い、安定した TUI ワークフロー内でモデルを切り替える
Claude Code — ターミナル、IDE、デスクトップ、Web にまたがる成熟したコーディングエージェント — フロントエンドの推論、画像の多いリファレンス、確立されたデザイン統合
OpenDesign — サポート対象のコーディングエージェントを中心としたエージェントネイティブなデザインワークスペースとライブラリ — 厳選されたデザインシステム、スキル、ビジュアルアーティファクト、そして特定のモデルベンダーに依存しないローカルワークフロー
公式の Web UI、プロファイルシステム、モデルカタログ、再開可能な Harness セッションが必要な場合は DeepSeek Harness を選んでください。そのエージェントのターミナルファーストなワークフローを好む場合は OpenDesign 内の DeepSeek TUI を選んでください。OpenDesign がどちらも同じデザインプロセスで包めるようになった今でも、両者は別個のランタイムであり続けます。
ツール — 概要 — 最適なデザイン用途
DeepSeek Harness（`dsh`） — ローカル Web UI とヘッドレスプロファイルを備えた DeepSeek AI 公式のプラグインファーストハーネス。ファーストパーティの OpenDesign アダプター — OpenDesign のアーティファクトワークフロー内で Harness のセッション、プロバイダー、プラグイン構成を活用する
DeepSeek TUI（`deepseek` / `codewhale`） — 独自の OpenDesign アダプターを備えた別個のターミナルコーディングエージェント — Harness のプロファイルアーキテクチャを伴わない、ターミナルファーストの DeepSeek ワークフロー
OpenCode — 成熟したオープンソースでプロバイダー非依存のターミナルエージェント — AGENTS.md と MCP を使い、安定した TUI ワークフロー内でモデルを切り替える
Claude Code — ターミナル、IDE、デスクトップ、Web にまたがる成熟したコーディングエージェント — フロントエンドの推論、画像の多いリファレンス、確立されたデザイン統合
OpenDesign — サポート対象のコーディングエージェントを中心としたエージェントネイティブなデザインワークスペースとライブラリ — 厳選されたデザインシステム、スキル、ビジュアルアーティファクト、そして特定のモデルベンダーに依存しないローカルワークフロー
公式の Web UI、プロファイルシステム、モデルカタログ、再開可能な Harness セッションが必要な場合は DeepSeek Harness を選んでください。そのエージェントのターミナルファーストなワークフローを好む場合は OpenDesign 内の DeepSeek TUI を選んでください。OpenDesign がどちらも同じデザインプロセスで包めるようになった今でも、両者は別個のランタイムであり続けます。
ツール — 概要 — 最適なデザイン用途
ビジュアル出力を台無しにする失敗を避ける
最大の過ちは、プレビューを安定した製品のように扱うこと、テキストのみのルートをビジョンモデルのように扱うこと、または柔軟なハーネスを視覚的センスの源のように扱うことから生じます。
カスタマイズする前に固定する: 互換性を破壊する変更は明示的なプレビューポリシーです。npm バージョンを固定し、アップグレード後にレビューできる程度にプロファイルパッチを小さく保ちます。
選択したモデルのモダリティを確認する: ネイティブの DeepSeek chat-completions ルートはテキストのみです。スクリーンショットからコード生成の場合、添付ファイルが理解されるだろうと想定するのではなく、画像対応プロバイダールートを選択して宣言します。
センスをデータとして提供する: エージェントにトークン、標準コンポーネント、参照状態、禁止パターンを与えます。デザイン契約のないモジュール式ランタイムは、依然として汎用的な UI を生成します。
プロファイルが実際にマウントするものを検証する: リポジトリパッケージは機能であり、デフォルトプロファイルがそれらを有効にした証拠ではありません。統合を文書化したり、それに依存したりする前に、構成された設定を検査します。
それぞれの緩和策は、コンテキストと検証の決定です。それこそが、デザインレイヤーが、各プロジェクトに再発見させるのではなく、再現可能にすべき作業です。
カスタマイズする前に固定する: 互換性を破壊する変更は明示的なプレビューポリシーです。npm バージョンを固定し、アップグレード後にレビューできる程度にプロファイルパッチを小さく保ちます。
選択したモデルのモダリティを確認する: ネイティブの DeepSeek chat-completions ルートはテキストのみです。スクリーンショットからコード生成の場合、添付ファイルが理解されるだろうと想定するのではなく、画像対応プロバイダールートを選択して宣言します。
センスをデータとして提供する: エージェントにトークン、標準コンポーネント、参照状態、禁止パターンを与えます。デザイン契約のないモジュール式ランタイムは、依然として汎用的な UI を生成します。
プロファイルが実際にマウントするものを検証する: リポジトリパッケージは機能であり、デフォルトプロファイルがそれらを有効にした証拠ではありません。統合を文書化したり、それに依存したりする前に、構成された設定を検査します。
それぞれの緩和策は、コンテキストと検証の決定です。それこそが、デザインレイヤーが、各プロジェクトに再発見させるのではなく、再現可能にすべき作業です。
ステップ2: OpenDesign 0.19.1以降をダウンロード
dsh がローカルで動作したら、残りは OpenDesign で行います。DeepSeek Harness 統合は OpenDesign 0.19.1 以降で利用可能です。
現在のデスクトップビルドを OpenDesign ダウンロードページ から入手し、インストールして、アプリを起動します。
現在のデスクトップビルドを OpenDesign ダウンロードページ から入手し、インストールして、アプリを起動します。
ステップ3: DeepSeek Harness を検出する
設定 → モデル＆プロバイダー → ローカル CLI を開き、再スキャンを選択します。インストール中にすでに開いていた場合は、OpenDesign を再起動するか、もう一度再スキャンします。OpenDesign がステップ1の `dsh` 実行可能ファイルを見つけると、DeepSeek Harness カードが表示されます。
ステップ4: OpenDesign プロファイルを接続する
DeepSeek Harness カードを選択します。「接続セットアップが必要です」と表示された場合は、「インストールして選択」を確認します。OpenDesign は独自のコンポーネントを検証し、dsh にそれを `open-design` プロファイルにインストールするように依頼し、再スキャンして接続をテストします。
これがチェックポイントです: 検出された Harness バージョン、「CLI から同期済み」、および機能するテストアクション。
これで接続が完了します。UI と `od agent setup deepseek-harness --json` は同じローカルセットアップパスを使用します。各実行は `dsh --profile open-design --stdio` を開始し、Harness は後続のターンのためにセッション ID を保持します。
これがチェックポイントです: 検出された Harness バージョン、「CLI から同期済み」、および機能するテストアクション。
これで接続が完了します。UI と `od agent setup deepseek-harness --json` は同じローカルセットアップパスを使用します。各実行は `dsh --profile open-design --stdio` を開始し、Harness は後続のターンのためにセッション ID を保持します。
ステップ5: デザインタスクを開始する
カードに Harness バージョンと「CLI から同期済み」が表示されていることを確認し、テストをクリックします。テストが合格したら、プロジェクトを開くか作成し、DeepSeek Harness と同期済みモデルを選択して、デザインリクエストを送信します。
DeepSeek Harness は実際のワークスペースを編集し、OpenDesign はリクエスト、進行状況、プレビュー、最終成果物をまとめて保持します。
境界はシンプルに保たれます: Harness は dsh、資格情報、モデル、セッションを所有し、OpenDesign は検証済みの接続プロファイルとデザインワークスペースを所有します。OpenDesign は DeepSeek AI から独立しており、DeepSeek および DeepSeek Harness はそれぞれの所有者の商標です。
以前のガイドからの履歴コマンド例。現在の構文は、リンク先のベンダードキュメントで確認してください。
DeepSeek Harness は実際のワークスペースを編集し、OpenDesign はリクエスト、進行状況、プレビュー、最終成果物をまとめて保持します。
境界はシンプルに保たれます: Harness は dsh、資格情報、モデル、セッションを所有し、OpenDesign は検証済みの接続プロファイルとデザインワークスペースを所有します。OpenDesign は DeepSeek AI から独立しており、DeepSeek および DeepSeek Harness はそれぞれの所有者の商標です。
このワークスペースで洗練された製品ランディングページを作成します。\nDESIGN.md、AGENTS.md、インストール済みのフロントエンドスキルをビジュアルコントラクトとして使用します。\nプロジェクトのトークンとコンポーネントを再利用し、デスクトップとモバイルの状態を含めます。\nアプリを実行し、レンダリング結果を検査し、目に見える間隔と階層の問題を修正し、\n最終的な HTML とアセットを OpenDesign がプレビューできるようにプロジェクトに残します。以前のガイドからの履歴コマンド例。現在の構文は、リンク先のベンダードキュメントで確認してください。
DeepSeek Harness は公式ですか？
はい。DeepSeek AI によって開発され、MITライセンスの下で公開されています。