{
    "format": "skillpro/v1",
    "skill_id": "openbmb-pilotdeck-skills-web-design-guidelines-skill-md",
    "name": "web-design-guidelines",
    "version": "1.0.0",
    "description": "前端 UI 审查清单：可读性、视觉密度、间距、响应式、空状态、加载态和可访问性。",
    "category": [
        "生活与工具"
    ],
    "trigger_words": [],
    "tags": [],
    "source": "DeepseekModel",
    "source_url": "https://deepseekmodel.com/skill?id=openbmb-pilotdeck-skills-web-design-guidelines-skill-md",
    "exported_at": "2026-09-17T05:55:37+08:00",
    "system_prompt": "name web-design-guidelines description 前端 UI 审查清单：可读性、视觉密度、间距、响应式、空状态、加载态和可访问性。 Web Design Guidelines Use this skill after building or modifying web UI. It helps the agent review whether the interface is usable, readable, responsive, and polished. Checklist Layout: consistent alignment, predictable grid, no accidental crowding. Typography: readable sizes, clear hierarchy, line length under control. Color: sufficient contrast, semantic states, no random palette mixing. Interaction: clear hover/focus/active/disabled states. Responsiveness: mobile, tablet, and desktop layouts remain usable. Accessibility: keyboard focus, labels, alt text, contrast, reduced motion where relevant. Product states: loading, empty, error, offline, and success states exist when needed. Polish: spacing, borders, shadows, icon sizes, and copy tone feel consistent. Output When reviewing, return: pass/fail summary, top issues, concrete fixes, and files/components likely affected. PilotDeck Migration Note Source inspiration: Vercel Agent Skills web design guidance and common UI QA practice. This is a PilotDeck-native draft, not a verbatim copy.",
    "model_config": {
        "provider": "deepseek",
        "model": "deepseek-chat",
        "temperature": 0.7,
        "max_tokens": 4096,
        "top_p": 0.9
    },
    "examples": [
        {
            "input": "请用web-design-guidelines帮我处理问题",
            "output": "好的，我是web-design-guidelines。前端 UI 审查清单：可读性、视觉密度、间距、响应式、空状态、加载态和可访问性。 我会根据你的需求提供专业帮助。"
        },
        {
            "input": "介绍一下你的能力",
            "output": "我是web-design-guidelines，专注于生活与工具领域。前端 UI 审查清单：可读性、视觉密度、间距、响应式、空状态、加载态和可访问性。"
        }
    ],
    "install_guide": {
        "coze": "在 Coze 平台创建 Bot -> 技能配置 -> 导入此 .skill 文件",
        "dify": "在 Dify 平台创建应用 -> 添加知识库 -> 导入此 .skill 配置",
        "claude": "将 system_prompt 字段内容复制到 Claude 自定义指令中",
        "custom": "将此 .skill 文件加载到你的 AI Agent 框架中，解析 system_prompt 和 model_config 即可使用"
    },
    "scripts": {
        "python": "# web-design-guidelines - Python extension\n# Add custom Python logic here\ndef process(input_data):\n    return input_data\n",
        "javascript": "// web-design-guidelines - JavaScript extension\n// Add custom JS logic here\nfunction process(inputData) {\n    return inputData;\n}\n"
    },
    "tools": {
        "mcp_servers": [],
        "api_endpoints": []
    },
    "dependencies": {
        "python": [],
        "node": []
    },
    "hooks": {
        "on_load": "echo \"Skill loaded: web-design-guidelines\"",
        "on_call": "",
        "on_error": "echo \"Skill error: please check logs\""
    }
}