来自腾讯交互设计师的分享：交互微动效设计指南.docVIP

来自腾讯交互设计师的分享：交互微动效设计指南一、本指南的适用范围 本指南适用于UI界面中交互微动效，属于功能性动效。与聚焦于提供娱乐体验的动效（如动画影片、游戏动效等）不同，功能性动效的设计，有清晰的逻辑目的，聚焦于帮助用户理解当前所处的状态。 动效范围涵盖： 入场\出场动效（enter exit）、过渡动效（transition）和加载动效（loading） 二、设计原则和设计考量 一个优秀的交互微动效，在设计上应该遵循以下三个核心原则： 为了确保动效有清晰的用途并能完成目标，设计时请思考以下几方面的问题： 三、响应时间与持续时间 时间是动效核心元素，设计动效时需要考虑两类时间 —— 响应时间与持续时长 1、响应时间 响应时间指从用户执行操作到反馈出现的间隔时间。触发机制不同，响应时间的限制也不同： 对于由用户操作?直接触发?的反馈，理想的响应时间应该控制在?100?毫秒内 对于由用户操作?间接触发?的反馈，响应时长可允许达到?1秒左右，不可超过2秒无反馈 当 超过?2秒 才能获取反馈结果时，须设计加载动效（loading）： 当反馈时间为 2-9秒 时，可使用循环的加载样式（如常见的菊花转） 当反馈时间 超过10秒?时，须使用带有进度指示的加载样式（如已加载了60%，还剩30秒） 2、持续时间 交互微动效的持续时间不宜过长，以避免浪费用户时间，影响用户的阅读和操作效率，其持续