iOS开发中UIUE设计技术.docVIP

iOS开发中UIUE设计技术 　　摘要：该文主要介绍UI/UE技术在iOS开发中起到决定性的核心作用，同时就高职学生的特点，开设UI/UE相关技术课程，利用辅助设计工具Photoshop、Sketch以及Xcode等，以完整案例欢乐颂为例，带领学生如何完成UI/UE设计过程。 　　关键词：UI/UE；图标；界面；交互式；欢乐颂 　　中图分类号：TP311 文献标识码：A 文章编号：1009-3044（2018）03-0070-02 　　1 iOS应用开发UI/UE设计概述 　　智能手机发展到今天已经十余年载，风靡全球，苹果的iphone手机更是独占鳌头，当然这也与苹果iphone手机的UI界面美观和很好的用户体验分不开的。试想一下，一个看起来不美观的应用程序，是很难引起用户的点击和继续探索的欲望的。更何况在竞争如此激烈的APP市场中，出众的UI设计才能完胜。 　　在iOS应用开发中，作为手机人机交互的纽带――UI，它将成为手机市场的新卖点，同时也是手机的发展动力。苹果iphone手机基于iOS 系统，有很多传感器应用在手机上，如：运动，加速传感器、环境光传感器、距离传感器、磁力计传感器、陀螺仪等等，让操作界面更是酷炫无比，脱离了传统手机应用的单调和刻板。本文主要结合iphone本身的特点以及手机用户的视觉，触感等方面入手，阐述在iOS 开发中如何把UI设计的让用户操作习惯，审美特征，视觉感受，功能期望等等做到更好，让用户在人机交互中体验最大程度人性化。本文以课堂教学案例校园欢乐送APP UI设计为例。 　　2 iOS 开发中UI/UE设计基础 　　1） 图片的处理 　　对于网络上丰富的图片资源，我们在做设计的时候都可以进行综合运用，不但提高视觉效果也提高了设计的效率。例如应用程序启动画面通常都是有若干张图片轮播滑动产生的效果，这时我们就需要图片素材了。但是网络上的图片往往不符合要求，我们需要进一步处理。例如，图像大小应针对具体的设备来进行裁剪；图片中的冗余信息我们也要去掉；另外?要针对图像的格式进行恰当选择，位图和矢量图如何取舍，更多的时候我们选择PNG格式的图片。 　　要想把照片处理达到我们想要的预期效果，更多时候我们选择Photoshop软件。 　　美国 Adobe 公司研究和推出的 Photoshop软件在全球范围内广泛使用，通过融入平面广告设计、图像合成、包装设计等多方面功能来完成新的融合，在多个领域均有涉猎和拓展，从用户使用和处理效果来说，Photoshop已经成为了平面图像处理的标准之一。Photoshop本着以人性化、实用化为目标，通过其简介的操作界面，快速有效地完成各种设计，提高的设计的效率，收到广大设计者的信赖。 　　2） APP图标及按钮的设计 　　APP图标一般放置在主屏幕上的，用户通过点击图标来启动应用程序，它就类似于你手机APP产品的LOGO，用户看到图标的时候就对你的APP产生了第一印象，甚至有可能以此来判断你的APP品质，作用以及可靠性等，因此图标设计的好坏关系到你APP的存亡，它是APP UI设计中非常重要的工作。 　　如何做好APP图标设计，我们先要将APP的应用功能具体化，然后通过联想找到对应图形，紧接着将抽象图形。例如天气预报APP，我们联想到太阳，云都是跟天气有关，因此iphone中的APP用太阳和云朵抽象组合，图标来源与生活，让用户也倍感亲切。 　　但值得注意的是，抽象图形不能过于抽象，否则很难分辨，从而降低了图标的识别度，从而适得其反。 　　有时候相同功能的APP可能存在一定的相似之处，如微信和米聊，都是聊天通信应用程序，他们都是有气泡组成的，因此在做设计之前最好还是要做好调研工作，看看同行设计的样子，然后通过分析调整设计，做到区别而又新颖独特。 　　Sketch是一款使用与所有设计师的矢量绘图应用，而矢量图也正是目前网页、图标和界面设计最好的方式。同时Sketch除了矢量编辑的功能外，还添加了一些基本位图工具，如模糊和色彩校正等。目前越来越多的设计师开始使用Sketch去做UI界面设计，原因很多，一方面它足够轻巧，对系统配置要求不高；另一方面，内置了大量提高工作效率的特性，使用起来很方便；还有救是他的朵花瓣工作模式，让设计师在同一个界面可以将交互过程串联起来非常方便。 　　欢乐送app主图标作为一个app的灵魂，必须要充分反映此款app的主题，首先底部选择一个圆角矩形作为背景，因为此款app使用对象是大学生，主要是用于大学生代拿快递的app。现在大部分大学生性格急躁做事情急于求成，使用圆角矩形寓意让学生做事情学会圆润，做事情不能急躁。然后图标背景色是灰白渐变色，如果单独选用白色会显得单调。翅膀有两重含义，一种是代表了我国快递业迅速发展；另一种则