agentsclimarketplace

Flow ui optimize

Skill laozaidad/feflow/skills/flow-ui-optimize

UI/UX 优化流程。v2 在通用 Delivery 之上叠加视觉一致性、状态完整性和多端表现约束。From its SKILL.md

Install
npx -y skills add laozaidad/feflow --skill flow-ui-optimize

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

  • 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

SKILL.md

2.2 KB, as published. Nobody here has run it

flow-ui-optimize — v2 UI/UX 优化流程

flow-ui-optimize 是 flow-feature 的 UI 特化版本。

核心目标不是“写一份设计流程文档”,而是:

  1. 明确当前 UI/UX 问题
  2. 形成可信的改善方向
  3. 在实现后验证视觉、交互和状态完整性

适用场景

  • 视觉统一
  • 交互调整
  • 响应式修复
  • 无障碍改进
  • 动效和状态反馈优化

硬规则

  1. 先读现有页面、组件和样式,不凭空想象问题。
  2. 不要把 UI 优化任务强行拆成“方案评审一次、技术评审一次、再实施”的固定流程。
  3. L1 UI 调整允许直接实现,但必须覆盖基本状态检查。
  4. 优先复用设计系统、已有 token 和现有组件模式。

风险分级建议

级别特征默认策略
L1局部视觉或交互优化直接做 + 核心状态检查
L2多组件联动或多端适配简短方案 + 多状态验证
L3设计系统、共享组件、大范围交互重构强治理 + 设计一致性审查

执行重点

问题定义

先明确当前问题属于哪一类:

  • 视觉不一致
  • 操作路径不顺
  • 状态反馈不足
  • 响应式缺陷
  • 无障碍问题
  • 国际化溢出或布局不稳定

方案形成

只有在确实存在方向分叉时,才需要单独呈现多个方案。

大多数 L1/L2 UI 任务可以:

  • 读现有实现
  • 给出简短改善方向
  • 直接落地

实施

实施时优先顺序:

  1. 复用已有 token / 组件
  2. 保持布局与状态稳定
  3. 再处理细节视觉和交互感受

强制验证项

UI 任务至少检查这些状态是否合理:

  • loading
  • empty
  • error
  • success
  • disabled
  • hover / focus
  • mobile

视任务需要再检查:

  • dark mode
  • i18n 文本溢出
  • 权限态 / 登录态

何时需要确认

  • 视觉方向和交互方向存在明显分叉
  • 改动会改变用户路径或操作心智
  • 会突破现有设计系统边界

除此之外,不要因为“UI 任务”就默认卡在方案评审。

Keep looking

Skills are one crate of 627,801. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.