{"entries":[{"id":"scrollytelling","kind":"style","cat":"web","zh":"滚动叙事","en":"Scrollytelling","aka":["滚动叙事网页","滚动故事"],"oneLine":"读者往下滚动，图表、地图和画面跟着一步步变化，讲完一个故事。滚动条就是时间轴。","era":{"from":2012,"to":null},"regions":["north-america"],"media":["web"],"players":["solo"],"makeLevel":"web","making":"用 IntersectionObserver 或 GSAP ScrollTrigger 判断读到哪一段，固定住一块图形区域，按段落切换图形状态。","ask":"做一个滚动叙事页面：左边是一列文字段落，右边固定一块图形区域；读者每滚到一个新段落，右边的图表就过渡到对应状态（高亮某根柱子、缩放到某个区间、换一组数据）。用 IntersectionObserver 判断当前段落，过渡用 600 毫秒缓动，手机上改成图形在上、文字在下叠着滚。","keywordsZh":["滚动驱动","固定图形区","分步揭示","数据新闻","段落触发"],"keywordsEn":["scrollytelling","scroll-driven","sticky graphic","step reveal","data journalism"],"recognize":["文字一段段出现，旁边的图形停在原地变化","每一步只改变一件事","滚回去，故事也会倒回去"],"form":{"loop":"读一段，看图形变一步","input":"滚动","feedback":"图形过渡","pace":"由读者控制","mood":"沉浸、清楚"},"works":[{"title":"Snow Fall","creator":"《纽约时报》","year":2012},{"title":"The Pudding 的视觉长文","creator":"The Pudding","year":2017}],"demo":null,"dg":"scrolly","hint":"","related":["chat-ui"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"chat-ui","kind":"style","cat":"web","zh":"对话式界面","en":"Conversational UI","aka":["聊天式叙事","Chat UI"],"oneLine":"用聊天的方式完成任务或讲故事：一条条消息出现，用户回复或点选项推进。","era":{"from":1966,"to":null},"regions":["global"],"media":["web","mobile"],"players":["solo"],"makeLevel":"web","making":"消息列表加输入框；故事型可以用预设脚本和选项，助手型接大语言模型。打字中的提示和逐条出现的节奏决定了真实感。","ask":"做一个对话式界面：消息气泡一条条出现，对方消息前先显示 0.8 秒的“正在输入”三个点；底部给两到三个快捷回复按钮，也能自己输入。对话内容用 JSON 脚本驱动，支持分支跳转；消息区自动滚到底，手机键盘弹出时不遮挡输入框。","keywordsZh":["聊天气泡","正在输入","快捷回复","消息节奏","对话脚本"],"keywordsEn":["chat interface","typing indicator","quick replies","message bubbles","conversational"],"recognize":["界面像一个聊天窗口","回复有停顿和“正在输入”","选项以按钮形式出现在底部"],"form":{"loop":"对方说一句，你回一句","input":"点选或打字","feedback":"新消息出现","pace":"有呼吸的停顿","mood":"亲近"},"works":[{"title":"ELIZA","creator":"Joseph Weizenbaum","year":1966},{"title":"Lifeline","creator":"3 Minute Games","year":2015},{"title":"ChatGPT","creator":"OpenAI","year":2022}],"demo":null,"dg":"chat","hint":"","related":["ai-companion","visual-novel"],"use":4,"status":"rising","usedIn":[],"ai":false},{"id":"platformer","kind":"style","cat":"action","zh":"平台跳跃","en":"Platformer","aka":["横版跳跃","跳台游戏"],"oneLine":"控制角色在平台之间跑跳、躲开坑和敌人。跳得准不准、手感好不好，几乎决定了一切。","era":{"from":1981,"to":null},"regions":["japan","global"],"media":["arcade","console","pc","mobile"],"players":["solo"],"makeLevel":"web","making":"核心是跳跃的物理：重力、起跳速度、空中控制，再加上土狼时间和跳跃缓冲这类宽容处理。网页里用 Canvas 就能做出原型。","ask":"做一个横版平台跳跃原型：角色自动向右跑，点击或按空格跳，按住跳得更高；平台之间有坑，掉下去就从下一块平台重生。加入 100 毫秒的土狼时间和 120 毫秒的跳跃缓冲，落地时角色压扁一下再弹回。用 Canvas 实现，速度和重力做成可调参数。","keywordsZh":["跳跃手感","可变跳高","平台","坑","重力","空中控制"],"keywordsEn":["platformer","variable jump height","coyote time","jump buffer","air control"],"recognize":["主要操作就是跑和跳","关卡由平台和坑组成","失败了马上重来"],"form":{"loop":"跑、跳、过关、再来","input":"方向加跳跃","feedback":"落地、碰撞","pace":"紧凑","mood":"专注、爽快"},"works":[{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018,"video":{"src":"vid/platformer.mp4","poster":"img/platformer-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/504230/"},"note":"官方预告片片段"},{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018,"img":{"src":"img/platformer-504230-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/504230/","note":"Steam 商店页截图"}},{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018,"img":{"src":"img/platformer-504230-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/504230/","note":"Steam 商店页截图"}},{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018,"img":{"src":"img/platformer-504230-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/504230/","note":"Steam 商店页截图"}},{"title":"超级马力欧兄弟","creator":"任天堂","year":1985}],"demo":"platformer","dg":null,"hint":"点击或按空格跳","related":["coyote-time","metroidvania"],"use":5,"status":"classic","usedIn":[],"ai":false},{"id":"metroidvania","kind":"style","cat":"action","zh":"类银河恶魔城","en":"Metroidvania","aka":["银河城","类银河战士恶魔城"],"oneLine":"一张连通的大地图，起初很多路走不通；拿到新能力后回头，原来过不去的地方就打开了。","era":{"from":1986,"to":null},"regions":["japan","global"],"media":["console","pc"],"players":["solo"],"makeLevel":"engine","making":"需要地图设计先行：用能力当钥匙，规划哪些区域要等哪种能力才能进入。通常用游戏引擎做，网页里可以做成小地图原型。","ask":"设计一个类银河恶魔城的小地图原型：由 12 个房间组成的连通地图，三道门分别需要“二段跳”“冲刺”“破墙”才能通过；玩家在不同房间拿到这三个能力。先输出房间连通关系和能力锁的设计表，再用 Canvas 做一个俯视小地图，已探索的房间点亮。","keywordsZh":["能力锁","回头探索","连通地图","捷径","地图点亮"],"keywordsEn":["metroidvania","ability gating","backtracking","interconnected map","shortcuts"],"recognize":["有一张逐渐点亮的大地图","拿到新能力会想起以前过不去的地方","地图各处由捷径相连"],"form":{"loop":"探索、被挡住、拿能力、回头","input":"跑跳加攻击","feedback":"新区域打开","pace":"张弛交替","mood":"好奇、成就感"},"works":[{"title":"空洞骑士","creator":"Team Cherry","year":2017,"video":{"src":"vid/metroidvania.mp4","poster":"img/metroidvania-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/367520/"},"note":"官方预告片片段"},{"title":"空洞骑士","creator":"Team Cherry","year":2017,"img":{"src":"img/metroidvania-367520-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/367520/","note":"Steam 商店页截图"}},{"title":"空洞骑士","creator":"Team Cherry","year":2017,"img":{"src":"img/metroidvania-367520-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/367520/","note":"Steam 商店页截图"}},{"title":"空洞骑士","creator":"Team Cherry","year":2017,"img":{"src":"img/metroidvania-367520-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/367520/","note":"Steam 商店页截图"}},{"title":"超级银河战士","creator":"任天堂","year":1994},{"title":"恶魔城：月下夜想曲","creator":"科乐美","year":1997}],"demo":null,"dg":null,"hint":"","related":["platformer","soulslike"],"use":4,"status":"classic","usedIn":[],"ai":false},{"id":"rhythm","kind":"style","cat":"action","zh":"节奏游戏","en":"Rhythm Game","aka":["音游","音乐游戏"],"oneLine":"音符随音乐滑向判定线，在准确的时刻按下去。打得准，音乐和画面一起爆开。","era":{"from":1996,"to":null},"regions":["japan","global"],"media":["arcade","console","mobile","xr"],"players":["solo"],"makeLevel":"web","making":"关键是音画同步：音符的时间要从音频时钟取，不能用帧计时；判定窗口分出“完美、良好、错过”几档。","ask":"做一个单轨节奏游戏原型：音符从右向左滑向判定圈，按 120 BPM 的节奏谱面出现，提前 1.6 秒进入画面；点击或按空格判定，误差 55 毫秒内算“完美”、110 毫秒内算“良好”，否则算“错过”，判定时在圈上放一圈扩散动画并累计连击。时间用 Web Audio 的音频时钟计算，避免掉帧导致不同步。","keywordsZh":["判定线","谱面","连击","完美判定","音画同步","BPM"],"keywordsEn":["rhythm game","judgment line","beatmap","combo","perfect timing","audio sync"],"recognize":["音符朝一条线或一个圈移动","按准了会出现“完美”","连击数一直往上涨"],"form":{"loop":"听、看、按、连击","input":"按键或点击","feedback":"判定字样和打击音","pace":"跟随音乐","mood":"沉浸、律动"},"works":[{"title":"Beat Saber","creator":"Beat Games","year":2018,"video":{"src":"vid/rhythm.mp4","poster":"img/rhythm-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/620980/"},"note":"官方预告片片段"},{"title":"Beat Saber","creator":"Beat Games","year":2018,"img":{"src":"img/rhythm-620980-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/620980/","note":"Steam 商店页截图"}},{"title":"Beat Saber","creator":"Beat Games","year":2018,"img":{"src":"img/rhythm-620980-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/620980/","note":"Steam 商店页截图"}},{"title":"Beat Saber","creator":"Beat Games","year":2018,"img":{"src":"img/rhythm-620980-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/620980/","note":"Steam 商店页截图"}},{"title":"太鼓达人","creator":"南梦宫","year":2001},{"title":"节奏天国","creator":"任天堂","year":2006}],"demo":"rhythm","dg":null,"hint":"跟着节拍点击，或按空格","related":["hit-stop"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"tower-defense","kind":"style","cat":"strategy","zh":"塔防","en":"Tower Defense","aka":["TD"],"oneLine":"敌人沿着路线一波波涌来，你在路边放防御塔挡住它们。决定放什么、放在哪，就是全部的策略。","era":{"from":2007,"to":null},"regions":["global"],"media":["pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"敌人按路径点移动，塔按射程和攻速自动索敌；难点在波次和经济的平衡。网页里 Canvas 就能做。","ask":"做一个塔防原型：一条有三个弯的固定路线，敌人分 5 波沿路线前进；玩家点击路边空地花金币放塔，塔自动攻击射程内最靠前的敌人；击杀给金币，敌人走到终点扣生命。显示波次、金币和生命，选中塔时显示射程圈。用 Canvas 实现。","keywordsZh":["路线","波次","射程","防御塔","经济","升级"],"keywordsEn":["tower defense","waves","range","pathing","upgrade","economy"],"recognize":["有一条敌人必经的路线","敌人一波一波地来","防御塔自己开火，你负责摆放"],"form":{"loop":"布防、看一波、调整","input":"点选放置","feedback":"敌人倒下、生命减少","pace":"一波一波","mood":"运筹、紧张"},"works":[{"title":"王国保卫战","creator":"Ironhide","year":2011,"video":{"src":"vid/tower-defense.mp4","poster":"img/tower-defense-poster.webp","w":720,"h":404,"source":"https://store.steampowered.com/app/246420/"},"note":"官方预告片片段"},{"title":"王国保卫战","creator":"Ironhide","year":2011,"img":{"src":"img/tower-defense-246420-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/246420/","note":"Steam 商店页截图"}},{"title":"王国保卫战","creator":"Ironhide","year":2011,"img":{"src":"img/tower-defense-246420-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/246420/","note":"Steam 商店页截图"}},{"title":"王国保卫战","creator":"Ironhide","year":2011,"img":{"src":"img/tower-defense-246420-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/246420/","note":"Steam 商店页截图"}},{"title":"气球塔防","creator":"Ninja Kiwi","year":2007},{"title":"植物大战僵尸","creator":"PopCap Games","year":2009}],"demo":null,"dg":null,"hint":"","related":["deckbuilder"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"deckbuilder","kind":"style","cat":"strategy","zh":"卡牌构筑","en":"Deckbuilder","aka":["DBG","构筑卡牌"],"oneLine":"从一副很弱的牌组出发，一边打一边挑新牌、删旧牌，让牌组越来越成形。","era":{"from":2008,"to":null},"regions":["global"],"media":["physical","pc","mobile"],"players":["solo","versus"],"makeLevel":"web","making":"需要一套抽牌、出牌、弃牌的循环和卡牌效果系统；平衡比代码难。网页里用 HTML 就能做原型。","ask":"做一个卡牌构筑的战斗原型：开局 10 张牌（攻击、防御各 5 张），每回合抽 5 张、有 3 点能量；打出攻击扣敌人血，防御抵挡下一次伤害；敌人的下一步行动提前显示。打赢后从三张新牌里选一张加入牌组。用 HTML 和 CSS 做卡牌，出牌时卡飞向目标。","keywordsZh":["抽牌","能量","构筑","删牌","意图显示","协同"],"keywordsEn":["deckbuilder","draw pile","energy","card synergy","enemy intent","deck thinning"],"recognize":["每回合抽一手牌","打完一场会让你选新牌","越往后牌组越有自己的打法"],"form":{"loop":"战斗、选牌、再战斗","input":"点选卡牌","feedback":"数值变化","pace":"回合制","mood":"盘算、组合的快感"},"works":[{"title":"杀戮尖塔","creator":"Mega Crit","year":2019,"video":{"src":"vid/deckbuilder.mp4","poster":"img/deckbuilder-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/646570/"},"note":"官方预告片片段"},{"title":"杀戮尖塔","creator":"Mega Crit","year":2019,"img":{"src":"img/deckbuilder-646570-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/646570/","note":"Steam 商店页截图"}},{"title":"杀戮尖塔","creator":"Mega Crit","year":2019,"img":{"src":"img/deckbuilder-646570-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/646570/","note":"Steam 商店页截图"}},{"title":"杀戮尖塔","creator":"Mega Crit","year":2019,"img":{"src":"img/deckbuilder-646570-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/646570/","note":"Steam 商店页截图"}},{"title":"小丑牌","creator":"LocalThunk","year":2024,"img":{"src":"img/deckbuilder-2379780-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/2379780/","note":"Steam 商店页截图"}},{"title":"小丑牌","creator":"LocalThunk","year":2024,"img":{"src":"img/deckbuilder-2379780-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/2379780/","note":"Steam 商店页截图"}},{"title":"Dominion","creator":"Donald X. Vaccarino","year":2008}],"demo":null,"dg":null,"hint":"","related":["roguelike"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"sokoban","kind":"style","cat":"strategy","zh":"推箱子","en":"Sokoban","aka":["仓库番"],"oneLine":"在格子地图里把箱子推到指定位置。箱子只能推不能拉，一步走错就可能卡死。","era":{"from":1982,"to":null},"regions":["japan","global"],"media":["pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"网格加回合制移动，逻辑简单；好玩全靠关卡设计。务必做撤销功能。","ask":"做一个推箱子小游戏：网格地图，有墙、箱子、目标点和玩家；方向键或滑动移动，玩家能推动前方一个箱子，不能拉，箱子不能推进墙或另一个箱子。所有箱子到位即过关。支持撤销和重开，附 3 个由易到难的关卡。","keywordsZh":["网格","只能推","撤销","死局","关卡设计"],"keywordsEn":["sokoban","grid puzzle","push only","undo","deadlock"],"recognize":["地图是一格一格的","箱子只能推，推进角落就动不了了","每关都能用最少步数解开"],"form":{"loop":"观察、推、卡住、撤销","input":"方向","feedback":"箱子到位亮起","pace":"自己掌握","mood":"安静、顿悟"},"works":[{"title":"Baba Is You","creator":"Hempuli","year":2019,"video":{"src":"vid/sokoban.mp4","poster":"img/sokoban-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/736260/"},"note":"官方预告片片段"},{"title":"Baba Is You","creator":"Hempuli","year":2019,"img":{"src":"img/sokoban-736260-1.webp","w":850,"h":472,"source":"https://store.steampowered.com/app/736260/","note":"Steam 商店页截图"}},{"title":"Baba Is You","creator":"Hempuli","year":2019,"img":{"src":"img/sokoban-736260-2.webp","w":850,"h":472,"source":"https://store.steampowered.com/app/736260/","note":"Steam 商店页截图"}},{"title":"仓库番","creator":"Thinking Rabbit","year":1982}],"demo":null,"dg":null,"hint":"","related":["deckbuilder"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"match-3","kind":"style","cat":"casual","zh":"三消","en":"Match-3","aka":["消除","对对碰"],"oneLine":"交换相邻的两格，让三个以上相同的图形连成一线就会消除，上面的落下补位，还可能连锁。","era":{"from":2001,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"网格状态机：交换、判定、消除、下落、补充、再判定。生成初始棋盘时要避免一开局就有可消除的组合。","ask":"做一个 6×5 的三消小游戏：点选一个格子再点相邻格子交换；交换后横向或纵向连成三个及以上相同图形就消除，上方格子落下补位、顶部生成新格子，能连锁消除；交换后没形成消除就换回去。生成初始棋盘时避免一开局就能消除。图形用单色几何形状，显示得分，玩家一段时间不操作时自动演示一步。","keywordsZh":["交换","连成三个","消除","下落","连锁","特殊块"],"keywordsEn":["match-3","swap","cascade","combo","special tiles"],"recognize":["一盘彩色的格子","交换相邻两格","消掉后上面的落下来"],"form":{"loop":"找、换、消、连锁","input":"点选或滑动","feedback":"消除动画和音效","pace":"轻快","mood":"放松"},"works":[{"title":"宝石迷阵 3","creator":"PopCap Games","year":2010,"video":{"src":"vid/match-3.mp4","poster":"img/match-3-poster.webp","w":720,"h":404,"source":"https://store.steampowered.com/app/78000/"},"note":"官方预告片片段"},{"title":"宝石迷阵 3","creator":"PopCap Games","year":2010,"img":{"src":"img/match-3-78000-0.webp","w":1280,"h":800,"source":"https://store.steampowered.com/app/78000/","note":"Steam 商店页截图"}},{"title":"宝石迷阵 3","creator":"PopCap Games","year":2010,"img":{"src":"img/match-3-78000-1.webp","w":1280,"h":800,"source":"https://store.steampowered.com/app/78000/","note":"Steam 商店页截图"}},{"title":"宝石迷阵 3","creator":"PopCap Games","year":2010,"img":{"src":"img/match-3-78000-2.webp","w":1280,"h":800,"source":"https://store.steampowered.com/app/78000/","note":"Steam 商店页截图"}},{"title":"宝石迷阵","creator":"PopCap Games","year":2001},{"title":"糖果传奇","creator":"King","year":2012},{"title":"开心消消乐","creator":"乐元素","year":2014}],"demo":"match-3","dg":null,"hint":"点一个图形，再点旁边的交换","related":["merge","idle"],"use":4,"status":"classic","usedIn":[],"ai":false},{"id":"idle","kind":"style","cat":"casual","zh":"放置","en":"Idle Game","aka":["增量游戏","挂机","点击游戏"],"oneLine":"数字自己会涨。你只需要偶尔回来，把攒下的钱花在让数字涨得更快的东西上。","era":{"from":2013,"to":null},"regions":["global"],"media":["web","mobile","pc"],"players":["solo"],"makeLevel":"web","making":"核心是增长曲线：收益和价格按指数增长，价格涨得稍快一点，让玩家始终觉得“再等一会儿就能买”。离线收益要按离开时长补算。","ask":"做一个放置游戏原型：主题是咖啡店，大号数字显示金币，每秒自动增加；点“做一杯咖啡”加 1；有两项升级，“雇店员”每秒加 1、“咖啡机”每秒加 5，每买一次价格乘 1.15。数字涨的时候平滑滚动，金币够了升级按钮会亮起。数据存本地，回来时补算离线收益。","keywordsZh":["自动增长","升级","指数曲线","离线收益","转生"],"keywordsEn":["idle game","incremental","upgrades","exponential growth","offline progress","prestige"],"recognize":["屏幕中央有个一直在涨的数字","升级按钮越来越贵","关掉回来，数字涨了一大截"],"form":{"loop":"攒、买、涨得更快","input":"点击","feedback":"数字增长","pace":"随时进出","mood":"满足"},"works":[{"title":"Cookie Clicker","creator":"Orteil","year":2013,"video":{"src":"vid/idle.mp4","poster":"img/idle-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1454400/"},"note":"官方预告片片段"},{"title":"Cookie Clicker","creator":"Orteil","year":2013,"img":{"src":"img/idle-1454400-0.webp","w":1280,"h":659,"source":"https://store.steampowered.com/app/1454400/","note":"Steam 商店页截图"}},{"title":"Cookie Clicker","creator":"Orteil","year":2013,"img":{"src":"img/idle-1454400-1.webp","w":1280,"h":659,"source":"https://store.steampowered.com/app/1454400/","note":"Steam 商店页截图"}},{"title":"Cookie Clicker","creator":"Orteil","year":2013,"img":{"src":"img/idle-1454400-2.webp","w":1280,"h":659,"source":"https://store.steampowered.com/app/1454400/","note":"Steam 商店页截图"}},{"title":"AdVenture Capitalist","creator":"Hyper Hippo","year":2014},{"title":"Universal Paperclips","creator":"Frank Lantz","year":2017}],"demo":"idle","dg":null,"hint":"点“做一杯咖啡”，钱够了就升级","related":["streak","match-3"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"merge","kind":"style","cat":"casual","zh":"合成","en":"Merge Game","aka":["合成大西瓜类","2048 类"],"oneLine":"两个相同的东西合成一个更高级的，再合成更高级的。空间有限，越往后越要算计。","era":{"from":2014,"to":null},"regions":["global","china"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"核心是“同级合并成更高一级”的规则，加上有限的空间。物理版（比如往罐子里掉水果）要用二维物理引擎。","ask":"做一个合成小游戏：4×4 网格，方向滑动时所有方块朝该方向移动，相同数字的相邻方块合并成两倍，每次滑动后在空格随机生成一个 2；无法移动时游戏结束。合并时方块弹一下，显示当前分和最高分，最高分存本地。","keywordsZh":["合并","升级链","空间限制","滑动","生成"],"keywordsEn":["merge","2048","combine","tier up","limited space"],"recognize":["两个一样的东西碰到一起变成更高一级","空间越来越挤","目标是合出最高的那一级"],"form":{"loop":"移动、合并、腾空间","input":"滑动或拖拽","feedback":"合成弹跳","pace":"轻快","mood":"上头"},"works":[{"title":"Threes!","creator":"Sirvo","year":2014,"img":{"src":"img/merge-1818570-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1818570/","note":"Steam 商店页截图"}},{"title":"Merge Castle: Mansion Puzzles","creator":"Neverest Games","year":2025,"img":{"src":"img/merge-4126660-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/4126660/","note":"Steam 商店页截图"}},{"title":"Merge Castle: Mansion Puzzles","creator":"Neverest Games","year":2025,"img":{"src":"img/merge-4126660-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/4126660/","note":"Steam 商店页截图"}},{"title":"Threes!","creator":"Sirvo","year":2014},{"title":"2048","creator":"Gabriele Cirulli","year":2014},{"title":"Merge Dragons!","creator":"Gram Games","year":2017}],"demo":null,"dg":"merge","hint":"","related":["match-3"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"roguelike","kind":"style","cat":"rpg","zh":"Roguelike","en":"Roguelike","aka":["肉鸽","Roguelite","Roguelike-like"],"oneLine":"每局地图和奖励都随机生成，死了就从头再来。每一局都不一样，所以总想再来一局。","era":{"from":1980,"to":null},"regions":["north-america","global"],"media":["pc","console","mobile"],"players":["solo"],"makeLevel":"engine","making":"随机生成地图和奖励，加上永久死亡；现代作品多会保留一部分局外成长（也叫 Roguelite）。原型可以在网页里做。","ask":"设计一个 Roguelike 的单局结构：一局分 3 层，每层是一张分叉的节点地图（普通战斗、精英、商店、休息、事件），玩家选路线；每场战斗后三选一奖励；死亡后保留一种货币用于解锁新开局道具。先输出节点生成规则和奖励池设计，再用 Canvas 画出可点选的地图。","keywordsZh":["随机生成","永久死亡","一局一局","三选一","局外成长","构筑"],"keywordsEn":["roguelike","roguelite","procedural generation","permadeath","run-based","meta progression"],"recognize":["每次开局地图都不一样","死了就丢掉这局的一切","每局结束总想“再来一局”"],"form":{"loop":"开局、选择、变强、死亡、再来","input":"依类型而定","feedback":"新的随机组合","pace":"一局 20 到 60 分钟","mood":"冒险、上瘾"},"works":[{"title":"哈迪斯","creator":"Supergiant Games","year":2020,"video":{"src":"vid/roguelike.mp4","poster":"img/roguelike-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1145360/"},"note":"官方预告片片段"},{"title":"哈迪斯","creator":"Supergiant Games","year":2020,"img":{"src":"img/roguelike-1145360-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1145360/","note":"Steam 商店页截图"}},{"title":"哈迪斯","creator":"Supergiant Games","year":2020,"img":{"src":"img/roguelike-1145360-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1145360/","note":"Steam 商店页截图"}},{"title":"哈迪斯","creator":"Supergiant Games","year":2020,"img":{"src":"img/roguelike-1145360-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1145360/","note":"Steam 商店页截图"}},{"title":"以撒的结合：重生","creator":"Nicalis、Edmund McMillen","year":2014,"img":{"src":"img/roguelike-250900-0.webp","w":960,"h":540,"source":"https://store.steampowered.com/app/250900/","note":"Steam 商店页截图"}},{"title":"以撒的结合：重生","creator":"Nicalis、Edmund McMillen","year":2014,"img":{"src":"img/roguelike-250900-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/250900/","note":"Steam 商店页截图"}},{"title":"Rogue","creator":"Michael Toy、Glenn Wichman","year":1980},{"title":"以撒的结合","creator":"Edmund McMillen","year":2011}],"demo":null,"dg":null,"hint":"","related":["deckbuilder","soulslike"],"use":5,"status":"mainstream","usedIn":[],"ai":false},{"id":"soulslike","kind":"style","cat":"rpg","zh":"魂类","en":"Soulslike","aka":["类魂","魂系"],"oneLine":"敌人很强，死亡很常见。死了会掉下身上的资源，要回到死的地方捡回来；篝火是唯一安全的地方。","era":{"from":2009,"to":null},"regions":["japan","global"],"media":["console","pc"],"players":["solo","coop"],"makeLevel":"engine","making":"需要精确的动作系统（体力、翻滚无敌帧、攻击前摇）和检查点设计，必须用游戏引擎。","ask":"设计一个魂类战斗的最小原型：玩家有体力条，攻击和翻滚都消耗体力；翻滚前 0.2 秒无敌；敌人攻击前有明显的抬手动作；玩家死亡后在原地留下资源，回到上一个检查点复活，再次死在拾回前资源就消失。先列出参数表，再用游戏引擎实现一个房间。","keywordsZh":["高难度","体力条","翻滚","检查点","拾回魂","环境叙事"],"keywordsEn":["soulslike","stamina","dodge roll","bonfire","corpse run","tough but fair"],"recognize":["死很多次是常态","篝火一样的检查点","死后要回去捡回自己的东西"],"form":{"loop":"探索、死亡、学习、突破","input":"攻击、翻滚、格挡","feedback":"沉重的打击感","pace":"谨慎","mood":"压迫、成就感"},"works":[{"title":"艾尔登法环","creator":"FromSoftware","year":2022,"video":{"src":"vid/soulslike.mp4","poster":"img/soulslike-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1245620/"},"note":"官方预告片片段"},{"title":"艾尔登法环","creator":"FromSoftware","year":2022,"img":{"src":"img/soulslike-1245620-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1245620/","note":"Steam 商店页截图"}},{"title":"艾尔登法环","creator":"FromSoftware","year":2022,"img":{"src":"img/soulslike-1245620-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1245620/","note":"Steam 商店页截图"}},{"title":"艾尔登法环","creator":"FromSoftware","year":2022,"img":{"src":"img/soulslike-1245620-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1245620/","note":"Steam 商店页截图"}},{"title":"黑暗之魂 重制版","creator":"FromSoftware","year":2018,"img":{"src":"img/soulslike-570940-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/570940/","note":"Steam 商店页截图"}},{"title":"黑暗之魂 重制版","creator":"FromSoftware","year":2018,"img":{"src":"img/soulslike-570940-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/570940/","note":"Steam 商店页截图"}},{"title":"恶魔之魂","creator":"FromSoftware","year":2009},{"title":"黑暗之魂","creator":"FromSoftware","year":2011}],"demo":null,"dg":null,"hint":"","related":["metroidvania","roguelike"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"visual-novel","kind":"style","cat":"story","zh":"视觉小说","en":"Visual Novel","aka":["Galgame","AVG","文字冒险"],"oneLine":"背景加立绘加一个对话框，文字一句句往下读，在关键处做选择，走向不同的结局。","era":{"from":1983,"to":null},"regions":["japan","china"],"media":["pc","mobile","console"],"players":["solo"],"makeLevel":"web","making":"引擎很成熟，用 Ren'Py 或网页都能做；工作量在剧本、立绘和分支管理。","ask":"做一个视觉小说引擎的网页原型：全屏背景图、角色立绘可以淡入淡出和切换表情、底部对话框逐字显示文字，点击继续；遇到选项时显示两到三个按钮，跳到不同节点。剧本用 JSON 写，支持存档、读档和回看历史文字。","keywordsZh":["对话框","立绘","逐字显示","选项","多结局","存档"],"keywordsEn":["visual novel","dialogue box","character sprite","branching","multiple endings","typewriter text"],"recognize":["画面底部有一个对话框","人物立绘站在背景前","关键时刻弹出选项"],"form":{"loop":"读、选、读","input":"点击和选项","feedback":"剧情变化","pace":"很慢，跟着读者","mood":"代入"},"works":[{"title":"心跳文学部","creator":"Team Salvato","year":2017,"video":{"src":"vid/visual-novel.mp4","poster":"img/visual-novel-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/698780/"},"note":"官方预告片片段"},{"title":"心跳文学部","creator":"Team Salvato","year":2017,"img":{"src":"img/visual-novel-698780-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/698780/","note":"Steam 商店页截图"}},{"title":"心跳文学部","creator":"Team Salvato","year":2017,"img":{"src":"img/visual-novel-698780-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/698780/","note":"Steam 商店页截图"}},{"title":"心跳文学部","creator":"Team Salvato","year":2017,"img":{"src":"img/visual-novel-698780-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/698780/","note":"Steam 商店页截图"}},{"title":"命运石之门","creator":"5pb.、Nitroplus","year":2009,"img":{"src":"img/visual-novel-412830-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/412830/","note":"Steam 商店页截图"}},{"title":"命运石之门","creator":"5pb.、Nitroplus","year":2009,"img":{"src":"img/visual-novel-412830-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/412830/","note":"Steam 商店页截图"}},{"title":"逆转裁判","creator":"Capcom","year":2001}],"demo":null,"dg":null,"hint":"","related":["branching","walking-sim"],"use":4,"status":"classic","usedIn":[],"ai":false},{"id":"walking-sim","kind":"style","cat":"story","zh":"步行模拟","en":"Walking Simulator","aka":["叙事探索","第一人称叙事"],"oneLine":"几乎没有战斗和失败，玩家只是走、看、听，从环境里的物件和声音一点点拼出一个故事。","era":{"from":2012,"to":null},"regions":["europe","north-america"],"media":["pc","console"],"players":["solo"],"makeLevel":"engine","making":"需要三维场景和环境叙事设计，通常用游戏引擎；网页里可以用 Three.js 做一个房间。","ask":"做一个步行模拟的单房间原型：第一人称在一个房间里走动和转视角，房间里有 5 件可以查看的物品，靠近时出现提示，点开会显示一张信件或一段旁白；看完全部物品后门打开。用 Three.js 实现，WASD 加鼠标操作，手机上用虚拟摇杆。","keywordsZh":["环境叙事","第一人称","探索","物件","旁白","无失败"],"keywordsEn":["walking simulator","environmental storytelling","first person","narrative exploration","no fail state"],"recognize":["几乎不会输","故事藏在房间的物件里","节奏很慢，靠氛围推着走"],"form":{"loop":"走、看、听、拼凑","input":"移动和查看","feedback":"新的线索","pace":"缓慢","mood":"孤独、动人"},"works":[{"title":"伊迪丝·芬奇的记忆","creator":"Giant Sparrow","year":2017,"video":{"src":"vid/walking-sim.mp4","poster":"img/walking-sim-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/501300/"},"note":"官方预告片片段"},{"title":"伊迪丝·芬奇的记忆","creator":"Giant Sparrow","year":2017,"img":{"src":"img/walking-sim-501300-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/501300/","note":"Steam 商店页截图"}},{"title":"伊迪丝·芬奇的记忆","creator":"Giant Sparrow","year":2017,"img":{"src":"img/walking-sim-501300-1.webp","w":1280,"h":721,"source":"https://store.steampowered.com/app/501300/","note":"Steam 商店页截图"}},{"title":"伊迪丝·芬奇的记忆","creator":"Giant Sparrow","year":2017,"img":{"src":"img/walking-sim-501300-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/501300/","note":"Steam 商店页截图"}},{"title":"看火人","creator":"Campo Santo","year":2016,"img":{"src":"img/walking-sim-383870-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/383870/","note":"Steam 商店页截图"}},{"title":"看火人","creator":"Campo Santo","year":2016,"img":{"src":"img/walking-sim-383870-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/383870/","note":"Steam 商店页截图"}},{"title":"亲爱的艾斯特","creator":"The Chinese Room","year":2012}],"demo":null,"dg":null,"hint":"","related":["visual-novel"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"management-sim","kind":"style","cat":"sim","zh":"模拟经营","en":"Management Sim","aka":["经营模拟","Tycoon"],"oneLine":"经营一座城市、一家店或一个农场：资源进来、加工、卖出，再拿钱去扩张。","era":{"from":1989,"to":null},"regions":["north-america","japan","global"],"media":["pc","console","mobile"],"players":["solo"],"makeLevel":"web","making":"核心是资源流转的数值模型和时间推进；界面多为俯视或等距视角。数值原型在网页里就能做。","ask":"做一个模拟经营的数值原型：一家面包店，每天自动推进；原料要买，烤箱把原料变成面包，顾客按价格和口碑决定买不买；玩家可以调价格、买烤箱、雇人。每天结束显示收入、支出和口碑变化的小结。先给出数值公式，再用 HTML 做界面。","keywordsZh":["资源流","经营","扩建","数值平衡","时间推进"],"keywordsEn":["management sim","tycoon","resource loop","economy","expansion"],"recognize":["屏幕上很多数字和图表","钱、材料、人在流动","慢慢把小摊子做成大生意"],"form":{"loop":"投入、产出、扩张","input":"点选和规划","feedback":"数字增长","pace":"按天或按季","mood":"掌控、满足"},"works":[{"title":"星露谷物语","creator":"ConcernedApe","year":2016,"video":{"src":"vid/management-sim.mp4","poster":"img/management-sim-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/413150/"},"note":"官方预告片片段"},{"title":"星露谷物语","creator":"ConcernedApe","year":2016,"img":{"src":"img/management-sim-413150-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/413150/","note":"Steam 商店页截图"}},{"title":"星露谷物语","creator":"ConcernedApe","year":2016,"img":{"src":"img/management-sim-413150-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/413150/","note":"Steam 商店页截图"}},{"title":"星露谷物语","creator":"ConcernedApe","year":2016,"img":{"src":"img/management-sim-413150-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/413150/","note":"Steam 商店页截图"}},{"title":"模拟城市","creator":"Maxis","year":1989},{"title":"过山车大亨","creator":"Chris Sawyer","year":1999}],"demo":null,"dg":null,"hint":"","related":["idle","falling-sand"],"use":4,"status":"classic","usedIn":[],"ai":false},{"id":"falling-sand","kind":"style","cat":"sim","zh":"粉末沙盒","en":"Falling-sand Game","aka":["落沙游戏","像素物理"],"oneLine":"屏幕上每个像素都是一粒沙、一滴水或一团火，按简单规则下落、流动、燃烧，堆出意想不到的画面。","era":{"from":2005,"to":null},"regions":["japan","global"],"media":["web","pc"],"players":["solo"],"makeLevel":"web","making":"细胞自动机：每帧对每个格子按规则更新，比如沙往下掉、下面有东西就往两边斜着滑。低分辨率网格放大显示。","ask":"做一个粉末沙盒：低分辨率像素网格，鼠标按住的地方不断落下沙子；沙子往下掉，正下方被挡住就随机向左下或右下滑；画面里有两条斜挡板。用 Canvas 的 ImageData 逐像素绘制并关闭平滑。之后可以再加水（会横向流动）和墙（可以画）。","keywordsZh":["细胞自动机","像素","下落","堆积","元素反应"],"keywordsEn":["falling sand","cellular automata","pixel physics","powder game","sandbox"],"recognize":["画面由会动的像素颗粒组成","沙子会堆成小山","不同材料之间会反应"],"form":{"loop":"倒、看、再倒","input":"按住拖动","feedback":"颗粒堆积","pace":"随意","mood":"解压"},"works":[{"title":"Noita","creator":"Nolla Games","year":2020,"video":{"src":"vid/falling-sand.mp4","poster":"img/falling-sand-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/881100/"},"note":"官方预告片片段"},{"title":"Noita","creator":"Nolla Games","year":2020,"img":{"src":"img/falling-sand-881100-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/881100/","note":"Steam 商店页截图"}},{"title":"Noita","creator":"Nolla Games","year":2020,"img":{"src":"img/falling-sand-881100-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/881100/","note":"Steam 商店页截图"}},{"title":"Noita","creator":"Nolla Games","year":2020,"img":{"src":"img/falling-sand-881100-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/881100/","note":"Steam 商店页截图"}},{"title":"Powder Game","creator":"Dan-Ball","year":2008}],"demo":"falling-sand","dg":null,"hint":"按住或划过上方，倒下沙子","related":["management-sim"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"trpg","kind":"style","cat":"table","zh":"跑团","en":"Tabletop RPG","aka":["TRPG","桌面角色扮演"],"oneLine":"几个人围坐一桌，一个主持人描述世界，其他人扮演角色、说出想做的事，用骰子决定成败。","era":{"from":1974,"to":null},"regions":["north-america","global"],"media":["physical","web"],"players":["coop"],"makeLevel":"physical","making":"规则书加骰子就能玩；线上靠语音和虚拟桌面工具。数字化的难点在于让主持人的即兴发挥保持流畅。","ask":"做一个线上跑团辅助工具的原型：左边是共享的场景描述和地图，右边是聊天区，输入 /r 1d20+3 就能掷骰并显示结果；每个玩家有一张角色卡（属性、技能、生命值）；主持人可以推送场景图片和暗骰。先用单人模拟多角色的方式做前端。","keywordsZh":["主持人","掷骰","角色卡","即兴","团本","检定"],"keywordsEn":["tabletop RPG","game master","dice roll","character sheet","improvisation","skill check"],"recognize":["有一个主持人在讲","大家说“我想做什么”","关键时刻要掷骰子"],"form":{"loop":"描述、行动、掷骰、后果","input":"说话和掷骰","feedback":"主持人的描述","pace":"一团几个小时","mood":"共创、热闹"},"works":[{"title":"跑团现场：主持人屏风后视角","img":{"src":"img/trpg-wm-0.webp","w":1280,"h":1023,"source":"https://commons.wikimedia.org/wiki/File:View_from_behind_the_screen_(8735516858).jpg","note":"维基共享资源，Graham Campbell from Glasgow, Scotland，CC BY-SA 2.0"}},{"title":"龙与地下城跑团桌面","creator":"Wizards of the Coast","img":{"src":"img/trpg-wm-1.webp","w":1280,"h":899,"source":"https://commons.wikimedia.org/wiki/File:DnD_Game_01.jpg","note":"维基共享资源，Nicole Hill，CC BY-SA 4.0"}},{"title":"跑团中的骰子与角色卡","img":{"src":"img/trpg-wm-2.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:Dice_and_Spanish-language_character_sheet_during_an_RPG_session.jpg","note":"维基共享资源，Jorge Leal，CC BY 2.0"}},{"title":"龙与地下城","creator":"Gary Gygax、Dave Arneson","year":1974},{"title":"克苏鲁的呼唤","creator":"Chaosium","year":1981}],"demo":null,"dg":"trpg","hint":"","related":["ai-gm","murder-mystery"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"murder-mystery","kind":"style","cat":"table","zh":"剧本杀","en":"Murder Mystery Game","aka":["谋杀之谜","Murder Mystery Party"],"oneLine":"每人拿到一个角色的剧本，大家轮流讲述、搜证、互相盘问，最后投票找出凶手。","era":{"from":2016,"to":null},"regions":["china","europe"],"media":["physical","mobile"],"players":["coop","versus"],"makeLevel":"physical","making":"核心是剧本：每个角色的信息不完整且互相交错；需要阶段推进和线索发放的流程。线上版用房间和语音实现。","ask":"做一个线上剧本杀的流程原型：6 个角色各有私密剧本；流程分自我介绍、两轮搜证、自由讨论、投票四个阶段，主持人点击推进；搜证阶段每人每轮可以翻开两张线索卡，可以选择公开或私藏；最后投票并揭晓真相。先做单机界面，用假数据演示全流程。","keywordsZh":["角色剧本","搜证","线索卡","盘问","投票","复盘"],"keywordsEn":["murder mystery","role script","clue cards","deduction","voting","social deduction"],"recognize":["每人手里有一份只有自己知道的剧本","要翻线索、互相盘问","最后一起投票"],"form":{"loop":"读本、搜证、讨论、投票","input":"说话","feedback":"新线索、别人的反应","pace":"一场三到五小时","mood":"推理、社交"},"works":[{"title":"谋杀派对（Murder Party）的线索道具桌","img":{"src":"img/murder-mystery-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:MurderParty.jpg","note":"维基共享资源，The original uploader was Ornicar69 at…，CC BY-SA 2.0 fr"}},{"title":"海盗主题谋杀推理晚宴","year":2015,"img":{"src":"img/murder-mystery-wm-1.webp","w":1280,"h":850,"source":"https://commons.wikimedia.org/wiki/File:Pirate-themed_murder_mystery_dinner_hooks_guests_151115-Z-KK981-007.jpg","note":"维基共享资源，Sgt. Ryan Twist，Public domain"}},{"title":"常州天宁吾悦广场的剧本杀店","img":{"src":"img/murder-mystery-wm-2.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:A_murder_mystery_game_shop_in_Tianning_Wuyue_Square.jpg","note":"维基共享资源，Fumikas Sagisavas，CC BY-SA 4.0"}},{"title":"英式谋杀推理派对游戏","creator":"","year":1980},{"title":"明星大侦探","creator":"芒果 TV","year":2016}],"demo":null,"dg":"murder","hint":"","related":["trpg"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"installation","kind":"style","cat":"space","zh":"互动装置","en":"Interactive Installation","aka":["互动投影","沉浸式展览"],"oneLine":"在一个真实空间里，人的移动、触摸或声音会改变投影、灯光和声音，人本身成了作品的一部分。","era":{"from":1975,"to":null},"regions":["japan","europe","global"],"media":["installation"],"players":["mass"],"makeLevel":"physical","making":"传感器（摄像头、深度相机、雷达）识别人的位置和动作，实时驱动投影或灯光。常用 TouchDesigner 搭建。","ask":"做一个互动投影的原型：用电脑摄像头识别画面里的人体轮廓（可以用 MediaPipe），在人站的位置周围的地面上生成向外扩散的水波，人走过留下一串涟漪；没人时有缓慢的随机水波。先在网页里用摄像头做出效果，再说明搬到 TouchDesigner 加投影仪需要哪些设备。","keywordsZh":["人体追踪","投影","空间","实时生成","沉浸"],"keywordsEn":["interactive installation","body tracking","projection mapping","immersive","real-time"],"recognize":["人走进去，画面就变化","多人同时在场","没有屏幕，整个空间都是界面"],"form":{"loop":"走动、观察变化、再走动","input":"身体动作","feedback":"光影和声音","pace":"自由","mood":"惊奇"},"works":[{"title":"雨屋 Rain Room（沙迦）","creator":"Random International","year":2012,"img":{"src":"img/installation-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:RainRoomSharjah.jpg","note":"维基共享资源，Alexandermcnabb，CC BY-SA 4.0"}},{"title":"teamLab 无界美术馆（麻布台之丘）","creator":"teamLab","year":2024,"img":{"src":"img/installation-wm-1.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:TeamLab_Borderless_Azabudai_Hills.jpg","note":"维基共享资源，DannyWithLove，CC BY-SA 4.0"}},{"title":"teamLab 无界美术馆","creator":"teamLab","year":2018,"img":{"src":"img/installation-wm-2.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:TeamLab_Borderless,_Odaiba,_Tokyo,_Japan_(49070857867).jpg","note":"维基共享资源，Domenico Convertini from Zurich, Schweiz，CC BY-SA 2.0"}},{"title":"Videoplace","creator":"Myron Krueger","year":1975},{"title":"雨屋 Rain Room","creator":"Random International","year":2012},{"title":"teamLab 无界美术馆","creator":"teamLab","year":2018}],"demo":null,"dg":"install","hint":"","related":["ripple"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"ai-companion","kind":"style","cat":"ai","zh":"AI 角色对话","en":"AI Character Chat","aka":["AI 陪伴","AI 角色扮演"],"oneLine":"和一个有设定、有记忆的 AI 角色聊天。它会记得你说过的事，下次聊天时主动提起。","era":{"from":2017,"to":null},"regions":["north-america","china","global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"大语言模型加角色设定，再加一层记忆：把重要的事存起来，聊天时检索放进上下文。成本按对话量计。","ask":"做一个 AI 角色对话的原型：角色有名字、性格和说话方式的设定；聊天时把最近 20 条消息和从记忆库检索到的相关记忆一起发给大模型；每次对话结束后让模型总结出值得记住的事存进记忆库。界面上可以看到角色“记得”哪些事，用户可以删除。","keywordsZh":["角色设定","长期记忆","主动提起","人设一致","陪伴"],"keywordsEn":["AI character","persona","long-term memory","companion","consistent voice"],"recognize":["对方有固定的名字和性格","它会提起你上次说的事","聊天没有终点"],"form":{"loop":"说、被回应、被记住","input":"打字或语音","feedback":"有个性的回复","pace":"随时","mood":"亲近"},"works":[{"title":"Replika","creator":"Luka","year":2017},{"title":"Character.AI","creator":"Character.AI","year":2022}],"demo":null,"dg":"companion","hint":"","related":["chat-ui","ai-gm"],"use":4,"status":"rising","usedIn":[],"ai":true},{"id":"ai-gm","kind":"style","cat":"ai","zh":"AI 主持跑团","en":"AI Game Master","aka":["AI 跑团","AI 地下城主"],"oneLine":"由 AI 当主持人：描述场景、扮演所有配角、根据玩家的行动和骰子结果即兴推进剧情。","era":{"from":2019,"to":null},"regions":["north-america","global"],"media":["web","mobile"],"players":["solo","coop"],"makeLevel":"web","making":"大语言模型负责叙述，规则和数值（生命、物品、骰子）由代码管理，避免模型随意改数值；用状态摘要保持长线剧情一致。","ask":"做一个 AI 主持的文字跑团原型：玩家输入想做的事，代码先判断是否需要检定并掷骰，再把场景状态、角色卡、骰子结果交给大模型写下一段叙述；生命值和物品由代码维护，模型只能通过约定好的指令修改。每 10 轮自动生成一次剧情摘要，作为后续上下文。","keywordsZh":["AI 叙述","即兴","规则由代码管","状态摘要","掷骰"],"keywordsEn":["AI game master","AI dungeon","procedural narrative","dice","state tracking"],"recognize":["你可以输入任何想做的事","AI 会顺着你的行动编下去","骰子决定成败"],"form":{"loop":"行动、掷骰、叙述","input":"自由输入","feedback":"新的剧情段落","pace":"随意","mood":"自由、意外"},"works":[{"title":"AI Dungeon","creator":"Latitude","year":2019}],"demo":null,"dg":"aigm","hint":"","related":["trpg","ai-companion"],"use":4,"status":"rising","usedIn":[],"ai":true},{"id":"hit-stop","kind":"technique","cat":"feedback","zh":"打击停顿","en":"Hit Stop","aka":["顿帧","卡肉","Hit Pause"],"oneLine":"命中的一瞬间画面冻结几十毫秒，再配上屏幕震动、闪白和碎片，攻击就有了“打到肉”的分量。","era":{"from":1991,"to":null},"regions":["japan","global"],"media":["arcade","console","pc","mobile"],"players":["solo"],"makeLevel":"web","making":"命中时暂停游戏逻辑 50 到 100 毫秒，渲染照常；之后加衰减的屏幕震动。所有参数做成可调。","ask":"给攻击加上打击感：命中瞬间让整个画面冻结 85 毫秒（打击停顿），然后屏幕向随机方向抖动约 220 毫秒、幅度 9 像素并逐渐衰减；被击中的物体闪白一帧、被压扁再弹回，同时迸出十几个碎片；伤害数字弹出后上浮淡出。停顿时长、震屏幅度、闪白都做成可调参数，再加一个总开关，方便对比有和没有手感时的区别。","keywordsZh":["顿帧","屏幕震动","闪白","碎片","伤害数字","挤压拉伸"],"keywordsEn":["hit stop","screen shake","hit flash","particles","damage numbers","game juice"],"recognize":["命中时有一瞬间的停顿","画面在震","被打的东西会闪白"],"form":{},"works":[{"title":"街头霸王 II","creator":"Capcom","year":1991},{"title":"空洞骑士","creator":"Team Cherry","year":2017},{"title":"哈迪斯","creator":"Supergiant Games","year":2020}],"demo":"hit-stop","dg":null,"hint":"点击方块；下面可以调停顿时长和震屏幅度，关掉手感对比一下","related":["coyote-time","magnetic"],"use":5,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"coyote-time","kind":"technique","cat":"feedback","zh":"土狼时间","en":"Coyote Time","aka":["边缘宽容","Ledge Grace"],"oneLine":"角色已经跑出平台边缘的一小段时间里，按跳跃仍然算数。玩家察觉不到它，只会觉得“这游戏跳起来很顺”。","era":{"from":2000,"to":null},"regions":["global"],"media":["console","pc","mobile"],"players":["solo"],"makeLevel":"web","making":"记录角色最后一次站在地面的时刻，离地后 80 到 120 毫秒内按跳仍然执行跳跃。常和跳跃缓冲一起用。","ask":"给平台跳跃加上土狼时间：记录角色最后一次接触地面的时间，离开平台边缘后 100 毫秒内按跳跃仍然能起跳；同时加 120 毫秒的跳跃缓冲，落地前一刻按下的跳跃在落地时生效。做一个开关对比开和关的手感。","keywordsZh":["宽容判定","跳跃缓冲","手感","边缘","隐形辅助"],"keywordsEn":["coyote time","jump buffer","forgiveness","game feel","ledge grace"],"recognize":["跑出边缘晚一点按跳也能跳起来","玩家不会注意到它","关掉后会觉得“明明按了却掉下去”"],"form":{},"works":[{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018}],"demo":"coyote","dg":null,"hint":"点击或按空格跳；下面关掉土狼时间，晚按的跳就会掉下去","related":["platformer","hit-stop"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"magnetic","kind":"technique","cat":"feedback","zh":"磁吸按钮","en":"Magnetic Button","aka":["吸附按钮","磁性悬停"],"oneLine":"鼠标靠近时，按钮像被磁铁吸住一样朝指针偏过去，里面的文字偏得少一点，形成层次；离开后弹回原位。","era":{"from":2016,"to":null},"regions":["global"],"media":["web"],"players":["solo"],"makeLevel":"web","making":"按钮周围一定范围内，按指针相对按钮中心的距离计算偏移，用弹簧动画跟随。只在有鼠标的设备上启用。","ask":"做一个磁吸按钮：鼠标进入按钮周围 120px 范围时，按钮朝鼠标方向偏移，偏移量是距离的 35%，按钮里的文字只偏移 18%，形成层次；鼠标离开后用弹簧动画回到原位。用原生 JS 和 CSS transform 实现，触屏设备上不启用。","keywordsZh":["磁吸","悬停","弹簧","跟随","层次"],"keywordsEn":["magnetic button","hover","spring","cursor follow","micro-interaction"],"recognize":["按钮会追着鼠标跑一点","文字和按钮动得不一样多","离开时弹回去"],"form":{},"works":[],"demo":"magnetic","dg":null,"hint":"把鼠标移近按钮","related":["tilt"],"use":3,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"tilt","kind":"technique","cat":"feedback","zh":"倾斜卡片","en":"3D Tilt Card","aka":["视差卡片","全息卡片"],"oneLine":"卡片随指针位置在三维空间里轻轻倾斜，表面一层高光跟着移动，像拿在手里转动一张卡。","era":{"from":2015,"to":null},"regions":["global"],"media":["web","mobile"],"players":["solo"],"makeLevel":"web","making":"按指针相对卡片中心的位置计算绕 X、Y 轴的旋转角，外层设 perspective；高光用跟随指针的径向渐变。","ask":"做一张会随鼠标倾斜的卡片：根据指针相对卡片中心的位置，让卡片绕 X 轴和 Y 轴旋转，最多 12 度，外层加 perspective；卡片表面加一层跟着指针移动的径向高光；鼠标移开时平滑回正。手机上保持静止或跟随陀螺仪。","keywordsZh":["三维倾斜","视差","高光","透视","全息"],"keywordsEn":["3D tilt","parallax card","glare","perspective","holographic"],"recognize":["卡片朝鼠标方向倾斜","表面有一道跟着动的反光","移开后慢慢回正"],"form":{},"works":[{"title":"tvOS 视差图标","creator":"Apple","year":2015}],"demo":"tilt","dg":null,"hint":"在卡片周围移动鼠标","related":["magnetic"],"use":3,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"particle-text","kind":"technique","cat":"feedback","zh":"粒子成字","en":"Particle Text","aka":["粒子文字","粒子聚合"],"oneLine":"几千个小点从四处飞来排成一行字；鼠标划过时被推开，离开后又各自飞回原位。","era":{"from":2010,"to":null},"regions":["global"],"media":["web"],"players":["solo"],"makeLevel":"web","making":"把文字画到看不见的画布上取样，得到目标点；每个粒子用弹簧力飞向目标，鼠标附近施加排斥力。","ask":"用 Canvas 做粒子成字：把文字「Muse」画到一张看不见的画布上，按间隔取样得到约 2000 个目标点，每个粒子用弹簧力飞向自己的目标点；鼠标经过时把半径 70px 内的粒子推开，移开后自动归位。粒子颜色跟随页面的深浅色主题。","keywordsZh":["粒子","聚合","排斥","弹簧","文字取样"],"keywordsEn":["particle text","particles","repel","spring","text sampling"],"recognize":["字是由很多小点组成的","鼠标一碰就散开","散开后又自己聚回来"],"form":{},"works":[],"demo":"particle-text","dg":null,"hint":"划过文字，粒子会被推开","related":["ripple"],"use":3,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"ripple","kind":"technique","cat":"feedback","zh":"水波涟漪","en":"Water Ripple","aka":["水面折射","波纹扰动"],"oneLine":"画面像一层浅水，指针划过的地方荡起波纹，底下的条纹跟着折射弯曲。","era":{"from":1995,"to":null},"regions":["global"],"media":["web","installation"],"players":["solo"],"makeLevel":"web","making":"两张高度图交替计算水面（经典的二维水波算法），用水面斜率偏移底图；低分辨率计算再放大。","ask":"做一个水波涟漪背景：用两张高度图模拟水面（经典的二维水波算法），鼠标移动时在指针处激起波纹，用水面的斜率去偏移底下的斜条纹图案，形成折射效果。用低分辨率计算再放大显示，保证手机上也有 60 帧。没有鼠标时随机落下雨点。","keywordsZh":["水波","折射","高度图","扰动","涟漪"],"keywordsEn":["water ripple","refraction","height map","disturbance","2D water"],"recognize":["指针划过会荡起波纹","底下的图案被折射弯曲","波纹会慢慢平息"],"form":{},"works":[],"demo":"ripple","dg":null,"hint":"在上面移动鼠标","related":["installation","particle-text"],"use":3,"status":"mainstream","usedIn":["web","space"],"ai":false},{"id":"joystick","kind":"technique","cat":"input","zh":"虚拟摇杆","en":"Virtual Joystick","aka":["触屏摇杆","虚拟手柄"],"oneLine":"在触屏上画出一个摇杆，拇指按住拖动控制方向和力度，让手机也能玩需要移动的游戏。","era":{"from":2008,"to":null},"regions":["global"],"media":["mobile"],"players":["solo","versus"],"makeLevel":"web","making":"记录按下点作为摇杆中心，拖动向量限制在半径内，方向和长度换算成移动速度；松手回中。","ask":"做一个触屏虚拟摇杆：底座固定在屏幕左下角，半径约为画面短边的 15%，也可以切换成手指在左下区域按下时就地出现；拖动时摇杆头跟随但不超出底座半径，方向和偏移比例控制角色移动的方向和速度，推满时每秒移动约 216 像素；松手时摇杆回中、角色停下。同时支持鼠标拖动，便于在电脑上调试。","keywordsZh":["摇杆","触屏","方向","死区","回中"],"keywordsEn":["virtual joystick","touch controls","analog stick","dead zone","mobile input"],"recognize":["屏幕角落有一个圆形摇杆","拇指拖得越远走得越快","松手就停"],"form":{},"works":[{"title":"王者荣耀","creator":"腾讯","year":2015},{"title":"荒野乱斗","creator":"Supercell","year":2018}],"demo":"joystick","dg":null,"hint":"拖动左下角的摇杆","related":["platformer"],"use":3,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"slingshot","kind":"technique","cat":"rules","zh":"弹射","en":"Slingshot Launch","aka":["拉弓","弹弓"],"oneLine":"往后拉、松手、飞出去。拉的方向和距离决定轨迹，一条虚线预告大概会落在哪里。","era":{"from":2009,"to":null},"regions":["europe","japan","global"],"media":["mobile","web"],"players":["solo","versus"],"makeLevel":"web","making":"拖拽向量换算成初速度，用二维物理引擎模拟飞行和碰撞；虚线预测轨迹只画前一小段，保留不确定性。","ask":"做一个弹射机制原型：按住弹弓上的物体往后拉，松手时按拉动的方向和距离发射，拉得越远越快；拖拽过程中显示前半段的预测轨迹虚线；物体飞出后受重力影响，撞到右侧的方块堆会把它们撞倒。用 Matter.js 做物理。","keywordsZh":["拉拽","抛物线","轨迹预测","物理碰撞","力度"],"keywordsEn":["slingshot","pull and release","trajectory preview","physics","projectile"],"recognize":["先往后拉再松手","有一条预告轨迹的虚线","撞上去东西会倒塌"],"form":{},"works":[{"title":"愤怒的小鸟","creator":"Rovio","year":2009},{"title":"怪物弹珠","creator":"mixi","year":2013}],"demo":null,"dg":"sling","hint":"","related":["joystick"],"use":3,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"branching","kind":"technique","cat":"choice","zh":"分支对话","en":"Branching Dialogue","aka":["对话树","选项对话"],"oneLine":"每一句回答都会把故事带向不同的方向，几个选择组合出多个结局。","era":{"from":1980,"to":null},"regions":["global"],"media":["pc","console","mobile","web"],"players":["solo"],"makeLevel":"web","making":"用节点和跳转描述剧情，变量记住玩家选过什么；分支多了要用汇合避免工作量爆炸。","ask":"做一个分支对话的小故事：每一步显示角色的一句话和两个选项，选项决定走向，一共四个结局；旁边用一张小树状图标出所有节点，走过的路径点亮，当前节点加圈。剧情用 JSON 描述节点和跳转，结局处显示“结局 x / 4”和重来按钮，方便以后加内容。","keywordsZh":["选项","分支","多结局","变量","汇合"],"keywordsEn":["branching dialogue","choices","multiple endings","dialogue tree","story flags"],"recognize":["说话时给你几个选项","选的不同，后面就不同","有好几个结局"],"form":{},"works":[{"title":"80 天","creator":"inkle","year":2014},{"title":"底特律：变人","creator":"Quantic Dream","year":2018},{"title":"极乐迪斯科","creator":"ZA/UM","year":2019}],"demo":"branching","dg":null,"hint":"选一个回答，看右边的树怎么走","related":["visual-novel","trpg"],"use":5,"status":"mainstream","usedIn":["game","web"],"ai":false},{"id":"streak","kind":"technique","cat":"growth","zh":"连续打卡","en":"Streak","aka":["连胜","Streak 火花"],"oneLine":"把每天的一点行动累成一个不断增长的数字，人会因为不想让它断掉而回来。","era":{"from":2012,"to":null},"regions":["north-america","global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"按本地日期记录每天是否完成；断了清零。常配“冻结卡”这类保护，避免一次中断就让人放弃。","ask":"做一个连续打卡组件：大号数字显示连续天数，下面一排是本周七天，已打卡的日子打勾，今天有一个打卡按钮；点下后今天的圆圈填满、数字加一并弹跳一下，提示语变成离下一个徽章还差几天。连续天数断了要清零，数据存在本地。","keywordsZh":["连续天数","每日打卡","徽章","断签","冻结卡"],"keywordsEn":["streak","daily check-in","habit loop","badge","streak freeze"],"recognize":["有一个连续了多少天的大数字","一周七个圆圈","断了会清零"],"form":{},"works":[{"title":"多邻国的连胜","creator":"Duolingo","year":2012},{"title":"Snapchat 连续火花","creator":"Snap","year":2015}],"demo":"streak","dg":null,"hint":"点“今天打卡”","related":["gacha","idle"],"use":5,"status":"mainstream","usedIn":["web","game"],"ai":false},{"id":"gacha","kind":"technique","cat":"growth","zh":"抽卡","en":"Gacha","aka":["扭蛋","Gacha"],"oneLine":"花一次机会抽一张卡，结果从普通到稀有不等；保底机制保证抽到一定次数必出好东西。","era":{"from":2010,"to":null},"regions":["japan","china","korea"],"media":["mobile"],"players":["solo"],"makeLevel":"web","making":"按概率表抽取，加上保底计数；开卡动画的节奏和稀有度的视觉区分决定了刺激感。多数地区要求公示概率。","ask":"做一个抽卡系统原型：概率为普通 70%、稀有 25%、传说 5%，连续 10 次没出传说时第 10 次必出；点“抽一次”后卡牌先抖动再翻开，稀有度越高光效越强；下方显示最近 10 次结果和距离保底的次数。页面上公示概率。","keywordsZh":["概率","保底","开卡动画","稀有度","十连"],"keywordsEn":["gacha","pity system","rarity","loot box","pull animation"],"recognize":["有一个“抽一次”的按钮","开卡前有悬念的动画","写着“还差几次保底”"],"form":{},"works":[{"title":"智龙迷城","creator":"GungHo","year":2012},{"title":"原神","creator":"米哈游","year":2020}],"demo":"gacha","dg":null,"hint":"点“抽一次”","related":["streak"],"use":3,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"flow-curve","kind":"technique","cat":"pace","zh":"难度曲线","en":"Difficulty Curve","aka":["心流通道","节奏设计"],"oneLine":"难度随着玩家变强而上升，但始终留在“不太难也不太容易”的通道里，张弛交替。","era":{"from":1990,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"把关卡的挑战度和玩家的能力画成两条线，挑战略高于能力；每段高峰之后给一段喘息。动态难度会根据失败次数微调。","ask":"为一个 10 关的小游戏设计难度曲线：每关用三个参数描述挑战度（敌人数量、速度、可用时间），整体呈锯齿状上升，每三关有一个高峰、高峰后一关放松；如果玩家在同一关失败三次，下次进入时速度降低 10%。输出参数表，并用一张折线图展示曲线。","keywordsZh":["心流","锯齿上升","喘息","动态难度","教学关"],"keywordsEn":["difficulty curve","flow channel","pacing","dynamic difficulty","tutorial level"],"recognize":["前几关在偷偷教你","难一段、松一段","失败多了会悄悄变简单"],"form":{},"works":[{"title":"超级马力欧兄弟 1-1","creator":"任天堂","year":1985}],"demo":null,"dg":"flow","hint":"","related":["platformer"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"async-pvp","kind":"technique","cat":"social","zh":"异步对战","en":"Asynchronous Multiplayer","aka":["异步多人","回合制对战"],"oneLine":"对手不需要和你同时在线：你走一步、他晚点再回一步，或者你去打他留下的防守阵容。","era":{"from":2009,"to":null},"regions":["global"],"media":["mobile","web"],"players":["versus"],"makeLevel":"web","making":"把对局状态存在服务器上，轮到谁就通知谁；或者保存玩家的防守快照，让其他人随时来挑战。","ask":"设计一个异步对战的原型：两名玩家轮流在 5×5 的格子上放子，轮到谁就给谁发通知，对方 24 小时不走则判负；对局状态存在服务器的一条记录里，客户端打开时读取。先用本地存储模拟两个玩家，界面显示“等对方落子”和历史回合。","keywordsZh":["轮流","回合通知","防守快照","不必同时在线","超时"],"keywordsEn":["asynchronous multiplayer","turn-based","push notification","ghost data","play by mail"],"recognize":["要等对方回合","对手可能几小时后才走一步","也可能是在打别人留下的阵容"],"form":{},"works":[{"title":"Words With Friends","creator":"Zynga","year":2009},{"title":"部落冲突","creator":"Supercell","year":2012}],"demo":null,"dg":"async","hint":"","related":["trpg"],"use":3,"status":"mainstream","usedIn":["game","web"],"ai":false},{"id":"screen-shake","kind":"technique","cat":"feedback","zh":"屏幕震动","en":"Screen Shake","aka":["震屏","Camera Shake"],"oneLine":"开火、爆炸、被击中时让镜头抖一下，几像素、两百多毫秒就够，画面里的力量感马上就出来了。","era":{"from":1982,"to":null},"regions":["global"],"media":["arcade","console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"命中时记录一个震动强度，每帧给镜头加随机或沿打击方向的偏移，偏移量按剩余时间的平方衰减；整个场景用 translate 画，HUD 不跟着抖。","ask":"给开火和命中加屏幕震动：每次触发时镜头在 240 毫秒内随机偏移，最大幅度 10 像素，强度按剩余时间的平方衰减到 0；连续触发时取较大值而不是叠加。HUD 和文字不跟着抖。幅度、持续时间和抖法（随机 / 沿打击方向 / 带轻微旋转）做成可调参数，加一个开关方便对比，手机上点屏幕触发。","keywordsZh":["屏幕震动","镜头抖动","打击感","爆炸反馈","震屏衰减"],"keywordsEn":["screen shake","camera shake","trauma","game juice","impact feedback"],"recognize":["爆炸和重击时整个画面猛地一抖","抖动很短，马上平复","界面文字通常稳稳不动"],"form":{},"works":[{"title":"核子王座","creator":"Vlambeer","year":2015},{"title":"Luftrausers","creator":"Vlambeer","year":2014},{"title":"井中猎手","creator":"Moppin","year":2015}],"demo":"screen-shake","dg":null,"hint":"点画面开火；下面可以调幅度和抖法","related":["hit-stop","knockback","hit-flash","slow-motion"],"use":5,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"squash-stretch","kind":"technique","cat":"feedback","zh":"挤压拉伸","en":"Squash and Stretch","aka":["弹性形变"],"oneLine":"落地时压扁、腾空时沿速度方向拉长，体积大致不变。动画十二法则的第一条，一个方块也能因此显得有弹性、有重量。","era":{"from":1930,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"碰撞瞬间按撞击速度设定形变量，用衰减的余弦让它在一两百毫秒内回弹；缩放时让宽 × 高 ≈ 1 保持体积，飞行中先旋转到速度方向再拉长。","ask":"给弹跳的角色加挤压拉伸：落地瞬间按撞击速度压扁，最大压缩 30%，同时横向等比变宽保持体积；180 毫秒内用衰减余弦弹回原形。腾空时沿速度方向拉长，速度越快拉得越长。撞墙时换成横向压扁。幅度、回弹时间和是否保持体积做成可调参数，加一个开关对比没有形变的版本；点屏幕把角色抛起来。","keywordsZh":["挤压拉伸","弹性形变","落地压扁","Q弹","果冻感"],"keywordsEn":["squash and stretch","volume preservation","landing squash","jelly","juicy animation"],"recognize":["落地那一下明显扁了","跳起来会变细长","形变很快就弹回去"],"form":{},"works":[{"title":"超级食肉男孩","creator":"Team Meat","year":2010},{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018},{"title":"茶杯头","creator":"Studio MDHR","year":2017}],"demo":"squash-stretch","dg":null,"hint":"点画面把球抛起来；虚线圈是原始大小","related":["easing","spring","anticipation","hit-stop"],"use":5,"status":"classic","usedIn":["game","web"],"ai":false},{"id":"camera-follow","kind":"technique","cat":"feedback","zh":"镜头跟随","en":"Camera Follow","aka":["镜头插值","死区","Camera Lerp"],"oneLine":"镜头不死盯角色，而是带一点延迟追上去：小范围走动时不动（死区），移动时往前方多看一截（前瞻），画面稳又看得远。","era":{"from":1985,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"镜头目标点 = 角色位置 + 速度方向 × 前瞻距离；目标出了死区矩形才移动，移动用和帧率无关的指数插值 1 - e^(-k·dt) 追过去。","ask":"做一个 2D 镜头跟随：镜头中心用指数插值追角色，跟随速度 6/秒（每帧 k = 1 - e^(-6·dt)，和帧率无关）；屏幕中间留一个宽高各 16% 的死区，角色在死区里走动镜头不动；移动时镜头往速度方向多看 50 像素，前瞻点本身也要平滑过渡。跟随速度、死区大小、前瞻距离做成可调参数，加调试开关显示死区框和前瞻点；手机上按住拖动控制角色。","keywordsZh":["镜头跟随","平滑镜头","死区","前瞻","镜头插值"],"keywordsEn":["camera follow","camera lerp","dead zone","look-ahead","smooth damp"],"recognize":["角色走两步镜头不动","跑起来前方视野变大","停下后镜头慢慢回正"],"form":{},"works":[{"title":"超级马力欧世界","creator":"任天堂","year":1990},{"title":"空洞骑士","creator":"Team Cherry","year":2017},{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018}],"demo":"camera-follow","dg":null,"hint":"按住拖动指挥小球；虚线框是死区，小圈是前瞻点","related":["screen-shake","platformer","metroidvania","easing"],"use":5,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"easing","kind":"technique","cat":"feedback","zh":"缓动曲线","en":"Easing","aka":["缓入缓出","Easing Function","Tween"],"oneLine":"动画的位置不随时间匀速变化，而是按一条曲线先快后慢、或冲过头再回来。同样 400 毫秒，换条曲线手感就完全不同。","era":{"from":2001,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"把 0 到 1 的时间进度 p 喂给缓动函数得到位置进度，常用 1-(1-p)^3（减速）、回拉、弹性、弹跳几种；CSS 里用 cubic-bezier，游戏里用 Tween 库。","ask":"给界面里的移动和弹出动画统一用缓动：默认用三次方减速曲线（1-(1-p)^3），时长 420 毫秒；做一个可选列表切换减速、缓入缓出、回拉、弹性、弹跳五种曲线，曲线力度（2 到 6 次方）和时长做成可调参数。画一张时间-位置曲线图和一条匀速对照轨道，再用等时间间隔的刻度显示快慢分布；加开关切回线性对比。","keywordsZh":["缓动曲线","缓入缓出","动画曲线","回弹效果","贝塞尔曲线"],"keywordsEn":["easing function","ease out cubic","cubic-bezier","tween","ease in out"],"recognize":["动作起步或收尾明显变慢","有的会冲过头再弹回","匀速移动会显得很机械"],"form":{},"works":[{"title":"Robert Penner 缓动方程","creator":"Robert Penner","year":2002},{"title":"CSS Transitions 规范","creator":"W3C","year":2009}],"demo":"easing","dg":null,"hint":"点画面再播一次；下面可以换曲线","related":["spring","squash-stretch","camera-follow","magnetic"],"use":5,"status":"mainstream","usedIn":["web","game"],"ai":false},{"id":"damage-numbers","kind":"technique","cat":"feedback","zh":"伤害数字","en":"Damage Numbers","aka":["跳字","浮动战斗文字","Floating Combat Text"],"oneLine":"打中敌人时从身上弹出一个数字，先放大再上浮淡出，暴击用更大的字。玩家不用看血条就知道这一刀有多疼。","era":{"from":1997,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"每次命中生成一个文字对象，前 60 毫秒放大到 1.6 倍再缩回，沿缓出曲线上浮、末段淡出；同一目标短时间内的伤害可以合并累加，避免刷屏。","ask":"打中敌人时弹出伤害数字：数字在命中点上方出现，前 60 毫秒放大到 1.6 倍再缩回原尺寸，然后带一点随机横向漂移上浮，800 毫秒内淡出（最后 30% 才开始变透明）。暴击率 20%，暴击数字更大、斜体、加描边和“暴击”小字。可选把短时间内的连续伤害累加成一个数字。停留时间、弹出倍数、暴击率做成可调参数；手机上点屏幕攻击。","keywordsZh":["伤害数字","跳字","暴击数字","飘字","战斗反馈"],"keywordsEn":["damage numbers","floating combat text","critical hit","damage popup","hit feedback"],"recognize":["数字从被打的位置跳出来","暴击的字明显更大","数字很快飘走消失"],"form":{},"works":[{"title":"冒险岛","creator":"Wizet","year":2003},{"title":"魔兽世界","creator":"暴雪娱乐","year":2004},{"title":"无主之地","creator":"Gearbox Software","year":2009}],"demo":"damage-numbers","dg":null,"hint":"点画面连续攻击；斜体大字是暴击","related":["hit-flash","hit-stop","combo-counter","health-bar-lag"],"use":5,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"hit-flash","kind":"technique","cat":"feedback","zh":"受击闪白","en":"Hit Flash","aka":["闪白","白闪","Damage Flash"],"oneLine":"被打中的那几帧，敌人整个变成一块纯白剪影，然后恢复。最便宜的命中确认，屏幕再乱也看得清“打到了”。","era":{"from":1987,"to":null},"regions":["global"],"media":["arcade","console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"命中后几帧里把精灵的所有不透明像素替换成纯色：引擎里用一个 flash 参数的着色器，网页里可以用离屏 canvas 加 source-atop 填色。","ask":"给敌人加受击闪白：被命中后 3 帧（约 50 毫秒）内把精灵所有不透明像素画成纯白剪影，保留轮廓，之后恢复原样；同时敌人往后缩一点。闪的方式可选纯色剪影、闪烁（隐藏）、渐隐三种，可设置连闪 1 到 4 下。时长（帧）、方式、次数做成可调参数，加开关对比；用着色器或 canvas 的 source-atop 实现，不要换贴图。","keywordsZh":["受击闪白","命中闪烁","白闪","受伤反馈","打击感"],"keywordsEn":["hit flash","white flash","damage flash","flash shader","hit confirm"],"recognize":["敌人中招时整块变白","只闪一两帧","闪完立刻恢复原色"],"form":{},"works":[{"title":"洛克人","creator":"Capcom","year":1987},{"title":"空洞骑士","creator":"Team Cherry","year":2017},{"title":"死亡细胞","creator":"Motion Twin","year":2018}],"demo":"hit-flash","dg":null,"hint":"点画面开枪；底下的格子是最近 14 帧","related":["hit-stop","damage-numbers","i-frames","knockback"],"use":5,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"knockback","kind":"technique","cat":"feedback","zh":"击退","en":"Knockback","aka":["击飞","受击后退"],"oneLine":"被打中的一方沿攻击方向被推出去一截，再被摩擦力拖停。距离写清了这一下有多重，也给了双方喘口气的空间。","era":{"from":1986,"to":null},"regions":["global"],"media":["arcade","console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"命中时给目标一个沿攻击方向的初速度，之后每帧乘以摩擦系数（如 0.86）衰减；可附加向上的速度做挑飞，硬直期间禁止目标行动。","ask":"给近战攻击加击退：命中时给敌人一个水平初速度 18 像素/帧，之后每帧乘以 0.86 的摩擦系数减速停下，撞墙会小幅反弹；敌人受击后硬直 220 毫秒不能行动，头上转小星星。可选挑飞：同时给向上的速度，落地再弹一下。力度、摩擦、挑飞、硬直做成可调参数，加开关对比原地不动的版本；手机上点屏幕挥砍。","keywordsZh":["击退","击飞","受击后退","硬直","打击感"],"keywordsEn":["knockback","knockback impulse","hitstun","launch","friction"],"recognize":["打中后对方往后滑一截","越重的攻击推得越远","被推的时候不能还手"],"form":{},"works":[{"title":"恶魔城","creator":"Konami","year":1986},{"title":"任天堂明星大乱斗","creator":"HAL研究所","year":1999},{"title":"哈迪斯","creator":"Supergiant Games","year":2020}],"demo":"knockback","dg":null,"hint":"点画面挥砍；敌人会自己走回来","related":["hit-stop","screen-shake","hit-flash","i-frames"],"use":5,"status":"classic","usedIn":["game"],"ai":false},{"id":"i-frames","kind":"technique","cat":"feedback","zh":"无敌帧","en":"Invincibility Frames","aka":["无敌时间","i-frame","受击无敌"],"oneLine":"受伤或翻滚之后有一小段时间不会再受伤，角色一闪一闪地提示。没有它，一串子弹能把满血瞬间清空。","era":{"from":1985,"to":null},"regions":["global"],"media":["arcade","console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"受伤时记下 invulnerableUntil = now + 时长，期间伤害判定直接跳过；渲染时按频率交替隐藏角色，闪避动作则在动画的某几帧打开无敌标记。","ask":"给角色加受击无敌帧：受伤后 900 毫秒内不再受伤，期间角色以每秒 12 次的频率闪烁，身边画一圈倒计时圆环；这段时间里碰到的子弹直接穿过，不扣血也不再触发受击。弹幕每秒 6 发，角色上下拖动躲避。无敌时长、闪烁频率、弹幕密度做成可调参数，加开关对比没有无敌帧时连续扣血的情况，并统计扣血和被挡下的次数。","keywordsZh":["无敌帧","受击无敌","翻滚无敌","闪烁提示","容错"],"keywordsEn":["invincibility frames","i-frames","mercy invincibility","dodge roll","damage cooldown"],"recognize":["受伤后角色在闪","闪的时候撞上敌人不掉血","翻滚能穿过攻击"],"form":{},"works":[{"title":"超级马力欧兄弟","creator":"任天堂","year":1985},{"title":"黑暗之魂","creator":"FromSoftware","year":2011},{"title":"挺进地牢","creator":"Dodge Roll","year":2016}],"demo":"i-frames","dg":null,"hint":"上下拖动躲子弹；受伤后闪烁期间子弹会穿身而过","related":["hit-flash","knockback","coyote-time","soulslike"],"use":5,"status":"classic","usedIn":["game"],"ai":false},{"id":"afterimage","kind":"technique","cat":"feedback","zh":"拖尾残影","en":"Afterimage","aka":["残影","Motion Trail","Ghost Trail"],"oneLine":"角色冲刺时身后留下一串逐渐变淡的剪影，速度和轨迹一眼就看得出来，也让瞬间位移不至于像传送。","era":{"from":1997,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"移动时每隔固定毫秒记录一次当前姿势和位置，存进环形队列；渲染时按年龄降低透明度画出这些快照，引擎里也可以复用精灵换成纯色材质。","ask":"给冲刺加拖尾残影：冲刺 220 毫秒，期间每 40 毫秒在当前位置留下一个角色剪影，最多同时存在 6 个，每个在 300 毫秒内淡出，越旧越淡；剪影用纯色填充（可选只描边），和角色保持同一姿势与朝向。数量、间隔、淡出时间、样式做成可调参数，加开关对比；手机上点哪里就冲到哪里。","keywordsZh":["残影","拖尾","冲刺特效","速度感","幻影"],"keywordsEn":["afterimage","motion trail","ghost trail","dash effect","speed lines"],"recognize":["冲刺时身后有一串影子","影子越往后越淡","停下来影子很快消失"],"form":{},"works":[{"title":"恶魔城X：月下夜想曲","creator":"Konami","year":1997},{"title":"蔚蓝","creator":"Maddy Makes Games","year":2018}],"demo":"afterimage","dg":null,"hint":"点画面任意位置冲刺过去","related":["squash-stretch","slow-motion","screen-shake","platformer"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"slow-motion","kind":"technique","cat":"feedback","zh":"子弹时间","en":"Slow Motion","aka":["慢动作","Bullet Time","时间缓速"],"oneLine":"按下按键整个世界慢到原来的一小截，子弹都看得清轨迹。用来给玩家多一点反应时间，或者把精彩瞬间拉长给人看。","era":{"from":2001,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","making":"所有游戏逻辑都乘上全局 timeScale，进入和退出时让 timeScale 在一两百毫秒内平滑过渡；玩家自己可以选择不受影响，界面动画用真实时间。","ask":"做一个子弹时间：按住屏幕时全局时间流速降到 20%，松开恢复到 100%，进出都在 200 毫秒内平滑过渡，不要瞬间切换。所有敌人、子弹、粒子都乘这个时间系数，可选让玩家自己保持正常速度。慢动作时上下压暗边，子弹画出轨迹线，右下角显示当前流速。流速、过渡时间、玩家是否受影响做成可调参数，加开关对比。","keywordsZh":["子弹时间","慢动作","时间缓速","时间系数","高光时刻"],"keywordsEn":["bullet time","slow motion","time scale","time dilation","slow-mo"],"recognize":["按住某个键世界变慢","子弹拖着清楚的轨迹","进出慢动作有过渡"],"form":{},"works":[{"title":"马克思·佩恩","creator":"Remedy Entertainment","year":2001},{"title":"F.E.A.R.","creator":"Monolith Productions","year":2005},{"title":"燥热","creator":"SUPERHOT Team","year":2016}],"demo":"slow-motion","dg":null,"hint":"按住画面进入子弹时间，松开恢复","related":["hit-stop","screen-shake","afterimage","flow-curve"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"spring","kind":"technique","cat":"feedback","zh":"弹簧动画","en":"Spring Animation","aka":["弹性动画","物理动画","Spring Physics"],"oneLine":"用弹簧的刚度、阻尼和质量来驱动动画，而不是固定时长加曲线。拖着走、放手回弹，被打断也能顺着当前速度接着动。","era":{"from":2013,"to":null},"regions":["global"],"media":["mobile","web","console","pc"],"players":["solo"],"makeLevel":"web","making":"每帧按 F = -k·x - c·v 更新速度和位置（c = 2ζ√(km)），用小步长积分保证稳定；阻尼比 ζ < 1 会过冲，等于 1 刚好不过冲地停下。","ask":"用弹簧物理做卡片的拖拽回弹：放手后卡片按弹簧回到原位，刚度 220、阻尼比 0.45、质量 1，略微过冲一两下再停；拖动时卡片跟手并按水平速度轻微倾斜，放手时继承拖动速度。下方画出放手后 2 秒内离开原位的距离曲线。刚度、阻尼比、质量做成可调参数，加开关对比固定 300 毫秒补间的版本；手机上可以直接拖。","keywordsZh":["弹簧动画","弹性回弹","拖拽回弹","物理动画","阻尼"],"keywordsEn":["spring animation","spring physics","damping ratio","stiffness","interruptible animation"],"recognize":["放手后会冲过头再回来","动画被打断时不会生硬跳变","拖得越远弹得越猛"],"form":{},"works":[{"title":"iOS 7 弹簧动画 API","creator":"Apple","year":2013},{"title":"Pop 动画引擎","creator":"Facebook","year":2014},{"title":"Framer Motion","creator":"Framer","year":2019}],"demo":"spring","dg":null,"hint":"拖动卡片再松手；下面可以调刚度和阻尼","related":["easing","squash-stretch","magnetic","tilt"],"use":5,"status":"mainstream","usedIn":["web","game"],"ai":false},{"kind":"technique","cat":"feedback","aka":["振动反馈","触感","Rumble"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"ai":false,"id":"haptics","zh":"触觉反馈","en":"Haptics","oneLine":"在点击、成功、出错这些节点给手一下短促的振动，不看屏幕也知道操作生效了。好的触感是十几毫秒的“哒”，不是长长的嗡。","era":{"from":1997,"to":null},"media":["console","mobile","web"],"making":"网页用 navigator.vibrate([15,60,30]) 传入“振、停、振”的毫秒数组（安卓 Chrome 支持，iOS Safari 不支持）；原生 App 用 iOS 的 UIImpactFeedbackGenerator 或安卓的 HapticFeedbackConstants，手柄走引擎的 rumble 接口。","ask":"给按钮和结果提示加触觉反馈：用 navigator.vibrate，轻点只振 15 毫秒；成功用 [15, 60, 30]（短-停-稍长），警告用 [45, 60, 45, 60, 45]；先判断 'vibrate' in navigator，不支持的设备静默跳过。同时在界面上画一条振动波形示意，播放头随时间走过去，方便在电脑上也能看出节奏。提供开关让用户关掉振动，参数可调。","keywordsZh":["振动反馈","触感","手机振动","成功提示","马达","震动模式"],"keywordsEn":["haptics","navigator.vibrate","haptic feedback","rumble","Taptic Engine","HD Rumble"],"recognize":["点下去手指能感到一下“哒”","成功和出错的振动节奏不同","关掉声音也知道操作成功了"],"works":[{"title":"Rumble Pak 振动包","creator":"任天堂","year":1997},{"title":"iPhone 7 Taptic Engine","creator":"Apple","year":2016},{"title":"宇宙机器人无线控制器使用指南","creator":"Team Asobi","year":2020}],"hint":"点手机触发一次振动（安卓手机上真的会振）；下面可以换振动模式和脉冲长度","related":["button-press","screen-shake","hit-stop","confetti"],"use":4,"status":"rising","usedIn":["web","game"],"demo":"haptics"},{"kind":"technique","cat":"feedback","aka":["彩带","庆祝动画","五彩纸屑"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"ai":false,"id":"confetti","zh":"撒花庆祝","en":"Confetti","oneLine":"完成目标、付款成功、连续打卡时从屏幕两侧喷出一把纸屑，翻转着飘落，给一个本来很平淡的“完成”加上仪式感。","era":{"from":2016,"to":null},"media":["mobile","web"],"making":"Canvas 粒子：每片纸屑有初速度、空气阻力、重力和终端速度，绕自身轴翻转时把 y 方向按 cos(角度) 缩放来模拟正反面；网页上常直接用 canvas-confetti 库。","ask":"用户完成目标时放一次撒花：从屏幕左下和右下两侧各向斜上方喷出共 120 片纸屑，喷射张角 55 度；每片有空气阻力和重力（重力 0.8 倍），下落有终端速度，左右轻微飘动，翻转时用 scaleY(cos) 模拟正反面明暗。用 Canvas 实现，纸屑数限制在 300 以内，手机上流畅；同时完成卡片轻微放大一下。参数可调，可切换中心爆开或从天而降。","keywordsZh":["撒花","庆祝动画","完成反馈","彩带","粒子特效","打卡成功"],"keywordsEn":["confetti","celebration","canvas-confetti","particle burst","success state","delight"],"recognize":["完成的瞬间纸屑从两边喷出","纸屑边飘边翻转","只在重要节点出现，不会天天撒"],"works":[{"title":"iMessage 屏幕特效「五彩纸屑」","creator":"Apple","year":2016},{"title":"canvas-confetti","creator":"Kiril Vatev","year":2018},{"title":"多邻国","creator":"Duolingo","year":2012}],"hint":"点画面完成一个目标；下面可以调纸屑数量、张角和重力","related":["streak","particle-text","button-press","combo-counter"],"use":4,"status":"mainstream","usedIn":["web","game"],"demo":"confetti"},{"kind":"technique","cat":"feedback","aka":["连击数","Combo","连段计数"],"regions":["japan","north-america","global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"ai":false,"id":"combo-counter","zh":"连击计数","en":"Combo Counter","oneLine":"连续命中时屏幕角落的数字一跳一跳往上涨，后面挂一条倒计时，停手太久就断。它把“别停”变成看得见的压力和奖励。","era":{"from":1994,"to":null},"media":["arcade","console","pc","mobile"],"making":"维护 combo 和 lastHitTime，每帧检查 now - lastHitTime 是否超过断连窗口；数字每次加一时做一次放大回弹（scale 1.35 回到 1），每到阶段数换评语并加大字号。","ask":"做一个连击计数：每次命中 combo +1，数字在右侧以斜体大字显示，每跳一下放大 35% 再回弹；下面一条细进度条表示剩余时间，1200 毫秒内没有下一次命中就断连，断掉时旧数字下坠淡出并写“断了”。每 10 连升一阶，换评语（不错、漂亮、疯狂、传说），字号也跟着变大。记录最高连击，参数可调。","keywordsZh":["连击","连击数","断连","评价等级","打击反馈","连段"],"keywordsEn":["combo counter","combo timer","hit streak","style meter","combo break","multiplier"],"recognize":["数字随命中一跳一跳往上涨","有一条倒计时，停手就断","连到一定数会出评语"],"works":[{"title":"杀手本能","creator":"Rare","year":1994},{"title":"鬼泣","creator":"Capcom","year":2001},{"title":"猎天使魔女","creator":"PlatinumGames","year":2009}],"hint":"连续点画面打靶，停太久连击就断；下面可以调断连时间和数字跳动","related":["damage-numbers","hit-stop","streak","screen-shake"],"use":4,"status":"mainstream","usedIn":["game"],"demo":"combo-counter"},{"kind":"technique","cat":"feedback","aka":["受伤残影","延迟血条","Damage Trail"],"regions":["japan","global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"ai":false,"id":"health-bar-lag","zh":"掉血残影条","en":"Health Bar Lag","oneLine":"挨打时真实血量立刻扣掉，后面留一截浅色残影停一下再缓缓追上，玩家一眼就能看清“这一下打掉了多少”。","era":{"from":1996,"to":null},"media":["arcade","console","pc","mobile"],"making":"同时存 hp 和 ghost 两个值：受击时 hp 立即减少并记下时间，ghost 先停留一段时间再以固定速度向 hp 逼近；绘制时先画 ghost 再盖上 hp，连击中每次受击都重置停留计时。","ask":"给 Boss 血条加掉血残影：受击时实心血条立刻扣减，后面一截浅色（或斜纹）残影保持 450 毫秒不动，然后以每秒 60% 的速度追上实际血量；连续受击时重新计时，所以连打几下残影会攒成一大截再一起退。残影区上方显示这一下打掉的数值，单次伤害默认 12%。加开关对比，参数可调。","keywordsZh":["血条","掉血动画","受伤反馈","Boss 血条","残影","伤害可视化"],"keywordsEn":["health bar lag","damage trail","delayed health bar","ghost bar","boss health","HUD"],"recognize":["掉血后血条后面有一截浅色在慢慢退","连打几下浅色那截会变长","能看清一套连招打掉多少"],"works":[{"title":"黑暗之魂","creator":"FromSoftware","year":2011},{"title":"英雄联盟","creator":"Riot Games","year":2009},{"title":"艾尔登法环","creator":"FromSoftware","year":2022}],"hint":"点画面攻击，盯着血条后面那截浅色；下面可以调停留和追赶速度","related":["damage-numbers","hit-flash","combo-counter","easing"],"use":4,"status":"mainstream","usedIn":["game"],"demo":"health-bar-lag"},{"kind":"technique","cat":"feedback","aka":["蓄力前摇","前摇","起手式"],"regions":["north-america","japan","global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"ai":false,"id":"anticipation","zh":"预备动作","en":"Anticipation","oneLine":"动作发生前先往反方向做一下：跳之前蹲、冲刺前后仰、挥砍前收手。观众提前读懂要发生什么，真正的动作也显得更有力。","era":{"from":1930,"to":null},"media":["console","pc","mobile","web"],"making":"把动作拆成预备、执行、收势三段，预备段用缓出曲线压缩（下蹲时 scaleY 变小、scaleX 变大）或反向位移，再接执行段；在敌人身上，预备段的长短就是留给玩家的反应时间。","ask":"给角色的跳跃和冲刺加预备动作：触发后先花 160 毫秒下蹲（高度压到 70%、宽度相应变宽，眼睛眯一下），冲刺则先向反方向后仰；然后才起跳或冲出去，落地时再压扁回弹一次作为收势。画面下方显示预备、执行、收势三段时间轴和播放头。加开关对比没有预备的版本，蓄力时长和下蹲幅度可调。","keywordsZh":["预备动作","前摇","蓄力","动画十二原则","起跳下蹲","攻击预警"],"keywordsEn":["anticipation","wind-up","telegraph","12 principles of animation","squash","startup frames"],"recognize":["跳之前会先蹲一下","敌人出招前有明显的抬手","没有预备时动作像是凭空瞬移"],"works":[{"title":"生命的幻象：迪士尼动画","creator":"Frank Thomas、Ollie Johnston","year":1981},{"title":"怪物猎人","creator":"Capcom","year":2004},{"title":"空洞骑士","creator":"Team Cherry","year":2017}],"hint":"点画面让它跳或冲，注意出手前那一下；下面可以调蓄力时长和下蹲幅度","related":["squash-stretch","easing","hit-stop","spring"],"use":4,"status":"classic","usedIn":["game","web"],"demo":"anticipation"},{"kind":"technique","cat":"feedback","aka":["按下态","点击反馈","Tap Feedback"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"ai":false,"id":"button-press","zh":"按压反馈","en":"Button Press","oneLine":"手指按下的瞬间按钮就缩一点、往下沉、阴影收紧，松手再带一点回弹。它告诉用户“我收到了”，比等到请求返回快得多。","era":{"from":2013,"to":null},"media":["mobile","web"],"making":"pointerdown 时立刻把按钮 transform 设成 scale(0.96) translateY(2px) 并缩小阴影，按下用 60 毫秒左右的快速过渡；pointerup 时用弹簧或带回弹的 cubic-bezier 回到原位。注意按下就给反馈，不要等 click。","ask":"给主按钮加按压反馈：pointerdown 时 60 毫秒内缩到 96%，向下沉 2 像素，阴影同步变浅变小，背景略微变亮；松手时用 220 毫秒带一点回弹的曲线回到原状（可以略微超过原尺寸再回来）。反馈在按下时立即触发，不要等 click 事件；手机上加 touch-action: manipulation 去掉延迟。加开关对比，缩放、下沉、回弹时长可调。","keywordsZh":["按钮动效","点击反馈","按下态","微交互","按钮缩放","回弹"],"keywordsEn":["button press","active state","tap feedback","press animation","microinteraction","whileTap"],"recognize":["按下去按钮立刻缩小下沉","松手时会轻轻弹一下","手指没离开前就知道按到了"],"works":[{"title":"Material Design","creator":"Google","year":2014},{"title":"Framer Motion（whileTap）","creator":"Framer","year":2019}],"hint":"按住按钮再松开；下面可以调缩放、下沉和回弹时长","related":["spring","ripple","haptics","easing"],"use":5,"status":"mainstream","usedIn":["web"],"demo":"button-press"},{"kind":"technique","aka":["预输入","指令缓存"],"regions":["japan","global"],"players":["solo","versus"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game"],"ai":false,"id":"input-buffer","cat":"input","zh":"输入缓冲","en":"Input Buffer","oneLine":"角色还在收招时就按下的下一招先存起来，动作一结束立刻执行。连招因此能按节奏打出来，不用卡准某一帧。","era":{"from":1991,"to":null},"media":["arcade","console","pc","mobile"],"making":"每次按键记下时间戳；角色处于不可行动状态时，若离可行动只剩缓冲窗以内就把指令入队，可行动的第一帧取出执行，超出窗口的按键直接丢弃。","ask":"给动作游戏的攻击加输入缓冲：每招出招 90 毫秒、收招 280 毫秒；收招结束前 150 毫秒内按下的攻击先存起来，收招结束那一帧自动出下一招，更早的按键直接丢弃。上一招结束后 80 毫秒内接上算连段，画面显示连击数。底部画一条时间轴标出每次按键是执行、进缓冲还是被吞掉，做开关对比，支持点屏幕和空格键。","keywordsZh":["预输入","连招手感","指令缓存","收招","宽容判定","按键吞掉"],"keywordsEn":["input buffer","buffered input","recovery frames","combo","input leniency","action queue"],"recognize":["连点攻击键，招式一招接一招不断档","收招中提前按也不会被吞","关掉后要等动作完全停下才能按"],"works":[{"title":"街头霸王 II","creator":"Capcom","year":1991},{"title":"猎天使魔女","creator":"PlatinumGames","year":2009},{"title":"艾尔登法环","creator":"FromSoftware","year":2022}],"hint":"连点画面或按空格出拳；关掉缓冲对比收招中按键被吞","related":["coyote-time","hit-stop","soulslike"],"use":4,"demo":"input-buffer"},{"kind":"technique","aka":["瞄准吸附","子弹磁吸"],"regions":["north-america","global"],"players":["solo","versus"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game"],"ai":false,"id":"aim-assist","cat":"input","zh":"辅助瞄准","en":"Aim Assist","oneLine":"准星靠近敌人时自动放慢、被轻轻拉过去。手柄和触屏的精度比不过鼠标，射击游戏靠它把差距补回来。","era":{"from":2001,"to":null},"media":["console","mobile"],"making":"每帧找离准星最近的目标，在吸附半径内按距离加权：把本帧输入位移乘一个减速系数（摩擦），再把准星朝目标中心插值一点（磁吸），出了半径偏移量逐渐归零。","ask":"给射击游戏做辅助瞄准：目标周围 45 像素是吸附区，准星进区后玩家的移动量减少 45%，同时每帧把准星朝目标中心拉 35% 的强度，离中心越近效果越强，离开吸附区后偏移平滑归零。画出玩家手实际指的位置和被吸过去的准星，点击开火统计命中率，做开关对比，鼠标和触屏都能玩。","keywordsZh":["瞄准吸附","准星减速","手柄瞄准","命中率","射击手感","辅助"],"keywordsEn":["aim assist","aim friction","aim magnetism","reticle slowdown","bullet magnetism","controller aiming"],"recognize":["准星扫过敌人时会顿一下","手柄瞄准移动目标也能跟住","关掉后准星总是滑过头"],"works":[{"title":"光环：战斗进化","creator":"Bungie","year":2001},{"title":"命运 2","creator":"Bungie","year":2017},{"title":"使命召唤：现代战争","creator":"Infinity Ward","year":2019}],"hint":"移动瞄准、点击开火；小圈是手的位置，大准星是被吸过去的结果","related":["dead-zone","joystick","twin-stick","magnetic"],"use":4,"demo":"aim-assist"},{"kind":"technique","aka":["死区","摇杆响应曲线"],"regions":["global"],"players":["solo","versus"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game"],"ai":false,"id":"dead-zone","cat":"input","zh":"摇杆死区","en":"Stick Dead Zone","oneLine":"把摇杆中心一小圈的读数当作零，老化手柄的漂移不会让角色自己走；外圈重新映射到 0 到 1，推得越深走得越快。","era":{"from":1996,"to":null},"media":["console","pc","mobile"],"making":"读取摇杆向量长度，小于死区半径时输出零，其余按 (长度-死区)/(1-死区) 重新映射，再取次方做响应曲线；圆形死区按向量长度算，十字死区按 x、y 轴分别算。","ask":"给摇杆输入加死区：读数长度低于 15% 时输出 0，超过的部分重新映射到 0–1，再做 1.5 次方的响应曲线，让小幅推杆更好微调。用圆形死区，保证斜向推动不被吃掉。左边画摇杆、死区范围、原始读数和处理后的输出点，右边一个角色按输出移动；模拟一点摇杆漂移，开关对比能看出松手后角色会不会自己溜走。","keywordsZh":["摇杆漂移","死区","响应曲线","手柄设置","微调","灵敏度"],"keywordsEn":["dead zone","stick drift","response curve","radial dead zone","axial dead zone","analog input"],"recognize":["松开摇杆角色完全静止","轻推摇杆有一小段没反应","设置菜单里能调死区大小"],"works":[{"title":"火箭联盟","creator":"Psyonix","year":2015},{"title":"堡垒之夜","creator":"Epic Games","year":2017},{"title":"Apex 英雄","creator":"Respawn Entertainment","year":2019}],"hint":"拖动左边摇杆再松手；下面可以调死区和漂移","related":["joystick","aim-assist","twin-stick"],"use":3,"demo":"dead-zone"},{"kind":"technique","aka":["拖动排序","长按拖拽"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["web"],"ai":false,"id":"drag-reorder","cat":"web","zh":"拖拽排序","en":"Drag to Reorder","oneLine":"按住列表里的一项拖到别的位置，被拖的那行浮起来跟着手，其余行实时让出空位，松手就落定。","era":{"from":2008,"to":null},"media":["web","mobile","pc"],"making":"pointerdown 后计时，超过按住阈值才进入拖拽，避免和滚动冲突；拖动时按指针 y 算出目标槽位，调整数组顺序，其余行用 transform 从旧位置补间到新位置（FLIP），松手时被拖行补间回槽位。","ask":"做一个可以拖拽排序的待办列表：按住一行 200 毫秒后浮起，放大到 104% 并加投影，跟着手指上下移动；经过其他行时那些行用 180 毫秒的缓出动画让位，原位置显示虚线占位框，松手后平滑落进新位置。按住期间手指移动超过 12 像素视为滚动、取消拖拽。手机触屏和鼠标都能用。","keywordsZh":["拖动排序","列表重排","长按拖拽","让位动画","看板","占位"],"keywordsEn":["drag and drop","reorder list","sortable","FLIP animation","long press drag","kanban"],"recognize":["行的右侧有三条横线的把手","被拖的那行浮在其他行上面","其他行会滑开让位"],"works":[{"title":"Trello","creator":"Fog Creek Software","year":2011},{"title":"Notion","creator":"Notion Labs","year":2016},{"title":"Todoist","creator":"Doist","year":2007}],"hint":"按住一行拖动；关掉让位动画对比生硬的跳位","related":["long-press","snap","magnetic"],"use":5,"demo":"drag-reorder"},{"kind":"technique","aka":["滑卡","Tinder 式滑动"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["web","game"],"ai":false,"id":"swipe-cards","cat":"web","zh":"左右滑卡","en":"Swipe Cards","oneLine":"一叠卡片，往右甩是要、往左甩是不要。卡片跟手倾斜并亮出标签，一个手势就完成一次二选一。","era":{"from":2012,"to":null},"media":["mobile","web"],"making":"拖动时卡片位移跟手，旋转角与水平偏移成正比；松手时位移超过阈值或最近 90 毫秒的速度够快就沿该方向飞出，否则弹簧回中，下一张从后面放大补位。","ask":"做一个左右滑卡片的选择器：卡片跟手拖动，旋转角随水平偏移变化，最大 12 度，并逐渐显示“想去 / 跳过”的标签；松手时偏移超过卡片区宽度的 30%，或甩动速度超过 0.6 像素/毫秒，卡片就朝那个方向飞出，否则弹回中间。后面一张卡跟着放大补位，顶部计数，手机触屏和鼠标都能用。","keywordsZh":["左右滑","卡片堆","二选一","甩动","弹回","交友"],"keywordsEn":["swipe cards","card stack","tinder swipe","fling to dismiss","binary choice","gesture"],"recognize":["一叠卡只露出最上面一张","拖动时卡片会歪","甩一下卡片飞出屏幕"],"works":[{"title":"Tinder","creator":"Hatch Labs","year":2012},{"title":"王权","creator":"Nerial","year":2016}],"hint":"左右拖动或甩卡片；越过虚线才算","related":["fling","rubber-band","branching"],"use":4,"demo":"swipe-cards"},{"kind":"technique","aka":["下拉加载"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"classic","usedIn":["web"],"ai":false,"id":"pull-to-refresh","cat":"web","zh":"下拉刷新","en":"Pull to Refresh","oneLine":"列表已经在最顶上时继续往下拉，越拉越沉，过了阈值松手就刷新，新内容从顶部插进来。","era":{"from":2009,"to":null},"media":["mobile","web"],"making":"在滚动到顶时接管下拉手势，手指位移经过指数阻尼得到列表位移；超过阈值时给一次触感反馈，松手后停在阈值高度转圈，请求结束再插入新行、回弹到顶。","ask":"给信息流列表做下拉刷新：列表在顶部时继续下拉，列表位移按阻尼曲线增长，最多 160 像素；顶部指示环随拉动进度画满，拉过 72 像素时提示“松开刷新”并给一下触感反馈。松手后列表停在 72 像素处转圈 900 毫秒，然后从顶部插入一条新内容并回弹。没过阈值松手直接弹回，手机和鼠标拖动都能用。","keywordsZh":["下拉刷新","阻尼","信息流","加载指示","回弹","触感反馈"],"keywordsEn":["pull to refresh","overscroll","rubber banding","refresh control","feed","spinner"],"recognize":["在顶部往下拉列表会被拉出一段","拉到一定程度提示松开刷新","松手后转一圈出现新内容"],"works":[{"title":"Tweetie 2","creator":"atebits（Loren Brichter）","year":2009},{"title":"邮件（iOS 6）","creator":"Apple","year":2012}],"hint":"在手机里的列表上往下拉再松手","related":["rubber-band","scrollytelling","chat-ui"],"use":5,"demo":"pull-to-refresh"},{"kind":"technique","aka":["捏合缩放","滚轮缩放"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"classic","usedIn":["web","game"],"ai":false,"id":"pinch-zoom","cat":"web","zh":"双指缩放与平移","en":"Pinch Zoom & Pan","oneLine":"两指张开放大、捏拢缩小，手指下的那一点始终钉在原处；单指拖动平移。电脑上用滚轮以鼠标位置为中心缩放。","era":{"from":2007,"to":null},"media":["mobile","web","pc"],"making":"用 Pointer Events 记录两个触点，按两点距离之比改缩放、按中点位移改平移，并让中点下的内容坐标不变：t = 锚点 − (锚点 − t) × 新倍数/旧倍数；wheel 事件用同一公式，以指针为锚点。","ask":"给地图画布做双指缩放和平移：两指捏合时以两指中点为锚点缩放，范围 1 到 5 倍，中点下的内容不跟着跑；单指拖动平移，内容边缘不能拖进画面里。电脑上用滚轮以鼠标位置为中心缩放，每格 10%。超出范围时允许拉过一点，松手弹回。放大到 1.6 倍以上显示地点名，右侧显示当前倍数。","keywordsZh":["双指缩放","捏合","滚轮缩放","平移","锚点","地图"],"keywordsEn":["pinch to zoom","pan and zoom","wheel zoom","zoom to cursor","multi-touch","gesture"],"recognize":["两指张开画面放大","手指下的东西不会滑走","缩过头会弹回来"],"works":[{"title":"iPhone（照片、Safari）","creator":"Apple","year":2007},{"title":"Google 地图","creator":"Google","year":2005},{"title":"Figma","creator":"Figma","year":2016}],"hint":"双指捏合、单指拖动；电脑上用滚轮缩放","related":["rubber-band","fling","tilt"],"use":5,"demo":"pinch-zoom"},{"kind":"technique","aka":["按住","长按菜单","Haptic Touch"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["web","game"],"ai":false,"id":"long-press","cat":"web","zh":"长按","en":"Long Press","oneLine":"同一个按钮，轻点是主操作，按住半秒弹出更多选项。一个位置放两层功能，代价是用户得知道能长按。","era":{"from":2008,"to":null},"media":["mobile","web"],"making":"pointerdown 开始计时，超过时长阈值触发长按并标记，pointerup 时若未触发才当作轻点；期间指针移动超过容许距离就取消，避免和滚动、拖拽冲突。","ask":"给图标网格加长按：轻点图标打开应用，按住 500 毫秒弹出快捷菜单（编辑、分享、移除），其余图标变暗。按下时图标缩小到 96%，80 毫秒后开始显示一圈进度环预告长按；手指移动超过 10 像素就取消。屏蔽浏览器默认的长按菜单，手机触屏和鼠标都能用。","keywordsZh":["长按","快捷菜单","上下文菜单","按住","二级操作","触感"],"keywordsEn":["long press","press and hold","context menu","haptic touch","touch slop","secondary action"],"recognize":["按住一会儿弹出菜单","按住时有缩小或进度提示","轻点和长按做的是两件事"],"works":[{"title":"Android 长按菜单","creator":"Google","year":2008},{"title":"iPhone 6s 主屏幕快捷操作","creator":"Apple","year":2015},{"title":"微信","creator":"腾讯","year":2011}],"hint":"轻点图标或按住它；按住时看进度环","related":["drag-reorder","one-button","magnetic"],"use":4,"demo":"long-press"},{"kind":"technique","aka":["$1 识别器","一笔画识别","画符施法"],"regions":["global"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"classic","usedIn":["game"],"ai":false,"id":"gesture-recognize","cat":"input","zh":"手势绘制识别","en":"Gesture Recognition","oneLine":"用手指或鼠标一笔画个形状，程序认出它是圆、勾还是闪电，再触发对应的动作。很多“画符施法”的玩法靠的就是它。","era":{"from":2001,"to":null},"media":["mobile","console","pc","web"],"making":"$1 Unistroke 识别器：把笔迹重采样成等距的 N 个点，绕质心转到起点角，缩放到标准方框并平移到原点，再和每个模板比平均点距，用黄金分割搜索微调角度，距离换算成分数取最高的。","ask":"做一个一笔画手势识别：用户在框里画一笔，松手后用 $1 识别器和圆、三角、勾、单笔叉、闪电、箭头 6 个模板比对，笔迹重采样为 64 个点，开启旋转不变，相似度达到 80% 才算认出，否则提示认不出并给出最像的那个。右侧显示识别结果和前 4 名的分数条，在笔迹上画出重采样点。手机和鼠标都能画。","keywordsZh":["手势识别","一笔画","画符","笔迹","模板匹配","施法"],"keywordsEn":["$1 recognizer","unistroke","gesture recognition","template matching","stroke","sketch input"],"recognize":["画一个形状就触发技能","画歪一点也能认出来","画得太乱会提示认不出"],"works":[{"title":"黑与白","creator":"Lionhead Studios","year":2001},{"title":"大神","creator":"Clover Studio","year":2006},{"title":"$1 Unistroke Recognizer","creator":"Wobbrock、Wilson、Li（华盛顿大学）","year":2007}],"hint":"在虚线框里一笔画个圆、勾或闪电","related":["long-press","one-button","particle-text"],"use":3,"demo":"gesture-recognize"},{"id":"werewolf","kind":"style","cat":"table","zh":"狼人杀","en":"Werewolf / Mafia","aka":["社交推理","Mafia","杀人游戏"],"oneLine":"少数狼人藏在村民里，夜里刀人、白天发言投票。全部信息只有一个来源：别人说的话和他们投的票。","era":{"from":1986,"to":null},"regions":["global","china","europe"],"media":["physical","mobile","pc"],"players":["versus","mass"],"makeLevel":"web","making":"核心是身份分配加日夜状态机：夜晚阶段私密行动，白天轮流发言、同时亮票、结算出局。线上版靠房间、语音和发言计时器，票型记录是复盘的关键。","ask":"做一个网页狼人杀小局：9 人圆桌、3 狼 6 民，一夜一天循环；白天按座位轮流发言，每人限时 60 秒，发言时用箭头指向怀疑对象；投票同时亮票，票数显示在座位旁，平票无人出局；出局者翻牌公开身份，开关可切成不翻牌。玩家点座位就能指定自己这轮怀疑和投票的人，其他座位用简单规则模拟。手机竖屏下圆桌缩小、阶段说明放桌心。","keywordsZh":["身份牌","日夜交替","轮流发言","投票放逐","票型复盘","上帝主持"],"keywordsEn":["social deduction","hidden role","day night cycle","voting","bluffing","moderator"],"recognize":["开局每人拿一张只有自己知道的身份牌","白天绕桌一圈轮流发言，然后同时举手投票","出局的人要么翻牌，要么带着身份闭嘴旁观"],"form":{"loop":"夜里行动、白天发言、投票出局","input":"说话和投票","feedback":"别人的反应、票型、翻开的身份","pace":"一局 20 到 60 分钟，按发言轮推进","mood":"猜疑、表演、被冤枉的委屈"},"works":[{"title":"Among Us","creator":"Innersloth","year":2018,"img":{"src":"img/werewolf-945360-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/945360/","note":"Steam 商店页截图"}},{"title":"狼人游戏：天黑请闭眼","img":{"src":"img/werewolf-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:Werewolf_players_at_night.jpg","note":"维基共享资源，Dana Lookadoo，CC BY 2.0"}},{"title":"狼人游戏：围坐发言","img":{"src":"img/werewolf-wm-1.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:Are_you_a_werewolf%3F.jpg","note":"维基共享资源，Benny Mazur，CC BY 2.0"}},{"title":"Mafia（杀手游戏）","creator":"Dimitry Davidoff","year":1986},{"title":"米勒山谷狼人","creator":"Philippe des Pallières、Hervé Marly","year":2001},{"title":"一夜终极狼人","creator":"Bezier Games","year":2014},{"title":"Among Us","creator":"Innersloth","year":2018}],"demo":"werewolf","dg":null,"hint":"点一个座位指定你怀疑的人；可以调人数、狼数和是否翻牌","related":["murder-mystery","party-quiz","async-pvp","trpg"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"legacy-game","kind":"style","cat":"table","zh":"传承类桌游","en":"Legacy Board Game","aka":["传承机制","Legacy 游戏"],"oneLine":"同一盒游戏要连着玩十几局，每局结束都会在版图上贴贴纸、撕卡、拆封存的信封，规则和地图都会永久改变。","era":{"from":2011,"to":null},"regions":["north-america","europe"],"media":["physical"],"players":["coop","versus"],"makeLevel":"physical","making":"设计上是一份按局数展开的战役脚本：每局的结果写回持久状态（贴纸、被毁的卡），到指定节点解锁封存内容。数字版就是把版图状态存档，并按局数和条件触发新规则。","ask":"做一个传承类战役的网页原型：一张 24 座城的点线地图，战役共 12 局；每局结束在玩家路过的城上永久加 2 处改动（贴纸叠层、道路被划掉），改动跨局保留；每 3 局拆一个封存信封，弹出新规则卡并解锁一片新区域；底部进度条标出哪几局挂着信封。加一个开关对比每局清空重来的普通玩法，存档用 localStorage。","keywordsZh":["永久改动","封存信封","战役","贴纸","撕卡","版图成长"],"keywordsEn":["legacy","campaign","persistent board","sealed content","stickers","unlockables"],"recognize":["规则书里有空白格，玩着玩着往里贴新规则","盒子里有写着“第 N 局后才能打开”的信封","版图上的标记是贴纸和马克笔，擦不掉"],"form":{"loop":"打一局、结算、写回版图、拆新内容","input":"在版图上落子，结束时贴贴纸、撕卡","feedback":"版图越来越面目全非，新规则不断出现","pace":"一盒 12 到 24 局，每局一小时上下","mood":"这是只属于我们这一桌的世界"},"works":[{"title":"幽港迷城（数字版）","creator":"Flaming Fowl Studios","year":2021,"img":{"src":"img/legacy-game-780290-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/780290/","note":"Steam 商店页截图"}},{"title":"瘟疫危机：传承","creator":"Z-Man Games","year":2015,"img":{"src":"img/legacy-game-wm-0.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:Pandemic_Legacy_(33870877603).jpg","note":"维基共享资源，Sean Hagen from Vancouver, Canada，CC BY-SA 2.0"}},{"title":"瘟疫危机：传承","creator":"Z-Man Games","year":2015,"img":{"src":"img/legacy-game-wm-1.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:Pandemic_Legacy_(34550432131).jpg","note":"维基共享资源，Sean Hagen from Vancouver, Canada，CC BY-SA 2.0"}},{"title":"战国风云：传承","creator":"Hasbro","year":2011},{"title":"瘟疫危机：传承 第一季","creator":"Z-Man Games","year":2015},{"title":"幽港迷城","creator":"Cephalofair Games","year":2017}],"demo":"legacy-game","dg":null,"hint":"点一座城开下一局；看封存信封何时被拆开","related":["coop-boardgame","roguelike","streak","trpg"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"coop-boardgame","kind":"style","cat":"table","zh":"合作桌游","en":"Cooperative Board Game","aka":["合作游戏","Co-op 桌游"],"oneLine":"所有玩家站在同一边，对手是一套会自己推进的规则：感染在蔓延、怪物在逼近，大家只能商量着分配有限的行动点。","era":{"from":1987,"to":null},"regions":["north-america","europe"],"media":["physical","pc","mobile"],"players":["coop"],"makeLevel":"web","making":"关键是“游戏自己的回合”：玩家行动后抽事件牌推进威胁，配合连锁（爆发溢出到邻格）制造雪球。难度靠每轮抽几张、失败阈值来调，所有信息公开方便讨论。","ask":"做一个合作桌游原型：13 座城的点线地图，3 名玩家轮流行动，每人每回合 4 个行动点（移动一格或清掉 1 个感染方块）；所有玩家行动完后抽 2 张感染牌，每张给一座城加 1 块，满 3 块再感染就爆发，并连锁溢出到所有相邻城市；爆发累计 8 次全员失败，撑过 8 轮全员胜利。点城市可以指挥当前玩家赶过去，顶部显示爆发计数，手机上地图自适应。","keywordsZh":["共同目标","行动点","威胁升级","连锁爆发","全员胜负","团队讨论"],"keywordsEn":["cooperative","action points","escalation","outbreak chain","alpha player","shared win"],"recognize":["大家要么一起赢，要么一起输","每轮结束游戏会自己抽牌让局面变坏","玩家花大量时间讨论这回合谁去哪儿"],"form":{"loop":"玩家行动、游戏反击、威胁升级","input":"分配行动点，商量路线","feedback":"方块越堆越多，计数器往上爬","pace":"一局 45 分钟左右，越到后面越紧","mood":"焦头烂额的团结感"},"works":[{"title":"灵蕴岛（数字版）","creator":"Handelabra Games","year":2020,"img":{"src":"img/coop-boardgame-1236720-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1236720/","note":"Steam 商店页截图"}},{"title":"瘟疫危机","creator":"Z-Man Games","year":2008,"img":{"src":"img/coop-boardgame-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:Pandemic_board_game.jpg","note":"维基共享资源，Padaguan，CC BY-SA 4.0"}},{"title":"灵蕴岛","creator":"Greater Than Games","year":2017,"img":{"src":"img/coop-boardgame-wm-1.webp","w":1280,"h":723,"source":"https://commons.wikimedia.org/wiki/File:Mission_completed_in_Spirit_Island.jpg","note":"维基共享资源，Mathias N，CC0"}},{"title":"诡镇惊魂","creator":"Chaosium","year":1987},{"title":"瘟疫危机","creator":"Z-Man Games","year":2008},{"title":"灵蕴岛","creator":"Greater Than Games","year":2017}],"demo":"coop-boardgame","dg":null,"hint":"点一座城，当前玩家会赶过去治疗；可调感染速率、行动点和爆发上限","related":["legacy-game","tower-defense","werewolf","flow-curve"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"party-quiz","kind":"style","cat":"table","zh":"大屏答题","en":"Party Quiz / Jackbox-style","aka":["手机当手柄","Kahoot 式答题"],"oneLine":"一块大屏出题，每个人掏出手机扫码进房间，手机只当四色按键；答得又对又快分最高，每题结束切到排行榜。","era":{"from":1995,"to":null},"regions":["global","north-america"],"media":["web","console","pc","mobile"],"players":["versus","mass"],"makeLevel":"web","making":"大屏是主机页，手机是轻量控制页，两者用 WebSocket 连到同一个房间号；服务器统一计时，按作答耗时给分（Kahoot 是满分乘以 1 减去耗时比例的一半）。","ask":"做一个 Kahoot 式大屏答题：主屏显示题目、四个带形状的选项和倒计时，每题限时 20 秒；玩家用手机浏览器输入房间码加入，手机上只有四个大按键；答对得分 = 1000 ×（1 − 用时 / 时限 ÷ 2），速答加分可关成固定 1000；时间到或全员作答后公布答案和各选项人数，再切排行榜并做名次滑动动画。先用 6 个模拟玩家单机演示。","keywordsZh":["房间码","手机手柄","倒计时","速答加分","排行榜","主屏"],"keywordsEn":["second screen","room code","buzzer","speed bonus","leaderboard","party game"],"recognize":["进门先在手机上输一个四位房间码","题目只在大屏上，手机上只有几个大按钮","每题之后都切一次排行榜，名次上下滑动"],"form":{"loop":"看题、抢答、看排名","input":"手机上点按钮","feedback":"答案揭晓、加分、名次变化","pace":"一题 20 秒，一局十几分钟","mood":"客厅和教室里的起哄"},"works":[{"title":"Jackbox 派对游戏包 3","creator":"Jackbox Games","year":2016,"img":{"src":"img/party-quiz-434170-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/434170/","note":"Steam 商店页截图"}},{"title":"Jackbox 派对游戏包 6","creator":"Jackbox Games","year":2019,"img":{"src":"img/party-quiz-1005300-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1005300/","note":"Steam 商店页截图"}},{"title":"Kahoot! 大屏答题现场（希伯来语维基百科 20 周年）","creator":"Kahoot!","year":2023,"img":{"src":"img/party-quiz-wm-0.webp","w":1280,"h":576,"source":"https://commons.wikimedia.org/wiki/File:Hebrew_Wikipedia%27s_20th_birthday_Kahoot.jpg","note":"维基共享资源，Nizzan Cohen，CC BY-SA 4.0"}},{"title":"You Don't Know Jack","creator":"Jellyvision","year":1995},{"title":"Kahoot!","creator":"Kahoot!","year":2013},{"title":"Jackbox 派对游戏包","creator":"Jackbox Games","year":2014}],"demo":"party-quiz","dg":null,"hint":"点最左边那台手机答题；可以调时限、手机数和速答加分","related":["werewolf","streak","async-pvp","coop-boardgame"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"escape-room","kind":"style","cat":"space","zh":"密室逃脱","en":"Escape Room","aka":["真人密室","Room Escape"],"oneLine":"一群人被关进布满机关的房间，60 分钟内找线索、解谜、开锁出去。好的密室是一层套一层：打开一个盒子，里面是下一把锁的钥匙。","era":{"from":2007,"to":null},"regions":["global","china","japan","europe"],"media":["physical","installation","mobile"],"players":["coop"],"makeLevel":"physical","making":"设计上画一张谜题依赖图：每个锁的输入来自前面谜题的输出，线性、分叉、汇合三种结构搭配控制节奏；现场靠电磁锁、继电器和 Arduino 联动，配合主持人监控和定时提示。","ask":"做一个网页版嵌套谜锁：右边是 3 层套在一起的盒子，每层一把 3 位密码锁，点密码轮拨 0 到 6；左边是已拿到的线索卡，用点阵数量表示每位数字；打开一层，外框动画退开，并掉出下一层的线索卡；提示系统开着时，卡住超过 120 秒（演示中按 25 倍加速）就在拨错的那位下面闪一条下划线。全部打开后显示通关和用时。","keywordsZh":["谜题依赖","嵌套锁","线索","限时","主持人提示","机关"],"keywordsEn":["escape room","puzzle chain","combination lock","hint system","game master","props"],"recognize":["一进门就开始倒计时，墙上有块大表","到处是挂锁、密码箱和看起来不对劲的物件","卡住时对讲机里会传来主持人的提示"],"form":{"loop":"找线索、解谜、开锁、拿到下一层线索","input":"翻找、摆弄机关、拨密码","feedback":"锁咔嗒一声开了，门或抽屉弹开","pace":"通常 60 分钟一场，越到后面越赶","mood":"紧张、恍然大悟、团队配合"},"works":[{"title":"密室逃脱模拟器","creator":"Pine Studio","year":2021,"img":{"src":"img/escape-room-1435790-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1435790/","note":"Steam 商店页截图"}},{"title":"密室逃脱《探险》（Escape Quest 贝塞斯达）","creator":"Escape Quest","img":{"src":"img/escape-room-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:Escape_Room_-_%22The_Expedition%22_(Escape_Quest_Bethesda).jpg","note":"维基共享资源，Hudson Bloom，CC BY-SA 4.0"}},{"title":"密室逃脱《黑寡妇》（Escape Quest）","creator":"Escape Quest","img":{"src":"img/escape-room-wm-1.webp","w":1280,"h":852,"source":"https://commons.wikimedia.org/wiki/File:Escape_Quest_-_The_Black_Widow_1.jpg","note":"维基共享资源，Hudson Bloom，CC BY-SA 4.0"}},{"title":"Real Escape Game","creator":"SCRAP","year":2007},{"title":"Parapark","creator":"Attila Gyurkovics","year":2011},{"title":"EXIT 逃脱游戏","creator":"Kosmos","year":2016}],"demo":"escape-room","dg":null,"hint":"点密码轮拨数字，对照左边的点阵线索；可以调层数、位数和提示等待","related":["sokoban","murder-mystery","arg","larp"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"larp","kind":"style","cat":"space","zh":"实景角色扮演","en":"Live Action Role-Playing (LARP)","aka":["LARP","真人角色扮演","北欧 Larp"],"oneLine":"玩家穿上戏服、在真实场地里用身体扮演角色，一演就是几小时到几天。没有观众，剧情靠每个人带着的秘密目标彼此碰撞出来。","era":{"from":1977,"to":null},"regions":["europe","north-america","global"],"media":["physical","installation"],"players":["coop","versus","mass"],"makeLevel":"physical","making":"主创写的是角色和关系网，而不是剧情线：每个角色带两三条指向别人的目标或秘密，主持人按时间表投放剧情事件；规模大的场次用工作坊和安全词让玩家进出角色。","ask":"做一个 Larp 关系网的模拟器：一块分成 5 个房间的场地，16 个角色在里面走动，每人有 2 条指向其他人的秘密目标（虚线）；两个有目标关系的人相遇就停下对戏 1.7 秒，关系线变实线；主持人每 20 分钟（演示中压缩）在随机房间投放一封信，附近的人会围过去。玩家拖动自己的角色走位。加开关对比没有秘密目标时大家只是闲逛。","keywordsZh":["角色卡","秘密目标","关系网","主持人投放","场地","安全词"],"keywordsEn":["larp","character sheet","secret objectives","relationship map","runtime","bleed"],"recognize":["大家穿着戏服在真实场地里用第一人称说话","每个人都在找特定的某几个人谈事情","主持人不讲故事，只在关键时间点放出事件"],"form":{"loop":"进入角色、找人对戏、推进目标、迎接事件","input":"身体、对话、道具","feedback":"别人的回应、关系和局势的变化","pace":"一场几小时到一个周末","mood":"身临其境，下场后还会想很久"},"works":[{"title":"哈登施泰因城堡奇幻 LARP（2014）","year":2014,"img":{"src":"img/larp-wm-0.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:Hardenstein_2014_-_Adventurers.jpg","note":"维基共享资源，RalfHuels (photographer), Anja Arenz…，CC BY-SA 4.0"}},{"title":"Age of Chivalry 实景角色扮演（2018）","year":2018,"img":{"src":"img/larp-wm-1.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:Pirates_Firing_-_Age_of_Chivalry_2018.jpg","note":"维基共享资源，Noah Wulf，CC BY-SA 4.0"}},{"title":"Dagorhir","creator":"Bryan Weise","year":1977},{"title":"Just a Little Lovin'","creator":"Tor Kjetil Edland、Hanne Grasmo","year":2011},{"title":"巫术学院 College of Wizardry","creator":"Dziobak Larp Studios","year":2014}],"demo":"larp","dg":null,"hint":"拖动白点走位，碰到虚线另一头的人就会起戏；可以调人数、关系线和剧情投放间隔","related":["trpg","murder-mystery","immersive-theater","werewolf"],"use":2,"status":"rising","usedIn":[],"ai":false},{"id":"arg","kind":"style","cat":"space","zh":"平行实境游戏","en":"Alternate Reality Game (ARG)","aka":["ARG","侵入式游戏"],"oneLine":"故事被拆成碎片藏在真实世界的网站、电话、海报和坐标里，成千上万玩家在论坛上分头挖、一起拼，官方从不承认这是游戏。","era":{"from":2001,"to":null},"regions":["north-america","global"],"media":["web","mobile","physical"],"players":["mass","coop"],"makeLevel":"web","making":"核心是一个按幕推进的线索网：每幕若干碎片分散在不同渠道，玩家社区集齐后触发下一幕上线；制作方靠后台盯论坛进度，随时补线索或加难度，这个角色叫“幕后操纵者”。","ask":"做一个 ARG 线索网的可视化原型：中间是玩家论坛面板，周围 6 个渠道节点（网站源码、电话留言、海报、社交账号、坐标、音频频谱），一幕 8 片碎片分散在渠道里；300 名玩家按对数速度并行挖掘，藏得越深（5 级）越慢；每挖到一片，论坛里的密文就揭开一段，8 片集齐进入下一幕。点渠道可以帮忙加速，开关切换是否声明这是游戏。","keywordsZh":["兔子洞","碎片线索","玩家社区","幕后操纵者","不承认是游戏","跨媒介"],"keywordsEn":["alternate reality game","rabbit hole","puppet master","TINAG","transmedia","crowdsourced puzzle"],"recognize":["入口往往是一张奇怪海报或网页源码里的一行字","线索散落在电话、邮件、真实地点等多个渠道","玩家在论坛和 Discord 里集体解谜"],"form":{"loop":"发现兔子洞、挖碎片、社区拼合、解锁下一幕","input":"搜索、打电话、去现场、写代码解密","feedback":"新页面上线、电话打得通了、剧情往下走","pace":"持续几周到几个月，按幕推进","mood":"这件事好像真的在发生"},"works":[{"title":"《零年》ARG 中的 Art is Resistance 道具包","creator":"42 Entertainment","year":2007,"img":{"src":"img/arg-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:AIR_kit.jpg","note":"维基共享资源，Al Pavangkanan from Van Nuys, USA，CC BY 2.0"}},{"title":"《零年》ARG 在洛杉矶散发的传单","creator":"42 Entertainment","year":2007,"img":{"src":"img/arg-wm-1.webp","w":660,"h":1024,"source":"https://commons.wikimedia.org/wiki/File:AIR_flier.jpg","note":"维基共享资源，Ryan Tanaka from Los Angeles, USA，CC BY-SA 3.0"}},{"title":"The Beast","creator":"Microsoft","year":2001},{"title":"I Love Bees","creator":"42 Entertainment","year":2004},{"title":"Why So Serious?","creator":"42 Entertainment","year":2007}],"demo":"arg","dg":null,"hint":"点一个渠道帮大家挖碎片；可以调玩家人数、碎片数和藏得多深","related":["escape-room","location-ar","scrollytelling","immersive-theater"],"use":2,"status":"classic","usedIn":[],"ai":false},{"id":"immersive-theater","kind":"style","cat":"space","zh":"沉浸式剧场","en":"Immersive Theatre","aka":["漫游式戏剧","Promenade Theatre"],"oneLine":"演出铺满一整栋楼，几条故事线在不同房间同时循环上演；观众戴着面具自由走动、选择跟谁，每个人看到的都是不同的一晚。","era":{"from":1981,"to":null},"regions":["europe","north-america","china"],"media":["physical","installation"],"players":["mass"],"makeLevel":"physical","making":"导演排的是一张时空表：每个演员一条穿过房间的固定路线，按秒对齐，整场循环 2 到 3 次让观众补看；一对一场景从跟得最紧的观众里挑人。","ask":"做一个沉浸式剧场的俯视模拟：一栋 6 个房间的楼，4 名演员各走一条固定路线，每轮 60 分钟（演示压缩到约半分钟）并循环；60 个戴面具的观众会成群跟着演员走；玩家拖动自己的白圈，靠近哪个演员就跟着谁，右下统计你看到了多少个不同片段；跟随时有 8% 的概率被拉进一对一，画面压暗出字。开关切成坐着看的镜框式舞台做对比。","keywordsZh":["漫游","面具观众","多线并行","循环演出","一对一","场景设计"],"keywordsEn":["immersive theatre","promenade","masked audience","durational loop","one-on-one","site-specific"],"recognize":["进场先发一张白色面具，被要求不许说话","没有座位，观众在一栋楼里自己找戏看","散场后每个人讲的剧情都不一样"],"form":{"loop":"选一个人跟、看一段、换一个人跟","input":"走路和注视","feedback":"演员擦肩、房间亮起、偶尔被拉走","pace":"一轮约一小时，整场循环三次","mood":"偷窥感、迷路、错过的焦虑"},"works":[{"title":"麦基特里克酒店（《不眠之夜》纽约演出场地）","creator":"Punchdrunk","year":2011,"img":{"src":"img/immersive-theater-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:The_McKittrick_Hotel_1.jpg","note":"维基共享资源，Ahare63，CC0"}},{"title":"《不眠之夜》观众面具","creator":"Punchdrunk","year":2011,"img":{"src":"img/immersive-theater-wm-1.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:Sleep_No_More_mask.jpg","note":"维基共享资源，Autopilot，CC BY-SA 4.0"}},{"title":"Tamara","creator":"John Krizanc","year":1981},{"title":"不眠之夜 Sleep No More","creator":"Punchdrunk","year":2011},{"title":"Then She Fell","creator":"Third Rail Projects","year":2012}],"demo":"immersive-theater","dg":null,"hint":"拖动白圈去跟一个演员；可以调演员数、循环时长和一对一概率","related":["larp","installation","walking-sim","branching"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"projection-interactive","kind":"style","cat":"space","zh":"投影互动","en":"Interactive Projection","aka":["互动投影","体感投影","地面互动"],"oneLine":"投在墙上或地上的画面本身一直在流动，人走过去会把它推开，站着不动的地方开出花来。画面和人的身体之间只隔着一台摄像头。","era":{"from":1998,"to":null},"regions":["japan","global"],"media":["installation"],"players":["mass"],"makeLevel":"physical","making":"深度相机或红外摄像头做背景差分拿到人体轮廓，转成力场或遮罩喂给粒子、流体着色器，再用投影融合拼成一整面墙。常见工具是 TouchDesigner、Unity 和 openFrameworks。","ask":"做一个网页版投影互动：全屏 420 个粒子沿缓慢的正弦流场漂移，用半透明底色覆盖代替清屏形成 70% 的拖尾；画面里有 3 个人影（第一个跟随指针，其余自己走走停停），每个人周围 60 厘米（画面宽按 4 米算）内的粒子被推开，走得越快推力越大；有人站着不动超过 1200 毫秒，脚边就一朵朵开出线描的花，5 秒后凋谢。加开关对比关闭互动时的样子。","keywordsZh":["人影识别","粒子流场","投影融合","停留触发","拖尾","深度相机"],"keywordsEn":["interactive projection","body tracking","particle flow","dwell trigger","projection blending","TouchDesigner"],"recognize":["墙上地上的画面会跟着人的影子走","人站住不动，周围会长出东西","画面没人时也在缓慢流动"],"form":{"loop":"走进去、看画面怎么回应、试别的动作","input":"身体位置、速度、停留","feedback":"画面被推开、开花、跟随","pace":"没有起止，来去自由","mood":"像走进一幅会呼吸的画"},"works":[{"title":"teamLab 无界美术馆","creator":"teamLab","year":2018,"img":{"src":"img/projection-interactive-wm-0.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:TeamLab_Borderless,_Odaiba,_Tokyo,_Japan_(49070835722).jpg","note":"维基共享资源，Domenico Convertini from Zurich, Schweiz，CC BY-SA 2.0"}},{"title":"teamLab 无界美术馆","creator":"teamLab","year":2018,"img":{"src":"img/projection-interactive-wm-1.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:TeamLab_Borderless,_Odaiba,_Tokyo,_Japan_(49070645226).jpg","note":"维基共享资源，Domenico Convertini from Zurich, Schweiz，CC BY-SA 2.0"}},{"title":"teamLab 无界美术馆","creator":"teamLab","year":2018,"img":{"src":"img/projection-interactive-wm-2.webp","w":1280,"h":853,"source":"https://commons.wikimedia.org/wiki/File:TeamLab_Borderless,_Odaiba,_Tokyo,_Japan_(49070650346).jpg","note":"维基共享资源，Domenico Convertini from Zurich, Schweiz，CC BY-SA 2.0"}},{"title":"Boundary Functions","creator":"Scott Snibbe","year":1998},{"title":"Text Rain","creator":"Camille Utterback、Romy Achituv","year":1999},{"title":"teamLab 无界美术馆","creator":"teamLab","year":2018}],"demo":"projection-interactive","dg":null,"hint":"移动指针当一个人影，停住会开花；可以调影响半径、停留时间、拖尾和人数","related":["installation","ripple","particle-text","immersive-theater"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"location-ar","kind":"style","cat":"space","zh":"基于位置的 AR","en":"Location-based AR Game","aka":["LBS 游戏","位置游戏","地理定位游戏"],"oneLine":"游戏版图就是真实城市地图，玩家得出门走到某个街角，进入点位的触发半径才能抓精灵、领补给。走路本身成了核心操作。","era":{"from":2000,"to":null},"regions":["global","japan","north-america"],"media":["mobile","xr"],"players":["solo","coop","mass"],"makeLevel":"engine","making":"用 GPS 拿经纬度，地图瓦片做底，点位来自真实兴趣点数据库；进入地理围栏（通常几十米）触发事件，相遇画面叠在相机画面上。要防 GPS 漂移和作弊，服务器要做速度校验。","ask":"做一个基于位置的 AR 游戏原型：一块 400×400 米的街区地图，玩家位置居中，点地图就沿着走过去；地图上随机分布 8 个点位（精灵和补给站），触发半径 40 米，走进去弹出 AR 取景框演示相遇；精灵被遇到后 5 分钟（演示中按 1 秒 = 1 分钟）换个位置刷新，补给站原地冷却；附近雷达开着时右下角列出最近 3 只精灵的距离，关掉后只有走到 90 米内才看得见。","keywordsZh":["地理围栏","GPS 定位","兴趣点","刷新机制","AR 相遇","走路"],"keywordsEn":["location-based game","geofence","GPS","points of interest","spawn","AR encounter"],"recognize":["打开地图，你就是街道上那个小点","必须真的走过去，进入圆圈才能互动","热门地点会有一群人举着手机站着"],"form":{"loop":"出门、走路、进点位、抓或领、回家","input":"走路和点屏幕","feedback":"点位亮起、相遇弹出、图鉴增加","pace":"通勤、散步时玩几分钟","mood":"把熟悉的街道重新逛一遍"},"works":[{"title":"宝可梦 GO Fest 芝加哥（2017）","creator":"Niantic","year":2017,"img":{"src":"img/location-ar-wm-0.webp","w":1280,"h":960,"source":"https://commons.wikimedia.org/wiki/File:Pokemon_go_fest.jpg","note":"维基共享资源，Jim Trottier，CC BY-SA 2.0"}},{"title":"汉诺威街头的宝可梦 GO 玩家","creator":"Niantic","year":2016,"img":{"src":"img/location-ar-wm-1.webp","w":1280,"h":721,"source":"https://commons.wikimedia.org/wiki/File:Callinstra%C3%9Fe_Ecke_Hahnenstra%C3%9Fe_in_Hannover,_Pok%C3%A9mon_Go-Spielende_(77955).jpg","note":"维基共享资源，Bernd Schwabe，CC BY-SA 4.0"}},{"title":"Geocaching","creator":"Groundspeak","year":2000},{"title":"Ingress","creator":"Niantic","year":2013},{"title":"宝可梦 GO","creator":"Niantic","year":2016},{"title":"皮克敏 Bloom","creator":"Niantic","year":2021}],"demo":"location-ar","dg":null,"hint":"点地图往那儿走，走进虚线圈触发相遇；可以调触发半径、点位密度和刷新间隔","related":["arg","streak","gacha","installation"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"page-transition","kind":"technique","cat":"web","zh":"页面转场","en":"Shared Element Transition","aka":["共享元素过渡","Hero 动画","View Transitions"],"oneLine":"从列表点进详情时，被点的那张图不消失，而是直接放大、移动成详情页的头图。用户的视线一路跟着它，不会在切页时丢失位置感。","era":{"from":2014,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"记下元素在旧页面的位置和尺寸，新页面渲染后算出终点，用 FLIP 做 transform 插值；网页上可以直接用 View Transitions API 给两个元素起同一个 view-transition-name。","ask":"做一个相册列表到详情页的共享元素转场：点击某张卡片，封面图从卡片位置放大、移动成详情页顶部的头图，时长 380 毫秒，缓出曲线（cubic-bezier(0.2, 0, 0, 1)）；标题和正文比图片晚 30% 的时间再淡入上移。返回时反向播放。优先用 View Transitions API，不支持的浏览器退回 FLIP 动画；手机上整页过渡，不要出现闪白。","keywordsZh":["共享元素","页面转场","列表进详情","头图放大","视图过渡","FLIP 动画"],"keywordsEn":["shared element transition","hero animation","View Transitions API","FLIP","container transform","page transition"],"recognize":["点进去时，被点的那张图自己飞到了新页面的位置","背景和文字是后到的，主体先到","返回时图片会飞回原来那一格"],"form":{},"works":[{"title":"Android 5.0 Lollipop 共享元素过渡","creator":"Google","year":2014},{"title":"App Store「Today」卡片展开","creator":"Apple","year":2017},{"title":"View Transitions API","creator":"Chrome 团队","year":2023}],"demo":"page-transition","dg":null,"hint":"点一张相册进入详情，再点一下返回；关掉共享元素对比普通淡入","related":["bottom-sheet","stagger-reveal","skeleton"],"use":4,"status":"rising","usedIn":["web"],"ai":false},{"id":"skeleton","kind":"technique","cat":"web","zh":"骨架屏","en":"Skeleton Screen","aka":["占位加载","Skeleton Loading","内容占位符"],"oneLine":"数据还没回来时，先画出页面的灰色轮廓：头像是圆、标题是长条、图片是方块。用户提前知道内容长什么样，等待显得更短。","era":{"from":2013,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"按真实组件的尺寸写一套灰色占位块，加一层斜向渐变做扫光动画（background-position 循环）；数据到达后用短淡入替换，占位和真实内容尺寸要一致，避免布局跳动。","ask":"给信息流列表做骨架屏：加载时按真实卡片的结构画灰色占位（圆形头像、两行文字条、16:9 图片块），上面跑一道从左到右的扫光，一个周期 1400 毫秒；数据回来后占位用 200 毫秒淡出、真实内容淡入，尺寸完全一致，不许跳版。模拟 1600 毫秒的加载时间方便调试。用户开了“减少动态效果”时只保留静态灰块。","keywordsZh":["骨架屏","加载占位","扫光动画","感知速度","防跳版","首屏加载"],"keywordsEn":["skeleton screen","loading placeholder","shimmer","perceived performance","layout shift","content placeholder"],"recognize":["页面先出现一堆灰色的方块和长条","灰块上有一道光在扫","内容出来时位置正好对上，不会跳"],"form":{},"works":[{"title":"Polar（Luke Wroblewski 提出 skeleton screen）","creator":"Luke Wroblewski","year":2013},{"title":"react-loading-skeleton","creator":"David Tang","year":2017}],"demo":"skeleton","dg":null,"hint":"点画面重新加载；切换成转圈对比一下等待感","related":["infinite-scroll","empty-state","stagger-reveal"],"use":5,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"onboarding","kind":"technique","cat":"web","zh":"新手引导","en":"Coach Marks","aka":["蒙层引导","功能导览","Product Tour","聚光引导"],"oneLine":"第一次打开时，屏幕压暗，只留一个按钮亮着，旁边一个气泡说明它是干什么的，一步一步带着认完关键功能。","era":{"from":2010,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"取目标元素的 getBoundingClientRect，在全屏遮罩上挖一个带圆角的洞（大 box-shadow 或 SVG mask），气泡按目标位置自动选上下方；步骤之间让洞的位置和尺寸做补间。","ask":"做一个三步新手引导：全屏蒙层不透明度 60%，在目标按钮处挖一个圆角高亮洞，洞比按钮四周多留 8 像素；旁边弹出说明气泡，带“下一步”和“跳过”，以及 1/3 的步骤进度。切换步骤时洞的位置和大小用 320 毫秒补间过去，不要闪。气泡自动避开屏幕边缘，窗口尺寸变化时重新定位。完成后记在 localStorage，不再弹。","keywordsZh":["新手引导","蒙层高亮","功能导览","引导气泡","首次使用","步骤提示"],"keywordsEn":["coach marks","product tour","onboarding","spotlight overlay","tooltip walkthrough","first-run experience"],"recognize":["整个屏幕变暗，只有一个按钮是亮的","旁边有个气泡写着这是干什么的","有“下一步”和“跳过”，还有 1/3 这样的步数"],"form":{},"works":[{"title":"Intro.js","creator":"Afshin Mehrabani","year":2013},{"title":"Driver.js","creator":"Kamran Ahmed","year":2018}],"demo":"onboarding","dg":null,"hint":"点画面进入下一步；可以调蒙层深度和高亮留边","related":["empty-state","cursor-spotlight","command-palette"],"use":4,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"empty-state","kind":"technique","cat":"web","zh":"空状态","en":"Empty State","aka":["空页面设计","零数据状态","Inbox Zero"],"oneLine":"列表里什么都没有时，不只写一句“暂无数据”，而是告诉用户为什么是空的、下一步能做什么。首次使用、清空完成、搜不到结果，各说各的话。","era":{"from":2010,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"列表组件多一个 length === 0 的分支，按原因（首次使用、全部完成、无搜索结果、加载失败）给不同的图形、文案和主按钮；出现时加一个轻微的上移淡入。","ask":"给待办列表做空状态：用户把最后一条勾掉后，列表区域换成一个居中的线条插图、一行标题“今天的事都做完了”、一行灰色说明和一个“新建待办”按钮，整组用 300 毫秒上移淡入。按原因区分三种文案：首次使用（引导创建第一条）、全部完成（给一点成就感）、搜索无结果（提示换关键词并给清空搜索按钮）。插图用 SVG，跟随深色模式变色。","keywordsZh":["空状态","暂无数据","首次使用","清空完成","无搜索结果","引导操作"],"keywordsEn":["empty state","zero data","first use","inbox zero","no results","call to action"],"recognize":["列表空了以后出现一个小插图和一句话","下面有一个按钮告诉你接下来该干嘛","不同原因的空，说的话不一样"],"form":{},"works":[{"title":"Inbox by Gmail 清空后的太阳","creator":"Google","year":2014},{"title":"Chrome 断网小恐龙","creator":"Google","year":2014}],"demo":"empty-state","dg":null,"hint":"点待办勾掉它，清空后看空状态；可以切换空的原因","related":["onboarding","undo-toast","skeleton"],"use":4,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"undo-toast","kind":"technique","cat":"web","zh":"撤销提示条","en":"Undo Toast","aka":["Snackbar","撤销而非确认","Undo Snackbar"],"oneLine":"删除时不弹“确定要删除吗”，而是立刻删掉，底部浮出一条“已删除 · 撤销”，几秒内点一下就能恢复。操作不被打断，误删也有退路。","era":{"from":2007,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"删除先只改前端状态并把条目暂存，同时启动倒计时；倒计时结束才真正提交给服务器，点撤销就把暂存条目放回原位置。连续删除时提示条合并或排队。","ask":"邮件列表的删除改成可撤销：点删除后条目立刻收起消失，屏幕底部浮出深色提示条“已删除 1 封邮件 · 撤销”，停留 5000 毫秒，底边有一条倒计时进度线。点撤销时条目回到原位置并有展开动画；时间到才真正调用删除接口。连续删除时数字累加而不是叠多条。提示条在手机上避开底部安全区，鼠标悬停时暂停倒计时。","keywordsZh":["撤销","提示条","误删恢复","延迟提交","非阻塞反馈","倒计时"],"keywordsEn":["undo toast","snackbar","undo instead of confirm","optimistic UI","deferred commit","non-blocking feedback"],"recognize":["删完东西底部出现一条带“撤销”的小黑条","几秒后它自己消失","不会先弹窗问你确不确定"],"form":{},"works":[{"title":"Never Use a Warning When You Mean Undo","creator":"Aza Raskin（A List Apart）","year":2007},{"title":"Material Design Snackbar","creator":"Google","year":2014},{"title":"Gmail 撤销发送","creator":"Google","year":2015}],"demo":"undo-toast","dg":null,"hint":"点一封邮件右边删除，再点提示条里的撤销；关掉效果对比确认弹窗","related":["empty-state","bottom-sheet","like-burst"],"use":5,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"infinite-scroll","kind":"technique","cat":"web","zh":"无限滚动","en":"Infinite Scroll","aka":["瀑布流加载","无尽滚动","自动加载更多"],"oneLine":"滑到快见底时，下一批内容已经悄悄加载好接在后面，列表永远滑不到头。刷信息流停不下来，很大程度就是它造成的。","era":{"from":2006,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"在列表末尾放一个哨兵元素，用 IntersectionObserver 加 rootMargin 提前触发请求；加载中显示骨架行，长列表配合虚拟列表回收看不见的节点，并保存滚动位置以便返回。","ask":"做一个无限滚动的信息流：离底部还剩 1 屏高度时就开始请求下一页（IntersectionObserver 的 rootMargin 设成一屏高），每页 10 条，网络慢时在底部显示两行骨架占位；模拟 800 毫秒延迟。请求失败显示“加载失败，点我重试”，没有更多时显示“已经到底了”。超过 200 条用虚拟列表，点进详情再返回要回到原来的滚动位置。","keywordsZh":["无限滚动","自动加载","信息流","预加载","虚拟列表","触底加载"],"keywordsEn":["infinite scroll","lazy loading","feed","IntersectionObserver","virtual list","pagination"],"recognize":["一直往下滑也滑不到底","快到底时冒出几行灰色占位，马上被内容填上","页面上没有翻页按钮"],"form":{},"works":[{"title":"Pinterest 瀑布流","creator":"Pinterest","year":2010},{"title":"抖音","creator":"字节跳动","year":2016}],"demo":"infinite-scroll","dg":null,"hint":"上下拖动列表；关掉效果变成手动点“加载更多”","related":["skeleton","stagger-reveal","parallax"],"use":5,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"bottom-sheet","kind":"technique","cat":"web","zh":"底部抽屉","en":"Bottom Sheet","aka":["底部面板","Sheet","半屏浮层","Detents"],"oneLine":"从屏幕底部拉出一张卡片，可以停在收起、半屏、全屏几个档位，下面的地图或页面还看得见。拇指够得着，也不用离开当前页。","era":{"from":2014,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"记录拖动过程中的位移和速度，松手时根据速度方向和距离选最近的档位，用弹簧动画吸过去；面板越高背景压得越暗，内部滚动到顶后再继续下拉才收起面板。","ask":"做一个地图页的底部抽屉：面板有三个档位，收起时只露出 96 像素的标题栏，中间档停在屏幕高度的 50%，最高到全屏下方留 40 像素。手指拖动跟手，松手时如果速度超过 800 像素/秒就按甩动方向跳一档，否则吸附到最近的档位，用弹簧动画（阻尼 0.8）。面板升到最高时背景地图压暗 40%。面板内容可滚动，滚到顶后继续下拉才收起面板。","keywordsZh":["底部抽屉","半屏面板","吸附档位","拖拽手势","甩动","弹簧动画"],"keywordsEn":["bottom sheet","detents","drag gesture","fling velocity","snap points","spring animation"],"recognize":["底部有一张能上下拖的卡片","松手后会吸到固定的几个高度","卡片后面的页面还在，只是变暗了"],"form":{},"works":[{"title":"Material Design Bottom Sheets","creator":"Google","year":2014},{"title":"Apple 地图（iOS 10 卡片式面板）","creator":"Apple","year":2016},{"title":"iOS 15 sheet 档位（detents）","creator":"Apple","year":2021}],"demo":"bottom-sheet","dg":null,"hint":"上下拖面板，快速一甩试试；关掉吸附对比自由停留","related":["page-transition","joystick","undo-toast"],"use":5,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"command-palette","kind":"technique","cat":"web","zh":"命令面板","en":"Command Palette","aka":["⌘K 菜单","快捷命令","Cmd+K","全局搜索框"],"oneLine":"按一下 ⌘K，屏幕中央弹出一个输入框，打几个字母就能跳到任何页面、执行任何操作。熟练用户从此不用再翻菜单。","era":{"from":2012,"to":null},"regions":["global"],"media":["pc","web"],"players":["solo"],"makeLevel":"web","making":"把所有页面和操作注册成命令列表（名称、别名、快捷键、动作），输入时做模糊匹配打分（连续命中、词首命中加分）并高亮命中字符；上下键移动选中，回车执行。","ask":"做一个 ⌘K 命令面板：按 Cmd/Ctrl+K 在屏幕上方三分之一处弹出，弹出动画 160 毫秒（缩放 0.96→1 加淡入）。输入时对命令名做模糊匹配，比如输入“xjwd”能匹配“新建文档”的拼音首字母，命中的字加粗高亮；最多显示 6 条，上下键切换，回车执行，Esc 关闭。输入框为空时显示“最近使用”。每条右侧显示快捷键。手机上做成顶部全宽的搜索层。","keywordsZh":["命令面板","快捷键","模糊搜索","键盘优先","全局搜索","快速跳转"],"keywordsEn":["command palette","cmd+k","fuzzy search","keyboard-first","quick switcher","command menu"],"recognize":["按 ⌘K 弹出一个居中的搜索框","打几个字母，列表实时筛选并高亮命中的字","每条命令旁边写着它的快捷键"],"form":{},"works":[{"title":"Sublime Text 2","creator":"Sublime HQ","year":2012},{"title":"Visual Studio Code","creator":"Microsoft","year":2015},{"title":"Linear","creator":"Linear","year":2019}],"demo":"command-palette","dg":null,"hint":"直接打字筛选（支持拼音首字母），上下键选择、回车执行；也可以点选","related":["onboarding","chat-ui","custom-cursor"],"use":4,"status":"rising","usedIn":["web"],"ai":false},{"id":"parallax","kind":"technique","cat":"web","zh":"视差滚动","en":"Parallax Scrolling","aka":["多层视差","Parallax","景深滚动"],"oneLine":"画面分成几层，远处的山动得慢，近处的树动得快，一滚动就有了纵深。游戏里用了四十多年，网页上做官网头图也常见。","era":{"from":1982,"to":null},"regions":["global"],"media":["arcade","console","web","mobile"],"players":["solo"],"makeLevel":"web","making":"每一层按“深度系数 × 滚动量”做 translate，最远层系数接近 0、最近层大于 1；网页上用 transform 而不是改 top，或者用 CSS 3D 的 perspective + translateZ 让浏览器自己算。","ask":"做一个官网头图的视差滚动：画面分 5 层（天空、远山、中山、树林、前景草丛），滚动时每层的位移是滚动量乘以各自的系数，最远层 0.1、最近层 1.3，中间均匀分布，景深强度整体可调（默认 60%）。只用 transform: translate3d，滚动监听里用 requestAnimationFrame 节流。用户开启“减少动态效果”时所有层一起移动；手机上也能流畅跑。","keywordsZh":["视差滚动","多层景深","滚动动画","官网头图","纵深感","分层背景"],"keywordsEn":["parallax scrolling","depth layers","scroll animation","hero section","perspective","layered background"],"recognize":["滚动时远处和近处移动的速度不一样","画面像被分成了几张叠起来的纸","前景会盖住后面的东西又露出来"],"form":{},"works":[{"title":"月球巡逻（Moon Patrol）","creator":"Irem","year":1982},{"title":"iOS 7 视差壁纸","creator":"Apple","year":2013}],"demo":"parallax","dg":null,"hint":"左右拖动画面；可以调景深强度和层数","related":["horizontal-scroll","scrollytelling","tilt"],"use":3,"status":"classic","usedIn":["web","game"],"ai":false},{"id":"fps","cat":"action","zh":"第一人称射击","en":"First-Person Shooter","aka":["FPS","射击游戏"],"oneLine":"镜头就是你的眼睛，准星永远在屏幕正中。转身、瞄准、扣扳机，一枪命中的反馈是这个类型的全部底气。","era":{"from":1992,"to":null},"regions":["north-america","europe","global"],"media":["pc","console"],"players":["solo","versus","coop"],"makeLevel":"engine","making":"3D 引擎里把相机挂在角色头部，开火用射线检测（raycast）判定命中。网页原型可以学《德军总部 3D》用 2D 网格做射线投射，几百行就能跑出走廊。","ask":"做一个网页版迷你 FPS：用 Canvas 射线投射渲染一条三格宽的走廊，镜头自动前进，敌人从两侧凹室走出来。指针左右移动转向，按下开火、按住连射，命中时准星出现击中标记、敌人闪白，打头算双倍伤害。参数：视野 75 度，后坐力每枪 8 像素并快速回正，普通敌人 2 枪击倒，开瞄准辅助（准星靠近敌人时轻微吸附、判定放宽 40%）。手机上用触摸代替指针。","keywordsZh":["准星","射线检测","后坐力","爆头","瞄准辅助","视野"],"keywordsEn":["FPS","hitscan","recoil","aim assist","field of view","raycasting"],"recognize":["屏幕中央一个准星，右下角露出枪","看不到自己的身体","命中时有击中标记和音效"],"form":{"loop":"发现敌人、瞄准、开火、换位","input":"鼠标或摇杆转视角，键位移动","feedback":"枪口火光、后坐力、击中标记","pace":"快，秒级对枪","mood":"紧张、爽快"},"works":[{"title":"毁灭战士","creator":"id Software","year":2016,"video":{"src":"vid/fps.mp4","poster":"img/fps-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/379720/"},"note":"官方预告片片段"},{"title":"毁灭战士","creator":"id Software","year":2016,"img":{"src":"img/fps-379720-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/379720/","note":"Steam 商店页截图"}},{"title":"毁灭战士","creator":"id Software","year":2016,"img":{"src":"img/fps-379720-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/379720/","note":"Steam 商店页截图"}},{"title":"半条命 2","creator":"Valve","year":2004,"img":{"src":"img/fps-220-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/220/","note":"Steam 商店页截图"}},{"title":"德军总部 3D","creator":"id Software","year":1992},{"title":"反恐精英","creator":"Valve","year":2000}],"hint":"移动指针转向，按下开火，按住连射","related":["screen-shake","hit-stop","battle-royale","stealth"],"use":5,"status":"classic","dg":null,"demo":"fps","usedIn":[],"ai":false,"kind":"style"},{"id":"bullet-hell","cat":"action","zh":"弹幕射击","en":"Bullet Hell","aka":["弹幕 STG","Danmaku","CAVE 系射击"],"oneLine":"满屏子弹排成螺旋和花环，自机的判定却只有中间一个像素大的点。看清缝隙、在弹幕里穿针，是它独有的快感。","era":{"from":1993,"to":null},"regions":["japan"],"media":["arcade","pc","console"],"players":["solo"],"makeLevel":"web","making":"子弹是成百上千个只有位置和速度的小对象，按极坐标批量生成螺旋、环形、自机狙等弹型；碰撞只拿判定点和子弹圆心比距离。Canvas 跑几百发毫无压力。","ask":"做一个弹幕射击小样：上方一个 Boss 左右游移并发射弹幕，玩家按住拖动小飞机在下半屏躲避。飞机只有中心 2 像素的判定点（画成白圈黑芯，始终可见），子弹贴着判定点擦过算擦弹并计数。默认每波 16 发、弹速 110 像素/秒、螺旋弹型，另有环形和自机狙两种可切换。中弹后闪烁无敌 0.9 秒。用 Canvas 画，子弹数上限 700。","keywordsZh":["弹幕","判定点","擦弹","自机狙","弹型","避弹"],"keywordsEn":["bullet hell","danmaku","hitbox","grazing","bullet pattern","shmup"],"recognize":["满屏几何图案一样的子弹","自机中心有个发光的小点","Boss 战按阶段换弹型"],"form":{"loop":"读弹型、找缝隙、穿过去、反击","input":"八方向移动加低速键","feedback":"擦弹音效、判定点高亮、爆炸","pace":"极快，连续数分钟高压","mood":"专注、心流"},"works":[{"title":"怒首领蜂 大复活","creator":"CAVE","year":2008,"video":{"src":"vid/bullet-hell.mp4","poster":"img/bullet-hell-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/464450/"},"note":"官方预告片片段"},{"title":"怒首领蜂 大复活","creator":"CAVE","year":2008,"img":{"src":"img/bullet-hell-464450-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/464450/","note":"Steam 商店页截图"}},{"title":"怒首领蜂 大复活","creator":"CAVE","year":2008,"img":{"src":"img/bullet-hell-464450-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/464450/","note":"Steam 商店页截图"}},{"title":"怒首领蜂 大复活","creator":"CAVE","year":2008,"img":{"src":"img/bullet-hell-464450-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/464450/","note":"Steam 商店页截图"}},{"title":"首领蜂","creator":"CAVE","year":1995},{"title":"东方红魔乡","creator":"上海爱丽丝幻乐团","year":2002}],"hint":"按住拖动飞机；只有中间的小点会被打中","related":["roguelike","screen-shake","fps"],"use":3,"status":"classic","dg":null,"demo":"bullet-hell","usedIn":[],"ai":false,"kind":"style"},{"id":"fighting","cat":"action","zh":"格斗","en":"Fighting Game","aka":["FTG","对战格斗"],"oneLine":"两个人一条血槽，比的是读招和帧数。防住对手的重拳，趁它收招的那十几帧打回去，叫确反。","era":{"from":1987,"to":null},"regions":["japan","global"],"media":["arcade","console","pc"],"players":["versus"],"makeLevel":"engine","making":"逻辑按固定 60 帧推进，每个招式拆成前摇、判定、收招硬直三段，用帧数表管理；网络对战靠回滚（rollback）同步。单机原型网页也能做。","ask":"做一个格斗游戏的确反练习：左右两个火柴人，对手每隔一两秒出一记重拳，前摇 14 帧、判定 3 帧、收招硬直 22 帧；玩家按住屏幕左半边防御，点右半边出拳，出拳前摇 5 帧。防住后被定住 12 帧，算出对手是 -10 帧，在对手硬直里出拳就判定为确反。画面下方像训练模式那样显示两行帧数条，按前摇、判定、硬直上不同灰度。逻辑固定 60 帧推进，键盘 J 出拳、K 防御。","keywordsZh":["帧数","确反","硬直","防御","连招","读招"],"keywordsEn":["fighting game","frame data","punish","recovery","block stun","rollback netcode"],"recognize":["屏幕两侧各一条血槽，中间有倒计时","两个角色面对面，一局三十秒到一分多钟","会说帧数、确反、择这些黑话"],"form":{"loop":"试探、防守、确反、压起身","input":"方向加四到六个攻击键，或简化的一键必杀","feedback":"打击火花、顿帧、震屏","pace":"一回合几十秒，节奏忽快忽慢","mood":"对抗、心理博弈"},"works":[{"title":"街头霸王 6","creator":"Capcom","year":2023,"video":{"src":"vid/fighting.mp4","poster":"img/fighting-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1364780/"},"note":"官方预告片片段"},{"title":"街头霸王 6","creator":"Capcom","year":2023,"img":{"src":"img/fighting-1364780-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1364780/","note":"Steam 商店页截图"}},{"title":"街头霸王 6","creator":"Capcom","year":2023,"img":{"src":"img/fighting-1364780-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1364780/","note":"Steam 商店页截图"}},{"title":"铁拳 8","creator":"万代南梦宫","year":2024,"img":{"src":"img/fighting-1778820-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1778820/","note":"Steam 商店页截图"}},{"title":"街头霸王 II","creator":"Capcom","year":1991},{"title":"任天堂明星大乱斗","creator":"HAL 研究所","year":1999}],"hint":"按住左半边防御，点右半边出拳；在对手硬直里出拳就是确反","related":["hit-stop","screen-shake","async-pvp"],"use":3,"status":"classic","dg":null,"demo":"fighting","usedIn":[],"ai":false,"kind":"style"},{"id":"racing","cat":"action","zh":"竞速","en":"Racing","aka":["赛车游戏","Racer"],"oneLine":"压着弯心过弯，在抓地和侧滑之间找那条线。手感几乎全由轮胎抓地力这一个数决定。","era":{"from":1974,"to":null},"regions":["japan","europe","global"],"media":["arcade","console","pc","mobile"],"players":["solo","versus"],"makeLevel":"web","making":"把车速拆成车头方向和侧向两个分量，每帧按抓地力衰减侧向速度：衰减得快就是贴地的拟真车，慢就是会漂的街机车。俯视原型用 Canvas 加样条曲线赛道就够。","ask":"做一个俯视角竞速小样：一条闭合的样条曲线赛道，车自动给油，玩家按住画面时车头朝手指方向转。把速度拆成前向和侧向分量，每帧按抓地力衰减侧向速度，抓地力 45%、转向速度 190 度/秒、最高速度 230 像素/秒；侧滑角大时在地上留下胎痕，持续漂移超过 0.45 秒、松开后获得 0.7 秒加速。冲出赛道限速到 45%。显示本圈用时和最快圈。","keywordsZh":["漂移","抓地力","赛车线","胎痕","氮气","圈速"],"keywordsEn":["racing","drift","grip","racing line","slip angle","lap time"],"recognize":["赛道和对手，屏幕上有名次和圈速","过弯要提前减速或甩尾","越快越难控"],"form":{"loop":"入弯、出弯、超车、刷圈速","input":"油门、刹车、转向","feedback":"速度感、胎痕、引擎声","pace":"一圈一两分钟，持续高速","mood":"兴奋、追求极限"},"works":[{"title":"极限竞速：地平线 5","creator":"Playground Games","year":2021,"video":{"src":"vid/racing.mp4","poster":"img/racing-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1551360/"},"note":"官方预告片片段"},{"title":"极限竞速：地平线 5","creator":"Playground Games","year":2021,"img":{"src":"img/racing-1551360-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1551360/","note":"Steam 商店页截图"}},{"title":"极限竞速：地平线 5","creator":"Playground Games","year":2021,"img":{"src":"img/racing-1551360-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1551360/","note":"Steam 商店页截图"}},{"title":"极限竞速：地平线 5","creator":"Playground Games","year":2021,"img":{"src":"img/racing-1551360-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1551360/","note":"Steam 商店页截图"}},{"title":"超级马力欧赛车","creator":"任天堂","year":1992},{"title":"OutRun","creator":"世嘉","year":1986}],"hint":"按住画面，车会朝手指方向转；下面调抓地力看看漂移怎么变","related":["tilt","joystick","endless-runner"],"use":4,"status":"mainstream","dg":null,"demo":"racing","usedIn":[],"ai":false,"kind":"style"},{"id":"endless-runner","cat":"action","zh":"无尽跑酷","en":"Endless Runner","aka":["跑酷","无尽奔跑"],"oneLine":"角色自己一直往前跑，你只管换道和起跳。路没有尽头，速度越来越快，比的就是能跑多远。","era":{"from":2009,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"世界不动、障碍物朝玩家滚来，按距离程序化生成并保证每排至少留一条活路；难度主要靠速度随时间线性增长。伪 3D 透视用 Canvas 就能画。","ask":"做一个三车道无尽跑酷：伪 3D 透视的跑道，角色自动向前跑，左右滑动换道、上滑起跳，点屏幕左中右三块也行。障碍分高墙（只能换道躲）、低栏（可以跳）和金币，每排随机生成且至少留一条能走的道，排与排平均间距 14 米。起始速度 8 米/秒，每秒加速 0.25 米/秒²。撞上后短暂停顿并重开，显示距离、速度、金币和最远纪录。键盘方向键也能玩。","keywordsZh":["换道","滑动操作","程序生成","逐渐加速","金币","距离纪录"],"keywordsEn":["endless runner","lane switching","swipe controls","procedural generation","speed ramp","high score"],"recognize":["角色自动往前跑，从不停下","操作只有滑动或点击","死了马上重来，看最远距离"],"form":{"loop":"躲障碍、吃金币、跑更远","input":"滑动或单键","feedback":"速度线、金币声、撞击","pace":"由慢到快，一局一两分钟","mood":"紧张、上头"},"works":[{"title":"Canabalt","creator":"Adam Saltsman","year":2009,"video":{"src":"vid/endless-runner.mp4","poster":"img/endless-runner-poster.webp","w":720,"h":404,"source":"https://store.steampowered.com/app/358960/"},"note":"官方预告片片段"},{"title":"Canabalt","creator":"Adam Saltsman","year":2009,"img":{"src":"img/endless-runner-358960-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/358960/","note":"Steam 商店页截图"}},{"title":"Canabalt","creator":"Adam Saltsman","year":2009,"img":{"src":"img/endless-runner-358960-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/358960/","note":"Steam 商店页截图"}},{"title":"Canabalt","creator":"Adam Saltsman","year":2009,"img":{"src":"img/endless-runner-358960-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/358960/","note":"Steam 商店页截图"}},{"title":"神庙逃亡","creator":"Imangi Studios","year":2011},{"title":"地铁跑酷","creator":"SYBO Games / Kiloo","year":2012}],"hint":"左右滑动换道，上滑起跳","related":["platformer","flow-curve","streak","racing"],"use":4,"status":"mainstream","dg":null,"demo":"endless-runner","usedIn":[],"ai":false,"kind":"style"},{"id":"survival-craft","cat":"sim","zh":"生存建造","en":"Survival Crafting","aka":["生存沙盒","Survival Craft"],"oneLine":"饥饿条一直在掉，天黑前得备好柴火。白天采集、晚上守着火光，攒下来的材料慢慢变成工具和房子。","era":{"from":2009,"to":null},"regions":["north-america","europe","global"],"media":["pc","console","mobile"],"players":["solo","coop"],"makeLevel":"web","making":"几条随时间衰减的数值（饥饿、体温、燃料）加一个昼夜循环，资源点可采集并按天刷新，合成用配方表。夜色可以用离屏画布画黑暗、再把光源挖空。","ask":"做一个俯视角生存建造小样：地图上散布树和果丛，中间一堆篝火。点树去砍柴，点果丛摘浆果，点篝火添柴。一天 40 秒，最后三成时间是黑夜，夜里只有篝火照亮的范围是安全的，站在暗处会掉血；饱腹每秒下降 1.5%，一根柴烧 6 秒，柴越多光圈越大。死了显示撑过几天并重开。左上角显示生命、饱腹、木头、浆果和天数，右上角一个小钟表示昼夜。","keywordsZh":["饥饿值","昼夜循环","采集","合成","篝火","资源刷新"],"keywordsEn":["survival","crafting","day-night cycle","hunger meter","gathering","base building"],"recognize":["屏幕角落有饥饿、生命之类的几条数值","一开始赤手空拳，靠采集打造工具","夜晚比白天危险得多"],"form":{"loop":"采集、合成、建造、撑过夜晚","input":"移动加点击交互，背包和合成菜单","feedback":"数值涨落、天色变化","pace":"按天循环，有张有弛","mood":"紧迫、积累的满足"},"works":[{"title":"英灵神殿","creator":"Iron Gate","year":2021,"video":{"src":"vid/survival-craft.mp4","poster":"img/survival-craft-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/892970/"},"note":"官方预告片片段"},{"title":"英灵神殿","creator":"Iron Gate","year":2021,"img":{"src":"img/survival-craft-892970-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/892970/","note":"Steam 商店页截图"}},{"title":"英灵神殿","creator":"Iron Gate","year":2021,"img":{"src":"img/survival-craft-892970-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/892970/","note":"Steam 商店页截图"}},{"title":"饥荒","creator":"Klei Entertainment","year":2013,"img":{"src":"img/survival-craft-219740-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/219740/","note":"Steam 商店页截图"}},{"title":"我的世界","creator":"Mojang","year":2011}],"hint":"点树砍柴、点果丛摘果、点篝火添柴；天黑前把火烧旺","related":["sandbox","open-world","roguelike","falling-sand"],"use":4,"status":"mainstream","dg":null,"demo":"survival-craft","usedIn":[],"ai":false,"kind":"style"},{"id":"open-world","cat":"sim","zh":"开放世界","en":"Open World","aka":["沙盒世界","自由探索"],"oneLine":"远处有座塔，你就能走过去；走的路上又看见一座遗迹。好的开放世界靠地标和问号把人一路勾着走。","era":{"from":1984,"to":null},"regions":["north-america","europe","japan","global"],"media":["console","pc"],"players":["solo"],"makeLevel":"engine","making":"大地图按区块流式加载，兴趣点（POI）按密度撒在地图上，远景地标用低模剪影保证远远就能看见。网页原型可以用迷雾遮罩加兴趣点模拟探索节奏。","ask":"做一个开放世界探索的节奏原型：一张带等高线和河流的俯视地图，被迷雾盖住，玩家是一个小圆点，点地图任意位置就走过去，移动速度 55 像素/秒。周围 55 像素半径内迷雾被揭开；地图上撒 12 个兴趣点（高塔、遗迹、营地、洞穴等），进入视野时先冒出问号，走到跟前才算发现。高塔和山顶这类远景地标即使在迷雾里也能看到半透明剪影。显示已发现数量和走过的足迹。","keywordsZh":["兴趣点","地标","战争迷雾","自由探索","非线性","流式加载"],"keywordsEn":["open world","point of interest","landmark","fog of war","exploration","world streaming"],"recognize":["地图很大，几乎哪里都能去","主线随时可以放下，去做支线或闲逛","地图上密密麻麻的问号和图标"],"form":{"loop":"看到、走过去、发现、看到下一个","input":"移动、交互、开地图","feedback":"新区域揭开、图标点亮","pace":"自己定，可快可慢","mood":"好奇、自由"},"works":[{"title":"巫师 3：狂猎","creator":"CD PROJEKT RED","year":2015,"video":{"src":"vid/open-world.mp4","poster":"img/open-world-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/292030/"},"note":"官方预告片片段"},{"title":"巫师 3：狂猎","creator":"CD PROJEKT RED","year":2015,"img":{"src":"img/open-world-292030-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/292030/","note":"Steam 商店页截图"}},{"title":"巫师 3：狂猎","creator":"CD PROJEKT RED","year":2015,"img":{"src":"img/open-world-292030-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/292030/","note":"Steam 商店页截图"}},{"title":"荒野大镖客：救赎 2","creator":"Rockstar Games","year":2018,"img":{"src":"img/open-world-1174180-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1174180/","note":"Steam 商店页截图"}},{"title":"塞尔达传说：旷野之息","creator":"任天堂","year":2017},{"title":"侠盗猎车手 III","creator":"Rockstar North","year":2001}],"hint":"点地图上任意位置走过去；远处的塔会把你勾过去","related":["survival-craft","sandbox","metroidvania","walking-sim"],"use":4,"status":"mainstream","dg":null,"demo":"open-world","usedIn":[],"ai":false,"kind":"style"},{"kind":"technique","regions":["global"],"media":["console","pc","mobile"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game"],"ai":false,"aka":["天赋树","天赋盘"],"id":"skill-tree","cat":"growth","zh":"技能树","en":"Skill Tree","oneLine":"把能力画成一张有前置关系的节点图，点数有限、只能沿连线往外点，每次加点都是在选一条成长路线。","era":{"from":2000,"to":null},"making":"用节点表存 id、前置 id 和花费，节点可买的条件是“没买过、前置已买、点数够”；画面上把可买、买不起、被锁住三种状态区分开，连线跟着状态变实变虚。","ask":"做一个技能树：从中心根节点向外分 3 条分支，每条 4 层，中间层多一个支线节点；每 1.2 秒获得 1 技能点，第一层花 1 点、每往外一层多花 1 点；只能点亮与已点亮节点相连的技能，点被锁住的节点时闪一下缺的那段路径并提示原因，点数不够就让节点左右抖一下；可买节点带呼吸光圈。用 canvas 画，手机上节点点击区域至少 44 像素。","keywordsZh":["天赋点","前置技能","加点","分支路线","洗点"],"keywordsEn":["skill tree","talent tree","prerequisite","skill point","respec"],"recognize":["一张节点用连线串起来的图","灰着的节点要先点亮前面的才能买","点数总是不够用，得挑方向"],"works":[{"title":"暗黑破坏神 II","creator":"Blizzard North","year":2000},{"title":"上古卷轴 V：天际","creator":"Bethesda Game Studios","year":2011},{"title":"流放之路","creator":"Grinding Gear Games","year":2013}],"hint":"点亮着的空心节点花点数；点灰节点看看为什么不行","related":["xp-curve","prestige","roguelike"],"use":4,"demo":"skill-tree"},{"kind":"technique","regions":["global"],"media":["console","pc","mobile","web","physical"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"classic","usedIn":["game","web"],"ai":false,"aka":["升级曲线","经验表"],"id":"xp-curve","cat":"growth","zh":"经验曲线","en":"XP Curve","oneLine":"每一级需要多少经验，决定了升级是越来越慢还是始终匀速。指数稍微调一点，满级时间就能从几小时变成几天。","era":{"from":1974,"to":null},"making":"常用幂函数：第 L 级所需经验 = 首级经验 × L^指数，指数 1 是线性，1.5 左右是大多数 RPG 的手感；先按玩家每分钟能拿多少经验换算成时间，再看曲线是否合理。","ask":"做一个经验曲线调试器：第 L 级升到下一级需要 100 × L^1.5 点经验，满级 30 级；按每分钟 100 经验换算，画出每一级所需时间的柱状图，并用虚线叠一条线性增长做对比；上方显示当前等级、进度条和满级总时长。进度条持续自动灌经验，点一下额外加 2000，升级时等级数字弹一下。指数、首级经验、满级等级可调，改了图表和总时长立刻刷新。","keywordsZh":["升级所需经验","等级曲线","指数增长","满级时间","练级"],"keywordsEn":["xp curve","experience table","level curve","exponential growth","time to max level"],"recognize":["前几级升得飞快，后面越来越慢","进度条上写着“1234 / 5000”","有人在算满级要多少小时"],"works":[{"title":"龙与地下城","creator":"TSR","year":1974},{"title":"勇者斗恶龙","creator":"Enix","year":1986},{"title":"魔兽世界","creator":"Blizzard Entertainment","year":2004}],"hint":"看柱子越来越高；调指数，满级时间马上变。点画面加经验","related":["skill-tree","flow-curve","idle"],"use":5,"demo":"xp-curve"},{"kind":"technique","regions":["global"],"media":["console","pc","mobile","web"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game","web"],"ai":false,"aka":["奖杯","徽章"],"id":"achievements","cat":"growth","zh":"成就系统","en":"Achievements","oneLine":"给玩家行为设一组可见或隐藏的目标，达成时弹出提示并记进成就墙。它让人去尝试平时不会做的玩法。","era":{"from":2005,"to":null},"making":"把成就写成“统计项 + 阈值”的数据表，每次统计变化时检查一遍；解锁提示做成队列，从屏幕边缘滑入、停留几秒再退出，同时触发多个时排队叠放。","ask":"做一个成就系统原型：左边是一个会移动的靶子，右边是 8 个成就（命中 1/10/40 次、连中 5/15 次、靶心 3 次、打空 3 次、累计玩 40 秒），其中最后 2 个是隐藏成就，显示为“？？？”直到达成；未解锁的成就显示进度条和 3/10 这样的数字；解锁时顶部滑入一条黑色提示，停留 2500 毫秒后淡出，多条同时触发就叠起来排队。","keywordsZh":["成就墙","解锁提示","隐藏成就","完成度","徽章"],"keywordsEn":["achievement","trophy","unlock toast","hidden achievement","completion rate"],"recognize":["屏幕角落弹出“成就解锁”","有一面带进度的成就列表","有几个写着“？？？”的隐藏项"],"works":[{"title":"Xbox 360 玩家分数","creator":"Microsoft","year":2005},{"title":"Steam 成就","creator":"Valve","year":2007},{"title":"PlayStation 奖杯","creator":"Sony Computer Entertainment","year":2008}],"hint":"点靶子触发成就；可以关掉进度显示或调隐藏成就数量","related":["streak","battle-pass","leaderboard"],"use":5,"demo":"achievements"},{"kind":"technique","regions":["global"],"media":["console","pc","mobile"],"players":["solo","versus"],"makeLevel":"engine","form":{},"dg":null,"status":"mainstream","usedIn":["game"],"ai":false,"aka":["战令","赛季通行证"],"id":"battle-pass","cat":"growth","zh":"通行证","en":"Battle Pass","oneLine":"一个赛季几十级的奖励轨道，免费轨人人能领，付费轨要买；每天打几局就能往上走，赛季结束清零重来。","era":{"from":2013,"to":null},"making":"核心是一道算术题：赛季天数 × 每日可得经验 ÷ 每级经验，要让每天正常玩的人刚好在赛季末前满级；奖励轨道用横向滚动的两行格子，付费轨在未购买时也要看得见、拿不到。","ask":"做一个赛季通行证界面：赛季 56 天共 50 级，每级 1000 经验，每天任务给 900 经验，一局 300 经验；上面两行奖励轨道横向滚动，上行免费（每 2 级一个奖励）、下行高级（每级都有），未购买时高级奖励显示锁；升级时格子弹一下并自动领取；底部实时算出“按当前节奏赛季末能到几级”和“满级需要每天多少经验”。","keywordsZh":["战令","赛季","免费轨","付费轨","每日任务"],"keywordsEn":["battle pass","season pass","free track","premium track","seasonal progression"],"recognize":["一条横着排开的等级奖励轨道","上下两行，下面那行带锁","标着“赛季剩余 X 天”"],"works":[{"title":"Dota 2 国际邀请赛互动指南","creator":"Valve","year":2013},{"title":"堡垒之夜","creator":"Epic Games","year":2017},{"title":"Apex 英雄","creator":"Respawn Entertainment","year":2019}],"hint":"看天数推进、等级往上走；调每日经验看赛季末能到几级","related":["achievements","streak","xp-curve"],"use":4,"demo":"battle-pass"},{"kind":"technique","regions":["global"],"media":["pc","mobile","web","console"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game","web"],"ai":false,"aka":["转生","重生","飞升"],"id":"prestige","cat":"growth","zh":"转生重置","en":"Prestige","oneLine":"主动清空当前进度，换一点永久加成，再从头来会快得多。增长慢下来的那一刻，就是该转生的时候。","era":{"from":2007,"to":null},"making":"让本轮收益增长逐渐放缓（如产出随 √资源 增长），再设转生货币 = √(本轮总收入 ÷ 阈值)，每点永久提高倍率；关键是让第二轮在几分钟内追上第一轮的进度。","ask":"做一个转生机制演示：产出速度 = 倍率 × (1 + √金币)，所以越往后越慢；本轮赚满 100 金币后可以转生，得到 √(本轮收入÷100) 个转生点，每点让倍率加 100%；当新倍率达到当前的 2 倍时自动转生。用对数纵轴画金币曲线，每次转生画一条竖线，再用虚线画一条“从不转生”的对照曲线，显示当前倍率、转生点和现在转生能拿几点。","keywordsZh":["转生","永久加成","重置进度","放置游戏","倍率"],"keywordsEn":["prestige","rebirth","ascension","meta currency","soft reset"],"recognize":["有一个“重置并获得 X 点”的按钮","重来以后数字涨得飞快","进度曲线像锯齿一样一轮轮往上"],"works":[{"title":"使命召唤 4：现代战争","creator":"Infinity Ward","year":2007},{"title":"饼干点点乐","creator":"Orteil","year":2013},{"title":"AdVenture Capitalist","creator":"Hyper Hippo Games","year":2014}],"hint":"锯齿曲线是转生，虚线是一直不转生；点画面手动转生","related":["idle","roguelike","xp-curve"],"use":3,"demo":"prestige"},{"kind":"technique","regions":["global"],"media":["arcade","console","pc","mobile","web"],"players":["solo","versus","mass"],"makeLevel":"web","form":{},"dg":null,"status":"classic","usedIn":["game","web"],"ai":false,"aka":["天梯榜","好友榜"],"id":"leaderboard","cat":"social","zh":"排行榜","en":"Leaderboard","oneLine":"把分数排成名次给人看。全服榜让普通人永远够不着，所以好用的排行榜只给你看好友和名次附近的几个人。","era":{"from":1979,"to":null},"making":"服务端用有序集合（如 Redis ZSET）存分数，ZREVRANK 取名次、按名次区间取上下几名；客户端的重点在呈现：前三名、省略号、你上下各几名，名次变化时行要滑动换位。","ask":"做一个排行榜：全服 12 万人，默认显示前 3 名，下面一行省略号，再显示你上下各 3 名，你的那行反色高亮并写“距上一名还差多少分”；另有好友榜，只列 8 个好友和你。点一下打一局，得分在 400 分上下浮动，名次往上走时各行要平滑换位，底部提示“上升 1234 名”或“超过了阿杰”。数字用千分位，手机上一屏放得下。","keywordsZh":["名次","好友榜","附近排名","全服榜","超越提示"],"keywordsEn":["leaderboard","friend ranking","nearby rank","high score","rank change"],"recognize":["一列带名次的名字和分数","自己那行被高亮","会提示你刚刚超过了谁"],"works":[{"title":"爆破彗星","creator":"Atari","year":1979},{"title":"糖果传奇","creator":"King","year":2012},{"title":"Strava 路段排行","creator":"Strava","year":2009}],"hint":"点画面打一局；切到好友榜、关掉附近名次对比一下","related":["ghost-race","elo-matchmaking","async-pvp"],"use":5,"demo":"leaderboard"},{"kind":"technique","regions":["global"],"media":["console","pc","mobile"],"players":["solo","versus"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game","web"],"ai":false,"aka":["幽灵车","Ghost"],"id":"ghost-race","cat":"social","zh":"幽灵对手","en":"Ghost Race","oneLine":"把你或别人跑过的一次记录成半透明的影子，和现在的你同场竞速。对手永远在线，差距每一秒都看得见。","era":{"from":1996,"to":null},"making":"每隔固定时间（如 50 毫秒）记录一次赛道进度或坐标，回放时按同一时间轴插值；“领先/落后几秒”用自己当前位置在幽灵记录里查到达时间，再和当前计时相减。","ask":"做一个幽灵竞速原型：一条环形赛道，按住屏幕加速、松手减速，弯道太快会打滑掉速；每 50 毫秒记录一次赛道进度，跑完一圈后下一圈显示最快一圈的半透明幽灵车，透明度 35%，画面中央实时显示“−0.42 领先 / +0.31 落后”；可以切换成回放上一圈，右上列出最近几圈时间，新纪录加星标。","keywordsZh":["幽灵车","时间差","计时赛","回放","个人最佳"],"keywordsEn":["ghost race","time trial","ghost replay","split delta","personal best"],"recognize":["赛道上有一辆半透明的车","屏幕上显示 +0.3 或 −0.5 秒","跑完一圈会出现新纪录提示"],"works":[{"title":"马力欧卡丁车 64","creator":"任天堂","year":1996},{"title":"赛道狂飙","creator":"Nadeo","year":2003},{"title":"马力欧赛车 8 豪华版","creator":"任天堂","year":2017}],"hint":"按住画面加速、弯前松手；跑完一圈后幽灵出现","related":["leaderboard","async-pvp","platformer"],"use":3,"demo":"ghost-race"},{"kind":"technique","regions":["global"],"media":["pc","console","mobile","web","physical"],"players":["versus"],"makeLevel":"web","form":{},"dg":null,"status":"classic","usedIn":["game","table"],"ai":false,"aka":["Elo","MMR","天梯分"],"id":"elo-matchmaking","cat":"social","zh":"匹配分","en":"Elo Rating","oneLine":"每局按赛前预期胜率加减分：赢了强敌多加，输给弱敌多扣。打得足够多，分数会收敛到你的真实水平，匹配也就公平了。","era":{"from":1960,"to":null},"making":"预期胜率 E = 1 / (1 + 10^((对手分 − 自己分)/400))，赛后新分 = 旧分 + K × (结果 − E)；匹配时只在当前分上下一个窗口里找人，等得越久窗口越宽。","ask":"做一个 Elo 匹配分演示：新号从 1500 分起步，隐藏的真实水平是 1850；每局在自己当前分 ±100 内匹配对手，按真实水平算胜负，再按 Elo 公式（K=32）加减分，画出 60 局的分数曲线，赢的点实心、输的点空心，虚线标出真实水平。顶部显示这局的对手分、赛前预期胜率和加减分，K 值、匹配范围、真实水平都可调。","keywordsZh":["匹配分","天梯","预期胜率","K 值","隐藏分"],"keywordsEn":["elo rating","mmr","matchmaking","expected score","k-factor"],"recognize":["每局结束显示 +18 或 −14","新号前几十局分数大起大落","赢了比你高很多的对手加分特别多"],"works":[{"title":"光环 3（TrueSkill 匹配）","creator":"Bungie","year":2007},{"title":"英雄联盟","creator":"Riot Games","year":2009},{"title":"Lichess","creator":"Thibault Duplessis","year":2010}],"hint":"看分数曲线向虚线收敛；调 K 值和真实水平。点画面打一局","related":["leaderboard","async-pvp","flow-curve"],"use":4,"demo":"elo-matchmaking"},{"kind":"technique","regions":["global"],"media":["console","pc"],"players":["solo"],"makeLevel":"engine","form":{},"dg":null,"status":"classic","usedIn":["game"],"ai":false,"aka":["阵营倾向","善恶值","荣誉值"],"id":"moral-meter","cat":"choice","zh":"道德值","en":"Morality Meter","oneLine":"每个两难选择都会把一根善恶（或秩序）轴往一边推，推过门槛后称号、NPC 态度和能选的选项都会跟着变。","era":{"from":1985,"to":null},"making":"给每个选项标上对各轴的增减值，存一个或两个累计数；跨过阈值时切换阵营状态，并用它去过滤后续对话选项和 NPC 台词。","ask":"做一个道德值原型：屏幕左边是两难问题和两个选项，每个选项标着“善”或“恶”，选完善恶值按 15 点增减（范围 −100 到 100）；右边一根横向指示条显示当前位置，±50 处画门槛线，越过门槛后称号从“流浪者”变成“圣骑士”或“暴君”，NPC 态度一句话随之改变，并多出一个阵营专属选项。可以切成善恶 × 秩序两轴的九宫格。","keywordsZh":["善恶值","阵营","道德选择","声望","两难抉择"],"keywordsEn":["morality meter","alignment","karma","paragon renegade","moral choice"],"recognize":["选项旁边标着善或恶","有一根两头写着善恶的条","阵营够了才出现的特殊选项"],"works":[{"title":"创世纪 IV","creator":"Origin Systems","year":1985},{"title":"星球大战：旧共和国武士","creator":"BioWare","year":2003},{"title":"质量效应","creator":"BioWare","year":2007},{"title":"荒野大镖客：救赎 2","creator":"Rockstar Games","year":2018}],"hint":"点选项做选择；切到两轴看九宫格","related":["branching","timed-choice","visual-novel"],"use":3,"demo":"moral-meter"},{"kind":"technique","regions":["global"],"media":["console","pc","mobile"],"players":["solo"],"makeLevel":"web","form":{},"dg":null,"status":"mainstream","usedIn":["game"],"ai":false,"aka":["限时对话","倒计时选项"],"id":"timed-choice","cat":"choice","zh":"限时选择","en":"Timed Choice","oneLine":"对话选项下面有一根正在缩短的时间条，来不及想就得凭直觉选；超时不选，本身也算一种回答。","era":{"from":1996,"to":null},"making":"选项出现时开一个计时器，进度条按剩余时间缩短，最后 30% 加闪烁；超时后按规则落定（默认沉默、选最后悬停的那个或随机），后续剧情把“沉默”当成一个正式分支处理。","ask":"做一个限时对话选择：角色台词逐字打出后出现三个选项，最后一个是“……”（沉默），下面一根 5 秒的倒计时条从两边往中间缩，剩 30% 时闪烁；时间一到自动选“沉默”，并在结果下方小字写“时间到，默认沉默”；倒计时期间背景动画放慢到 15%，画面四周略微压暗。选完显示角色的反应，再进入下一句。","keywordsZh":["倒计时","对话选项","沉默","剧情分支","直觉选择"],"keywordsEn":["timed choice","dialogue timer","silence option","branching dialogue","decision pressure"],"recognize":["选项下面有一根在缩短的条","时间到了替你选，或者算你沉默","画面在倒计时时变慢、变暗"],"works":[{"title":"樱花大战","creator":"世嘉","year":1996},{"title":"行尸走肉","creator":"Telltale Games","year":2012},{"title":"直到黎明","creator":"Supermassive Games","year":2015},{"title":"底特律：化身为人","creator":"Quantic Dream","year":2018}],"hint":"点一个选项作答，或者等时间耗尽看会怎样","related":["branching","moral-meter","visual-novel"],"use":3,"demo":"timed-choice"},{"id":"battle-royale","kind":"style","cat":"action","zh":"大逃杀","en":"Battle Royale","aka":["吃鸡","BR"],"oneLine":"几十上百人空降同一张地图，安全区一圈圈缩小，把所有人挤到一起，最后活着的一个赢。缩圈决定了整局的节奏。","era":{"from":2017,"to":null},"regions":["global","china","korea"],"media":["pc","console","mobile"],"players":["versus","mass"],"makeLevel":"engine","making":"缩圈本身就是一个状态机：等待阶段公布下一个圈的圆心和半径，收缩阶段把当前圈插值过去，圈外每秒扣血；下一个圈心在当前圈内随机取，保证一定能跑到。网络同步和大地图才是真正的工程量。","ask":"做一个俯视角大逃杀缩圈原型：方形地图上 15 个点（1 个玩家、14 个机器人），玩家拖动移动。安全区每阶段先等待 4 秒并用虚线预告下一个圈，再用 4 秒缩到当前半径的 55%，新圈心在旧圈内随机。圈外每秒掉 12 点血，画面上圈外压暗加斜线。顶部显示存活人数和倒计时，最后一人胜出后 2.5 秒自动开下一局。Canvas 实现，参数可调，手机能拖。","keywordsZh":["缩圈","安全区","毒圈","跳伞","搜刮","最后一人"],"keywordsEn":["battle royale","shrinking zone","safe zone","storm circle","last man standing","drop-in"],"recognize":["开局从空中跳伞或选点落地，赤手空拳开始搜装备","地图上有一个会定时缩小的圈，圈外持续掉血","一局 20–30 分钟，只有第一名算赢，排名一路往上掉"],"form":{"loop":"落地、搜刮、跑圈、交火、活到最后","input":"射击游戏的移动加瞄准，外加背包管理","feedback":"击倒提示、存活人数、圈外掉血","pace":"前期松散、后期越来越挤，决赛圈极紧","mood":"紧张、侥幸、一局一个故事"},"works":[{"title":"绝地求生","creator":"PUBG Corporation","year":2017,"video":{"src":"vid/battle-royale.mp4","poster":"img/battle-royale-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/578080/"},"note":"官方预告片片段"},{"title":"绝地求生","creator":"PUBG Corporation","year":2017,"img":{"src":"img/battle-royale-578080-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/578080/","note":"Steam 商店页截图"}},{"title":"绝地求生","creator":"PUBG Corporation","year":2017,"img":{"src":"img/battle-royale-578080-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/578080/","note":"Steam 商店页截图"}},{"title":"绝地求生","creator":"PUBG Corporation","year":2017,"img":{"src":"img/battle-royale-578080-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/578080/","note":"Steam 商店页截图"}},{"title":"堡垒之夜","creator":"Epic Games","year":2017},{"title":"Apex 英雄","creator":"Respawn Entertainment","year":2019}],"demo":"battle-royale","dg":null,"hint":"拖动空心点跑进安全区；下面可以调缩圈节奏","related":["fps","survival-craft","async-pvp"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"stealth","kind":"style","cat":"action","zh":"潜行","en":"Stealth","aka":["潜入","隐匿"],"oneLine":"目标不是把敌人打倒，而是不被看见。读懂守卫的巡逻路线和视野，找准空档溜过去，紧张感来自“差一点就被发现”。","era":{"from":1987,"to":null},"regions":["japan","north-america","europe"],"media":["console","pc"],"players":["solo"],"makeLevel":"web","making":"守卫是一个巡逻点状态机，视野用“距离 + 夹角 + 射线检测墙”三步判断；看见玩家时不立刻判负，而是累积一个疑心值，满了才转入警戒，这段缓冲决定了宽容度。","ask":"做一个俯视角潜行小关卡：12×9 格地图，玩家拖动小点从左下角溜到右上角出口。两个守卫沿固定路线巡逻、到点会停下左右张望，一台摄像头来回扫。视野锥 70 度、视距 4 格，被墙挡住的部分要缺口；被看见后头顶出现疑心圈，700 毫秒内持续被看见才算暴露、回到起点。守卫巡逻速度 1.2 格/秒。Canvas 实现，参数可调，手机可拖动。","keywordsZh":["视野锥","巡逻路线","警戒值","躲藏","绕后","不被发现"],"keywordsEn":["stealth","vision cone","patrol route","detection meter","line of sight","alert state"],"recognize":["敌人头上有问号、感叹号或警戒条","画面或小地图上能看到敌人的视野范围","正面硬打很难，绕路、等待、躲藏才是正解"],"form":{"loop":"观察、等时机、移动、躲藏、再观察","input":"移动加蹲伏、躲藏、分散注意力","feedback":"警戒条、问号感叹号、脚步声大小","pace":"大部分时间在等，几秒钟内决定成败","mood":"屏住呼吸，得手后松一口气"},"works":[{"title":"忍者印记","creator":"Klei Entertainment","year":2012,"video":{"src":"vid/stealth.mp4","poster":"img/stealth-poster.webp","w":720,"h":404,"source":"https://store.steampowered.com/app/214560/"},"note":"官方预告片片段"},{"title":"忍者印记","creator":"Klei Entertainment","year":2012,"img":{"src":"img/stealth-214560-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/214560/","note":"Steam 商店页截图"}},{"title":"忍者印记","creator":"Klei Entertainment","year":2012,"img":{"src":"img/stealth-214560-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/214560/","note":"Steam 商店页截图"}},{"title":"合金装备5：幻痛","creator":"Konami","year":2015,"img":{"src":"img/stealth-287700-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/287700/","note":"Steam 商店页截图"}},{"title":"杀手 3","creator":"IO Interactive","year":2021}],"demo":"stealth","dg":null,"hint":"拖动小点避开视野溜到出口；下面可以调视野和起疑时间","related":["fps","platformer","soulslike"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"sandbox","kind":"style","cat":"sim","zh":"沙盒建造","en":"Sandbox","aka":["方块建造","沙盒游戏"],"oneLine":"世界由可以挖掉、也可以放回去的方块组成，没有规定目标，玩家自己决定盖什么。挖到的材料就是能盖的东西。","era":{"from":2009,"to":null},"regions":["global"],"media":["pc","console","mobile"],"players":["solo","coop"],"makeLevel":"web","making":"核心是一张格子数组：点实心格就挖掉并加进背包，点空格就从背包扣一个放下；沙、土这类方块每帧检查脚下是否为空来做下落。3D 版换成体素分块加网格合并，原理相同。","ask":"做一个侧视方块沙盒：14 像素一格，地形用正弦叠加生成，表层土、下面石头，再放两棵树。点实心方块挖掉，挖到的材料进背包；点空处放下当前选中的材料，按住可以连续刷，笔刷 1 格。默认生存模式，背包里没有就放不了；切到创造模式无限放。沙和土脚下空了就往下掉。顶部显示背包数量，没人操作时自动演示挖坑、盖小屋。Canvas 实现，手机可用。","keywordsZh":["挖方块","放方块","背包","地形生成","创造模式","生存模式"],"keywordsEn":["sandbox","voxel","block building","procedural terrain","creative mode","survival mode"],"recognize":["世界由网格方块组成，几乎都能挖","挖到的东西进背包，可以再放回去","没有固定目标，玩家自己给自己定任务"],"form":{"loop":"探索、挖材料、盖东西、再找更好的材料","input":"点击挖掘和放置，切换手上的材料","feedback":"方块碎裂、背包数量变化、建筑成形","pace":"自定，松弛","mood":"自由，慢慢搭出自己的地方"},"works":[{"title":"泰拉瑞亚","creator":"Re-Logic","year":2011,"video":{"src":"vid/sandbox.mp4","poster":"img/sandbox-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/105600/"},"note":"官方预告片片段"},{"title":"泰拉瑞亚","creator":"Re-Logic","year":2011,"img":{"src":"img/sandbox-105600-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/105600/","note":"Steam 商店页截图"}},{"title":"泰拉瑞亚","creator":"Re-Logic","year":2011,"img":{"src":"img/sandbox-105600-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/105600/","note":"Steam 商店页截图"}},{"title":"盖瑞模组","creator":"Facepunch Studios","year":2006,"img":{"src":"img/sandbox-4000-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/4000/","note":"Steam 商店页截图"}},{"title":"我的世界","creator":"Mojang Studios","year":2011}],"demo":"sandbox","dg":null,"hint":"点方块挖，点空处放；下面可以切材料和模式","related":["falling-sand","survival-craft","city-builder"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"city-builder","kind":"style","cat":"sim","zh":"城市建造","en":"City Builder","aka":["模拟城市类","城建"],"oneLine":"玩家不直接盖每栋房子，只铺路、划分区，房子自己长出来。乐趣在于看着规划被验证：路通了、商业近了，街区就会长高。","era":{"from":1989,"to":null},"regions":["north-america","europe","global"],"media":["pc","console"],"players":["solo"],"makeLevel":"web","making":"地图是格子，每格存类型和等级；定时检查条件（是否连路、周边几格内有没有商业或住宅），满足就涨一级，不满足就慢慢衰退。规模大了要换成分区缓存和分帧更新。","ask":"做一个城市建造原型：12×7 格地块，底部三个工具：道路、住宅、商业，按住拖动可以连续铺。住宅和商业必须挨着道路才会成长，没连路的地块闪一个叉。住宅每 2 秒左右涨一级，最高 3 级；附近 2 格内有商业时成长快 3 倍，商业覆盖范围用虚线框画出来。顶部显示人口和岗位。没人操作时自动铺一个十字路口街区演示。Canvas 实现，手机可用。","keywordsZh":["铺路","分区","住宅商业工业","人口增长","覆盖范围","交通"],"keywordsEn":["city builder","zoning","road network","service coverage","population growth","urban planning"],"recognize":["玩家铺路、划分区，房子由游戏自己长出来","大量数字面板：人口、税收、满意度","城市越大，交通和服务覆盖越是难题"],"form":{"loop":"规划、建造、观察数据、修问题、扩张","input":"拖动铺路、刷分区、放公共建筑","feedback":"建筑长高、人口数字、热力图","pace":"慢，可暂停可加速","mood":"掌控感，看着城市长大的满足"},"works":[{"title":"城市：天际线","creator":"Colossal Order","year":2015,"video":{"src":"vid/city-builder.mp4","poster":"img/city-builder-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/255710/"},"note":"官方预告片片段"},{"title":"城市：天际线","creator":"Colossal Order","year":2015,"img":{"src":"img/city-builder-255710-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/255710/","note":"Steam 商店页截图"}},{"title":"城市：天际线","creator":"Colossal Order","year":2015,"img":{"src":"img/city-builder-255710-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/255710/","note":"Steam 商店页截图"}},{"title":"纪元1800","creator":"Ubisoft Mainz","year":2019,"img":{"src":"img/city-builder-916440-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/916440/","note":"Steam 商店页截图"}},{"title":"模拟城市","creator":"Maxis","year":1989}],"demo":"city-builder","dg":null,"hint":"选道路、住宅或商业，在地块上拖动；下面可以调成长速度","related":["management-sim","sandbox","idle"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"farming-sim","kind":"style","cat":"sim","zh":"农场模拟","en":"Farming Sim","aka":["种田游戏","农场经营"],"oneLine":"播种、浇水、等几天、收获卖钱，再买更多种子。一天的时间和体力有限，每天都在规划今天先干什么。","era":{"from":1996,"to":null},"regions":["japan","global"],"media":["console","pc","mobile"],"players":["solo","coop"],"makeLevel":"web","making":"每块田存作物阶段和今天是否浇过水；一天结束时统一结算，浇过水的作物长一级。一天时长和体力上限是最关键的两个旋钮，它们决定每天能照顾多少块地。","ask":"做一个农场模拟原型：6×4 块田，手指拖过田地自动执行合适的动作：空地播种、干地浇水、成熟收获。一天 8 秒，顶部有进度线；每天 16 点体力，每个动作扣 1 点，用完只能等明天。天黑结算时浇过水的作物才长，3 天成熟，收获飘出金币。可切换“不用浇水”对比。没人操作时自动种田演示。Canvas 实现，手机可用。","keywordsZh":["种田","浇水","季节","体力","收获","日程"],"keywordsEn":["farming sim","crop growth","day cycle","stamina","harvest","cozy"],"recognize":["一天有明确的时钟，到点必须睡觉","作物要过好几天才熟，中间每天得照料","赚的钱拿去扩大农场、升级工具"],"form":{"loop":"播种、浇水、过夜、收获、卖钱、扩建","input":"点选或走到田地上使用工具","feedback":"作物逐日长大、收获数字、金币","pace":"以天为单位，日内紧、跨天松","mood":"踏实、规律、有盼头"},"works":[{"title":"牧场物语 橄榄镇与希望的大地","creator":"Marvelous","year":2021,"video":{"src":"vid/farming-sim.mp4","poster":"img/farming-sim-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1392960/"},"note":"官方预告片片段"},{"title":"牧场物语 橄榄镇与希望的大地","creator":"Marvelous","year":2021,"img":{"src":"img/farming-sim-1392960-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1392960/","note":"Steam 商店页截图"}},{"title":"牧场物语 橄榄镇与希望的大地","creator":"Marvelous","year":2021,"img":{"src":"img/farming-sim-1392960-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1392960/","note":"Steam 商店页截图"}},{"title":"模拟农场 22","creator":"GIANTS Software","year":2021,"img":{"src":"img/farming-sim-1248130-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1248130/","note":"Steam 商店页截图"}},{"title":"星露谷物语","creator":"ConcernedApe","year":2016}],"demo":"farming-sim","dg":null,"hint":"手指拖过田地播种、浇水、收获；下面可以调一天多长","related":["management-sim","idle","streak"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"scrub","kind":"technique","cat":"web","zh":"拖动调值","en":"Scrubbing Input","aka":["拖拽数值","Scrubby Slider"],"oneLine":"按住数字左右拖就能改值，不用打字也不用找滑杆；拖得快变化大，手指往下挪开还能进入精调。","era":{"from":2003,"to":null},"regions":["global"],"media":["pc","web","mobile"],"players":["solo"],"makeLevel":"web","making":"pointerdown 后锁定指针，按 movementX 乘灵敏度累加；用最近几帧的速度算加成倍数，用纵向偏移分档降低步长做精调。","ask":"做一个可拖动调值的数字输入框：按住后左右拖改值，每像素改 0.5，拖得快时按速度给最多 1.5 倍额外加成；按住后手指往下移超过框高的一档变 ½ 速、两档变 ¼ 速，方便精调。范围 0–360，碰到边界时边框闪一下。旁边放一根随数值滑动的刻度尺。手机触屏同样可用，拖动时禁止页面滚动。","keywordsZh":["拖动改数值","数字拖拽","精调","灵敏度","刻度尺","参数面板"],"keywordsEn":["scrubbing","scrubby slider","drag to adjust","fine adjustment","number input","pointer lock"],"recognize":["鼠标停在数字上会变成左右箭头","按住拖动数字实时变化","往下挪开手指变化变慢"],"form":{},"works":[{"title":"Tangle","creator":"Bret Victor","year":2011},{"title":"Figma","creator":"Figma","year":2016}],"demo":"scrub","dg":null,"hint":"按住数字框左右拖，往下挪开手指能精调；下面可以调灵敏度和加速","related":["snap","fling","dead-zone"],"use":4,"status":"mainstream","usedIn":["web","game"],"ai":false},{"id":"snap","kind":"technique","cat":"web","zh":"吸附对齐","en":"Snapping & Smart Guides","aka":["智能参考线","磁性对齐"],"oneLine":"拖动的元素靠近网格或别的元素的边、中线时被轻轻吸过去，同时亮出一条参考线，对齐不再靠手稳。","era":{"from":1985,"to":null},"regions":["global"],"media":["pc","web","mobile"],"players":["solo"],"makeLevel":"web","making":"拖动时收集其他元素的左/中/右、上/中/下坐标，分别在 x、y 轴找距离最近且小于阈值的那条线，把位置改成对齐后的值并画出参考线；都没命中再取整到网格。","ask":"做一个画布拖拽吸附：拖动卡片时，卡片的左边、中线、右边（以及上中下）和其他卡片对应的边或画布中线距离小于 8 像素时吸过去，并画一条贯穿画布的虚线参考线；不靠近任何元素时按 24 像素网格取整。命中新参考线时线条加粗闪一下。卡片实际位置和指针位置不同时，用虚框显示指针所在位置。支持触屏拖动。","keywordsZh":["吸附","对齐参考线","网格对齐","智能参考线","拖拽布局","磁吸"],"keywordsEn":["snapping","smart guides","snap to grid","alignment guides","drag and drop","magnetic snap"],"recognize":["拖到快对齐时元素会跳一下贴过去","出现一条红色或虚线参考线","微调一两个像素反而很难"],"form":{},"works":[{"title":"Keynote","creator":"Apple","year":2003},{"title":"Figma","creator":"Figma","year":2016}],"demo":"snap","dg":null,"hint":"拖动黑色卡片，靠近别的卡片边缘看参考线；下面可以调吸附距离","related":["drag-reorder","magnetic","scrub"],"use":5,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"rubber-band","kind":"technique","cat":"web","zh":"边界橡皮筋","en":"Rubber-Band Overscroll","aka":["越界回弹","弹性滚动"],"oneLine":"滚到列表尽头还能继续拉一截，但越拉越拉不动，松手弹回边界。用户一摸就知道到头了，不会以为卡住。","era":{"from":2007,"to":null},"regions":["global"],"media":["mobile","pc","web"],"players":["solo"],"makeLevel":"web","making":"越界部分用 (1 − 1/(x·c/d + 1))·d 映射，c 是阻尼系数、d 是容器高度；松手后用临界阻尼弹簧把位置拉回边界。","ask":"给一个自定义滚动列表做 iOS 式的边界橡皮筋：在范围内手指和内容 1:1 移动；拖过顶部或底部后，越界距离按 (1 − 1/(x × 0.55 / 容器高 + 1)) × 容器高 计算，越拉越费劲；松手后用刚度 260 的临界阻尼弹簧弹回边界。范围内松手保留惯性滑动，滑出边界同样回弹。触屏和鼠标拖动都要支持。","keywordsZh":["回弹","越界滚动","弹性边界","阻尼","弹簧","列表滚动"],"keywordsEn":["rubber banding","overscroll","bounce back","elastic scrolling","spring","scroll view"],"recognize":["拖到头还能拉出一点空白","拉得越远阻力越大","松手啪地弹回去"],"form":{},"works":[{"title":"iPhone（iPhone OS 1）","creator":"Apple","year":2007},{"title":"Mac OS X Lion","creator":"Apple","year":2011}],"demo":"rubber-band","dg":null,"hint":"上下拖动列表，拖过顶或底再松手；下面可以调阻尼和回弹刚度","related":["pull-to-refresh","fling","spring"],"use":4,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"fling","kind":"technique","cat":"web","zh":"惯性甩动","en":"Fling / Momentum","aka":["惯性滚动","动量滑动"],"oneLine":"松手时按最后一小段手指速度继续滑，再按摩擦慢慢停下。列表、地图、卡片甩得出去，手感才像在推实物。","era":{"from":2007,"to":null},"regions":["global"],"media":["mobile","pc","web"],"players":["solo"],"makeLevel":"web","making":"拖动时记录带时间戳的指针采样，松手取最近 80 毫秒算速度；之后每帧 v *= exp(−摩擦·dt)，速度低于阈值停下，停点可提前用 v/摩擦 预测。","ask":"做一个可以甩出去的圆点：拖动时记录指针位置和时间，松手时只用最近 80 毫秒的采样算速度（上限 4000 像素/秒），之后按 v = v × e^(−2.2 × dt) 衰减，碰到边框以 0.4 倍速度反弹。松手瞬间画出速度箭头，并用虚线标出按 v/摩擦 预测的停点。手机触屏可用，拖动时禁止页面滚动。","keywordsZh":["惯性","甩动","动量滚动","摩擦","速度衰减","手势"],"keywordsEn":["fling","momentum scrolling","inertia","velocity tracking","friction","decay"],"recognize":["松手后还会继续滑一段","甩得越快滑得越远","慢慢减速停下而不是戛然而止"],"form":{},"works":[{"title":"iPhone（iPhone OS 1）","creator":"Apple","year":2007},{"title":"Mac OS X Lion","creator":"Apple","year":2011}],"demo":"fling","dg":null,"hint":"拖住圆点甩出去；下面可以调摩擦和测速窗口","related":["rubber-band","swipe-cards","snap"],"use":5,"status":"mainstream","usedIn":["web","game"],"ai":false},{"id":"one-button","kind":"technique","cat":"input","zh":"单键操作","en":"One-Button Control","aka":["一键游戏","点按跳跃"],"oneLine":"整个游戏只有一个键，靠按下的时机和按住多久表达全部操作。上手零门槛，深度全压在节奏和时长上。","era":{"from":2009,"to":null},"regions":["global"],"media":["mobile","web","pc"],"players":["solo"],"makeLevel":"web","making":"按下给固定初速度起跳，按住期间维持；松手时若还在上升就把竖直速度乘一个截断系数，跳高就随按住时长变化。","ask":"做一个单键跑酷：角色自动以 260 像素/秒向前跑，场景只有一个操作，点屏幕或按空格。按下立即起跳，按住能跳到最高（约画面高 36%）；上升途中松手，竖直速度乘 0.55 截断，于是点一下是小跳。重力 2600 像素/秒²。障碍有矮台和高墙两种，高墙必须按住才能过。底部画一条按键记录带，显示最近 3 秒每次按了多久。","keywordsZh":["单键","一键操作","点按跳跃","按住跳高","休闲游戏","跑酷"],"keywordsEn":["one-button game","single input","variable jump height","tap to jump","endless runner","hyper-casual"],"recognize":["整局只按一个键或点屏幕","按得长短决定跳多高","失败几乎都因为时机不对"],"form":{},"works":[{"title":"Canabalt","creator":"Adam Saltsman","year":2009},{"title":"Flappy Bird","creator":"Dong Nguyen","year":2013},{"title":"几何冲刺","creator":"RobTop Games","year":2013}],"demo":"one-button","dg":null,"hint":"点一下小跳，按住跳高，空格也行；下面可以调松手截断和重力","related":["input-buffer","platformer","coyote-time"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"twin-stick","kind":"technique","cat":"input","zh":"双摇杆","en":"Twin-Stick Controls","aka":["双摇杆射击","左移右瞄"],"oneLine":"左摇杆管走位，右摇杆管朝哪儿打，移动和瞄准彻底分开，边退边打、绕圈扫射都成了基本功。","era":{"from":1982,"to":null},"regions":["global"],"media":["arcade","console","pc","mobile"],"players":["solo","coop"],"makeLevel":"web","making":"左右两个输入各自归一成向量：左边乘移速改位置，右边超过死区就取 atan2 作为瞄准角并按射速发弹；瞄准角用指数平滑过渡，避免枪口抖。","ask":"做一个触屏双摇杆射击：屏幕左半边按下拖动是移动摇杆，移速 150 像素/秒；右半边按下拖动是瞄准摇杆，推过 30% 就朝那个方向以每秒 8 发连射，枪口转向用 60 毫秒的指数平滑。两个摇杆支持多点触控同时操作，各自松手回中。敌人从四周慢慢逼近，被打中就消失并计分。键鼠调试时左边可用拖动，右边用拖动。","keywordsZh":["双摇杆","左移右瞄","多点触控","射击","走位","弹幕"],"keywordsEn":["twin-stick shooter","dual analog","move and aim","multitouch","shoot 'em up","strafe"],"recognize":["一只手走位另一只手瞄准","可以一边后退一边朝前开火","敌人从四面八方涌来"],"form":{},"works":[{"title":"Robotron: 2084","creator":"Williams Electronics","year":1982},{"title":"Geometry Wars: Retro Evolved","creator":"Bizarre Creations","year":2005},{"title":"挺进地牢","creator":"Dodge Roll","year":2016}],"demo":"twin-stick","dg":null,"hint":"左半屏拖动走位，右半屏拖动射击；下面可以调移速和射速","related":["joystick","aim-assist","dead-zone"],"use":4,"status":"classic","usedIn":["game"],"ai":false},{"id":"gyro-parallax","kind":"technique","cat":"web","zh":"陀螺仪视差","en":"Gyroscope Parallax","aka":["动态视差","倾斜视差"],"oneLine":"手机轻轻一歪，前后几层画面按不同幅度反向平移，平面界面立刻有了纵深；桌面上用鼠标位置代替。","era":{"from":2013,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"监听 deviceorientation 的 beta/gamma，减去起始姿态后除以满偏角度归一，乘每层的深度系数做 translate；iOS 要在点击里调 requestPermission，桌面退回到指针位置。","ask":"做一个多层视差场景：远处星空、月亮、两层山和最前面一张时钟卡片，深度系数从 0.15 到 1。手机上读 deviceorientation，以第一次读数为零点，倾斜 20 度算满偏，最前层最多反向平移 24 像素，其余按深度递减；位移用 120 毫秒的指数平滑。iOS 在用户点击时申请陀螺仪权限；电脑上用鼠标相对画面中心的位置代替，鼠标离开就自动缓慢摆动。","keywordsZh":["陀螺仪","视差","倾斜","纵深","动态壁纸","设备方向"],"keywordsEn":["gyroscope parallax","deviceorientation","tilt","depth layers","motion parallax","parallax wallpaper"],"recognize":["歪手机时背景和前景错开移动","离得越近的层动得越多","放平后慢慢归位"],"form":{},"works":[{"title":"iOS 7 视差壁纸","creator":"Apple","year":2013},{"title":"parallax.js","creator":"Matthew Wagerfield","year":2013}],"demo":"gyro-parallax","dg":null,"hint":"移动鼠标模拟倾斜，手机上直接歪手机；下面可以调位移和平滑","related":["tilt","pinch-zoom","long-press"],"use":3,"status":"mainstream","usedIn":["web","game"],"ai":false},{"id":"cursor-spotlight","kind":"technique","cat":"web","zh":"光标聚光","en":"Cursor Spotlight","aka":["鼠标光晕","边框发光","Reveal 高光","Spotlight Card"],"oneLine":"鼠标在一组卡片上移动时，光标下方亮起一团柔光，卡片边框被它照亮，像拿手电扫过暗处。深色官网很爱用它表现质感。","era":{"from":2017,"to":null},"regions":["global"],"media":["web","pc"],"players":["solo"],"makeLevel":"web","making":"在容器上监听 pointermove，把相对坐标写进 CSS 变量 --x/--y，卡片背景和边框各用一层 radial-gradient(circle at var(--x) var(--y)) 叠出光晕；边框光用 mask 只露出 1 像素的描边。","ask":"做一组深色背景上的功能卡片（3×2），鼠标移动时在光标位置显示一个半径 160 像素的径向光晕：卡片的 1 像素边框被照亮（亮度从光标处向外衰减），卡片内部也有一层很淡的底光，柔和度 60%。光晕跨卡片连续，不要每张卡单独算。坐标写到 CSS 变量里，用 requestAnimationFrame 更新；触屏设备上改为手指按住时显示。","keywordsZh":["光标光晕","边框发光","跟随鼠标","径向渐变","暗色质感","卡片悬停"],"keywordsEn":["cursor spotlight","glow border","radial gradient","reveal highlight","hover effect","spotlight card"],"recognize":["鼠标走到哪，哪里的卡片边框就亮起来","光是一团连续的，跨过卡片之间的缝","离开后卡片又暗下去"],"form":{},"works":[{"title":"Fluent Design Reveal 高光","creator":"Microsoft","year":2017}],"demo":"cursor-spotlight","dg":null,"hint":"在卡片上移动鼠标或手指；可以切换只亮边框还是连底光一起","related":["custom-cursor","magnetic","tilt"],"use":3,"status":"rising","usedIn":["web"],"ai":false},{"id":"like-burst","kind":"technique","cat":"web","zh":"点赞动效","en":"Like Burst","aka":["爱心爆开","点赞微动效","Heart Animation"],"oneLine":"点赞时爱心先缩一下再弹大，周围炸开一圈小点，数字向上滚一格。一个不到一秒的动画，让“点了一下”变成有分量的事。","era":{"from":2015,"to":null},"regions":["global"],"media":["mobile","web"],"players":["solo"],"makeLevel":"web","making":"爱心用关键帧做缩放（按下 0.8 → 弹到 1.3 → 回落到 1），同时在圆周上均匀发射一圈粒子，带减速和淡出；计数用上下两个数字做垂直滚动。复杂版本用 Lottie 导出。","ask":"做一个点赞按钮的动效：点击时爱心先缩到 0.8 倍，再弹到 1.3 倍并回落到 1 倍，整个动画 600 毫秒；同时从爱心中心向外炸开 12 个小圆点，沿圆周均匀分布，边飞边变小淡出。旁边的点赞数字向上滚动一格。再点一次取消，爱心变回空心、数字向下滚，不播粒子。双击图片也能点赞，在双击位置冒出一颗大爱心。","keywordsZh":["点赞","爱心动画","微交互","粒子爆开","数字滚动","双击点赞"],"keywordsEn":["like animation","heart burst","micro-interaction","particle burst","count roll","double tap to like"],"recognize":["爱心点下去会先缩再弹大","周围炸开一圈小点","数字往上翻了一格"],"form":{},"works":[{"title":"Twitter 红心点赞","creator":"Twitter","year":2015},{"title":"Facebook Reactions","creator":"Facebook","year":2016},{"title":"Lottie","creator":"Airbnb","year":2017}],"demo":"like-burst","dg":null,"hint":"点爱心，或双击图片；可以调粒子数和回弹大小","related":["hit-stop","screen-shake","particle-text"],"use":4,"status":"mainstream","usedIn":["web","game"],"ai":false},{"id":"text-scramble","kind":"technique","cat":"web","zh":"文字乱码解码","en":"Text Scramble","aka":["乱码解密","文字解码","Decode Text","Scramble Effect"],"oneLine":"文字出现前先是一串跳动的乱码，然后从左到右一个个“解”成正确的字，像终端在破译密码。科技感官网和游戏菜单常用。","era":{"from":1992,"to":null},"regions":["global"],"media":["web","pc"],"players":["solo"],"makeLevel":"web","making":"给每个字符分配一个开始和结束时间（按位置错开），在时间窗口内每隔几帧换一个随机字符，过了结束时间就固定成目标字符；用等宽字体避免宽度抖动。","ask":"做一个文字乱码解码效果：标题文字出现时，每个字符先显示随机乱码（从 !<>-_\\/[]{}=+*^?# 里随机取），按从左到右的顺序每 40 毫秒解出一个字，每个字解出前至少乱跳 400 毫秒。鼠标悬停时重新播放一遍。中文目标字用一组常用汉字做乱码池。用等宽字体防止宽度跳动，屏幕阅读器读取的是最终文字（aria-label）。","keywordsZh":["乱码解码","文字特效","科技感","逐字显现","悬停动画","终端风格"],"keywordsEn":["text scramble","decode effect","glitch text","character shuffle","hover animation","hacker text"],"recognize":["字出现之前是一串乱跳的符号","从左到右一个个变成正确的字","鼠标划过会再乱一次"],"form":{},"works":[{"title":"通天神偷（Sneakers）“Too Many Secrets” 解码镜头","creator":"Phil Alden Robinson","year":1992},{"title":"baffle","creator":"Cam Wiegert","year":2016}],"demo":"text-scramble","dg":null,"hint":"点画面或移过文字重新解码；可以换乱码字符集","related":["particle-text","stagger-reveal","custom-cursor"],"use":3,"status":"mainstream","usedIn":["web","game"],"ai":false},{"id":"horizontal-scroll","kind":"technique","cat":"web","zh":"横向滚动叙事","en":"Horizontal Scroll Section","aka":["横向滚动","滚动转横移","Pinned Horizontal Scroll"],"oneLine":"页面滚到某一段时被钉住，继续往下滚，内容却向左横着走，像翻一条长卷。产品发布页常用它一屏一屏展示功能。","era":{"from":2015,"to":null},"regions":["global"],"media":["web"],"players":["solo"],"makeLevel":"web","making":"外层容器高度设成“横向总宽度对应的滚动距离”，内层 position: sticky 钉在视口；根据外层的滚动进度算出横向 translateX，可加 lerp 平滑和按面板吸附。GSAP ScrollTrigger 的 pin + scrub 能一步做完。","ask":"做一个产品页里的横向滚动段落：这一段滚到视口顶部时钉住，继续纵向滚动时 4 块全屏面板向左横移，滚完最后一块再松开继续往下。横移位置用 lerp 平滑，每帧追上 12% 的差距；停止滚动后吸附到最近的一块面板。底部显示进度条和 1/4 页码。用 position: sticky 实现，手机上改为可以直接左右滑动的横向列表。","keywordsZh":["横向滚动","钉住段落","滚动驱动","长卷展示","产品介绍页","吸附翻页"],"keywordsEn":["horizontal scroll","pinned section","scroll-driven","ScrollTrigger","sticky","scroll snap"],"recognize":["往下滚，页面却在往左走","这一段像被钉在屏幕上","底部有进度条或页码提示还剩几块"],"form":{},"works":[{"title":"Locomotive Scroll","creator":"Locomotive","year":2019},{"title":"GSAP ScrollTrigger","creator":"GreenSock","year":2020}],"demo":"horizontal-scroll","dg":null,"hint":"在画面里上下拖动，模拟滚动页面；关掉效果看普通纵向排版","related":["scrollytelling","parallax","stagger-reveal"],"use":3,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"stagger-reveal","kind":"technique","cat":"web","zh":"交错入场","en":"Staggered Reveal","aka":["错峰动画","Stagger","依次出现"],"oneLine":"一组卡片不是同时出现，而是每张晚几十毫秒依次浮上来，像一排多米诺。同样的内容，看起来更有秩序，眼睛也知道该从哪读起。","era":{"from":2014,"to":null},"regions":["global"],"media":["web","mobile"],"players":["solo"],"makeLevel":"web","making":"给每个元素设 animation-delay = 序号 × 间隔（或按到起点的距离算），用同一条缓出曲线做位移加淡入；元素进入视口时才触发，用 IntersectionObserver 加类名。","ask":"做一个卡片网格的交错入场：网格进入视口时，每张卡片从下方 16 像素处上移并淡入，单张动画 420 毫秒，缓出曲线；相邻卡片之间间隔 60 毫秒依次开始，顺序按从左上到右下。超过 12 张时总延迟封顶 600 毫秒，免得最后几张等太久。用 IntersectionObserver 触发、只播一次；开启“减少动态效果”时直接显示。","keywordsZh":["交错动画","依次出现","入场动画","列表动画","错峰延迟","滚动触发"],"keywordsEn":["stagger animation","staggered reveal","entrance animation","list animation","animation delay","scroll reveal"],"recognize":["一组东西一个接一个地冒出来","像波浪一样从一角扩散到另一角","每个元素的动作都一样，只是起跑时间不同"],"form":{},"works":[{"title":"Material Design 动效规范（交错）","creator":"Google","year":2014},{"title":"Anime.js","creator":"Julian Garnier","year":2016}],"demo":"stagger-reveal","dg":null,"hint":"点画面重播；可以换扩散的起点和间隔","related":["skeleton","page-transition","text-scramble"],"use":4,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"custom-cursor","kind":"technique","cat":"web","zh":"自定义光标","en":"Custom Cursor","aka":["光标跟随","鼠标跟随器","Cursor Follower"],"oneLine":"把系统箭头换成一个小圆点和一个慢半拍跟随的圆环，移到链接上圆环放大，移到图片上变成“查看”。设计工作室的作品集网站几乎都有。","era":{"from":2016,"to":null},"regions":["global"],"media":["web"],"players":["solo"],"makeLevel":"web","making":"隐藏系统光标，用 fixed 定位的 div 画点和圈；点直接跟随指针，圈每帧用 lerp 追近一部分距离；悬停目标通过 data 属性告诉光标切换状态（放大、显示文字、反色）。","ask":"给作品集网站做自定义光标：系统光标隐藏，换成一个 6 像素的实心小点和一个直径 36 像素的细线圆环。小点紧贴鼠标，圆环每帧追上 18% 的距离，有慢半拍的拖尾感。移到链接和按钮上时圆环放大到 2 倍；移到作品图片上时圆环变成实心圆，中间写“查看”。用 transform 移动，requestAnimationFrame 更新；触屏设备上完全不启用，保留系统光标。","keywordsZh":["自定义光标","鼠标跟随","光标拖尾","悬停变形","作品集网站","交互光标"],"keywordsEn":["custom cursor","cursor follower","lerp","hover state","mouse trail","portfolio site"],"recognize":["鼠标变成一个点加一个圆圈","圆圈慢半拍跟着走","移到图片上它会变大并写着“查看”"],"form":{},"works":[{"title":"iPadOS 指针（吸附变形）","creator":"Apple","year":2020},{"title":"mouse-follower","creator":"Cuberto","year":2022}],"demo":"custom-cursor","dg":null,"hint":"在画面里移动鼠标，移到按钮和图片上看变化","related":["magnetic","cursor-spotlight","text-scramble"],"use":3,"status":"mainstream","usedIn":["web"],"ai":false},{"id":"procedural-dungeon","kind":"technique","cat":"rules","zh":"程序生成地牢","en":"Procedural Dungeon Generation","aka":["随机地图","PCG 地牢"],"oneLine":"每局开始时用算法现拼一张地图：房间、走廊、入口和出口位置都不同，同一套规则保证它一定能走通。","era":{"from":1980,"to":null},"regions":["global"],"media":["pc","console","mobile","web"],"players":["solo","coop"],"makeLevel":"web","making":"先用种子化的随机数撒房间、排除重叠，再按最近邻用 L 形走廊串起来，补几条回环边避免一条路走到底；最后从入口做一次广度优先搜索，把最远的格子设为出口，顺便验证连通。","ask":"做一个程序生成地牢的网页原型：48×36 的格子，每次随机生成 8 个不重叠的房间，用 L 形走廊按最近邻连通，再按 20% 的比例补回环走廊；入口放在第一个房间，用广度优先搜索把离入口最远的格子设为出口，并画出最短路径。地图按挖开的顺序动画展开，点画面换一个种子重新生成；顶部显示种子、房间数和入口到出口的步数，手机上同样能点。","keywordsZh":["随机种子","房间与走廊","连通性","回环","醉汉游走","广度优先"],"keywordsEn":["procedural generation","roguelike dungeon","seed","BSP","drunkard's walk","flood fill"],"recognize":["每局地图都不一样","能看出房间加走廊的拼接痕迹","能输入或分享地图种子"],"form":{},"works":[{"title":"Rogue","creator":"Michael Toy、Glenn Wichman","year":1980},{"title":"暗黑破坏神","creator":"Blizzard North","year":1996},{"title":"洞穴探险","creator":"Derek Yu","year":2008}],"demo":"procedural-dungeon","dg":null,"hint":"点画面换一个种子；关掉“规则”看纯随机有多乱","related":["roguelike","fog-of-war","permadeath","loot-rarity"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"fog-of-war","kind":"technique","cat":"rules","zh":"战争迷雾","en":"Fog of War","aka":["视野机制","未探索区域"],"oneLine":"只有单位视野里的东西是实时的，走过的地方留下地形但看不见敌人，没去过的地方一片黑，信息差本身就成了玩法。","era":{"from":1977,"to":null},"regions":["global"],"media":["pc","console","mobile","web"],"players":["solo","versus"],"makeLevel":"web","making":"地图存三种状态：未探索、已探索、当前可见。每帧以单位为圆心算视野半径内的格子，再用 Bresenham 射线判断是否被墙挡住；可见格写入已探索表，渲染时三层分别画黑、半透明灰和明亮。","ask":"做一个战争迷雾原型：32×24 的格子地图，随机放墙和 9 个敌人；玩家单位视野半径 5 格，用射线检测让墙挡住视线；地图分三层：从没去过的格子全黑，去过的格子保留灰色地形但不显示敌人，当前视野内完全可见。拖动或点击画面让单位走过去，顶部显示探索百分比和视野内的敌人数，手机上拖动也能操作。","keywordsZh":["视野半径","视线遮挡","已探索区域","信息差","侦察","阴影投射"],"keywordsEn":["fog of war","line of sight","field of view","shadowcasting","explored tiles","visibility map"],"recognize":["地图大部分是黑的","走过的地方变灰但看不到敌人","墙后面是盲区"],"form":{},"works":[{"title":"文明","creator":"MicroProse","year":1991},{"title":"魔兽争霸II：黑潮","creator":"Blizzard Entertainment","year":1995},{"title":"星际争霸","creator":"Blizzard Entertainment","year":1998}],"demo":"fog-of-war","dg":null,"hint":"拖动画面让单位走过去；可以把视线遮挡关掉对比","related":["procedural-dungeon","roguelike","tower-defense"],"use":4,"status":"classic","usedIn":["game"],"ai":false},{"id":"crafting","kind":"technique","cat":"rules","zh":"合成配方","en":"Crafting","aka":["制作系统","配方树"],"oneLine":"把两三样材料放在一起，按配方表变出新东西，新东西又能当材料往上合，玩家在摸索配方树的过程里推进。","era":{"from":1990,"to":null},"regions":["global"],"media":["pc","console","mobile","web"],"players":["solo","coop"],"makeLevel":"web","making":"配方存成无序键值表（把材料排序后拼成 key），合成时查表；结果写进物品栏和图鉴。难点在配方树的形状：基础材料少、每层产物都能再利用，再决定未发现配方显示多少信息。","ask":"做一个合成配方原型：4 种基础材料（木、石、草、铁），9 条两两合成的配方，产物还能继续当材料用，比如木+木=板、板+绳=筏、钢+木=剑。点两个材料放上工作台，0.45 秒进度条后出结果；配错了材料退回并抖动提示。右下角是配方图鉴，没发现的显示问号；开启提示时能和已选材料搭配的物品会亮圈。顶部统计尝试次数和发现进度，手机上点按即可。","keywordsZh":["配方表","物品栏","图鉴","材料树","试错","解锁"],"keywordsEn":["crafting system","recipe","inventory","tech tree","combination","discovery"],"recognize":["有个工作台或合成格","图鉴里一排问号等着解锁","低级材料合成高级物品"],"form":{},"works":[{"title":"我的世界","creator":"Mojang","year":2011},{"title":"饥荒","creator":"Klei Entertainment","year":2013},{"title":"星露谷物语","creator":"ConcernedApe","year":2016}],"demo":"crafting","dg":null,"hint":"点两个材料合成；可以把提示关掉，试试纯靠猜","related":["merge","idle","loot-rarity"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"loot-rarity","kind":"technique","cat":"rules","zh":"掉落与稀有度","en":"Loot Rarity Tiers","aka":["掉落表","装备品质"],"oneLine":"怪物按权重表掉东西，普通到传说分成几档，每档有自己的外形和特效，玩家一眼就知道这次掉得好不好。","era":{"from":1996,"to":null},"regions":["global"],"media":["pc","console","mobile"],"players":["solo","coop"],"makeLevel":"web","making":"掉落表写成权重数组，按累计权重取随机数落在哪一档；幸运值只乘在高档位的权重上再归一化。品质的视觉梯度（描边、填充、光晕、闪屏）要和概率梯度对应，越稀有表现越重。","ask":"做一个掉落表可视化原型：五档稀有度，权重分别是普通 60、优秀 25、稀有 10、史诗 4、传说 1，幸运加成 1 倍（只乘在稀有及以上的权重上）；点一下开 10 个，掉落物排成一行，档位越高图形越重，史诗和传说出现时闪一下屏。下方柱状图实时统计每档实际占比，用虚线标出理论概率，改权重后统计清零重来。顶部显示已开数量和平均多少个出一次传说，手机可点。","keywordsZh":["掉落表","权重","稀有度","品质颜色","幸运值","期望"],"keywordsEn":["loot table","drop rate","rarity tier","weighted random","magic find","item quality"],"recognize":["装备按品质分颜色","出了好东西有特别的光效和音效","高档掉落少到值得截图"],"form":{},"works":[{"title":"暗黑破坏神II","creator":"Blizzard North","year":2000},{"title":"魔兽世界","creator":"Blizzard Entertainment","year":2004},{"title":"无主之地","creator":"Gearbox Software","year":2009}],"demo":"loot-rarity","dg":null,"hint":"点画面开箱；把“每次开”调到 100 个看分布收敛","related":["gacha","pity-timer","crafting","roguelike"],"use":5,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"permadeath","kind":"technique","cat":"rules","zh":"永久死亡","en":"Permadeath","aka":["一命通关","铁人模式"],"oneLine":"角色死了就没了，从第一层重新开始；每一步都有分量，靠的是局外成长或玩家自己变强来推进。","era":{"from":1980,"to":null},"regions":["global"],"media":["pc","console","mobile"],"players":["solo"],"makeLevel":"web","making":"死亡时清空本局状态并删除或锁定存档，只保留局外数据（解锁、货币、最佳纪录）。设计重点是单局时长和每层风险，再决定死后留下什么：墓碑、纪录、还是可继承的升级。","ask":"做一个永久死亡的对比原型：角色一层层往下闯，每层死亡概率 14%，越深每层再加 4% 的相对风险；开启永久死亡时一死就回到第 0 层并开新的一局，右侧记一列墓碑（第几局、死在第几层）；关掉时改成每 5 层一个存档点，死了退回最近的存档点。用折线图画出层数随时间的变化，标出死亡点和历史最深纪录；可选局外成长，每死一次风险降低 1%。点画面推进一层，手机可点。","keywordsZh":["一条命","重开","墓碑","局外成长","风险","存档点"],"keywordsEn":["permadeath","roguelike","ironman mode","meta progression","run","high stakes"],"recognize":["没有读档","死后显示这局走了多远","下一局从头开始但解锁了新东西"],"form":{},"works":[{"title":"Rogue","creator":"Michael Toy、Glenn Wichman","year":1980},{"title":"超越光速","creator":"Subset Games","year":2012},{"title":"哈迪斯","creator":"Supergiant Games","year":2020}],"demo":"permadeath","dg":null,"hint":"点画面推进一层；把永久死亡关掉换成存档点对比曲线","related":["roguelike","procedural-dungeon","push-your-luck","soulslike"],"use":3,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"push-your-luck","kind":"technique","cat":"rules","zh":"见好就收","en":"Push Your Luck","aka":["风险回报","贪心骰"],"oneLine":"每次继续都能多拿一点，但也可能把这轮攒的全赔掉；玩家每一步都在“再来一次”和“收手”之间做决定。","era":{"from":1980,"to":null},"regions":["global"],"media":["physical","pc","mobile","web"],"players":["solo","versus"],"makeLevel":"web","making":"核心是一个累积奖池和一个失败概率：继续则奖池增加，失败则清零，收手才落袋。可以用动态规划算出每条收手线的期望得分，把最优点放在玩家直觉附近，让贪一点和稳一点都有道理。","ask":"做一个见好就收的骰子原型：点画面掷一颗六面骰，点数累加进本轮奖池，掷到 1 就爆，本轮清零；点“收手入账”把奖池加进总分。自动演示时奖池到 20 分就收手。右边画一条曲线：横轴是收手线（1 到 50 分），纵轴是用动态规划算出的每轮期望得分，标出最优收手线和当前收手线的位置；左上角统计已玩轮数、总分和实际每轮平均。手机上点按即可。","keywordsZh":["风险回报","收手","爆掉","期望值","奖池","贪心"],"keywordsEn":["push your luck","press your luck","bust","risk reward","expected value","stop rule"],"recognize":["有个“继续”和“收手”的选择","一次失手全部清零","越往后越心跳"],"form":{},"works":[{"title":"Can't Stop","creator":"Sid Sackson","year":1980},{"title":"印加宝藏","creator":"Bruno Faidutti、Alan R. Moon","year":2005}],"demo":"push-your-luck","dg":null,"hint":"点画面掷骰，点下方“收手入账”落袋；拖收手线看期望怎么变","related":["permadeath","loot-rarity","gacha","streak"],"use":3,"status":"classic","usedIn":["game","table"],"ai":false},{"id":"rubber-banding","kind":"technique","cat":"pace","zh":"橡皮筋机制","en":"Rubber Banding","aka":["追赶机制","Catch-up"],"oneLine":"落后的人被悄悄加速、领先的人被拖慢，差距像橡皮筋一样拉不开，比赛到最后一刻都还有悬念。","era":{"from":1992,"to":null},"regions":["global"],"media":["console","pc","mobile"],"players":["solo","versus"],"makeLevel":"web","making":"每帧算每个选手和平均位置的差距，除以生效距离后夹到 −1 到 1，乘上强度得到速度倍率；倍率用插值平滑过渡，避免突然加速。也可以只帮落后者，或者改成按名次发道具。","ask":"做一个橡皮筋机制的赛跑原型：4 辆车跑 300 米，基础速度各不相同；每辆车和平均位置的差距除以 8 米作为系数（夹在 ±1），乘上 25% 的强度作为速度加成，落后者加速、领先者减速，倍率用 0.1 的插值平滑。车旁边用速度线和刹车线显示加减速；下方实时画出第一名与最后一名的差距曲线，标出生效距离。按住画面让你的车加速 18%，开关可对比关掉后的差距，手机可按住。","keywordsZh":["追赶","动态速度","名次道具","差距","悬念","AI 对手"],"keywordsEn":["rubber banding","catch-up mechanic","dynamic AI speed","comeback","position-based items","racing AI"],"recognize":["怎么跑都甩不开 AI","落后时总能拿到好道具","最后一圈总是很胶着"],"form":{},"works":[{"title":"超级马力欧赛车","creator":"任天堂","year":1992},{"title":"极品飞车：地下狂飙","creator":"EA Black Box","year":2003},{"title":"马力欧卡丁车8 豪华版","creator":"任天堂","year":2017}],"demo":"rubber-banding","dg":null,"hint":"按住画面让你的车加速；关掉橡皮筋看差距怎么拉开","related":["dynamic-difficulty","flow-curve","async-pvp"],"use":3,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"dynamic-difficulty","kind":"technique","cat":"pace","zh":"动态难度","en":"Dynamic Difficulty Adjustment","aka":["DDA","自适应难度"],"oneLine":"游戏一直在偷偷看你的表现，打得好就加难度、连续失误就放水，让成功率稳在一个舒服的区间。","era":{"from":1996,"to":null},"regions":["global"],"media":["console","pc","mobile","web"],"players":["solo","coop"],"makeLevel":"web","making":"用一个 0 到 1 的难度值驱动所有参数（目标大小、速度、敌人数），每次成功加 (1−目标率)×步长、失败减 目标率×步长，长期下来成功率会收敛到目标值。关键是改得够慢、别让玩家看出来。","ask":"做一个动态难度原型：点击出现的黑色圆形目标，难度值在 0 到 1 之间，驱动目标大小（100% 到 28%）和停留时间（2.6 秒到 0.7 秒）；目标成功率 70%，每次命中难度加 (1−0.7)×8%×2.2，失误减 0.7×8%×2.2。右侧实时画难度曲线和每次命中/失误的记录，显示近 10 次命中率。无人操作时用“普通”水平的模拟玩家自动玩，也能切到新手和高手对比曲线收敛到哪里。手机点按即可。","keywordsZh":["自适应","目标成功率","难度曲线","放水","心流","表现评估"],"keywordsEn":["dynamic difficulty adjustment","adaptive difficulty","DDA","flow","player performance","AI director"],"recognize":["死几次之后关卡变容易了","打得太顺敌人会变多","不同水平的人都觉得“刚好”"],"form":{},"works":[{"title":"古惑狼","creator":"Naughty Dog","year":1996},{"title":"生化危机4","creator":"Capcom","year":2005},{"title":"求生之路","creator":"Turtle Rock Studios","year":2008}],"demo":"dynamic-difficulty","dg":null,"hint":"点黑色圆圈；右边能看到难度跟着你的表现变","related":["flow-curve","rubber-banding","enemy-waves"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"enemy-waves","kind":"technique","cat":"pace","zh":"刷怪波次","en":"Enemy Waves","aka":["波次","Wave System"],"oneLine":"敌人一波一波来，每波更多更快，波与波之间留几秒喘息，紧张和放松交替出节奏。","era":{"from":1978,"to":null},"regions":["global"],"media":["arcade","console","pc","mobile","web"],"players":["solo","coop"],"makeLevel":"web","making":"写一张波次表：每波数量按首波数量乘增长率的幂递增，出怪间隔、速度也随波数上调；清场后进入休息倒计时并预告下一波。比匀速刷怪多出了“开打—清场—喘气”的节拍。","ask":"做一个刷怪波次原型：玩家在画面中心，敌人从四周向中心逼近；首波 5 只，每波数量增长 30%（四舍五入），波内每 0.38 秒刷一只，清场后休息 3 秒并显示倒计时和下一波数量，每波开始时大字显示“Wave N”。点画面朝点击方向开火，无人操作时自动瞄准最近的敌人。顶部画一条场上敌人数的时间轴，能看出波峰和喘息；开关可切换成匀速刷怪做对比。手机可点。","keywordsZh":["波次","喘息","递增","清场","倒计时","刷怪表"],"keywordsEn":["enemy waves","wave spawner","horde mode","spawn table","intermission","escalation"],"recognize":["屏幕上会出现“第几波”","清完一波有短暂安静","越往后敌人越多"],"form":{},"works":[{"title":"太空侵略者","creator":"Taito","year":1978},{"title":"使命召唤：战争世界","creator":"Treyarch","year":2008},{"title":"植物大战僵尸","creator":"PopCap Games","year":2009}],"demo":"enemy-waves","dg":null,"hint":"点画面朝那个方向开火；把休息时间调成 0 感受一下","related":["tower-defense","dynamic-difficulty","flow-curve"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"pity-timer","kind":"technique","cat":"growth","zh":"保底机制","en":"Pity Timer","aka":["保底","坏运气保护"],"oneLine":"连续很多次没出好东西，概率就开始往上抬，到某一抽必定出；它不改平均值多少，主要是砍掉最倒霉的那条长尾。","era":{"from":2012,"to":null},"regions":["china","japan","korea","global"],"media":["mobile","pc","console"],"players":["solo"],"makeLevel":"web","making":"记录距上次出货的次数 n：n 小于软保底起点时用基础概率，之后每抽线性抬高，到硬保底时概率为 1。上线前用蒙特卡洛模拟几万人，看平均抽数、90 分位和最倒霉的人各要多少抽。","ask":"做一个保底机制的模拟器：基础出货概率 1.6%，硬保底 80 抽必出，从硬保底的 60%（第 48 抽）开始软保底，概率每抽线性抬高直到第 80 抽达到 100%。后台用蒙特卡洛模拟 2 万人，画出“第几抽出货”的柱状分布和累计出货比例的虚线，标出软保底区间和硬保底线；顶部显示平均抽数、90% 的人在第几抽前出货、最倒霉要几抽。下方有一条实时的“已垫抽数”进度条，点画面连抽 10 次。参数一改统计立刻重算，手机可点。","keywordsZh":["保底","软保底","硬保底","垫抽","概率公示","蒙特卡洛"],"keywordsEn":["pity timer","soft pity","hard pity","bad luck protection","drop rate","monte carlo"],"recognize":["界面写着“再抽 N 次必出”","垫到后期出货明显变多","保底计数会跨卡池继承"],"form":{},"works":[{"title":"炉石传说","creator":"Blizzard Entertainment","year":2014},{"title":"明日方舟","creator":"鹰角网络","year":2019},{"title":"原神","creator":"米哈游","year":2020}],"demo":"pity-timer","dg":null,"hint":"点画面连抽 10 次；拖动软保底起点看分布怎么变形","related":["gacha","loot-rarity","push-your-luck"],"use":4,"status":"mainstream","usedIn":["game"],"ai":false},{"id":"cozy","kind":"style","cat":"casual","zh":"治愈系","en":"Cozy Game","aka":["舒适游戏","慢生活游戏"],"oneLine":"没有失败、没有倒计时，玩家做的是浇花、整理、装饰这类小事。好不好玩看反馈够不够软、节奏够不够慢。","era":{"from":2001,"to":null},"regions":["global","japan"],"media":["console","pc","mobile"],"players":["solo","coop"],"makeLevel":"web","making":"状态机很简单，重点在动画曲线：每次点击给一个 500–700 毫秒的回弹，加柔和的粒子和漂浮光尘；系统上去掉惩罚，只留正向累积。","ask":"做一个治愈系小游戏原型：一排 5 个花盆，点花盆浇水，植物 8 秒长成开花，开花后再点一下收花，飘花瓣、记 +1。每次点击花盆做 600 毫秒的弹性回弹。不设倒计时、不会枯死，缺水只是暂停生长。背景有缓慢漂浮的光尘。加一个对比开关：关掉后变成 60 秒限时、缺水 2.5 秒就枯死。手机上点击区域要大。","keywordsZh":["治愈","慢节奏","无失败","收集","装饰","种田"],"keywordsEn":["cozy game","wholesome","low stakes","no fail state","relaxing loop","decorating"],"recognize":["没有血条也没有限时","每个动作都有软软的回弹和小音效","玩一会儿就有东西慢慢变多、变好看"],"form":{"loop":"做小事 → 看它慢慢变好 → 收获","input":"点击、拖放","feedback":"柔和动画与正向累积","pace":"很慢，玩家自己定","mood":"放松、安心"},"works":[{"title":"开箱","creator":"Witch Beam","year":2021,"video":{"src":"vid/cozy.mp4","poster":"img/cozy-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1135690/"},"note":"官方预告片片段"},{"title":"开箱","creator":"Witch Beam","year":2021,"img":{"src":"img/cozy-1135690-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1135690/","note":"Steam 商店页截图"}},{"title":"开箱","creator":"Witch Beam","year":2021,"img":{"src":"img/cozy-1135690-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1135690/","note":"Steam 商店页截图"}},{"title":"开箱","creator":"Witch Beam","year":2021,"img":{"src":"img/cozy-1135690-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1135690/","note":"Steam 商店页截图"}},{"title":"动物森友会","creator":"任天堂","year":2001},{"title":"星露谷物语","creator":"ConcernedApe","year":2016}],"demo":"cozy","dg":null,"hint":"点花盆浇水，开花后再点收花；关掉治愈模式试试限时版","related":["farming-sim","idle","merge","walking-sim"],"use":4,"status":"rising","usedIn":[],"ai":false},{"id":"word-game","kind":"style","cat":"casual","zh":"文字游戏","en":"Word Game","aka":["猜词游戏","Wordle-like"],"oneLine":"围绕字和词做谜题：猜词、拼词、改词。Wordle 把它做成每天一题、靠三种格子颜色推理答案的形式。","era":{"from":1938,"to":null},"regions":["global","north-america","china"],"media":["web","mobile","pc"],"players":["solo","mass"],"makeLevel":"web","making":"核心是判分函数：先标出位置正确的字母，再按剩余字母计数标“存在但位置不对”，处理好重复字母；翻牌动画逐格错开。","ask":"做一个 Wordle 式猜词游戏：5 个字母的英文单词，6 次机会。每次提交后逐格翻牌揭晓，格与格之间间隔 250 毫秒：实心表示位置对，描边表示单词里有这个字母但位置不对，灰色表示没有。判分要正确处理重复字母。下方屏幕键盘同步显示每个字母的状态；字数不够时整行左右抖一下。手机上用屏幕键盘，电脑上也支持实体键盘。","keywordsZh":["猜词","每日一题","字母提示","拼词","词库","分享战绩"],"keywordsEn":["word game","wordle","word puzzle","letter feedback","daily puzzle","anagram"],"recognize":["一排排字母格，提交后翻牌变色","有限的猜测次数","屏幕键盘上已经排除的字母变灰"],"form":{"loop":"猜一个词 → 读反馈 → 缩小范围","input":"打字","feedback":"每格三种状态","pace":"慢，可以随时停下来想","mood":"推理的小满足"},"works":[{"title":"Wordle","creator":"Josh Wardle","year":2021},{"title":"文字游戏","creator":"Team9","year":2022,"video":{"src":"vid/word-game-v2.mp4","poster":"img/word-game-v2-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1109570/"},"note":"官方预告片片段"},{"title":"文字游戏","creator":"Team9","year":2022,"img":{"src":"img/word-game-1109570-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1109570/","note":"Steam 商店页截图"}},{"title":"文字游戏","creator":"Team9","year":2022,"img":{"src":"img/word-game-1109570-1.webp","w":1152,"h":720,"source":"https://store.steampowered.com/app/1109570/","note":"Steam 商店页截图"}},{"title":"文字游戏","creator":"Team9","year":2022,"img":{"src":"img/word-game-1109570-2.webp","w":1152,"h":720,"source":"https://store.steampowered.com/app/1109570/","note":"Steam 商店页截图"}},{"title":"拼字游戏 Scrabble","creator":"Alfred Butts","year":1938}],"demo":"word-game","dg":null,"hint":"用下方键盘或实体键盘猜词；关掉位置提示看看难多少","related":["streak","match-3","party-quiz"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"jrpg","kind":"style","cat":"rpg","zh":"回合制角色扮演","en":"JRPG / Turn-based RPG","aka":["JRPG","回合制 RPG"],"oneLine":"小队轮流下指令，和敌人你来我往。好玩的地方在读敌人弱点、算资源，然后打出一回合翻盘。","era":{"from":1986,"to":null},"regions":["japan","global"],"media":["console","pc","mobile"],"players":["solo"],"makeLevel":"web","making":"战斗是一个回合队列加状态机：选指令 → 播演出 → 结算 → 下一个行动者。歧路旅人式的护盾破防只要给敌人加护盾计数和弱点表。","ask":"做一个回合制战斗原型：三名队员（剑、弓、火三种属性）对一个首领，按顺序轮流行动，轮到谁就弹出“攻击 / 连击（耗 15 MP，两段）/ 防御”菜单。首领有 2 个隐藏弱点和 4 层护盾，用弱点属性打中会揭示弱点并削一层；护盾归零首领破防，停一回合，期间受到的伤害翻倍。屏幕上方显示行动顺序，伤害数字弹出放大再淡出，演出速度 1 倍、可调。","keywordsZh":["回合制","指令菜单","弱点","破防","行动顺序","小队"],"keywordsEn":["turn-based combat","JRPG","command menu","weakness","break system","party"],"recognize":["屏幕一角有攻击、技能、道具的指令菜单","敌我双方站成两排轮流出手","伤害数字从头顶跳出来"],"form":{"loop":"读局面 → 下指令 → 看结算","input":"菜单选择","feedback":"伤害数字和演出","pace":"回合之间可以慢慢想","mood":"运筹、成长"},"works":[{"title":"歧路旅人","creator":"Square Enix、ACQUIRE","year":2018,"video":{"src":"vid/jrpg.mp4","poster":"img/jrpg-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/921570/"},"note":"官方预告片片段"},{"title":"歧路旅人","creator":"Square Enix、ACQUIRE","year":2018,"img":{"src":"img/jrpg-921570-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/921570/","note":"Steam 商店页截图"}},{"title":"歧路旅人","creator":"Square Enix、ACQUIRE","year":2018,"img":{"src":"img/jrpg-921570-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/921570/","note":"Steam 商店页截图"}},{"title":"歧路旅人","creator":"Square Enix、ACQUIRE","year":2018,"img":{"src":"img/jrpg-921570-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/921570/","note":"Steam 商店页截图"}},{"title":"勇者斗恶龙","creator":"Enix","year":1986},{"title":"最终幻想 IV","creator":"Square","year":1991}],"demo":"jrpg","dg":null,"hint":"轮到队员时点左下菜单下指令；切到 ATB 看看犹豫的代价","related":["trpg","skill-tree","damage-numbers","xp-curve"],"use":4,"status":"classic","usedIn":[],"ai":false},{"id":"horror","kind":"style","cat":"story","zh":"恐怖游戏","en":"Horror Game","aka":["生存恐怖","心理恐怖"],"oneLine":"把玩家能看到、能做的事情收得很窄：光只够照一个方向，威胁总在背后。怕的来源是“知道它在，看不见”。","era":{"from":1992,"to":null},"regions":["japan","north-america","global"],"media":["pc","console"],"players":["solo","coop"],"makeLevel":"web","making":"网页里用 2D canvas 画一个扇形光锥做遮罩，其余区域压黑；威胁只在光外移动，靠距离驱动心跳、暗角和画面抖动。","ask":"做一个 2D 恐怖小游戏原型：玩家站在黑屋中央，手电筒指向鼠标或手指方向，光锥 45 度，其余全黑。房间里 3 个怪物从四周靠近，被光照到就停住，照不到时以每秒 28 像素向你挪；黑暗里只露一对微亮的眼睛。离得越近心跳越快（60 到 170 次/分），暗角跟着心跳收缩，近距离手电会闪。被碰到时全屏惊吓 0.9 秒，再重新开始。","keywordsZh":["黑暗","手电筒","心跳","追逐","资源稀缺","跳吓"],"keywordsEn":["survival horror","flashlight","limited vision","jump scare","tension","stalker AI"],"recognize":["画面大部分是暗的","有个东西在追你，你打不过或者很难打","心跳声、喘息声越来越密"],"form":{"loop":"探索 → 察觉威胁 → 躲避或逃跑","input":"移动和转视角","feedback":"声音、光和心跳","pace":"慢慢憋紧再突然爆发","mood":"紧张、恐惧"},"works":[{"title":"生化危机 2 重制版","creator":"Capcom","year":2019,"video":{"src":"vid/horror.mp4","poster":"img/horror-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/883710/"},"note":"官方预告片片段"},{"title":"生化危机 2 重制版","creator":"Capcom","year":2019,"img":{"src":"img/horror-883710-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/883710/","note":"Steam 商店页截图"}},{"title":"生化危机 2 重制版","creator":"Capcom","year":2019,"img":{"src":"img/horror-883710-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/883710/","note":"Steam 商店页截图"}},{"title":"生化危机 2 重制版","creator":"Capcom","year":2019,"img":{"src":"img/horror-883710-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/883710/","note":"Steam 商店页截图"}},{"title":"失忆症：黑暗后裔","creator":"Frictional Games","year":2010},{"title":"寂静岭 2","creator":"Konami","year":2001}],"demo":"horror","dg":null,"hint":"移动指针转动手电，照住怪物它就不动；关掉黑暗看看还怕不怕","related":["stealth","walking-sim","screen-shake"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"detective","kind":"style","cat":"story","zh":"推理解谜","en":"Detective / Deduction Game","aka":["演绎推理","侦探游戏"],"oneLine":"游戏只给线索不给答案，玩家自己把人、事、名字对上号。奥伯拉丁的回归让你填完船员名册，答对三个才确认一次。","era":{"from":1984,"to":null},"regions":["global","japan","europe"],"media":["pc","console","mobile"],"players":["solo"],"makeLevel":"web","making":"数据上是一张“对象 × 属性”的答案表，界面是让玩家填空的表单；关键设计是校验粒度，比如凑够 N 个正确才统一确认，防止逐个试错。","ask":"做一个奥伯拉丁式身份推理原型：6 个船员画像，每人旁边列 2 条线索（站在哪、拿着什么、说什么语言），右边是名字栏，点一下循环切换名册里的名字。猜对的不会马上提示，要同时猜对 3 个才一起锁定并弹出“3 人身份已确认”，锁定的名字从可选项里移除。全部确认后显示完成。加一个对比开关，关掉后改成每填一个立刻判对错。","keywordsZh":["推理","线索","身份对应","演绎","笔记本","真相"],"keywordsEn":["deduction game","detective","clue","identity puzzle","logic","fill in the blanks"],"recognize":["有一本需要你填空的笔记、名册或案情板","答案要自己组合出来，不是选项里挑","答对时只确认一部分，不让你逐个试"],"form":{"loop":"观察线索 → 提出假设 → 填写验证","input":"点选和填空","feedback":"批量确认","pace":"慢，经常停下来对照","mood":"灵光一闪的爽"},"works":[{"title":"奥伯拉丁的回归","creator":"Lucas Pope","year":2018,"video":{"src":"vid/detective.mp4","poster":"img/detective-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/653530/"},"note":"官方预告片片段"},{"title":"奥伯拉丁的回归","creator":"Lucas Pope","year":2018,"img":{"src":"img/detective-653530-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/653530/","note":"Steam 商店页截图"}},{"title":"奥伯拉丁的回归","creator":"Lucas Pope","year":2018,"img":{"src":"img/detective-653530-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/653530/","note":"Steam 商店页截图"}},{"title":"奥伯拉丁的回归","creator":"Lucas Pope","year":2018,"img":{"src":"img/detective-653530-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/653530/","note":"Steam 商店页截图"}},{"title":"金色偶像案","creator":"Color Gray Games","year":2022},{"title":"逆转裁判","creator":"Capcom","year":2001}],"demo":"detective","dg":null,"hint":"点名字栏切换名字，凑够一批正确才会锁定","related":["murder-mystery","escape-room","sokoban","visual-novel"],"use":3,"status":"rising","usedIn":[],"ai":false},{"id":"rts","kind":"style","cat":"strategy","zh":"即时战略","en":"Real-Time Strategy","aka":["RTS"],"oneLine":"采集资源、造兵、框选部队下命令，敌我双方同时行动，没有回合可以停下来想。考的是同时盯住经济和前线的能力。","era":{"from":1992,"to":null},"regions":["north-america","europe","korea","global"],"media":["pc"],"players":["solo","versus","coop"],"makeLevel":"web","making":"单位做成带目标点的简单代理，框选用矩形命中，下令时按方阵分配目标位；战争迷雾用离屏画布挖洞再盖回主画布。上百单位以内 Canvas 足够。","ask":"做一个即时战略小样：左侧是我方基地和 8 个小兵，拖动框选部队，点地面下令移动，队形自动排成方阵；敌军每 6 秒从右侧来一波，双方碰上自动交火，射程内优先打最近的。开启战争迷雾，只有己方单位周围看得见。顶部显示基地血量、击杀数和下一波倒计时，提供 1 倍游戏速度并可调。手机上单指拖动即框选。","keywordsZh":["框选","资源采集","战争迷雾","微操","兵种克制","建造顺序"],"keywordsEn":["RTS","box select","fog of war","micro","build order","APM"],"recognize":["拖一个框选中一群单位，右键或点地面下令","地图大部分被迷雾盖着","暂停不了，手速和多线操作很重要"],"form":{"loop":"采集、建造、出兵、交战","input":"框选加点击下令","feedback":"部队交火、地盘推进","pace":"持续高压，没有停顿","mood":"紧张、运筹"},"works":[{"title":"帝国时代 II：决定版","creator":"Forgotten Empires","year":2019,"video":{"src":"vid/rts.mp4","poster":"img/rts-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/813780/"},"note":"官方预告片片段"},{"title":"帝国时代 II：决定版","creator":"Forgotten Empires","year":2019,"img":{"src":"img/rts-813780-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/813780/","note":"Steam 商店页截图"}},{"title":"帝国时代 II：决定版","creator":"Forgotten Empires","year":2019,"img":{"src":"img/rts-813780-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/813780/","note":"Steam 商店页截图"}},{"title":"帝国时代 II：决定版","creator":"Forgotten Empires","year":2019,"img":{"src":"img/rts-813780-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/813780/","note":"Steam 商店页截图"}},{"title":"星际争霸","creator":"Blizzard Entertainment","year":1998},{"title":"命令与征服","creator":"Westwood Studios","year":1995}],"demo":"rts","dg":null,"hint":"拖动框选部队，点地面下令；下面可以开关迷雾、调敌军间隔","related":["tower-defense","four-x","auto-battler"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"four-x","kind":"style","cat":"strategy","zh":"4X 策略","en":"4X Strategy","aka":["4X","大战略"],"oneLine":"探索、扩张、开发、征服四件事轮流做，一局几百回合，从一座城发展成帝国。“再来一回合”说的就是它。","era":{"from":1991,"to":null},"regions":["north-america","europe","global"],"media":["pc","console"],"players":["solo","versus"],"makeLevel":"web","making":"六角格用轴坐标存储，距离公式 (|dq|+|dr|+|dq+dr|)/2；每个势力记录自己的视野表，AI 按地块价值贪心扩张就能跑起来。","ask":"做一个 4X 策略小样：半径 5 格的六角格地图，有平原、森林、丘陵、水四种地形；我方和 2 个电脑对手各从角落一座城出发，每回合可以占领一块与领地相邻的格子，领地每长到 6 格自动建新城。未探索区域用迷雾遮住，领地外 2 格内可见。点虚线框的可扩张格就推进一回合，回合时长 1.2 秒，地图占满后按格子数判胜负。","keywordsZh":["探索","扩张","六角格","科技树","外交","再来一回合"],"keywordsEn":["4X","explore expand exploit exterminate","hex grid","tech tree","diplomacy","one more turn"],"recognize":["地图一开始几乎全黑，要派人去探","领土一格一格往外长，边界线互相顶住","一局要几十上百回合，总想再来一回合"],"form":{"loop":"探索、扩张、开发、征服","input":"回合内点选下令","feedback":"领土变大、数字增长","pace":"回合制，长线","mood":"掌控、经营野心"},"works":[{"title":"文明 VI","creator":"Firaxis Games","year":2016,"video":{"src":"vid/four-x.mp4","poster":"img/four-x-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/289070/"},"note":"官方预告片片段"},{"title":"文明 VI","creator":"Firaxis Games","year":2016,"img":{"src":"img/four-x-289070-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/289070/","note":"Steam 商店页截图"}},{"title":"文明 VI","creator":"Firaxis Games","year":2016,"img":{"src":"img/four-x-289070-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/289070/","note":"Steam 商店页截图"}},{"title":"文明 VI","creator":"Firaxis Games","year":2016,"img":{"src":"img/four-x-289070-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/289070/","note":"Steam 商店页截图"}},{"title":"群星","creator":"Paradox Development Studio","year":2016},{"title":"银河霸主","creator":"SimTex","year":1993}],"demo":"four-x","dg":null,"hint":"点虚线格向外扩张，每点一次就是一回合；下面可以调对手数和地图大小","related":["rts","tactics","management-sim"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"auto-battler","kind":"style","cat":"strategy","zh":"自走棋","en":"Auto Battler","aka":["Auto Chess","自动战斗"],"oneLine":"战斗你插不上手，能做的只有在商店里买棋子、排站位、凑三合一。乐趣全在开战前那几十秒的决策上。","era":{"from":2019,"to":null},"regions":["china","global"],"media":["pc","mobile"],"players":["solo","versus"],"makeLevel":"web","making":"分成商店阶段和战斗阶段两个状态；战斗是确定性的回合结算，前排对撞、后排技能触发。三合一用同名计数实现。","ask":"做一个自走棋小样：每轮 10 金币，商店刷出 3 个棋子（每个 3 金，刷新 1 金），队伍最多 5 个；买到同名棋子自动合成，攒够数量升星并加攻防。点开战后双方从前排开始自动对撞，弓手在后排也能放箭，蜂每回合攻击 +1。胜利进入下一轮，对手逐轮变强。卡片显示攻击和血量，战斗速度 1 倍可调。","keywordsZh":["商店刷新","三合一","站位","羁绊","经济","自动战斗"],"keywordsEn":["auto battler","shop roll","three-of-a-kind upgrade","positioning","synergy","economy"],"recognize":["每轮先逛商店买棋子，然后看它们自己打","三个一样的合成一个更强的","金币要在刷新、升级、存利息之间分配"],"form":{"loop":"买棋、排阵、观战、复盘","input":"点选购买、拖动站位","feedback":"升星光效、胜负结算","pace":"一轮几十秒，一局二三十分钟","mood":"算计、赌一把"},"works":[{"title":"Super Auto Pets","creator":"Team Wood Games","year":2021,"video":{"src":"vid/auto-battler.mp4","poster":"img/auto-battler-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1714040/"},"note":"官方预告片片段"},{"title":"Super Auto Pets","creator":"Team Wood Games","year":2021,"img":{"src":"img/auto-battler-1714040-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1714040/","note":"Steam 商店页截图"}},{"title":"Super Auto Pets","creator":"Team Wood Games","year":2021,"img":{"src":"img/auto-battler-1714040-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1714040/","note":"Steam 商店页截图"}},{"title":"Super Auto Pets","creator":"Team Wood Games","year":2021,"img":{"src":"img/auto-battler-1714040-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1714040/","note":"Steam 商店页截图"}},{"title":"刀塔自走棋","creator":"巨鸟多多工作室","year":2019},{"title":"云顶之弈","creator":"Riot Games","year":2019}],"demo":"auto-battler","dg":null,"hint":"点商店买棋子，点自己的棋子往前挪，点开战；可以关掉三合一对比","related":["deckbuilder","roguelike","rts"],"use":4,"status":"mainstream","usedIn":[],"ai":false},{"id":"tactics","kind":"style","cat":"strategy","zh":"回合制战棋","en":"Tactics","aka":["SRPG","战棋","回合制战术"],"oneLine":"在格子棋盘上一回合一回合地移动和出手。好的战棋会先告诉你敌人要打哪，让每一步都像在解一道小题。","era":{"from":1990,"to":null},"regions":["japan","north-america","global"],"media":["console","pc","mobile"],"players":["solo"],"makeLevel":"web","making":"网格加 BFS 求可移动范围，敌人在玩家回合前锁定攻击格并画出来；击退做成逐格推移，撞墙或撞单位各扣血。","ask":"做一个回合制战棋小样：6×6 格子，我方 2 个机甲各 3 血、移动力 3 格，场上有几栋要保护的建筑。敌人每回合开始前用箭头和高亮格显示下一步要打哪一格。我方点选单位、点格子移动、点相邻敌人攻击，攻击会把敌人击退 1 格，撞到墙或其他单位双方都扣血。所有单位行动完自动进入敌方回合。","keywordsZh":["网格","移动范围","敌方意图","击退","地形","回合"],"keywordsEn":["tactics","grid","telegraphed attacks","knockback","movement range","turn-based"],"recognize":["地图是格子，选中单位会亮出能走的范围","我方动完轮到敌方动，交替进行","位置比数值重要，推一下就能化解危机"],"form":{"loop":"看意图、走位、出手、承受","input":"点选单位和格子","feedback":"击退碰撞、威胁解除","pace":"回合制，想多久都行","mood":"冷静、精算"},"works":[{"title":"陷阵之志","creator":"Subset Games","year":2018,"video":{"src":"vid/tactics.mp4","poster":"img/tactics-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/590380/"},"note":"官方预告片片段"},{"title":"陷阵之志","creator":"Subset Games","year":2018,"img":{"src":"img/tactics-590380-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/590380/","note":"Steam 商店页截图"}},{"title":"陷阵之志","creator":"Subset Games","year":2018,"img":{"src":"img/tactics-590380-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/590380/","note":"Steam 商店页截图"}},{"title":"陷阵之志","creator":"Subset Games","year":2018,"img":{"src":"img/tactics-590380-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/590380/","note":"Steam 商店页截图"}},{"title":"火焰纹章：暗黑龙与光之剑","creator":"Intelligent Systems","year":1990},{"title":"幽浮 2","creator":"Firaxis Games","year":2016}],"demo":"tactics","dg":null,"hint":"点方块选中→点格子移动→点相邻敌人攻击；可以隐藏敌方意图对比","related":["four-x","sokoban","deckbuilder"],"use":3,"status":"classic","usedIn":[],"ai":false},{"id":"logic-puzzle","kind":"style","cat":"strategy","zh":"规则解谜","en":"Rule-Based Puzzle","aka":["规则改写解谜","元规则解谜"],"oneLine":"谜题不靠反应和运气，只靠理解规则；最好的那类会让你动手改规则本身，比如把“墙是停”推散，墙就不挡了。","era":{"from":2016,"to":null},"regions":["europe","north-america","global"],"media":["pc","console","mobile"],"players":["solo"],"makeLevel":"web","making":"关卡是网格上的物体，每次移动后重新扫描横竖三连的“名词 是 属性”文字块生成规则表；撤销靠每步存一份坐标快照。","ask":"做一个规则解谜小样：9×7 网格，场上有人、墙、旗和若干文字块，横着或竖着拼成“人 是 你”“墙 是 停”“旗 是 赢”的句子就生效。玩家控制“是你”的物体，可以推动文字块，推散“墙 是 停”后墙就能穿过，拼出新句子规则立刻改变。生效的字块反色高亮，移动有 120 毫秒补间，支持方向键、滑动和 Z 撤销，做两个关卡。","keywordsZh":["规则即物体","推文字","撤销","顿悟","网格","改写规则"],"keywordsEn":["rule puzzle","meta rules","push text blocks","undo","aha moment","grid"],"recognize":["规则就写在场景里，而且能被改","卡关时答案就在眼前，只是没想到","每关都很小，但解开后会想笑"],"form":{"loop":"观察、假设、试推、顿悟","input":"方向移动、撤销","feedback":"规则高亮、过关","pace":"自己掌握，可以一直想","mood":"安静、恍然大悟"},"works":[{"title":"Baba Is You","creator":"Hempuli","year":2019,"video":{"src":"vid/logic-puzzle.mp4","poster":"img/logic-puzzle-poster.webp","w":720,"h":486,"source":"https://store.steampowered.com/app/736260/"},"note":"官方预告片片段"},{"title":"Baba Is You","creator":"Hempuli","year":2019,"img":{"src":"img/logic-puzzle-736260-0.webp","w":850,"h":472,"source":"https://store.steampowered.com/app/736260/","note":"Steam 商店页截图"}},{"title":"Baba Is You","creator":"Hempuli","year":2019,"img":{"src":"img/logic-puzzle-736260-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/736260/","note":"Steam 商店页截图"}},{"title":"Baba Is You","creator":"Hempuli","year":2019,"img":{"src":"img/logic-puzzle-736260-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/736260/","note":"Steam 商店页截图"}},{"title":"见证者","creator":"Thekla, Inc.","year":2016},{"title":"史蒂芬的香肠卷","creator":"increpare games","year":2016}],"demo":"logic-puzzle","dg":null,"hint":"滑动或方向键移动，把字块推散或拼成新句子；可以锁住规则对比","related":["sokoban","tactics","falling-block"],"use":3,"status":"rising","usedIn":[],"ai":false},{"id":"falling-block","kind":"style","cat":"casual","zh":"方块堆叠","en":"Falling Block Puzzle","aka":["俄罗斯方块类","下落式消除"],"oneLine":"形状各异的方块一块块落进竖井，转一转、挪一挪，填满一行就消掉。越堆越高时手会越来越快。","era":{"from":1984,"to":null},"regions":["europe","japan","global"],"media":["arcade","console","pc","mobile","web"],"players":["solo","versus"],"makeLevel":"web","making":"10×20 二维数组存盘面，方块用四个坐标偏移加旋转表示；手感全在“7 个一袋”的出块、落地缓冲和硬降上。","ask":"做一个方块堆叠小游戏：10×20 的竖井，七种四格方块按“7 个一袋”随机出现，右侧显示接下来 3 块；每 600 毫秒下落一格，落地后有 500 毫秒缓冲可以继续挪动或旋转，旋转靠墙时自动左右踢开。显示半透明落点预览，填满一行闪一下再消除。支持方向键、空格硬降，手机上左右拖动移动、轻点旋转、下滑硬降。","keywordsZh":["消行","落点预览","硬降","出块袋","落地缓冲","旋转踢墙"],"keywordsEn":["falling block","line clear","ghost piece","hard drop","7-bag randomizer","lock delay"],"recognize":["七种四格方块从上面掉下来","填满一整行就消失","下落越来越快，最后堆到顶输掉"],"form":{"loop":"看下一块、找位置、落下、消行","input":"左右移动、旋转、硬降","feedback":"整行闪烁消失","pace":"逐渐加速","mood":"专注、心流"},"works":[{"title":"俄罗斯方块效应：连接","creator":"Monstars / Resonair","year":2021,"video":{"src":"vid/falling-block.mp4","poster":"img/falling-block-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1003590/"},"note":"官方预告片片段"},{"title":"俄罗斯方块效应：连接","creator":"Monstars / Resonair","year":2021,"img":{"src":"img/falling-block-1003590-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1003590/","note":"Steam 商店页截图"}},{"title":"俄罗斯方块效应：连接","creator":"Monstars / Resonair","year":2021,"img":{"src":"img/falling-block-1003590-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/1003590/","note":"Steam 商店页截图"}},{"title":"噗哟噗哟 俄罗斯方块","creator":"Sonic Team","year":2014,"img":{"src":"img/falling-block-546050-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/546050/","note":"Steam 商店页截图"}},{"title":"俄罗斯方块","creator":"阿列克谢·帕基特诺夫","year":1984}],"demo":"falling-block","dg":null,"hint":"左右拖动移动，轻点旋转，下滑硬降；下面可以调下落间隔和落地缓冲","related":["match-3","merge","logic-puzzle"],"use":4,"status":"classic","usedIn":[],"ai":false},{"id":"party-game","kind":"style","cat":"casual","zh":"派对游戏","en":"Party Game","aka":["聚会游戏","多人同乐"],"oneLine":"几个人围着一块屏幕，规则三秒学会，一局一两分钟。输赢不重要，重要的是有人抢跑、有人翻盘、大家一起笑。","era":{"from":1998,"to":null},"regions":["japan","north-america","global"],"media":["console","pc","mobile"],"players":["versus","coop","mass"],"makeLevel":"web","making":"核心是一堆极短的小游戏加统一的计分；随机等待防止预判，抢跑惩罚和落后加分让每个人都有戏。","ask":"做一个派对反应小游戏：四个人各占一个按钮（我是“你”，其余三个是电脑），中间一盏灯，随机等待 0.8 到 3.3 秒后亮起“拍！”，最先拍下的得 1 分，灯亮前拍算抢跑扣 1 分。开启追赶机制：分数最低且落后 2 分以上的人抢到时得 2 分。电脑反应时间约 320 毫秒并带随机，偶尔也会抢跑。先到 5 分获胜，每人下方显示反应毫秒数。","keywordsZh":["同屏多人","小游戏合集","抢答","追赶机制","手机当手柄","短局"],"keywordsEn":["party game","local multiplayer","minigames","rubber banding","couch co-op","phone as controller"],"recognize":["规则一句话就能讲完","一局很短，玩完马上下一局","落后的人也随时可能翻盘"],"form":{"loop":"学规则、比拼、计分、换小游戏","input":"一个键或一次点击","feedback":"夸张的胜负演出","pace":"极短局，连续轮换","mood":"热闹、吵闹、好笑"},"works":[{"title":"胡闹厨房 2","creator":"Ghost Town Games","year":2018,"video":{"src":"vid/party-game.mp4","poster":"img/party-game-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/728880/"},"note":"官方预告片片段"},{"title":"胡闹厨房 2","creator":"Ghost Town Games","year":2018,"img":{"src":"img/party-game-728880-0.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/728880/","note":"Steam 商店页截图"}},{"title":"胡闹厨房 2","creator":"Ghost Town Games","year":2018,"img":{"src":"img/party-game-728880-1.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/728880/","note":"Steam 商店页截图"}},{"title":"Jackbox 派对游戏包","creator":"Jackbox Games","year":2014,"img":{"src":"img/party-game-331670-2.webp","w":1280,"h":720,"source":"https://store.steampowered.com/app/331670/","note":"Steam 商店页截图"}},{"title":"马力欧派对","creator":"Hudson Soft","year":1998}],"demo":"party-game","dg":null,"hint":"灯亮的瞬间点画面，亮之前点算抢跑；可以关掉追赶机制对比","related":["rhythm","murder-mystery","async-pvp"],"use":3,"status":"mainstream","usedIn":[],"ai":false},{"id":"survivors-like","kind":"style","cat":"action","zh":"幸存者类","en":"Survivors-like","aka":["类吸血鬼幸存者","割草肉鸽","Bullet Heaven"],"oneLine":"你只负责走位，武器自己开火；怪从四面八方涌来，捡经验升级三选一，二十分钟后满屏都是你的弹幕。","era":{"from":2021,"to":null},"regions":["europe","china","global"],"media":["pc","mobile","console"],"players":["solo","coop"],"makeLevel":"web","making":"怪物只做“朝玩家走”的最简 AI，刷在屏幕外的一圈；武器按冷却自动索敌。数量上去后要用空间网格或采样做碰撞和分离。","ask":"做一个幸存者类小样：玩家在无限平面上移动（手机按住拖动、电脑也可用鼠标），武器每 0.55 秒自动朝最近的怪开火；怪在屏幕外一圈刷出，每秒 4 只并随时间加快，同屏最多 160 只，碰到玩家扣血。怪死掉掉经验宝石，靠近自动吸附，攒够 8 颗升级，弹出三选一：环绕刃、射速、弹数、震荡波、拾取范围。顶部显示经验条、存活时间和击杀数。","keywordsZh":["自动攻击","割草","三选一升级","经验宝石","构筑","无尽波次"],"keywordsEn":["survivors-like","auto attack","horde","level-up choice","XP gems","bullet heaven"],"recognize":["只能控制移动，攻击是自动的","屏幕上的怪越来越多，最后密密麻麻","每次升级从三个技能里挑一个"],"form":{"loop":"走位、捡经验、升级选技能","input":"只控制移动","feedback":"满屏怪物成片倒下","pace":"由慢到爆，一局 15–30 分钟","mood":"爽快、解压"},"works":[{"title":"吸血鬼幸存者","creator":"poncle","year":2022,"video":{"src":"vid/survivors-like.mp4","poster":"img/survivors-like-poster.webp","w":720,"h":406,"source":"https://store.steampowered.com/app/1794680/"},"note":"官方预告片片段"},{"title":"吸血鬼幸存者","creator":"poncle","year":2022,"img":{"src":"img/survivors-like-1794680-0.webp","w":1152,"h":720,"source":"https://store.steampowered.com/app/1794680/","note":"Steam 商店页截图"}},{"title":"吸血鬼幸存者","creator":"poncle","year":2022,"img":{"src":"img/survivors-like-1794680-1.webp","w":1152,"h":720,"source":"https://store.steampowered.com/app/1794680/","note":"Steam 商店页截图"}},{"title":"吸血鬼幸存者","creator":"poncle","year":2022,"img":{"src":"img/survivors-like-1794680-2.webp","w":1152,"h":720,"source":"https://store.steampowered.com/app/1794680/","note":"Steam 商店页截图"}},{"title":"土豆兄弟","creator":"Blobfish","year":2023}],"demo":"survivors-like","dg":null,"hint":"按住拖动走位，武器会自己打；下面可以调刷怪速度和同屏上限","related":["roguelike","bullet-hell","idle"],"use":4,"status":"rising","usedIn":[],"ai":false},{"id":"llm-npc","kind":"technique","cat":"ai","zh":"大模型驱动的 NPC","en":"LLM-driven NPC","aka":["AI NPC","生成式 NPC"],"oneLine":"NPC 的台词不再写死，由大模型按人设和当前局面现场生成。玩家可以问任何问题，难点是让它不出戏、不乱说、回得够快。","era":{"from":2023,"to":null},"regions":["global"],"media":["pc","web","mobile"],"players":["solo"],"makeLevel":"web","making":"系统提示词里写人设、知识边界和禁止事项，代码只把最近 N 轮对话和相关世界状态拼进去；回复流式输出，再用一层过滤拦下“我是 AI”这类破戏回答。","ask":"做一个能聊天的旅店老板 NPC：系统提示词写死她的身份、说话风格和不知道的事（比如现代科技），对话上下文只保留最近 6 轮，温度 0.3 左右；回复流式逐字显示，首字出来前显示三个跳动的点，目标首字延迟 600 毫秒以内。加一层检查：回复里出现“AI”“模型”“作为一个”就重新生成。手机上输入框贴底，键盘弹出时对话区跟着上移。","keywordsZh":["人设提示词","上下文窗口","破戏","流式输出","首字延迟","温度"],"keywordsEn":["LLM NPC","system prompt","persona","context window","streaming","jailbreak"],"recognize":["对 NPC 可以打字或说任何话","同一个问题问两次，回答措辞不一样","追问太久它会忘了前面说过的事"],"form":{},"works":[{"title":"Suck Up!","creator":"Proxima","year":2023},{"title":"千夜之书 1001 Nights","creator":"Ada Eden","year":2023},{"title":"Inworld Origins","creator":"Inworld AI","year":2023}],"demo":"llm-npc","dg":null,"hint":"点下面的问题跟老板聊；调高跑偏程度，或关掉人设约束看看","related":["npc-memory","voice-npc","ai-companion","ai-gm"],"use":4,"status":"rising","usedIn":[],"ai":true},{"id":"ai-text-adventure","kind":"style","cat":"ai","zh":"AI 文字冒险","en":"AI Text Adventure","aka":["AI 地牢","生成式文字冒险"],"oneLine":"老式文字冒险的输入框，后面换成了大模型：输入什么它都能接着写。自由度换来的代价是剧情容易散、设定容易自相矛盾。","era":{"from":2019,"to":null},"regions":["north-america","global"],"media":["web","mobile","pc"],"players":["solo","coop"],"makeLevel":"web","making":"模型只负责写叙述，生命、背包、位置放在代码里的状态表，每轮把状态表和前情摘要一起塞进提示词；模型想改状态必须输出约定格式的指令，由代码执行。","ask":"做一个 AI 文字冒险原型：左边是叙述区和输入框，右边是代码维护的状态栏（5 格生命、背包、当前位置）。每轮把状态 JSON、最近 4 段叙述和前情摘要发给模型，要求它返回叙述（约 45 字）和一个状态变更数组，代码校验后再改状态，模型提到背包里没有的东西就打回重写。温度 0.4，每 8 轮让模型把旧剧情压成一段摘要。手机上状态栏折叠成顶部一行。","keywordsZh":["自由输入","状态表","前情摘要","幻觉","温度","长线一致性"],"keywordsEn":["AI dungeon","interactive fiction","state tracking","summarization","hallucination","parser"],"recognize":["输入框里可以写任何动作","每次回应都是一段新写的文字","玩久了会发现它忘了你包里有什么"],"form":{"loop":"输入行动、读叙述、看状态变化","input":"自由文本","feedback":"新写出的段落和状态栏变化","pace":"随玩家，回合制","mood":"自由、荒诞、偶尔失控"},"works":[{"title":"AI Dungeon","creator":"Latitude","year":2019},{"title":"NovelAI","creator":"Anlatan","year":2021},{"title":"AI Roguelite","creator":"Max Loh","year":2023}],"demo":"ai-text-adventure","dg":null,"hint":"点画面推进；关掉“状态归代码”，看模型怎么编出你没有的东西","related":["ai-gm","co-writing","npc-memory","branching"],"use":4,"status":"rising","usedIn":[],"ai":true},{"id":"infinite-craft","kind":"style","cat":"ai","zh":"无限合成","en":"Infinite Crafting","aka":["元素合成","AI 合成"],"oneLine":"从水火土风四个元素开始，任意两样拖到一起就合出新东西。老式合成游戏的配方是写死的，AI 版本的配方表没有尽头。","era":{"from":2010,"to":null},"regions":["global"],"media":["web","mobile"],"players":["solo","mass"],"makeLevel":"web","making":"合成请求先查全局缓存（两个名字排序后做键），没有才调模型，结果写回缓存，这样同一对组合全服一致，调用量也会随时间下降；模型输出限定成一个名词加一个 emoji。","ask":"做一个无限合成网页：画布上有水、火、土、风四个卡片，拖一张卡到另一张上就合成，右侧列出已发现的东西，点一下放回画布。合成时先查缓存（键是两个名字排序后拼接），命中就立即出结果并标“缓存”，没命中就显示“生成中”，调模型（温度 0.35，只返回一个中文名词），生成延迟控制在 800 毫秒左右，然后写入缓存。首次发现的东西用反色高亮 1.5 秒。拖拽用 pointer 事件，手机能用手指拖。","keywordsZh":["元素合成","拖拽合并","全局缓存","首次发现","配方表","联想"],"keywordsEn":["infinite craft","alchemy game","element combining","recipe cache","first discovery","drag and drop"],"recognize":["开局只有几个基础元素","两两拖在一起合出新名词","有人会炫耀自己是“首次发现”"],"form":{"loop":"拖两样、合出新东西、再拿新东西去合","input":"拖拽","feedback":"新卡片和首次发现提示","pace":"随意，无压力","mood":"好奇、上瘾、常被逗笑"},"works":[{"title":"小小炼金术 Little Alchemy","creator":"Jakub Koziół","year":2010},{"title":"涂鸦上帝 Doodle God","creator":"JoyBits","year":2010},{"title":"Infinite Craft","creator":"Neal Agarwal","year":2024}],"demo":"infinite-craft","dg":null,"hint":"把一张卡拖到另一张上；关掉缓存，看调用次数怎么涨","related":["merge","falling-sand","ai-judge"],"use":4,"status":"rising","usedIn":[],"ai":true},{"id":"ai-director","kind":"technique","cat":"ai","zh":"AI 导演","en":"AI Director","aka":["导演系统","动态节奏控制"],"oneLine":"系统盯着玩家的紧张度，按“蓄力、高潮、喘息”的节奏决定什么时候刷怪、刷多少。求生之路把它做成了招牌，现在开始有人用大模型当导演。","era":{"from":2008,"to":null},"regions":["north-america","global"],"media":["pc","console"],"players":["solo","coop"],"makeLevel":"engine","making":"给每个玩家算一个紧张度（受伤、近身敌人、击杀都会推高它，没事时缓慢回落），导演是一个状态机：低于阈值时按密度刷怪，到阈值进入高潮，然后强制喘息一段时间再重来。大模型版本是把状态摘要交给模型，让它挑下一个事件。","ask":"给一个横版射击小游戏加 AI 导演：维护一个 0–100 的紧张度，敌人靠近、玩家受伤会推高它，周围没有威胁时每秒回落 4 点。导演三个阶段：蓄力期按每秒 2 只刷怪，紧张度到 70% 进入高潮（刷怪加倍 3 秒），然后进入喘息期停刷至少 8 秒，等紧张度降到阈值的三分之一再回到蓄力。画面下方画一条紧张度曲线，阈值用虚线，喘息段用浅色底标出。","keywordsZh":["紧张度","节奏曲线","刷怪","喘息期","动态难度","状态机"],"keywordsEn":["AI director","intensity","pacing","spawn director","dynamic difficulty","relax phase"],"recognize":["每局遇到的尸潮时机不一样","一波猛攻之后总会有一段安静","打得越惨，敌人反而稍微收着点"],"form":{},"works":[{"title":"求生之路","creator":"Turtle Rock Studios / Valve","year":2008},{"title":"异形：隔离","creator":"Creative Assembly","year":2014},{"title":"喋血复仇 Back 4 Blood","creator":"Turtle Rock Studios","year":2021}],"demo":"ai-director","dg":null,"hint":"点画面清怪；切到“固定刷怪”对比曲线","related":["flow-curve","ai-gm","roguelike"],"use":4,"status":"mainstream","usedIn":["game"],"ai":true},{"id":"generative-agents","kind":"style","cat":"ai","zh":"AI 小镇","en":"Generative Agents","aka":["多智能体社会","智能体模拟"],"oneLine":"一群由大模型驱动的居民各自有日程、记忆和关系，彼此聊天、传话、约事情。玩家看到的是一个自己会长出故事的小社会。","era":{"from":2023,"to":null},"regions":["north-america","global"],"media":["web","pc"],"players":["solo","mass"],"makeLevel":"web","making":"每个智能体一条记忆流，加上定期“反思”把零碎记忆总结成看法，再按看法规划日程；相遇时用一次模型调用决定聊不聊、聊什么。最大的问题是成本，居民数和时间流速一上去调用量是成倍涨的。","ask":"做一个 AI 小镇俯视图：8 个居民在咖啡馆、公园、学校等地点间按日程走动，时间默认 4 倍速。两人距离小于 26 像素时按 50% 的概率聊天，聊天内容决定是否传递一条消息（比如“周五咖啡馆有派对”），听到的人写入自己的记忆流。右侧显示时钟、知道这条消息的人数曲线，以及选中居民最近 4 条记忆。点居民可以切换查看。先用预设台词，接口留好以后换成模型调用。","keywordsZh":["记忆流","反思","日程规划","信息传播","涌现","调用成本"],"keywordsEn":["generative agents","multi-agent simulation","memory stream","reflection","emergent behavior","Smallville"],"recognize":["一群小人各自忙自己的事","两个人碰面会停下来说话","一条消息会在镇上慢慢传开"],"form":{"loop":"观察、介入一个变量、看社会怎么反应","input":"点选、偶尔下指令","feedback":"居民的对话和行为变化","pace":"慢，可加速","mood":"窥视、意外、像养蚂蚁"},"works":[{"title":"Generative Agents（斯坦福 AI 小镇论文）","creator":"Joon Sung Park 等，斯坦福大学与 Google","year":2023},{"title":"Project Sid","creator":"Altera","year":2024},{"title":"inZOI","creator":"inZOI Studio","year":2025}],"demo":"generative-agents","dg":null,"hint":"点一个居民看他的记忆；关掉记忆流，看消息还传不传得开","related":["npc-memory","llm-npc","management-sim"],"use":3,"status":"rising","usedIn":[],"ai":true},{"id":"voice-npc","kind":"technique","cat":"ai","zh":"语音对话角色","en":"Voice-chat NPC","aka":["语音 NPC","实时语音角色"],"oneLine":"对着麦克风跟角色说话，它用声音回答。语音识别、大模型、语音合成三段串起来，体验好坏几乎全看说完到听见回答之间那一两秒。","era":{"from":2023,"to":null},"regions":["global"],"media":["pc","mobile","xr"],"players":["solo"],"makeLevel":"web","making":"三段全部流式：识别边听边出字，模型吐出第一句就送去合成，合成首包一到就播放；等待超过一秒时先播一句预录的垫话（“嗯……”）。能用端到端语音模型就省掉中间两次转换。","ask":"做一个能语音对话的角色：按住按钮说话，松开后走 语音识别 → 大模型 → 语音合成 三段，全部流式衔接，模型输出到第一个句号就开始合成。目标延迟：识别 300 毫秒、模型首字 500 毫秒、合成首包 250 毫秒，合计一秒出头。预计等待超过 0.9 秒时先播一句“嗯，让我想想”。界面上画玩家和角色两条声波，再画三段管线的时间条，显示这次说完到听见回答用了几秒。","keywordsZh":["语音识别","语音合成","流式管线","端到端延迟","垫话","打断"],"keywordsEn":["voice NPC","speech-to-text","text-to-speech","latency","streaming pipeline","barge-in"],"recognize":["可以直接对角色说话","角色开口前总有一小段停顿","说到一半插话，它会停下来听"],"form":{},"works":[{"title":"Mantella（上古卷轴 5 模组）","creator":"Art from the Machine","year":2023},{"title":"Covert Protocol","creator":"NVIDIA 与 Inworld AI","year":2024},{"title":"Whispers from the Star","creator":"Anuttacon","year":2025}],"demo":"voice-npc","dg":null,"hint":"按住画面模拟说话；把流式管线切成串行，看延迟变成多少","related":["llm-npc","ai-companion","chat-ui"],"use":3,"status":"rising","usedIn":["game","web"],"ai":true},{"id":"ai-judge","kind":"technique","cat":"ai","zh":"AI 评判自由回答","en":"AI Judge","aka":["AI 裁判","AI 判官"],"oneLine":"玩家不再选 ABC，而是随便写一句话，AI 判断这招行不行、给几分、讲个理由。派对游戏里特别好用，前提是判得够稳、理由够好笑。","era":{"from":2018,"to":null},"regions":["global"],"media":["web","mobile","pc"],"players":["versus","mass"],"makeLevel":"web","making":"提示词里写清评分细则（可行性、创意、是否扣题各占多少分），要求模型先输出分数再输出一句理由，用 JSON 返回；温度压低，同一答案缓存结果，防止重判时一会儿活一会儿死。","ask":"做一个“AI 判生死”的派对小游戏：屏幕给出一个险境（比如潜艇下沉），每个玩家写一句自救办法，提交后逐个揭晓。让模型按评分细则打 0–100 分并附一句冷幽默的理由，50 分以上算活下来。温度 0.2，同一句话命中缓存直接复用分数。每条结果显示分数条、存活线、活/死标签和理由，最后统计几人存活。手机竖屏下每条结果占一行。","keywordsZh":["自由回答","评分细则","判定一致性","派对游戏","说服","幽默理由"],"keywordsEn":["AI judge","free-text answer","rubric","LLM grading","party game","persuasion"],"recognize":["回答是自己打字写的","AI 给分数还附上一句点评","大家会去试各种奇怪的答案看它怎么判"],"form":{},"works":[{"title":"Semantris","creator":"Google Research","year":2018},{"title":"Suck Up!","creator":"Proxima","year":2023},{"title":"Death by AI","creator":"Playroom","year":2024}],"demo":"ai-judge","dg":null,"hint":"点画面让评委重判一次；关掉评分细则，看同一句话分数怎么乱跳","related":["draw-for-ai","human-or-ai","murder-mystery"],"use":4,"status":"rising","usedIn":["game","web"],"ai":true},{"id":"draw-for-ai","kind":"style","cat":"ai","zh":"画给 AI 猜","en":"Draw for AI","aka":["AI 你画我猜"],"oneLine":"你画，AI 猜，限时内它喊出正确答案就算过。好玩的地方在于看它每多一笔就改一次主意，以及它会被什么样的画骗住。","era":{"from":2016,"to":null},"regions":["global"],"media":["web","mobile"],"players":["solo","versus"],"makeLevel":"web","making":"每画完一笔就把笔画序列（或缩成 28×28 的位图）送去分类模型，拿回前几名和置信度；最高项超过门槛就喊答案。用多模态大模型也行，但要节流，否则每一笔一次调用太贵太慢。","ask":"做一个“画给 AI 猜”的网页：左边正方形画板，限时 20 秒；每画完一笔把笔画坐标发给识别接口，右边显示前 3 个候选和置信度条，第一名超过 70% 时 AI 大声喊出“我知道了，是 xx！”，进入下一题。画板下方有倒计时细条。先用预设题目和假识别结果把交互跑通。画板用 pointer 事件，手机上禁止页面滚动。","keywordsZh":["涂鸦识别","置信度","边画边猜","限时","候选列表","笔画序列"],"keywordsEn":["Quick Draw","sketch recognition","doodle classifier","confidence","top-k","stroke data"],"recognize":["一边画 AI 一边念叨它的猜测","画到一半它就喊出了答案","画得很像它却死活猜不出来"],"form":{"loop":"看题、画、等 AI 喊答案","input":"手指或鼠标涂鸦","feedback":"不断刷新的猜测和置信度","pace":"每题 20 秒左右，很快","mood":"急、好笑"},"works":[{"title":"猜画小歌 / Quick, Draw!","creator":"Google Creative Lab","year":2016},{"title":"AutoDraw","creator":"Google Creative Lab","year":2017}],"demo":"draw-for-ai","dg":null,"hint":"在左边画板上画；调高喊答门槛，AI 会更谨慎","related":["ai-judge","human-or-ai","infinite-craft"],"use":3,"status":"mainstream","usedIn":["web","game"],"ai":true},{"id":"human-or-ai","kind":"style","cat":"ai","zh":"人机辨别","en":"Human or AI","aka":["图灵测试游戏","找出真人"],"oneLine":"和对面聊上两分钟，猜它是人还是 AI。双方都会伪装：AI 学人打错字、装忙，人反而故意说得很工整，所以没你想的那么好猜。","era":{"from":2014,"to":null},"regions":["global"],"media":["web","pc","mobile"],"players":["versus","mass"],"makeLevel":"web","making":"匹配时按设定比例分给玩家真人或 AI；AI 一侧的提示词要求口语化、偶尔错字、不用列表，回复前人为加上和字数成比例的延迟，否则秒回会立刻暴露。","ask":"做一个人机辨别聊天游戏：每局 120 秒，对面 50% 概率是 AI。AI 的回复要像人：短句、偶尔打错字、不用标点列表，按字数加 1.5 秒左右的输入延迟并显示“对方正在输入…”。玩家随时可以点“是人”或“是 AI”，揭晓结果并累计正确率。界面顶部显示倒计时，聊天区占满中间，两个判断按钮贴底，手机上按钮足够大。","keywordsZh":["图灵测试","伪装","输入延迟","匹配","正确率","社交推理"],"keywordsEn":["Turing test game","human or not","bot detection","social deduction","typing delay","persona"],"recognize":["聊天开始前不知道对面是谁","限时结束要投一票：人还是 AI","大家会用奇怪的问题去试探"],"form":{"loop":"聊天、试探、下判断、看揭晓","input":"打字、二选一","feedback":"揭晓结果和正确率","pace":"两分钟一局","mood":"警惕、多疑、被骗时很好笑"},"works":[{"title":"Hidden in Plain Sight","creator":"Adam Spragg","year":2014},{"title":"SpyParty","creator":"Chris Hecker","year":2018},{"title":"Human or Not?","creator":"AI21 Labs","year":2023}],"demo":"human-or-ai","dg":null,"hint":"看完对话点“是人”或“是 AI”；关掉 AI 伪装，再猜猜看","related":["ai-judge","murder-mystery","chat-ui"],"use":3,"status":"rising","usedIn":["game","web"],"ai":true},{"id":"npc-memory","kind":"technique","cat":"ai","zh":"角色记忆","en":"NPC Memory","aka":["记忆流","长期记忆"],"oneLine":"角色记得你做过什么：你救过谁、欠过谁的钱。大模型的上下文装不下所有往事，所以要决定每次想起哪几件，这是 AI 角色最核心的工程问题。","era":{"from":2014,"to":null},"regions":["global"],"media":["pc","console","web","mobile"],"players":["solo"],"makeLevel":"web","making":"每个事件存成一条记忆，带时间、重要度（让模型打 1–10 分）和向量；提问时按 相关度 + 重要度 + 新近度 加权打分，取前 K 条塞进提示词。重要的旧事靠重要度权重留住，琐事靠时间衰减自然淡出。","ask":"给 NPC 做一个记忆系统：每件事存一条记录（内容、时间、重要度 1–10）。玩家提问时给每条记忆打分：相关度 + 重要度 × 0.6 + 新近度（每过一条事件衰减 15%），取得分最高的 3 条拼进提示词。界面左边列出全部记忆和实时分数，被选中的那几条反色高亮；右边是对话。加一个开关切到“只看最近 3 条”做对比，让人看清老的大事是怎么被挤掉的。","keywordsZh":["记忆流","检索","重要度","时间衰减","向量搜索","上下文预算"],"keywordsEn":["NPC memory","memory stream","retrieval","importance score","recency decay","RAG"],"recognize":["很久以前做的事，角色还会提起","角色对你的态度跟着过往经历变","琐碎的小事它会慢慢忘掉"],"form":{},"works":[{"title":"中土世界：暗影魔多（宿敌系统）","creator":"Monolith Productions","year":2014},{"title":"Generative Agents（斯坦福 AI 小镇论文）","creator":"Joon Sung Park 等，斯坦福大学与 Google","year":2023},{"title":"Suck Up!","creator":"Proxima","year":2023}],"demo":"npc-memory","dg":null,"hint":"点画面向铁匠提问；切到“只看最近”，看他还记不记得你救过他女儿","related":["llm-npc","generative-agents","ai-companion"],"use":4,"status":"rising","usedIn":["game"],"ai":true},{"id":"co-writing","kind":"technique","cat":"ai","zh":"人机接龙写故事","en":"AI Co-writing","aka":["故事接龙","AI 共创"],"oneLine":"你写一句，AI 接一句，一起把故事往下推。决定好不好玩的是 AI 的态度：一味顺着你会很无聊，偶尔使个绊子才有来回。","era":{"from":2019,"to":null},"regions":["global"],"media":["web","mobile","pc"],"players":["solo","coop"],"makeLevel":"web","making":"提示词里给 AI 一个明确的角色（顺写、制造转折、只给选项），限制每次续写的句数，避免它一口气把故事写完；温度控制意外程度，把玩家的句子和 AI 的句子分开标记，方便回退和重写。","ask":"做一个人机接龙写故事的页面：玩家写一句，AI 接一句，AI 的任务是“使绊子”：每次续写 1 句，要给剧情加一个合理的转折，不能替玩家做决定，也不能写结局。温度 0.4。玩家的句子左侧加黑色竖线，AI 的句子颜色浅一点；每句后面有“重写”按钮。再加一个“给选项”模式：AI 不写正文，只给 3 个走向让玩家挑。手机上输入框贴底。","keywordsZh":["故事接龙","续写","转折","共创","选项模式","重写"],"keywordsEn":["AI co-writing","collaborative fiction","story continuation","plot twist","writing partner","regenerate"],"recognize":["你和 AI 轮流写","AI 写的那句常常让故事拐个弯","不满意可以让它重写一次"],"form":{},"works":[{"title":"AI Dungeon","creator":"Latitude","year":2019},{"title":"NovelAI","creator":"Anlatan","year":2021},{"title":"千夜之书 1001 Nights","creator":"Ada Eden","year":2023}],"demo":"co-writing","dg":null,"hint":"点画面推进接龙；换个 AI 态度试试","related":["ai-text-adventure","branching","visual-novel"],"use":3,"status":"rising","usedIn":["web","game"],"ai":true},{"id":"generative-level","kind":"technique","cat":"ai","zh":"AI 生成关卡","en":"AI Level Generation","aka":["生成式世界","提示词生成地图"],"oneLine":"用一句话描述想要的地图，模型吐出一张关卡。好看不难，难的是保证能玩：出口走得到、宝箱拿得到，所以生成之后必须用代码校验。","era":{"from":2023,"to":null},"regions":["global"],"media":["pc","web"],"players":["solo"],"makeLevel":"web","making":"让模型输出字符网格或结构化 JSON（房间、走廊、物件坐标），代码用 BFS 检查入口到出口、到每个宝箱是否连通，不通就挖一条走廊补上或者打回重生成；风格交给模型，可玩性交给算法。","ask":"做一个 AI 生成关卡的原型：输入一句描述（比如“被水淹了一半的地牢”），生成一张 16 × 12 的格子地图，墙体密度约 35%，随机度 0.45。生成完用 BFS 从入口找到出口的最短路径并画出来；如果走不通，自动挖开最少的墙并用虚线框标出被修补的格子。地图逐格出现像在打印，底部显示路径长度和“可玩/废图”统计。先用程序化噪声模拟模型输出。","keywordsZh":["程序化生成","提示词生成","可达性校验","寻路","修补","字符地图"],"keywordsEn":["PCG","LLM level generation","text-to-level","reachability","BFS","repair"],"recognize":["用一句话就能换一张新地图","每次生成的布局都不一样","偶尔会刷出一张明显走不通的图"],"form":{},"works":[{"title":"MarioGPT","creator":"Shyam Sudhakaran 等，哥本哈根信息技术大学","year":2023},{"title":"AI Roguelite","creator":"Max Loh","year":2023},{"title":"Oasis","creator":"Decart 与 Etched","year":2024}],"demo":"generative-level","dg":null,"hint":"点画面重新生成；关掉可达性校验，看会不会刷出废图","related":["roguelike","ai-text-adventure","ai-director"],"use":3,"status":"rising","usedIn":["game"],"ai":true}],"makers":[{"id":"miyamoto","zh":"宫本茂","en":"Shigeru Miyamoto","years":"1952 年生","roles":["游戏设计师","任天堂"],"signature":"把“操作本身好玩”放在第一位，用第一关不着痕迹地教会玩家。","keyWorks":[{"title":"超级马力欧兄弟","year":"1985"},{"title":"塞尔达传说","year":"1986"}],"entries":["platformer","flow-curve"],"link":"https://en.wikipedia.org/wiki/Shigeru_Miyamoto"},{"id":"miyazaki","zh":"宫崎英高","en":"Hidetaka Miyazaki","years":"1974 年生","roles":["游戏总监","FromSoftware"],"signature":"高难度、碎片化的环境叙事和互相连通的世界，定义了魂类。","keyWorks":[{"title":"恶魔之魂","year":"2009"},{"title":"黑暗之魂","year":"2011"},{"title":"艾尔登法环","year":"2022"}],"entries":["soulslike","metroidvania"],"link":"https://en.wikipedia.org/wiki/Hidetaka_Miyazaki"},{"id":"supergiant","zh":"Supergiant Games","en":"Supergiant Games","years":"2009 年成立","roles":["独立工作室"],"signature":"手绘美术、原创配乐和打击感都极其讲究，把 Roguelike 和叙事结合起来。","keyWorks":[{"title":"堡垒","year":"2011"},{"title":"哈迪斯","year":"2020"}],"entries":["roguelike","hit-stop"],"link":"https://www.supergiantgames.com"},{"id":"inkle","zh":"inkle","en":"inkle","years":"2011 年成立","roles":["独立工作室","叙事工具 Ink 的作者"],"signature":"文字驱动的互动叙事，开源了写分支剧情的脚本语言 Ink。","keyWorks":[{"title":"80 天","year":"2014"},{"title":"Heaven's Vault","year":"2019"}],"entries":["branching","visual-novel"],"link":"https://www.inklestudios.com"},{"id":"concernedape","zh":"Eric Barone","en":"ConcernedApe","years":"1987 年生","roles":["独立开发者"],"signature":"一个人做完美术、程序、音乐和剧本，把农场经营做成了温柔的生活。","keyWorks":[{"title":"星露谷物语","year":"2016"}],"entries":["management-sim"],"link":"https://en.wikipedia.org/wiki/Stardew_Valley"},{"id":"gygax","zh":"加里·吉盖克斯","en":"Gary Gygax","years":"1938–2008","roles":["桌游设计师"],"signature":"和 Dave Arneson 一起创造了《龙与地下城》，奠定了跑团的基本形式。","keyWorks":[{"title":"龙与地下城","year":"1974"}],"entries":["trpg"],"link":"https://en.wikipedia.org/wiki/Gary_Gygax"},{"id":"teamlab","zh":"teamLab","en":"teamLab","years":"2001 年成立","roles":["艺术团体"],"signature":"用投影和传感器把整个空间变成会回应人的数字作品。","keyWorks":[{"title":"teamLab 无界美术馆","year":"2018"}],"entries":["installation"],"link":"https://www.teamlab.art"},{"id":"mcmillen","zh":"Edmund McMillen","en":"Edmund McMillen","years":"1980 年生","roles":["独立开发者"],"signature":"用怪诞的美术和极高的随机组合深度，把 Roguelike 带回大众视野。","keyWorks":[{"title":"超级食肉男孩","year":"2010"},{"title":"以撒的结合","year":"2011"}],"entries":["roguelike","platformer"],"link":"https://en.wikipedia.org/wiki/Edmund_McMillen"}],"compare":[{"id":"metroid-souls","title":"类银河恶魔城和魂类","oneLine":"都有连通的地图和让人反复死亡的敌人，但重心不一样。","tip":"类银河恶魔城的核心是用能力打开地图，魂类的核心是在高风险的战斗里学习。","ids":["metroidvania","soulslike"],"order":1,"points":[{"aspect":"核心乐趣","items":{"metroidvania":"拿到新能力，回头打开以前过不去的路","soulslike":"反复挑战强敌，靠学习招式突破"}},{"aspect":"死亡的代价","items":{"metroidvania":"通常较轻，回存档点","soulslike":"掉落资源，要回去捡"}},{"aspect":"视角","items":{"metroidvania":"多为横版二维","soulslike":"多为第三人称三维"}}]},{"id":"trpg-murder","title":"跑团和剧本杀","oneLine":"都是一群人围坐着扮演角色，但一个在共创，一个在解谜。","tip":"跑团的故事是现场一起编出来的；剧本杀的故事早就写好，大家要把它拼出来。","ids":["trpg","murder-mystery"],"order":2,"points":[{"aspect":"故事","items":{"trpg":"主持人和玩家即兴共创","murder-mystery":"剧本提前写好"}},{"aspect":"玩家关系","items":{"trpg":"通常是合作的队友","murder-mystery":"各怀秘密，有人是凶手"}},{"aspect":"一次玩多久","items":{"trpg":"可以连续很多次","murder-mystery":"一个本一场结束"}}]},{"id":"vn-walk","title":"视觉小说和步行模拟","oneLine":"都以叙事为主、很少有失败，但讲故事的方式相反。","tip":"视觉小说用文字直接讲给你听，步行模拟让你从环境里自己找出来。","ids":["visual-novel","walking-sim"],"order":3,"points":[{"aspect":"故事怎么传递","items":{"visual-novel":"对话框里的文字","walking-sim":"环境里的物件和旁白"}},{"aspect":"玩家的选择","items":{"visual-novel":"常有明确的选项和分支","walking-sim":"多为线性，选择在于看什么"}},{"aspect":"画面","items":{"visual-novel":"背景加立绘","walking-sim":"可自由走动的三维空间"}}]}],"resources":[{"name":"Game UI Database","url":"https://www.gameuidatabase.com","kind":"reference","free":"free","desc":"按界面类型检索上千款游戏的截图，看别人的菜单、背包和对话框怎么做。"},{"name":"itch.io","url":"https://itch.io","kind":"reference","free":"free","desc":"独立游戏和实验作品最多的地方，大量可以直接在浏览器里玩的小游戏。"},{"name":"Awwwards","url":"https://www.awwwards.com","kind":"reference","free":"free","desc":"互动网站的评选，找滚动叙事、三维网页和微交互的参考。"},{"name":"Codrops","url":"https://tympanus.net/codrops/","kind":"reference","free":"free","desc":"网页交互效果的教程和示例，几乎每篇都附可运行的代码。"},{"name":"The Pudding","url":"https://pudding.cool","kind":"reference","free":"free","desc":"以滚动叙事和互动图表讲故事的视觉长文。"},{"name":"BoardGameGeek","url":"https://boardgamegeek.com","kind":"vocabulary","free":"free","desc":"桌游数据库，按机制分类，是查桌游玩法术语最全的地方。"},{"name":"IFDB","nameZh":"互动小说数据库","url":"https://ifdb.org","kind":"vocabulary","free":"free","desc":"互动小说和文字冒险的作品库与评价。"},{"name":"GDC Vault","url":"https://gdcvault.com","kind":"learn","free":"freemium","desc":"游戏开发者大会的演讲录像，很多关于手感、关卡和系统设计的经典分享。"},{"name":"Game Maker's Toolkit","url":"https://www.youtube.com/@GMTK","kind":"learn","free":"free","desc":"讲游戏设计的视频频道，把一个个机制拆开讲清楚。"},{"name":"Twine","url":"https://twinery.org","kind":"opensource","free":"free","desc":"写分支故事的开源工具，导出一个网页文件就能分享。"},{"name":"Ink","url":"https://www.inklestudios.com/ink/","kind":"opensource","free":"free","desc":"inkle 开源的分支叙事脚本语言，可以接进网页和游戏引擎。"},{"name":"Godot","url":"https://godotengine.org","kind":"opensource","free":"free","desc":"免费开源的游戏引擎，做二维游戏特别顺手。"}]}