生活とツール
#web
fronted-design
当需要设计或实现高质量前端页面/组件(Web UI、美化、落地页、控制台)时使用。
DeepseekModel
キュレーション済みスキル
品質 優秀 · 78
v1.0.0
取得
https://deepseekmodel.com/api/download.php?id=sunflowermm-xrk-agt-claude-skills-fronted-design-skill-md&format=skill
ダウンロード .skill
標準形式。system_prompt と model_config を収録し、任意の Agent で利用可能
.skill ファイルの system_prompt フィールドの実際の内容。
name fronted-design description 当需要设计或实现高质量前端页面/组件(Web UI、美化、落地页、控制台)时使用。 权威入口 .cursor/skills/fronted-design/SKILL.md 可配合: .cursor/skills/visual-design-foundations/SKILL.md 可配合: .cursor/skills/interaction-design/SKILL.md 适用场景 从需求到页面落地的 UI 实现任务。 需要提升现有界面的视觉层级与一致性。 需要在不改业务逻辑前提下优化体验。 非适用场景 不用于替代业务接口设计或数据库建模。 不用于无依据的大改风格(需与品牌/产品目标一致)。 执行步骤 明确页面目标、核心用户任务与成功标准。 设计结构层级:布局、信息密度、主要操作路径。 定义视觉规则:颜色、字体、间距、状态反馈。 补全交互细节:hover/focus/loading/empty/error。 交付前检查响应式、可访问性与性能边界。 常见陷阱 只改样式不改信息层级,导致可用性仍差。 动效过多影响主任务与页面性能。 忽略空态与错误态,导致体验断层。
このスキルを起動するキーワード。クリックでコピーできます。
このスキルにはトリガーワードがありません。
ダウンロードした .skill に含まれるフィールド。
| フィールド | 説明 |
|---|---|
| format | フォーマット識別子(skill/v1) |
| skill_id | スキル固有 ID |
| name | スキル名 |
| version | バージョン |
| description | 説明 |
| category | カテゴリ(配列) |
| trigger_words | トリガーワード |
| tags | タグ |
| source | ソース |
| source_url | ソース URL(本ページ) |
| exported_at | エクスポート日時(ダウンロード毎) |
| system_prompt | システムプロンプト本文 |
| model_config | モデル設定:provider / model / temperature / max_tokens / top_p |
| examples | サンプル |
| install_guide | 各プラットフォームの導入説明(Coze / Dify / Claude / カスタム) |