移动游戏UI设计专业教程

本书以Photoshop软件为基础，全面介绍了游戏UI设计中的理论知识及具体案例的制作方法。本书语言浅显易懂，配合丰富、精美的游戏UI设计案例，讲解游戏UI设计的相关知识和使用Photoshop软件进行游戏UI设计制作的方法和技巧，使读者在掌握设计知识的同时，能够在游戏UI设计制作的基础上做到活学活用。

本书配套学习资源，提供了书中所有案例的素材文件及效果源文件，同时还附赠了99例绘图笔刷，方便读者借鉴和使用。

本书适合有一定Photoshop基础的设计初学者及设计爱好者学习使用，也可以为相关行业的设计师及相关专业的学生提供参考。 [1]

01 带你进入游戏的世界 /7

1.1 游戏界面设计的基础知识 /8

1.1.1 什么是游戏界面设计 /8

1.1.2 游戏界面的设计原则 /9

1.2 游戏界面的种类 /11

1.2.1 启动界面 /11

1.2.2 游戏菜单界面 /12

1.2.3 游戏操作界面 /13

1.2.4 设置界面 /13

1.3 游戏的布局设计 /14

1.3.1 Miller公式 /14

1.3.2 合理的游戏布局 /15

1.4 游戏设计的思路与方法 /16

1.4.1 手游的应用平台 /16

1.4.2 梳理游戏方向 /16

1.4.3 创建产品流程图 /17

1.4.4 绘制游戏场景图 /18

1.4.5 测试游戏运行 /18

1.5 了解各大游戏载体 /20

1.5.1 手机游戏界面的标准尺寸 /20

1.5.2 平板游戏界面的标准尺寸 /21

1.5.3 网页游戏界面的标准尺寸 /22

1.6 绘制游戏界面的设备 22

1.6.1 对于软件的掌握 /22

1.6.2 对于硬件的需求 /24

02 游戏世界的基本法则 /25

2.1 游戏界面的基本特性 /26

2.1.1 风格统一化 /26

2.1.2 视觉交互的重要性 /27

2.1.3 游戏UI设计的把控 /28

2.2 抓住游戏界面的设计要素 /29

2.2.1 界面布局 /29

2.2.2 视觉习惯 /31

2.2.3 色彩搭配 /32

2.2.4 信息传达 38

2.2.5 游戏的自我独立性 /39

03 移动游戏基础界面的绘制方法 /41

3.1 绘制游戏界面的基础知识 /42

3.2 游戏常用按钮的绘制方法 /43

3.3 游戏常用图标的绘制方法 /55

3.3.1 游戏主图标的绘制方法 /55

3.3.2 系列卡通图标的绘制方法 /71

3.4 游戏操作界面的绘制方法 /90

3.4.1 制作背景 /92

3.4.2 制作上栏背景 /93

3.4.3 制作进度条 /94

3.4.4 制作小星星 /96

3.4.5 制作暂停按钮 /98

3.4.6 制作得分框 /101

3.4.7 制作下栏道具 /101

3.4.8 制作操作区 /108

3.5 游戏设置界面的绘制方法 /110

3.6 游戏关卡界面的绘制方法 /118

3.7 游戏胜利界面的绘制方法 /132

04 移动游戏主界面的绘制方法 /145

4.1 竞技类手机游戏界面设计 /146

4.1.1 绘制游戏的信息对战界面 /146

4.1.2 绘制游戏的操作界面 /155

4.2 卡牌类手机游戏界面设计/169

4.2.1 绘制卡牌英雄装备界面 /170

4.2.2 绘制卡牌英雄类型展示界面 /184

05 游戏设计规范和项目的整体流程 /197

5.1 游戏的设计规范 /198

5.1.1 按钮的规范 /198

5.1.2 硬件规范 /199

5.1.3 合理性 /199

5.1.4 美观与协调性 /200

5.2 游戏的前期策划 /200

5.3 绘制游戏UI /205

5.3.1 首页 /205

5.3.2 人物介绍页 /206

5.3.3 商店购买页 /210

5.3.4 地图备战页 /211

5.3.5 装备展示页 /215

5.3.6 战斗成绩页 /216

5.4 配合技术部门 /220

相关知识

游戏UI设计：修炼之道
在开发移动益智游戏时，如何设计关卡和UI元素来增强用户体验和游戏的粘性？
成也教程，败也教程 ——浅析游戏新手教程设计
移动游戏ui设计（一）
游戏体验：如何设计移动端游戏 – 人人都是产品经理,
920 款游戏、38000多张高清参考图免费提供！游戏灵感神站 GAME UI Databas
游戏UI界面设计怎么做？来看高手的总结+实战案例！
游戏场景设计专业技法解析
游戏设计之我见 —— 动作游戏中的敌人移动设计
守望先锋界面攻略 深入探索游戏画面与UI设计