SuperAPI AI 工具集

ux-cards

通用与其它

查看项目

更新于 10-16 01:27

技能介绍

用途:该技能用于设计或评审 UI 卡片(card),核心理念是一张卡片只装一个可消化主题、放在一个容器里并邀请探索。资料指出卡片布局适合浏览,不适合查找,因此先要判断内容是被浏览还是被搜索:卡片彼此平等,适合信息流、图库、仪表盘;有排序、需按规格比较的场景应改用列表或表格。

主要能力与核心规则:始终适用的一条卡片一个主题;卡片是摘要而非全文,用渐进披露和省略号引导打开;卡内要有层级,用大小、字重、颜色和位置区分标题与预览、主操作与次操作;保持克制,优先排版与留白而非分割线,一张卡片最多一个阴影,不为卡内媒体、按钮或图标再加阴影,内边距外边距一致,标签简洁;图片质量要好,图上文字对比度不低于 4.5:1,可用半透明深色遮罩。

按情境决策:浮起卡片适合需要可点击暗示的交互卡片,密集仪表盘应慎用;描边卡片适合无深度分组;扁平卡片需有对比背景和悬停微交互;单一操作可整卡可点击,多操作需内部按钮层级;富媒体卡片适合视觉即内容的浏览场景;用户卡片用于人物场景,头像、姓名、状态加一个 CTA;卡片网格用于发现,列表表格用于查找。

使用方式:先确认被卡片化的内容与消费方式,应用核心规则,再呈现容器样式与交互决策的取舍;完成后交给 ux-heuristics-audit、ux-accessibility-audit、ux-aesthetics-audit、ux-microcopy-audit 等审计技能验证,未安装某技能时用本技能自身规则继续,不阻塞。

限制:资料未提供具体价格、平台或安装命令等事实。