Photoshop移动UI设计从入门到精通 - (EPUB全文下载)
文件大小:0.52 mb。
文件格式:epub 格式。
书籍内容:
Photoshop移动UI设计从入门到精通
第1章 新手导航:移动UI的设计常识
第2章 掌控布局:移动UI设计的布局原则
第3章 透析本质:移动UI视觉交互设计法则
第4章 深入解析:移动UI的构成元素
第5章 软件进阶:Photoshop移动UI快速上手
第6章 视觉美感:UI的色彩与风格设计
第7章 画龙点睛:移动UI文字的编排设计
第8章 界面合成:移动UI图像的抠取与合成
第9章 界面特效:移动UI图像特效质感设计
第10章 常用元素:图标、图形、按钮设计
第11章 苹果系统:常见苹果系统UI设计
第12章 安卓系统:常见安卓系统UI设计
第13章 微软系统:常见微软系统UI设计
第14章 登录界面:社交与免费WiFi登录UI设计
第15章 影音游戏:影音与游戏UI设计
第1章 新手导航:移动UI的设计常识
学习提示
什么是设计?什么是UI?在IT界中经常会听到各种专业词汇,跨入这个行业,才知道“UI”是英文“User Interface”的缩写。在学习APP UI设计之前,首先要了解什么是设计,以及APP UI设计的一些基本平台、界面特点、制作流程及注意事项等,为后面学习和进行APP UI设计打下良好的基础。
本章重点导航
◎ 连接工具和人的界面
◎ 连接用户和手机的界面
◎ 移动UI的设计特点
◎ 移动UI的设计基础
◎ 谷歌Android系统
◎ 苹果iOS系统
◎ 微软Windows Phone系统
◎ 手机界面
◎ 平板电脑界面
◎ 流程分析
◎ 注意事项
1.1 便捷生活:认识移动UI设计
设计是把一种计划、规划、设想通过视觉形式传达出来的行为过程。简单地说,设计就是一种创造行为,一种解决问题的过程,其区别于其他艺术门类的主要特征之一是更具有独创性。
移动UI设计的相关知识,包括UI设计、移动UI的概念和特点、手机的界面特色以及不同移动UI的视觉效果等。只有认识并且了解移动UI设计的基本知识,才能更好地设计出优秀的APP产品。
1.1.1 连接工具和人的界面
UI的原意是“用户界面”,是由英文User Interface翻译而来的,概括成一句话就是——连接人和工具的界面。这个界面实际上体现在生活的每一个环节中,例如,操作电脑时的鼠标与手,吃饭时的筷子和饭碗,在景区旅游时路边的线路导览图,这些都是用户界面。
在设计领域中,UI可以分成硬件界面和软件界面两个大类。本书主要讲解的是软件界面,是介于用户与平板电脑、手机之间的一种移动UI,也可以称之为“特殊的或者狭义的UI”。
如图1-1所示为热门的图像处理类应用“美图秀秀”APP的启动UI和主菜单UI。
图1-1 “美图秀秀”APP的启动UI和主菜单UI
1.1.2 连接用户和手机的界面
APP是可以安装手机上的软件,用以弥补原始系统的不足与实现个性化。
“APP UI”是指移动APP的人机交互、操作逻辑、界面美观的整体设计。好的APP UI可以提升产品的个性和品位,为用户带来舒适、简单、自由的使用体验,同时也可以体现出产品的基本定位和特色。
如图1-2所示为手机APP UI的展示效果。
图1-2 手机APP UI的展示效果
如图1-3所示为平板电脑中的游戏APP UI的展示效果。
图1-3 游戏APP UI的展示效果
1.1.3 移动UI的设计特点
本书移动UI主讲手机UI界面的APP UI是将各类手机应用和UI设计结合起来,使其成为一个整体,且具备小巧轻便、通信便捷的特点。
小巧轻便:APP可以被内嵌到各种智能手机中。用户随身携带智能手机,可以随时随地打开这些APP以满足某些需求。另外,移动互联网的优势使用户可以通过各种APP快速沟通并获得资讯。如图1-4所示为“手机淘宝”的APP UI,用户通过手机即可获得各种生活资讯。
图1-4 “手机淘宝”的APP UI界面
通信便捷:移动APP使人们的沟通变得更加方便,可以跨通信运营商、跨操作系统平台,通过无线网络快速发送免费语音短信、视频、图片和文字。如图1-5所示为“微信”的APP UI,用户通过“摇一摇”“搜索号码”“附近的人”,以及扫二维码的方式添加好友和关注公众平台,同时可以将内容分享给好友或朋友圈。
图1-5 “微信”APP的“摇一摇”相关界面
1.1.4 移动UI的设计基础
随着科技的发展,智能手机的功能越来越多,而且越来越强大,甚至可以和电脑相媲美。
要想设计出优秀的APP UI,用户还需熟悉智能手机的界面构造。手机主要界面的构成被分为几个标准的信息区域(主要针对按键手机,触屏手机相对灵活):状态栏、标题区、功能操作区、导航栏等。
如图1-6所示为“中国工商银行手机银行”的APP UI构成。
图1-6 手机界面构成的基本单位
状态栏:用于显示手机目前运行状态及事件的区域,主要包括应用通知、手机状态、网络信号强度、运营商名称、电池电量、未处理事件及数量、时间等要素。在APP UI的设计过程中,状态栏并不是必须存在的元素,用户可依照交互需求进行取舍。
标题区:主要用于放置APP的LOGO、名称、版本及相关图文信息。
功能操作区:它是APP应用的核心部分,也是手机界面上面积最大的区域,通常包含有列表(list)、焦点(highlight)、滚动条(scroalbar)、图标(icon)等多种不同元素。在各个APP内部,不同层级的UI包含的元素可以相同也可以不同,用户可以根据实际情况进行合理的搭配运用,如图1-7所示。
导航栏:也被称为“公共导航区”或“软键盘区域”,它是对APP的主要操作进行宏观操控的区域,可以出现在该APP的任何界面中,方便用户进行切换操作。
APP运行在手机操作系统的软件环境中,其UI设计应该基于这个应用平台的整体风格,这样有利于产品外观的整合。
图1-7 同一个APP中不同层级的UI
手机界面效果的规范性包括以下两个方面,如图1-8所示。
图1-8 手机界面效果的规范性
手机界面效果的整体性和一致性是基于手机系统视觉效果的和谐统一而考虑的,而手机界面的效果个性化是基 ............
以上为书籍内容预览,如需阅读全文内容请下载EPUB源文件,祝您阅读愉快。
书云 Open E-Library » Photoshop移动UI设计从入门到精通 - (EPUB全文下载)