下载 App
“万象”开发日志 拖起一张牌 让界面化成灰
昨天 17:591 浏览
这次聊个很短的小效果:在《万象》里抽出一张卡,底下的手牌区会慢慢碎开,飘出一点灰烬,把地图让出来。
做这个效果的想法很直接。选牌时,当然得把牌看清楚;选好了,注意力就该移到地图上了。哪里能放,旁边有没有可以合成的东西,这时候比底下还有几张牌更重要。
图1 选牌时,手牌完整地铺在地图下方。开发阶段实机截图,界面保留当时版本。
正好游戏是体素风格,让界面一小块一小块地散掉,也挺搭。灰烬里混一点暖橙色,抽牌的时候就有了一点把东西从卡里带出来的感觉。
不过,先得把正在拖的那张牌单独拿出来。总不能卡还没放下,先把手里的东西也烧没了。它会先移到独立的拖拽层,再让其他需要隐藏的界面开始消散;进入地图后,由半透明的模型显示落点。
消散本身用了一层遮罩,由它决定界面上哪些位置还能看见。随着进度推进,能显示的区域越来越少,界面就一点点散开。原来的卡牌和文字都留在原处,恢复的时候还能接着用。
缺口的位置用固定的格子噪声决定,再加一点从下往上的倾向。卡面里的动态模型仍然在动,所以散到一半时,还能从没消失的部分看到它们。
固定噪声还有个好处:随时反悔也接得上。
如果取消了这次拖动,或者松手时没能放下元素,消散进度就会往回走,把原来的缺口补起来。现在消散用 0.3 秒,完整恢复用 0.15 秒;半路取消,回来的时间还会更短。牌都不放了,就早点把界面还给玩家吧。
灰烬是另外画的一层小碎屑。我从当前显示的 UI 区域里挑出生位置,等对应位置消散,碎屑才开始向上飘,再旋转、缩小、淡掉。这样能看出它们是从界面里散出来的,也不会刚抽牌就满屏飞灰,反过来把地图遮住。
图3 手牌等固定界面完全消隐,落点预览与操作提示保留,周围还有少量灰烬。
还有一件画面里看不出来的事:按钮藏起来以后,也得让它停止接收点击。否则玩家看着是一块空地,松手却被透明的 UI 挡住,想想就很别扭。所以消散开始时,交互会一起关掉,完全恢复后再打开。
如果这次放置刚好触发了合成,界面会继续藏着,等场景里的演出结束再回来。拖牌和合成各自保留一个隐藏状态,谁还没结束,就再等等,免得手牌在中间闪出来一下。
目前灰烬的出生位置还是按 UI 的矩形区域取的,没有细抠每张图片的透明轮廓。以后遇到镂空比较多的素材,再看看要不要做得更贴边。
这个效果想做到的,就是抽牌时让开,放完再回来,中途取消也顺手。大家玩卡牌游戏时会留意这些小动效吗?也想听听你们觉得,什么样的抽牌手感最舒服。












