移动端UI元素图形创意设计案例教程

图书标准信息

• 作者 魏云柯
• 出版社 电子工业出版社
• 出版时间 2022-06
• 版次 1
• ISBN 9787121438301
• 定价 57.80元
• 装帧 其他
• 开本 16开
• 页数 280页
• 字数 448千字

【内容简介】

本书对接1+X职业技能等级证书考试内容，融入课程思政内容，是岗课赛证融通的项目化教材。本书以培养学生的UI元素图形创意能力为根本，结合绘图软件的功能演示，通过案例有针对性地讲解UI项目的设计过程及软件的操作步骤，从而达到让学生熟练掌握绘图软件的目的。案例所使用的软件包括Photoshop、Illustrator和After Effects。全书共10个项目，项目1是概述，包含UI设计的基础知识和3个软件的功能简述。项目2～项目9是各个案例的分步解析，通过案例讲解界面构图、图形元素和色彩、字体规范等。项目10是综合实战，包括从项目分析、策划和设计到制作规范和如何完成的全过程讲解。本书不仅可以帮助学生迅速进入职场角色，还提供了丰富的教学资源帮助教师快速开课。本书主要适合作为软件技术专业，以及UI方向和艺术设计类相关专业的高职本科、专科学生的教材。

【作者简介】

魏云柯，硕士研究生毕业于四川大学，任教于广东科学技术职业学院。现任软件技术UI方向团队负责人，澳门设计师协会会员，中外设计研究院理事。有多年设计和一线教学经验，设计作品曾获得亚洲设计联盟主办首届亚洲设计双年展入选作品，并在韩国展出；秘鲁“水”主题海报设计比赛入选作品，并在秘鲁展出；中国创意设计年鉴.2018/2019金奖一项、银奖两项、铜奖一项；第七届中国高等院校设计大赛一等奖一项、三等奖两项；第10届中国高校美术作品学年展三等奖等。指导学生参加大学生广告艺术大赛、广东省大学生计算机设计大赛等获得多个等级奖。

【目录】

项目1 概述............................................................................................ 001

1.1　UI 设计的概念和设计原则 ....................................................................... 001

1.2　UI 设计的流程 ......................................................................................... 003

1.3　UI 元素的分类 ......................................................................................... 007

1.4　UI 版面和字体设计 .................................................................................. 009

1.4.1 版面设计的思路 ......................................................................... 010

1.4.2 版面设计的步骤 ......................................................................... 015

1.4.3 字体设计在图标和弹出窗口中的运用 ......................................... 016

1.4.4 字体设计的方法和步骤 ............................................................... 017

1.5　UI 色彩和图形设计概述 .......................................................................... 019

1.5.1 UI 色彩运用法则......................................................................... 019

1.5.2 色彩规范的制作 ......................................................................... 021

1.5.3 图形设计在UI 中的运用 ............................................................. 022

1.5.4 图形设计的方法和步骤 ............................................................... 023

1.6　绘图软件Photoshop 界面工具和功能简述.............................................. 024

1.7　绘图软件Illustrator 界面工具和功能简述 ................................................ 027

1.8　动效软件After Effects 界面工具和功能简述 ........................................... 028

项目2 小学霸英语App 功能图标设计及绘制方法........................................... 030

2.1　功能图标的概念 ...................................................................................... 030

2.2　功能图标范例——已上线 ........................................................................ 030

2.3　功能图标的设计原则 ............................................................................... 032

2.4　功能图标的风格类型 ............................................................................... 035

2.5　功能图标的设计步骤 ............................................................................... 036

2.6　完整项目课堂演示+ 学生实操 小学霸英语App 底部标签栏图标设计及

绘制方法 ................................................................................................. 042

2.6.1 项目相关知识 ............................................................................. 042

2.6.2 项目准备与设计 ......................................................................... 042

2.6.3 项目实施 .................................................................................... 044

2.6.4 项目总结 .................................................................................... 055

2.7　拓展练习 ................................................................................................. 056

项目3 甜在心App 图标设计及绘制方法....................................................... 058

3.1　App 图标的概念 ...................................................................................... 058

3.2　App 图标范例——已上线 ........................................................................ 058

3.3　App 图标的设计原则 ............................................................................... 064

3.4　App 图标的设计步骤 ............................................................................... 064

3.5　完整项目课堂演示+ 学生实操 甜在心App 图标设计及绘制方法 ............ 070

3.5.1 项目相关知识 ............................................................................. 070

3.5.2 项目准备与设计 ......................................................................... 070

3.5.3 项目实施 .................................................................................... 072

3.5.4 项目总结 .................................................................................... 089

3.6　拓展练习 ................................................................................................. 091

项目4 桃兔社交通信App 图标和个人页设计及绘制方法.................................. 092

4.1　色彩的重要性 .......................................................................................... 092

4.2　什么是色彩 ............................................................................................. 092

4.3　色彩搭配方法 .......................................................................................... 096

4.4　优秀的图标和界面配色案例赏析 ............................................................. 099

4.5　使用绘图软件设置色彩 ........................................................................... 101

4.6　完整项目课堂演示+ 学生实操 桃兔社交通信App 图标和个人页设计及

绘制方法 ................................................................................................. 107

4.6.1 项目相关知识 ............................................................................. 107

4.6.2 项目准备与设计 ......................................................................... 108

4.6.3 项目实施 .................................................................................... 109

4.6.4 项目总结 .................................................................................... 124

4.7　拓展练习 ................................................................................................. 125

项目5 怪鱼旅行App 引导页设计及绘制方法..................................................126

5.1　引导页的概念 .......................................................................................... 126

5.2　引导页范例——已上线 ........................................................................... 126

5.3　引导页的设计原则................................................................................... 129

5.4　引导页的类别 .......................................................................................... 130

5.5　引导页的设计步骤................................................................................... 136

5.6　完整项目课堂演示+ 学生实操 怪鱼旅行App 引导页设计及绘制方法 ..... 139

5.6.1 项目相关知识 ............................................................................. 140

5.6.2 项目准备与设计 ......................................................................... 140

5.6.3 项目实施 .................................................................................... 142

5.6.4 项目总结 .................................................................................... 149

5.7　拓展练习 ................................................................................................. 150

项目6 “不期而遇”女装促销Banner 设计及绘制方法....................................152

6.1　Banner 的概念 ........................................................................................ 152

6.2　Banner 的设计原则 ................................................................................. 153

6.3　Banner 的设计步骤 ................................................................................. 155

6.4　完整项目课堂演示+ 学生实操 “不期而遇”女装促销Banner 设计及

绘制方法 ................................................................................................. 163

6.4.1 项目相关知识 ............................................................................. 164

6.4.2 项目准备与设计 ......................................................................... 164

6.4.3 项目实施 .................................................................................... 165

6.4.4 项目总结 .................................................