1仕組みと動作原理
サードパーティSaaS（Sleek）のREST API呼び出しにより機能を実現：エージェントはSleekのAPIクライアントとして機能し、`POST /api/v1/projects/:id/chat/messages` を介してユーザーの意図をSleekサーバーに送信します。SleekのAIが画面を生成し、エージェントは結果の取得とスクリーンショットの提示を担当します。スキル本体にはデザインやレンダリングのコードは一切含まれません。
skills/design-mobile-apps/SKILL.md
[sleek.design](https://sleek.design) is an AI-powered mobile app design tool. You interact with it via a REST API at `/api/v1/*` to create projects, describe what you want built in plain language, and get back rendered screens.
SKILL.mdは完全なAPIマニュアルとして機能します：エンドポイント、認証、ポーリング、エラーコード、スクリーンショットパラメータが単一ファイル（564行）に網羅されており、モデルはこのマニュアルに沿ってSleekサービスを駆動します。
認証は環境変数のBearerトークンを使用：すべてのリクエストに `Authorization: Bearer $SLEEK_API_KEY` を付与し、frontmatterでrequires-envを宣言します。
skills/design-mobile-apps/SKILL.md
**Auth**: `Authorization: Bearer $SLEEK_API_KEY` on every `/api/v1/*` request
compatibilityフィールドには 'Requires SLEEK_API_KEY environment variable. Network access limited to https://sleek.design only.' と明記されており、認証情報はホスト環境から提供されます。
キーがない場合はOAuthライクなdevice flowを実行：POST /device/start を呼び出して verificationUrl + userCode + deviceCode を取得し、ユーザーがブラウザで確認した後、/device/poll をポーリングしてキーを取得し、SLEEK_API_KEY に書き込みます。
skills/design-mobile-apps/SKILL.md
If `SLEEK_API_KEY` is not set, use the device flow so the user never handles the raw key: 1. `POST https://sleek.design/api/v1/device/start` (no auth) with body `{"source": "your-tool-slug"}`. The response contains a `verificationUrl`, a human-checkable `userCode`, a secret `deviceCode`, and a poll `interval` in seconds. 2. Show the user the `verificationUrl` and the `userCode`, and tell them to confirm the code matches before approving. 3. Poll `POST https://sleek.design/api/v1/device/poll` with `{"deviceCode": "..."}` every `interval` seconds. When the user approves, the poll returns `{"status": "approved", "key": "sk_..."}` exactly once: store it as `SLEEK_API_KEY`.
処理内容：キーの取得手順を「ユーザーによる手動コピー＆ペースト」から、ユーザーが確認可能なブラウザ承認フローへと置き換えます。返却された sk_ キーは、後続のリクエストで使用するためにモデルによって環境変数に書き込まれます。
デザインワークフロー＝プロジェクト → チャットメッセージ → runポーリング → スクリーンショットの閉ループ：単一のチャットで完全な意図をそのまま送信し、Sleek側で画面構成やレイアウトを自動計画させ、エージェントはrunIdがcompletedになるまでポーリングした後にスクリーンショットをユーザーに提示します。
skills/design-mobile-apps/SKILL.md
Send the request with `POST /api/v1/projects/:id/chat/messages`. Sleek plans screen content and layout from your message, and will invent a visual style if you don't give it one. Don't decompose the request into screens and don't add product details the user didn't ask for; send the full intent as a single message.
エージェントが画面を独自に分割したり意図を過剰に解釈することを明示的に禁止：意図を丸ごと直接送信してSleek側に計画を委ねます。責務の境界は「エージェントは要件を伝達し、Sleekがデザインを生成する」ことです。
非同期処理の規律：チャットはデフォルトで非同期（202 + runId）、ポーリングは2秒→5秒のバックオフで上限5分。`?wait=true` で最大300秒ブロッキング可能。1プロジェクトにつき1つのrun（409コンフリクト処理）、およびidempotency-keyによる冪等な再試行。
skills/design-mobile-apps/SKILL.md
chat messages are async by default: you get a `runId` and poll `GET /api/v1/projects/:id/chat/runs/:runId`. Start at 2s interval, back off to 5s after 10s, give up after 5 minutes.
ポーリングプロトコルは実行可能なパラメータ（間隔、バックオフ、上限、タイムアウトのセマンティクス）として記述され、モデルの空転を防ぐためのアンチパターン（'if you can't read the status, stop and report it'）も提示されています。
結果検証の閉ループ：runによってscreen_created/updatedが発生した場合、必ず POST /api/v1/screenshots でユーザーにスクリーンショットを提示しなければならず、サイレントな完了は許可されません。自己確認時はfullHeightを使用してページ全体を再撮影します。
skills/design-mobile-apps/SKILL.md
After every chat run that produces `screen_created` or `screen_updated` operations, **take screenshots and show them to the user** using `POST /api/v1/screenshots`. The step is done only when the user has seen a screenshot of every screen the run created or updated; never complete a run silently.
'never complete a run silently'（サイレントにrunを完了してはならない）は厳格な検収ルールです。viewportスクリーンショットはユーザー提示用であり、モデルの自己確認ではコンテンツ欠落の誤認を防ぐためfullHeightでの再撮影が必須です。
コード実装への落とし込みパス：コンポーネントHTML（activeVersionまたは固定バージョン）を取得して .html として保存。React NativeやSwiftUIの場合はHTMLとスクリーンショットの双方を参照し、アイコンはIconify API経由、フォントはHTMLのlinkタグから取得します。
skills/design-mobile-apps/SKILL.md
The component `code` is a complete HTML document. Save it directly to a `.html` file. No build step needed.
実装セクションでは、エージェントがSleekによって生成されたHTMLをローカルファイルに直接書き込むよう指示します。ネイティブフレームワーク向けには、固定バージョン（componentVersionOverrides/themeVersionOverrides）やIconify/フォントの再現性に関する詳細なルールが用意されています。
独自のセキュリティ規約：単一ホスト、HTTPS限定、キーはAuthorizationヘッダー経由のみ、最小スコープキーの使用。
skills/design-mobile-apps/SKILL.md
**Single host**: All requests go exclusively to `https://sleek.design`. No data is sent to third parties.
Security & Privacyセクションで境界の宣言を明記。また、imageUrlsはSleekサーバーによってフェッチされるため機密URLの送信を避けるよう警告し、「外部画像をサーバーがフェッチする」仕様を明確にしています。
2コア機能
01Sleekプロジェクトのライフサイクル全般管理（list/create/get/delete）
02自然言語によるモバイル画面の生成・変更（全意図を直接送信するチャットメッセージ）
03スタイル方針の記述と参考スタイルのシード設定（referenceIdまたはstyle directionのいずれか）
04非同期runのポーリング/キャンセル/冪等な再試行/並行性制約（2s→5s→5min、409、idempotency-key）
05スクリーンショット検証の閉ループ（ユーザー向けスクリーンショット + fullHeight自己確認 + 並行リクエスト + 透過背景）
06実装に向けたコンポーネントHTMLの取得（固定バージョンによる正確な再現を含む）
07アイコン・フォントの高忠実度移行（Iconify APIからのSVG取得、Google Fonts抽出、react-native-svgによるレンダリング）
08device flowによるシームレスなキー取得 + エラーコードに応じたユーザーアクション案内（401/403/429修復ページURL、out_of_credits課金ページ案内）
3外部依存関係
| Kind | Dependency / Endpoint |
|---|---|
| api | Sleek REST API (sleek.design) |
| api | Sleek OpenAPI spec |
| api | Iconify API（仅实现原生图标时） |
| cli | curl |
| package | react-native-svg（SvgXml，仅 RN 实现路径） |
4推奨統制措置と判定根拠
安全運用のための推奨統制措置
Agent 向け
段階的・都度認可、サンドボックス推奨
管理者向け
承認フロー、ロールバック可能、全履歴監査
判定根拠（ファイルパスと抜粋）
- scripts/: ローカルスクリプトまたはコマンドの実行: curl（ホストによる実行: `curl -o run.json` および 'use shell commands to fetch the API respon
- 网络端点: 外部ネットワークアクセスの宣言: https://sleek.design/api/v1/*（プロジェクト/chat/run/スクリーンショット/リファレンス等の全エンドポイント、Bearer認証）
- 本地工作目录: ファイルの読み書きおよび成果物の出力: プロジェクトディレクトリへのスクリーンショット保存（'Save screenshots in the project directory'）
監査ノート： 実際の接触面：認証情報レベルの環境変数SLEEK_API_KEYを読み取り、BearerトークンとしてサードパーティSaaS（sleek.design）に外部送信します。また、device flowを用いてキーを取得し環境変数に書き込みます。外部ネットワーク通信先は予測可能（公式API＋実装時のIconify）であり、キーはAuthorizationヘッダーのみで使用され、最小スコープ指針とHTTPS限定の宣言を備えており、不正な外部送信はありません。サーバー生成のHTMLをローカルのプロジェクトファイルに出力します。統一基準による判定：認証情報へのアクセスがあるため（外部送信の有無にかかわらず）オレンジ判定。判定理由：SLEEK_API_KEYの読み取り ＋ サードパーティAPIへの依存 ＋ サーバー生成物のディスク保存。信頼できるホスト環境および最小スコープのキーでのみ使用することを推奨します。
5二重目の独立検証
- [ok] 鉴权与凭证读取 — '**Auth**: `Authorization: Bearer $SLEEK_API_KEY` on every `/api/v1/*` request' 原文在；frontmatter requires-env: SLEEK_API_KEY。无其他凭证访问。
- [ok] device flow 换 key — device/start（无鉴权拿 verificationUrl/userCode/deviceCode）+ device/poll 轮询换 sk_ key 并 'store it as SLEEK_API_KEY' 的原文完整存在。
- [ok] 网络外发 host 清单 — 正则扫描全部 URL host 仅 sleek.design（功能主体）与 api.iconify.design（图标实现）；example.com 是 imageUrls 文档占位；'Single host… No data is sent to third parties' 与实现路径的 iconify 调用并存——严格说 iconify 为第二外发点，但系文档明示的实现步骤，非隐蔽行为。
- [ok] 本地文件写入 — 'Save screenshots in the project directory'、'Save it directly to a `.html` file'、'curl -o run.json'、SVG 存静态资源四处写入指令均有原文。
- [ok] 无脚本内置 — skill 目录仅 SKILL.md 一个文件，仓库无 scripts/；curl/写文件全部由宿主按指示执行，无自带可执行代码。
- [ok] 端点表与正文一致性 — Quick Reference 11 个端点（projects/components/references/chat runs/cancel/screenshots）与正文 HTTP 示例逐一对应，参数表含 required/默认值/级联（padding）语义。
- [ok] 异步轮询纪律 — 'Start at 2s interval, back off to 5s after 10s, give up after 5 minutes' 与 '?wait=true'（300s 上限、202 超时转轮询）原文在，非编造。
- [ok] 截图验收闭环 — 'never complete a run silently' + fullHeight 自查（'re-shoot the screen with `fullHeight: true`'）+ 并行截图建议原文均在。
6結論
最適な用途： SleekのアカウントおよびAPIキーを保有し、AIエージェントを用いてモバイルUI画面を一括生成・反復改善したいデザイナーや開発者。Sleekのデザインをコード（HTMLプロトタイプ、React Native、SwiftUI）へアイコンやフォントの再現性を保ちながら実装したいエンジニアリング現場。「デザイン機能はクラウドSaaS側にある」というアーキテクチャを受け入れ可能なユーザーに最適です。
不向きな用途： Sleekアカウントがない、または有料クラウドSaaSにデザイン作業を任せたくないユーザー。デザインデータを外部送信せず、認証情報も使わずに完全ローカルで完結させたい環境。アイコンやフォントの再現性を問わず、単なる静的表示（スクリーンショットのみで十分）で済むユースケース。外部通信がホワイトリスト等で厳格に制限されているホスト環境（frontmatterのallowed-hostsにはsleek.designのみ記載されていますが、アイコン実装時にapi.iconify.designへのアクセスが必要となる点に注意）。
Install Agent-Ready
① Verified Mirror 2026-09-09
Option A · Direct DownloadDownload design-mobile-apps.tar.gz
sha256:
Option B · Copy Guide for Agent215af338726abdb5…Agent はこの JSON ガイドから自動的にダウンロードして検証します。
② Upstream GitHub
GitHub Repo ↗
Pinned to commit 2aaa24df05.