目录

  • 1 UI界面基础
    • 1.1 手机UI设计相关基本概念
      • 1.1.1 什么是UI设计
      • 1.1.2 什么是APP/客户端
      • 1.1.3 智能手机的操作系统有哪些
      • 1.1.4 UI专业术语认知
      • 1.1.5 交互设计七大定律
    • 1.2 UI设计与项目流程步骤
      • 1.2.1 UI设计与产品团队
      • 1.2.2 App界面设计实战之准备工作
      • 1.2.3 界面的原型设计
    • 1.3 UI设计与项目流程步骤
      • 1.3.1 各设备尺寸标准一览
      • 1.3.2 UI规范
      • 1.3.3 UE/UX用户体验设计基础认知
    • 1.4 UI设计的工具
    • 1.5 图标尺寸大小与格式建议
      • 1.5.1 图标尺寸大小
      • 1.5.2 图标格式建议
    • 1.6 APP布局说明
    • 1.7 熟悉各系统组件
      • 1.7.1 Android的基础UI组件
      • 1.7.2 iOS的基础UI组件
    • 1.8 界面设计的配色技巧
  • 2 UI界面设计常用元素制作
    • 2.1 常见控件的制作
      • 2.1.1 UI控件
      • 2.1.2 导航栏
      • 2.1.3 轮播点&选项卡
      • 2.1.4 TAB栏
      • 2.1.5 搜索框
    • 2.2 图片效果处理
      • 2.2.1 半透明背景
      • 2.2.2 画中画效果
      • 2.2.3 镜面效果
    • 2.3 App界面设计实战之登录页面
  • 3 实战篇—UI界面设计风格
    • 3.1 常用图标设计风格
      • 3.1.1 像素风格
      • 3.1.2 剪影2D风格
      • 3.1.3 扁平化风格
      • 3.1.4 写实风格
      • 3.1.5 3D风格
      • 3.1.6 MEB风格
    • 3.2 实战篇——扁平化风格
      • 3.2.1 布尔运算
        • 3.2.1.1 扁平化案例-优惠券
      • 3.2.2 扁平化案例-日历制作
    • 3.3 拟物化
      • 3.3.1 轻拟物写实-相机
      • 3.3.2 轻拟物写实-按钮
      • 3.3.3 轻拟物写实-勋章
    • 3.4 线性图标
  • 4 UI动效设计
    • 4.1 Tab栏图标动效
    • 4.2 导航动效
    • 4.3 界面动效
      • 4.3.1 App界面卡片切换动效
  • 5 【0】游戏UI设计师养成计划
    • 5.1 【课程思政】UI设计师的职业素养与职业能力
    • 5.2 【课程思政】UI设计与中国传统文化的应用与传播
    • 5.3 【立德树人】游戏UI设计如何传递积极社会价值观
    • 5.4 【人文关怀】游戏UI设计中的心理健康促进和护眼理念
    • 5.5 【行业新成果】角色详情界面案例赏析
    • 5.6 【行业新发展】人工智能与UI设计
    • 5.7 【行业新发展】探索手机游戏UI设计
    • 5.8 【行业新发展】游戏UI设计行业前沿资讯
    • 5.9 【1+X直通车】游戏美术设计职业技能等级标准
    • 5.10 【1+X直通车】游戏美术设计职业技能要求
    • 5.11 【企业导师连线】UI设计师的职业发展与未来挑战
    • 5.12 【企业导师连线】探索游戏UI设计前沿
  • 6 【1】UI设计理论基础
    • 6.1 交互设计7大定律(上)
    • 6.2 交互设计7大定律(下)
    • 6.3 界面的原型设计
    • 6.4 界面的配色技巧
  • 7 【2】动出活力—生活时尚类手机APP UI设计全流程
    • 7.1 【项目任务单】
    • 7.2 【前导内容】
    • 7.3 运动时尚类手机APP应用UI设计全流程1
    • 7.4 运动类时尚手机app应用UI设计全流程2
    • 7.5 运动时尚类手机APP应用UI设计全流程3
    • 7.6 运动时尚类手机APP应用UI设计全流程4
    • 7.7 【课堂活动】
    • 7.8 【随堂试卷】
  • 8 【3】东方意境游戏UI界面全流程制作
    • 8.1 【项目任务单】
    • 8.2 【前导内容】
    • 8.3 卡通国风界面笔刷设计与制作
    • 8.4 卡通国风界面原型设计及制作
    • 8.5 卡通国风图标及按钮设计-按钮设计
    • 8.6 卡通国风图标及按钮设计-图标设计
    • 8.7 卡通国风详情界面制作及细化-详情界面制作
    • 8.8 卡通国风详情界面制作及细化-界面细化
    • 8.9 【课堂活动】
    • 8.10 【随堂试卷】
  • 9 【4】中式古风风格UI全流程制作
    • 9.1 【项目任务单】
    • 9.2 【前导内容】
    • 9.3 国风中式古风界面底框绘制
    • 9.4 中式古风界面标签栏绘制-图稿绘制
    • 9.5 中式古风界面标签栏绘制-上色绘制
    • 9.6 【课堂活动】
    • 9.7 中式古风界面分类选项栏绘制-主体绘制
    • 9.8 中式古风界面分类选项栏绘制-周边元素绘制
    • 9.9 中式古风界面详情栏绘制-左侧详情绘制
    • 9.10 中式古风界面详情栏绘制-右侧详情绘制
    • 9.11 【随堂试卷】
  • 10 【5】AIGC在UI设计中的使用
    • 10.1 【项目任务单】
    • 10.2 AI绘图工具参数介绍
    • 10.3 AI绘图中的提示词使用技巧
    • 10.4 AI绘图中的图生图使用技巧
    • 10.5 【课堂活动】
    • 10.6 游戏斧头图标的AI绘制:线稿绘制
    • 10.7 游戏斧头图标的AI绘制:炼图技法
    • 10.8 游戏斧头图标的AI绘制:上色及修正
    • 10.9 游戏斧头图标的AI绘制:细化
    • 10.10 【随堂测验】
  • 11 【6】动出活力—生活时尚类手机APP UI动效设计
    • 11.1 【项目任务单】
    • 11.2 用户体验设计
    • 11.3 UI设计中的动效设计
    • 11.4 动效设计中的设计类型及动画效果
    • 11.5 动效设计方案
    • 11.6 手环页面展示动效
    • 11.7 鞋子页面展示动效
    • 11.8 【课堂活动】
    • 11.9 【随堂试卷】
【随堂试卷】

项目:东方意境游戏UI界面全流程制作

随堂试卷

一、单选题:

 

1.开始按钮摆放的位置通常放置在界面(   )的中心位置,通常设计的较大,以便玩家点击。

A.靠上

B.靠下

C.靠左

D.靠右

【答案】:B

 

2.游戏界面为游戏界面的(   )设计。

A.操作

B.功能

C.交互

D.弹窗

【答案】:C

 

3.游戏中除了游戏画面外的所有内容都属于游戏UI的(   )。

A.设计范畴

B.操作范畴

C.功能范畴

D.交互范畴

【答案】:A

 

4.按住键盘上的(   )键,可以使用橡皮擦工具。

A.E

B.B

C.R

D.S

【答案】:A

 

5.下列选项中,使用哪个组合键可以复制图层(   )。

A.Ctrl+G

B.Ctrl+J

C.Ctrl+O

D.Ctrl+T

【答案】:B

 

二、多选题:

 

1.下列选项中,哪些元素属于游戏界面的组成部分(   )。

A.游戏按钮

B.游戏底框

C.游戏图标

D.装饰图案

【答案】:ABCD

 

2.游戏图标用来展示(   )内容信息。

A.游戏界面

B.游戏装备

C.游戏道具

D.角色头像

【答案】:BCD

 

3.12.下列选项中,哪些选项属于按钮、图标的制作流程步骤(   )。

A.打草稿

B.铺大色块

C.制作初步光影关系

D.刻画精细立体效果

【答案】:ABCD

 

4.在实际工作中,游戏开发使用的图片素材格式绝大多数使用(   )和(   )格式。

A.GIF

B.PNG

C.JPG

D.TIFF

【答案】:BC

 

5.下列选项中,哪些选项需要储存为PNG格式(   )。

A.游戏Logo图片

B.底框图片

C.按钮图片

D.文字图片

【答案】:ABCD

 

三、判断题:

 

1. 装饰图案主要作用是用来装饰和美化界面,通常包括界面装饰物和标题美术字。【答案】:×

 

2. 游戏界面由游戏按钮、游戏底框、游戏图标、游戏文字和装饰图案五种元素组成。【答案】:

 

3.无论是使用漂亮、酷炫的动画背景,还是静态的华丽的原画背景,设计师都会把游戏最有特色、最具代表性的内容展示在游戏Logo中,从而达到炫技和吸引玩家注意的目的。【答案】:×

 

4.游戏登录界面中的功能按钮要醒目,但其醒目程度不能超过游戏Logo。【答案】:√

 

5.由于按钮的内容会随时发生变化,因此按钮的底框和文字需要一起输出。【答案】:×

 

 

四、简答题:

 

1. 描述界面细化的重要性和主要步骤。

 

界面细化的重要性在于确保设计从概念到实现的关键步骤,它直接影响到用户与界面的交互质量。主要步骤包括:展示商品制作、道具等级标识、道具框设计、道具名称和数量的添加、服饰图标放置、穿戴和选中状态标志的添加、按钮和关闭按钮设计、背景图融合以及最终调整和保存。

 

 

2. 解释原型设计在产品开发过程中的作用及其对提升产品市场竞争力的贡献。

 

原型设计在产品开发过程中的作用是验证产品的概念、功能和用户体验,以便在进一步的开发和生产中进行改进。原型设计是一种交流工具,它允许产品经理准确地向设计师、开发人员传达产品定位、目标功能、架构、流程等信息,并与客户、投资者和利益相关者进行沟通和反馈。这对提升产品市场竞争力至关重要,因为原型设计有助于改进产品设计,确保其满足市场需求和用户期望,从而增加产品的吸引力和成功可能性。

 

 

五、实操题:

 

1.古风角色界面制作

 

习题需求说明

练习目的

为了尽快掌握中式古风人物角色界面设计制作方法,需要利用提供的若干张素材图完成练习

具体需求

请在提供的背景图的基础上,参照效果图完成人物角色界面的绘制。界面所需头像素材、技能素材和财产图标请在素材文件夹中提取,界面中的其余内容需独立绘制完成

输出要求

01_UI练习 PSD源文件一张

02_Photoshop输出JPEG格式图片一张

03_PSD源文件尺寸要求至少为1920像素x1080像素,分辨率为300DPI

04_PSD源文件禁止合并图层

考核标准

1)界面布局清晰有层次感,主次分明,配色淡雅协调,装饰纹理清新灵动

2)左侧培养按钮月亮、云纹、小鸟图案清晰淡雅,文字排布合理,识别性强

3)顶部财产区布局合理,排列整齐,关闭按钮及培养按钮造型流畅,配色协调,图形和文字清晰,便于识别

4)左侧头像区布局合理,排列整齐,按钮大小合理,颜色淡雅,便于识别和点击

5)右侧信息区布局合理,排列整齐,信息主次分明,便于阅读,按钮大小合理,配色淡雅,便于识别和点击

参考效果图


 

 

根据提示步骤完成相应页面即可得60分;若设计功能完整则可得75分;若有创新点可酌情加分。