SuperAPI AI 工具集

ux-design

设计与创作

查看项目

更新于 10-16 03:37

技能介绍

UX Design 聚焦应用的结构与行为层,即用户如何在产品中移动、找到所需内容并以最小阻力完成任务,涉及信息架构、导航、用户流程、交互模式与错误处理。视觉设计(颜色、字体、布局)属于 beautify 与 ui-patterns 技能,引导流程见 ONBOARDING.md,无障碍实现见 ACCESSIBILITY.md,本文暂未提供这些关联文档的详细内容。

信息架构:目标是用户不必思考在哪里找东西,导航应匹配用户心智模型而非数据库结构。原则包括层级扁平优先(导航最多两层)、标签即架构(模糊标签需更换)、按用户任务而非数据类型分组、每组 5-9 项、最常用项靠前。URL 需映射信息架构,使用名词、小写加连字符、有意义 ID、路径最多三层,筛选状态放入查询参数。

页面类型:仪表盘展示概览指标、快捷操作与最近活动;列表页支持筛选、排序、搜索并显示条目数;详情页展示单个对象及其关联;设置页按区块分组保存,而非整页一个保存按钮;空状态需说明页面内容并提供单个添加 CTA。

导航模式按复杂度选择:顶部导航用于 3-7 项且重要性相近的简单产品;侧边栏用于 5-20 项、含子分区的复杂产品;标签页用于单一实体的 2-6 个相关视图;命令面板(Cmd+K/Ctrl+K)作为补充,包含导航、操作与搜索三类结果;面包屑用于深度超过两层的页面。

用户流程:绘制用户从意图到完成的所有步骤(含导航、点击、表单、确认),识别卡点,删除多余步骤,常见任务目标为三步内完成。减少步骤的方法有智能默认值、就地创建、批量操作、记住上次选择、合并相关步骤。

交互模式:每次操作需在 100ms 内给出反馈,1 秒内显示按钮加载,1-10 秒显示进度或骨架屏,超过 10 秒显示进度条并允许后台处理。可逆操作不确认,可恢复的破坏性操作使用 5-8 秒的撤销提示,不可逆高风险操作才用确认对话框并可能要求输入确认文本。单字段改动用行内编辑,多字段改动用模态或抽屉,复杂创建用整页。低风险操作可用乐观更新并在失败时回滚,金融交易、权限变更等应等服务器确认。渐进披露分始终可见、交互触发、按需、可发现四层,但错误状态、破坏性后果、必填信息和当前状态不应隐藏。

错误处理:错误信息需说明发生了什么、为何发生、如何修复。表单在失焦时行内校验,错误紧邻字段并用 aria-invalid 与 aria-describedby 关联;无结果时提示清除筛选;加载失败可显示上次良好状态或重试;部分失败需分别展示成功与失败项。网络失败可按 1 秒、2 秒、4 秒指数退避自动重试最多三次,之后提供手动重试。

感知性能:使用乐观更新、骨架屏、进度指示、懒加载与预取提升速度感;不要出现空白屏,状态切换加动画,200ms 内完成的操作不显示加载指示,优先加载首屏内容。