design-mobile-apps

它能做什么

中文摘要

该技能通过 Sleek 的 REST API（https://sleek.design/api/v1/*）完成移动应用界面设计：创建项目、根据 brief 设计屏幕、获取 HTML 与渲染截图，并把设计实现为 React Native 或 HTML。使用前需配置 SLEEK_API_KEY；若未设置，可走公开的设备授权流程（device/start + device/poll）让用户在不接触明文密钥的情况下完成授权。文档给出完整端点表（projects、components、references、chat messages 与 runs、screenshots、share-cards），并区分两种截图：user shot（默认、手机视口高度、给用户看）和 review shot（fullHeight: true、单组件、用于自检）。设计环节遵循 create → chat → screenshot 循环，实现环节需先读取 implementing.md 了解版本选择、原生转换、功能实现与验收检查。免费账号可用一次性试用额度（约一次设计运行），持续使用需 Pro 及以上；渲染上限为每组织每小时 1000 次截图与分享卡片。

为什么推荐

推荐理由

适合需要把移动端界面从需求一路做到可交付物（设计稿 + HTML/渲染图 + React Native/HTML 实现）的团队或开发者。它的价值在于把设计、评审、实现串成一条可脚本化的 API 流程，并提供设备码授权、明确的错误码与配额说明，便于在 Agent 中自动化调用；同时用 user shot / review shot 分离用户展示与自检，减少返工。若只需一次轻量尝试，免费额度即可验证首个设计，但持续使用涉及付费与密钥配置，接入前应了解计费与每小时渲染上限。

什么时候用

适用场景

• 根据文字 brief 生成移动应用界面设计稿并获取渲染截图
• 通过 chat 消息迭代修改 Sleek 项目中的屏幕设计
• 把已有的 Sleek 设计实现为 React Native 或 HTML 代码
• 在未配置 SLEEK_API_KEY 时用设备码流程完成授权并获取密钥
• 用 fullHeight 的单组件 review shot 对设计结果做自检
• 在自动化 Agent 中按端点表调用项目、组件、聊天运行与截图接口

使用前先看

主要亮点

• 01

  基于 sleek.design 的 REST API（/api/v1/*），认证方式为 Authorization: Bearer $SLEEK_API_KEY

• 02

  提供公开的设备授权端点 /api/v1/device/start 与 /api/v1/device/poll，用户可通过 verificationUrl 和 userCode 确认后一次性获得密钥

• 03

  端点表覆盖 projects、components、references、chat messages/runs（含取消）、screenshots、share-cards，并标注所需 scope

• 04

  截图分两类：user shot 为默认手机视口高度；review shot 使用 fullHeight: true 且每次一个组件，用于自检

• 05

  设计流程为 create → chat → screenshot 循环，可在一次运行中先设计再实现（如设计后在 Expo 中构建）

• 06

  实现前需参考 implementing.md 的版本选择、原生转换、功能实现与验收检查

• 07

  错误码包含 401/403/404/400/409/429/500，其中 401、403、429 可能返回可用于修复的 data.url

• 08

  渲染上限为每组织每小时 1000 次截图加分享卡片，仅统计 API-key 请求

• 09

  免费账号可用一次性试用额度（约一次设计运行），持续使用需 Pro 及以上，价格需从 https://sleek.design/agents.md 获取

• 10

  文档提示应把响应体写入文件再解析，避免 zsh 将字符串中的 \n 展开导致 JSON 非法

原始文档

原文摘录

Designing with Sleek [](https://sleek.design) Overview