卡片 Card
活动列表需要让每个活动拥有自己的标题、时间、地点和详情入口。
前端与交互约 10 分钟 · 从真实需求理解
1卡片如何把一个对象收在一起?
活动对象 · 独立边界卡片如何把一个对象收在一起?
商品摘要河畔市集 · 周六 14:00 · 河畔广场 · 免费媒体、信息和详情入口还没有共同边界。
卡片 负责把一个对象的重点信息、媒体和动作收进清晰边界,让对象可以被独立浏览或进入。
- 先确认用户是在阅读、比较、筛选还是继续操作,再选择对应的内容结构。
2卡片和相近结构,什么时候不能互换?
卡片的判断依据不是外观,而是用户正在阅读、比较、筛选或继续操作的关系。[[列表|list]只在语义边界符合时替代它。
- 先确认用户是在阅读、比较、筛选还是继续操作,再选择对应的内容结构。
3卡片由哪些真实部分组成?
活动对象 · 独立边界卡片如何把一个对象收在一起?
轻量18L防水面料
城市通勤
河畔市集
周六 14:00 · 河畔广场
免费组成部分来自真实 DOM:对象边界、媒体区域、对象信息、详情入口。标注只帮助定位结构,不复制一套新的内容。
- 先确认用户是在阅读、比较、筛选还是继续操作,再选择对应的内容结构。
4卡片有哪些对象呈现差异?
低密度摘要卡片
摘要卡片活动 · 河畔市集时间 · 周六 14:00
快速识别媒体卡片
媒体卡片图片 · 活动封面地点 · 河畔广场
继续查看入口卡片
入口卡片对象 · 河畔市集入口 · 查看活动
区分简洁卡片、媒体卡片和可进入卡片。
- 先确认用户是在阅读、比较、筛选还是继续操作,再选择对应的内容结构。
5卡片放进真实场景后怎样回应?
打开活动详情
卡片打开活动详情
当前卡片进入已打开状态,其他活动卡片不改变。用户正在浏览多个独立活动对象。
卡片动作应跟随对象边界,并保留可识别的局部反馈。
- 先确认用户是在阅读、比较、筛选还是继续操作,再选择对应的内容结构。
6卡片什么时候用、什么时候不用?
河畔市集
时间、地点和详情入口属于同一个活动。
| 项目 | 状态 |
|---|
- 01
- 02
标题、媒体、说明和动作都属于同一对象。
- 先确认用户是在阅读、比较、筛选还是继续操作,再选择对应的内容结构。
7怎样把卡片需求交给 Agent?
请用卡片实现活动列表需要让每个活动拥有自己的标题、时间、地点和详情入口。,先说明内容关系、可观察结果和窄屏策略;不要用相邻结构替代它,也不要添加没有语义责任的装饰。
8不用背,看看你能不能判断
1 / 3
卡片的边界应该属于什么?
请选择一个最符合题意的答案
社区延伸
看别人真实遇到过什么
社区帖子还没有关联到这个词条。