项目六:动出活力—生活时尚类手机APPUI动效设计
随堂试卷
一、单选题:
1.用户体验设计(UXD)是一种以什么为中心的设计手段?
A. 产品
B. 市场
C. 用户
D. 技术
2.动效设计中的“缓动”是指什么?
A. 动画的开始和结束
B. 动画的中间过程
C. 动画的持续时间
D. 动画的延迟效果
3.在用户体验设计的五大层级中,哪一个层级涉及到制定产品目标和市场定位?
A. 战略层
B. 范围层
C. 结构层
D. 表现层
4.动效设计的作用之一是用于?
A. 转场过渡
B. 增加软件复杂性
C. 减少用户操作
D. 限制界面元素
5.动效设计方案中的“1+6+2”原则中的“1”代表什么?
A. 一个动人的小细节
B. 一个告知性动画
C. 一个欢迎动画
D. 一个交互类动画
二、多选题:
1.动效设计在UI设计中的作用包括哪些?
A. 动画过渡
B. 视觉反馈
C. 焦点引导
D. 功能说明
2.用户体验设计的三大原则包括哪些?
A. 可用性原则
B. 可见性原则
C. 可供性原则
D. 一致性原则
3.在动效设计方案撰写中,需要确定的动效类型包括哪些?
A. 通用动效
B. 业务层动效
C. 组件动效
D. 交互类动画
4.动效设计的原则和要求包括哪些?
A. 个性化原则
B. 导向性原则
C. 共鸣性原则
D. 情感性原则
5.动效设计前的准备工作包括哪些?
A. 确定动效类型
B. 确定动效点
C. 设计动效方案
D. 编写动效代码
三、判断题:
1.用户体验设计(UXD)是用户在使用产品过程中产生的感受,包括情感、认知、行为、成就等方面。(对/错)
2.在用户体验设计的五大层级中,表现层是通过界面设计、颜色、图标等元素,传达产品的视觉效果。(对/错)
3.动效设计的作用之一是操作反馈,即通过动画效果对用户的操作给予即时反馈。(对/错)
4.动效设计方案中的“1+6+2”原则中的“2”代表两个动人的小细节。(对/错)
5.动效设计的原则包括个性化、导向性、共鸣性和情感性。(对/错)
四、简答题:
1.描述用户体验设计(UXD)的五大层级,并解释每个层级的作用。
2. 解释动效设计中的“缓动”、“偏移和延迟”以及“父子关系”三种动画效果,并给出它们在UI设计中的应用场景。
五、实操题:
1.智慧生活智能家居App的天气动画设计
习题需求说明 | |
练习目的 | 理解和掌握天气动画的制作,培养对细节的关注,如动画的流畅性、色彩搭配和与用户交互的连贯性。 工具熟练度:通过使用AE (After Effects) 软件,提高初学者在实际设计中的工具操作熟练度。 基础技能培养:帮助初学者掌握加载动画的基本设计原则和技巧,为他们在未来的设计工作打下坚实的基础。 |
具体需求 | 请利用Adobe After Effects设计在智慧生活智能家居App的天气动画。在设计过程中,需要遵循移动App UI动效设计规范,并在参考基础上加入一些个人想法,注重设计元素的应用。参考素材仅作为大致方向指导,具体要求如下: 1. 动画元素选择:需要设计3种天气动画。天气可以从以下选项中选择:晴天、雨天、雪天、多云、雷暴等。 2. 动画时长:动画的时长应参考一般的加载动画规律,通常在2-5秒之间。动画不应过长,以避免用户在等待加载时感到不耐烦。 3. 输出格式:动画应输出为“.mp4”文件,并确保动画大小为512*512。 4. 文件命名和格式:文件名为“智慧生活智能家居天气动画.aep”。 5. 制作时长:完成此动画的制作时长为2天。 在设计过程中,请确保遵循移动UI的设计规范,保持整体风格统一,注重细节处理;同时,可以加入一些个人想法,使设计更具创意和吸引力。 |
输出要求 | 01_Adobe After Effects源文件*1 02_预览视频文件.mp4*3 |
考核标准 | 1. 动画流畅性与连贯性:动画的过渡是否流畅,没有突兀的帧跳跃。动画的开始和结束是否自然。 2. 创意与原创性:动画中是否融入了个人的创意和想法。动画是否具有独特性,与其他常见的天气动画有所区别。 3.文件规范:文件命名是否正确,是否为“智慧生活智能家居天气动画.aep”。输出文件是否为AE项目文件,动画大小是否为512*512。 |
参考素材图 | ![]() |
2.智慧生活智能家居App底部导航条动效设计
习题需求说明 | |
练习目的 | 理解底部导航条在移动应用中的重要性及其在用户体验中的作用;学习如何设计与应用主题相关的导航条动效;培养对细节的关注,如动画的流畅性、色彩搭配和与用户交互的连贯性。 工具熟练度:通过使用AE (After Effects) 软件,提高初学者在实际设计中的工具操作熟练度。 基础技能培养:帮助初学者掌握加载动画的基本设计原则和技巧,为他们在未来的设计工作打下坚实的基础。 |
具体需求 | 请利用Adobe After Effects设计智慧生活和智能家居App的底部导航条的动效设计。在设计过程中,需要遵循移动App UI动效设计规范,并在参考基础上加入一些个人想法,注重设计元素的应用。参考素材仅作为大致方向指导,具体要求如下: 1. 需要设计底部导航条的动效动画。包含至少四个主要功能模块,如“首页”、“场景”、“商城”和“我的”。 2. 动画时长:动画的时长应参考一般的加载动画规律,通常在2-5秒之间。动画不应过长,以避免用户在等待加载时感到不耐烦。 3. 输出格式:动画应输出为“.mp4”文件,并确保动画大小为1080*1920。 4. 文件命名和格式:文件名为“智慧生活智能家居导航条动效.aep”。 5. 制作时长:完成此动画的制作时长为2天。 在设计过程中,请确保遵循移动UI的设计规范,保持整体风格统一,注重细节处理;同时,可以加入一些个人想法,使设计更具创意和吸引力。 |
输出要求 | 01_Adobe After Effects源文件*1 02_预览视频文件.mp4*1 |
考核标准 | 1. 动画流畅性与连贯性:动画的过渡是否流畅,没有突兀的帧跳跃。动画的开始和结束是否自然。 2. 创意与原创性:动画中是否融入了个人的创意和想法。动画是否具有独特性,与其他常见的导航条动画有所区别。 3.文件规范:文件命名是否正确,是否为“智慧生活智能家居导航条动效.aep”。输出文件是否为AE项目文件,动画大小是否为1080*1920。 |
参考素材图 | ![]() |
参考答案
一、单选题答案:
1. C. 用户
2. B. 动画的中间过程
3. A. 战略层
4. A. 转场过渡
5. C. 一个欢迎动画
二、多选题答案:
1. A. 动画过渡, B. 视觉反馈, C. 焦点引导, D. 功能说明
2. A. 可用性原则, B. 可见性原则, C. 可供性原则
3. A. 通用动效, B. 业务层动效, C. 组件动效
4. A. 个性化原则, B. 导向性原则, C. 共鸣性原则, D. 情感性原则
5. A. 确定动效类型, B. 确定动效点, C. 设计动效方案
三、判断题答案:
1. 对
2. 对
3. 对
4. 对
5. 对
四、简答题答案:
1.用户体验设计(UXD)的五大层级包括:
战略层:制定产品目标、明确市场定位,为产品开发提供根本指引。
范围层:划分和统筹功能需求,从最小可行性版本开始,逐步迭代完善。
结构层:建立产品的骨架,制定架构图和流程图,将产品需求逻辑清晰呈现。
框架层:填充交互设计,让产品的交互流程变得可视可理解,是产品雏形的具体体现。
表现层:通过界面设计、颜色、图标等元素,传达产品的视觉效果,影响用户感知和情感。
2.动效设计中的三种动画效果及其应用场景:
“缓动”:指的是在一个动作在过渡中进行的方式,比如一个物体可以从界面的一侧缓慢启动,然后加速,最后到另一侧突然停止。在UI设计中,这种效果可以用来平滑过渡界面元素,如菜单的展开和收缩。
“偏移和延迟”:在同时移动的UI元素之间创建层次结构,并说明它们是相关的,但又是不同的。这种效果可以用来区分同时发生的多个动画,如在列表项加载时,每个项可以有微小的延迟,以便用户区分它们。
“父子关系”:将一个UI元素的属性链接到其他元素的属性,当父元素中的属性发生变化时,子元素的链接属性也会发生变化。在UI设计中,这种效果可以用来创建复杂的动态效果,如一个按钮的点击导致相关元素的大小、颜色或位置发生变化。
五、实操题答案
根据提示步骤完成相应页面即可得60分;若设计功能完整则可得75分;若有创新点可酌情加分。



