体验碎周报第286期(2026.7.6)
系统的知识来源于对碎片的整理和思考，为了更好地输出系统知识，记录本周我发现的体验设计和思考，为构建系统知识做准备。
大产品小细节
Apple Sports 交互拆解：如何用分段卡片做复杂的世界杯对阵图
传统的世界杯树状淘汰赛对阵图在横屏电脑上都显得局促，更别提在狭长的手机屏幕上展示了。Apple Sports 没有把传统的横向大图硬塞进来，而是用一套可以左右滑动的「分段卡片级联」把整个淘汰赛乃至小组赛的逻辑顺畅地缝合在了一起。当你左右滑动时，页面底部的卡片会根据当前的阶段，在列表形态和树状图形态之间做无缝的几何转场。
🔗：https://www.uisdc.com/hunter/0221675025.html
把人机验证做成抓娃娃机
人机验证是产品为了防止机器人不得不加的，对用户来说就觉得是麻烦。有个网友Solutionb就想了个创意，把人机验证做成了抓娃娃机PlayCaptcha，用户的注意力从「我在被机器审查」转移到了「我想抓住那个独角兽」，心理阻抗降到了最低。
🔗：https://www.uisdc.com/hunter/0221674895.html
优设AI情报如何直接给你落地指导
每天AI的信息太多了，到底怎么样才能更好地抓住重点？ 优设的 AI 情报改版就帮你解决痛点，「AI情报观察」用一两句话把当天的核心变化提炼出来，这就让你第一秒就能对今天的行业大盘心里有数。 列表里每条新闻里亮眼的的 Action 模块，把一条宏观的行业新闻直接拆解成具体的、可落地的行为指导，告诉你可以去试什么、怎么跟现有的工作流产生连接。 这就好像互联网刚兴起时那句经典的话，「用户要的是车，而不是更快的马」。其实大家看AI也一样，不是想看最新的AI工具，而是想看最新的AI怎么样才能运用到自己的工作中。
🔗：https://www.uisdc.com/hunter/0221675430.html
Blender低模驱动AI视频精准控镜工作流
靠提示词控制AI生成视频的镜头很难的，有位网友Reid Hannaford想了个奇招，直接把 Blender 里的粗糙低模视频作为 Seedance 2.0 的结构和运动参考，提供物理运动轨迹，让 AI按轨迹翻译成电影质感画面。 对于真正的导演或影视创作者来说，随机性的美感毫无价值，可控性才是生产力。
🔗：https://www.uisdc.com/hunter/0221675263.html
推荐阅读
The Layers of AI Experience — AI 产品体验的六层设计框架
AI 产品的体验不只在界面上，而是由六层叠加出来的——界面、上下文、执行框架、模型、治理、涌现。她想说服设计师别只盯着聊天框那点事，往下潜。行文清晰、引用扎实，从 Garrett 2000 年那套经典 UX 框架一路讲到今天的 agent 系统，是我近期读到把「AI 设计到底该管什么」讲得最系统的一篇，值得设计和产品的人都收藏。
🔗：https://emilycampbell.co/writing/layers-of-ai-experience
Product Design Psychology by Wouter de Bres — 设计心理学电子书
41篇短文，全免费在线读。分四个部分：设计师自己的脑子、界面机制、用户的脑子、组织的脑子。标题起得都特别扎心，什么「没人像你一样思考」「直觉设计是个谎言」「好设计死在会议里」。冲着标题点进去都值，牛不牛得看内容，但这个切入角度确实少见。
在线英文版🔗：https://productdesignpsychology.com/
AI中译版🔗：https://pan.quark.cn/s/15a883e77a00
AI中译版🔗： https://pan.baidu.com/s/1isJI7R7XntUeo9dJErz2jA?pwd=i6t9 提取码: i6t9
【英文】重现我们的 1 分钟 Seedance 4K 影片——包含所有提示的完整分解教程 — AI 生成 4K 短片全流程拆解与提示词合集
Higgsfield 拿自家刚出 4K 的 Seedance 2.0 撸了一条一分钟短片，然后把整个制作过程扒了个底朝天：每个场景怎么搭、素材怎么做、提示词一字不落全公开，点一下 Recreate 就能照抄。工作流简单到离谱——Claude 写词、Seedance 出片。奇幻飞行、雪豹纪录片、末世卡车追逐、精灵大战兽人，一条视频里塞了五六种风格，质感确实唬人。这波是把 AI 视频从”炫技 demo”往”能干活的生产线”上推。
🔗：https://higgsfield.ai/blog/seedance4k-breakdown
8名网贷设计者，揭秘大厂如何“吃”掉一个普通人
以往讲网贷都是苦主视角，这次反过来，产品经理张洋讲怎么把「登录」改成「查看额度」点击率涨7%，风控经理冯月凯讲「放点水」就能把通过率从30%提到35%，投放的冯勇强讲怎么用手机设备号绕开隐私红线精准捞人。每个环节都是明码标价的生意，每人多贷1万够老板请全团队喝奶茶。
最扎心的是主角李明学的还是心理学，懂成瘾机制，照样三次破戒、债滚到16万。这恰恰说明问题不在个人意志，而在整套系统。有意思的是，设计者们毫无道德负担，一句「我又不是做色情网站」就过去了。
🔗：https://mp.weixin.qq.com/s/hEGuToW_RPVKJzMhXCJwrA
【视频】Agent、Skill、Harness啥意思？一次性讲明白AI技术名词！
视频的思路是把AI名词当成一条演进链来讲：先有大模型（LLM）能理解语言，但模型不知道你想干嘛，于是有了Prompt；模型记不住太多东西、也不懂最新信息，于是有了RAG去外挂知识；光会答还不够，要能自己调工具干活，于是有了Agent；给Agent配上一套可复用的能力包，就是Skill；而把这一整套东西跑起来、管好上下文和调度的运行框架，就是Harness。按「痛点驱动」的顺序串，比孤立背定义好懂得多。
🔗：https://www.bilibili.com/video/BV1YRG46eE1n
工具资源
Product Onboarding — 产品引导设计案例库
「新手引导怎么设计」是个几乎所有 SaaS 都要做、但很少有人做好的活儿，这个站把真实产品里的引导拆成八种组件——Tour（导览）、Checklist（任务清单）、Banner（横幅）、Hint（提示）之类，每种都配了 Figma、GitHub、Brex 等公司的实拍案例，等于把散落在各家产品里的最佳实践归了个类，省了你到处截图的功夫。
🔗：https://productonboarding.com/
野果子 · 从电影里，找家的配色与灵感 — 电影截图家居配色灵感库
一个把电影截图当家居配色参考的网站。专挑那些画面、空间、色彩讲究的片子，把好看的镜头扒下来，提炼成你能照着抄的配色和软装方案。目前收了 64 部电影、3154 张截图。选片品味相当能打——塔可夫斯基、侯麦、阿巴斯、瓦尔达、考里斯马基全在,基本是文艺片影迷的「自己人」选片，看着就舒服。
🔗：https://www.yeguozi.com/
astryx — Meta 开源的 AI 友好的设计系统
Meta（Facebook） 把自己内部用了8年、支撑13000多个 App 的最大设计系统开源了。150+ 个组件、七套主题、暗色模式、CLI 全都打包好。最有意思的一点是它专门为「人和 AI 一起写代码」这件事重新设计过接口和文档，让工程师和 Copilot、Claude 这类助手用同一套规范干活。
🔗：https://astryx.atmeta.com/
UX4G Design System 3.0 — 印度政府官方开源设计系统
印度政府自己出的设计系统，专门给政务和公共服务类产品用。免费开源，3.0 这版把语义化 token、暗黑模式、36 套业务流程模板全补齐了，还配了 React、Flutter、Angular 的开发包。
🔗：https://www.figma.com/community/file/1654976809099378421/ux4g-design-system-3-0
Taste Lab — 网站设计品味提取工具
给它一个网址，它就把这个网站的设计「基因」扒出来，喂给你的 AI 编程助手。不只是抓颜色、字号、间距这些死数据，还试图讲清楚设计师「为什么这么选、放弃了什么」，然后生成一份文件给 Cursor、Claude Code 这些工具用。做设计和 vibe coding 的人应该会眼前一亮。
🔗：https://www.tastelab.xyz
Mac-Icon-Extracor — 提取 Mac 应用图标生成 .icon 文件的小工具
专治 macOS 26 Tahoe 的新图标格式头疼。它能把现成 Mac 应用的图标扒出来，直接生成 Icon Composer 用的 .icon 文件，省得你从零画图层。
🔗：https://github.com/Clayton630/Mac-Icon-Extracor
film-space — iPhone AR 虚拟片场，给 AI 视频做运镜参考
在手机里搭个 3D 场景、摆好人形占位，然后切到相机模式，举着手机在现实里走动，ARKit 把你真实的脚步和转身映射成虚拟镜头的运动。录下来这段footage，丢进 Seedance 2.0 这类 AI 视频工具当运镜参考，模型就能照着你走过的轨迹去生成。开源、SwiftUI 写的、完全本地跑,目前 32 个 star。给 AI 视频做”预演”这个思路,确实有意思。
🔗：https://github.com/maxprokopp/film-space
CityEngine — 基于GIS数据的程序化3D城市建模软件
sri家的3D城市建模工具，最大的特点是”程序化生成”——你不用一栋一栋楼去建模，定好规则它就能把整座城市批量生出来。而且能直接吃真实的GIS地理数据，所以做出来的城市是有真实地形和坐标的，不是凭空捏的沙盘。搞城市规划、影视场景、游戏地图的人应该会觉得挺香。
🔗：https://www.esri.com/zh-cn/arcgis/products/arcgis-cityengine/overview
FIFA World Cup 26 Brand Manual（Edition 12）— 世界杯官方品牌视觉规范手册
足足 184 页，这份手册要解决的核心问题，是让全球成百上千个授权方、赞助商、主办城市用同一套视觉语言，避免品牌被用得七零八落。整本书从会徽的技术设置、四色/RGB 数值，一路管到刺绣、雕刻、烫印该用哪个专属文件，连 TM 标记的最小字号 3 磅都写进去了。
🔗1：https://pan.quark.cn/s/1cf10797b697
🔗2： https://pan.baidu.com/s/14HrYy2KATZ8pEQeHTJ9neA?pwd=7vqr 提取码: 7vqr
产品发现
GESTO 98 — 手势识别自动匹配表情包
打开摄像头对着比划，它就用手势识别帮你匹配对应的表情包。你先录几遍「举手」「比心」「捂嘴」这些动作训练它，之后比一个它就懂。技术不复杂，但组合得挺讨喜，属于那种打开就想玩两下、玩完还想发朋友圈的东西。
🔗：https://www.gestomeme.com/
Fuck Claude — 检测你被Claude封号的风险
扫描你浏览器里的地域信号（时区、语言、中文字体等），给你打个 0–100 的”中国用户”风险分，判断你用 Claude Code 会不会被标记封号。名字够狠，做得也够克制——全本地跑、零上传、开源。给最近被 Anthropic 风控搞得心惊胆战的国内开发者提供了一面照妖镜，挺应景。
🔗：https://fuck-claude.vercel.app/zh/
CN⇄World · 美国人在用什么？ — 中美同类互联网应用对照投票工具
把中国人天天用的 App 一个个对应到美国的同类产品，还让网友投票选谁是「最佳对应」。微信配 WhatsApp、微博配 X、豆瓣配 IMDb、虎扑配 ESPN……有意思的是这些映射不是官方定的，而是群众投票投出来的。要出国、要跟老外解释「我们平时用啥」，或者纯粹好奇，就翻一翻。
🔗：https://cn.qust.me/#internet
HyperFrames — HTML 转视频渲染框架，为 AI Agent 设计
用写网页的方式做视频。你写 HTML+CSS，加几个 data-* 时间属性，它就用无头 Chrome 逐帧截图、FFmpeg 编码，吐出一个 MP4。最狠的点是「为 Agent 而生」——AI 本来就会写 HTML，直接让它给你产视频。开源，Apache 2.0，背后是估值不低的 HeyGen。
🔗：https://github.com/heygen-com/hyperframes
相关资讯
拼多多借用原神虚假宣传，被米哈游告赢
拼多多在视频平台招募博主发《原神》推广，挂「1元抢一万原石」的链接引流下载App，但原石是游戏里的付费货币，拼多多压根提供不了，用户点进去只是参与拼多多站内抽奖。这一套操作有两个问题：一是虚假宣传，二是让不少玩家误以为米哈游和拼多多有官方合作，伤了米哈游的商誉。
多多也是胆子大，这么明显就是侵权的事情，它也敢做。
米哈游法务部这个「卷王」直接开告，一审35万、二审加到100万，拼多多不服一路申诉到最高法，最后被驳回。米哈游法务部战绩又添一笔，属实是玩家嘴里「世界最强法务部「的实锤了。
🔗：https://www.ithome.com/0/972/379.htm
比亚迪智能座舱UI设计大赛结果揭晓
突然想说点什么，也不知道想说啥。总之大家有机会的话，可以去看看比亚迪现在的车机是怎么样。哎。
🔗：https://mp.weixin.qq.com/s/2arcYoBWdAWVYKEjO9La6A
豆包和千问下架智能体
豆包和千问都在7月15日下架了智能体功能。这一天刚好是《人工智能拟人化互动管理服务暂行办法》正式实施的日子。所以也不清楚是不是这个监管条例导致智能体功能被管制。
体验碎周报第286期(2026.7.6)
