fronted-design
- Repo stars 142
- Author repo XRK-AGT
权威入口
.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。
- 交付前检查响应式、可访问性与性能边界。
常见陷阱
- 只改样式不改信息层级,导致可用性仍差。
- 动效过多影响主任务与页面性能。
- 忽略空态与错误态,导致体验断层。
- Fluxly category
- Design
- Author-declared agents
- No explicit declaration found; this is not inferred or tested compatibility
- Static check
- 88 / 100 · heuristic scan, not runtime safety proof
- Author / version / license
- @sunflowermm · no license declared
- Fluxly token estimate
- Lean
- Fluxly setup estimate
- Plug-and-play
- External API key
- No requirement detected
- Detected OS requirements
- Unspecified
- Runtime requirements
- Unspecified
- Detected file/system behavior
-
- Read-only
- Detected network behavior
- Local-only
- Install commands
- None (reference only)
Profile is derived at build time from SKILL.md and install vectors. Subject to drift from author intent.
Heads up: 未限定 allowed-tools,默认拥有全部工具权限。
The current SKILL.md does not define a fixed output example. 权威入口
.cursor/skills/fronted-design/SKILL.md 可配合: .cursor/skills/visual-design-foundations/SKILL.md 可配合: .cursor/skills/interaction-design/SKILL.md
适用场景
从需求到页面落地的 UI 实现任务。 需要提升现有界面的视觉层级与一致性。 需要在不改业务逻辑前提下优化体验。
非适用场景
不用于替代业务接口设计或数据库建模。 不用于无依据的大改风格(需与品牌/产品目标一致)。
执行步骤
明确页面目标、核心用户任务与成功标准。 设计结构层级:布局、信息密度、主要操作路径。 定义视觉规则:颜色、字体、间距、状态反馈。
常见陷阱
只改样式不改信息层级,导致可用性仍差。 动效过多影响主任务与页面性能。 忽略空态与错误态,导致体验断层。
## 权威入口
- ` .cursor/skills/fronted-design/SKILL.md `
- 可配合:` .cursor/skills/visual-design-foundations/SKILL.md `
- 可配合:` .cursor/skills/interaction-design/SKILL.md `
## 适用场景
- 从需求到页面落地的 UI 实现任务。
- 需要提升现有界面的视觉层级与一致性。
- 需要在不改业务逻辑前提下优化体验。
## 非适用场景
- 不用于替代业务接口设计或数据库建模。
- 不用于无依据的大改风格(需与品牌/产品目标一致)。
## 执行步骤
1. 明确页面目标、核心用户任务与成功标准。
2. 设计结构层级:布局、信息密度、主要操作路径。
3. 定义视觉规则:颜色、字体、间距、状态反馈。
4. 补全交互细节:hover/focus/loading/empty/error。
5. 交付前检查响应式、可访问性与性能边界。
## 常见陷阱
- 只改样式不改信息层级,导致可用性仍差。
- 动效过多影响主任务与页面性能。
- 忽略空态与错误态,导致体验断层。 Evidence boundary and execution chain
Author text anchors workflow facts; Fluxly only indexes current sections, terms, files, and commands.
sections -> 权威入口 → 适用场景 → 非适用场景 → 执行步骤 → 常见陷阱
terms -> - 从需求到页面落地的 UI 实现任务。 · - 不用于替代业务接口设计或数据库建模。 · 1. 明确页面目标、核心用户任务与成功标准。 · - 只改样式不改信息层级,导致可用性仍差。
files/cmd -> .cursor/skills/fronted-design/SKILL.md · .cursor/skills/visual-design-foundations/SKILL.md · .cursor/skills/interaction-design/SKILL.md · hover/focus/loading/empty/error
body sha256 -> d7331c75f274
Decide Fit First
Design Intent
How To Use It
Boundaries And Review