面向智能手机的UI界面设计

朱轩樱

摘 要：随着手机的普及和功能的增强，越来越多的用户追求手机界面的美观度、愉悦的交互感，又能体现个人独特而鲜明的风格。本文从智能手机UI界面设计的现状到自行设计完成一套界面，阐述了具有统一风格的系统图标并伴有动态的独特解锁方式，提高用户的私密性、使用的舒适性与愉悦性，使机械化的东西不再机械，更具人性化，达到吸引消费者的目的。本文旨在探索如何设计出符合现代人审美情趣，能展示用户独特的风格，同时探索动画在手机UI界面上的运用以及表现的多样性。

关键词：手机UI；解锁界面；图标设计；人机交互

今天，手机成为移动互联网改变人们生活最为基础的介质之一，不再是单一的通讯工具已成为人们生活工作娱乐的必需品，随着软件的不断开发应用，手机诠释了更加多样化的角色通讯、娱乐、办公、交易……都已经在生活中随处可见。

手机UI界面设计是手机软件的人机交互、操作逻辑、界面美观的整体设计，一直被业界称为产品的“脸面”，好的UI设计不仅是让软件变得有个性、品位，还要让软件的操作变得舒适、简单、自由，充分体现软件的定位和特点。当手机商发布智能手机时出现在人们面前的第一张图片就是手机解锁页面，2007年iPhone发布会上，乔布斯实机演示滑动锁屏为序幕，当时小丑鱼的背景纸和新颖的滑动锁屏方式，震撼了普通公众乃至整个业界，解锁界面从此在手机UI设计中拉开了大序幕。在智能手机界面设计中操作是否人性化？色彩搭配是否舒适？画面质感是否新颖等等众多因素影响着用户对于产品的选择，可以毫不夸张地说，产品拥有一个让人眼前一亮的手机UI设计，就等于拿到了在用户心目中的通行证。

本文涉及的手机UI界面设计指装有安卓系统的智能手机解锁界面和解锁完成后进入系统在手机屏上一系列系统图标，本文指的图标是狭义的手机屏幕上表示命令、符号、功能、图像等。

1 手机UI的现状

手机从最初体现身份标志物到现在的日常用品，人们关注的焦点逐渐从功能性转移到手机的外观、操作便捷以及UI界面美观的设计，这给手机相关设计提供了广阔的发展空间，但是现在手机UI界面设计也存在以下问题：

（1）手机UI界面形式缺乏统一性，目前的手机UI界面基本是解锁方式和系统图标各自分离，前后衔接不对称，以实现功能为准则，不能体现整套界面的统一性，不能强化用户的个性化。

（2）手机UI界面内容缺乏故事性，现在手机界面基本是千机一面，界面设计大同小异，大部分手机界面没有自己思想，由于没有故事情感在里边，设计出的界面是随大流，创新力严重不足。

（3）手机UI界面交互缺乏愉悦性，目前手机UI解锁界面和图标采用静态的方式呈现，表现形式相对比较单一，缺少动态化和趣味化；开锁界面单调乏味，缺乏娱乐性、设计性，最重要的是无法满足用户日益强烈的个性化要求。

2 手机UI的设计原则

手机UI界面和其他的界面设计也有许多共通的地方，但手机UI界面的设计更注重用户体验、操作便捷及内容优质，它不同于电脑等媒介，屏幕的大小限制了展示内容，设计出内容丰富、形式统一又能展示用户的独特性，以满足不同的用户需求，这就要求手机UI的设计更要优于其他媒介的UI设计，设计师应遵守的设计原则：

用户为主体性，所谓界面就是要了解客户的心理、功能的需求，找到用户中意的目标，并且把用户的目标当作自己的目标，把用户当作自己的亲人，要去细细地了解他们的需要，这样才能真正做到以客户为主体。UI是使用者与程序交流的途径，通过UI向用户传达信息进行服务，界面设计的是用户而不是程序员。

图标的一致性，使用者在使用UI界面时要求图标具有一定的统一性，可以让使用者在很短的时间内记住这些图标。相反，如果在设计时采用不同的元素，既乱七八糟又给用户使用带来识别的困难，甚至一些急性子的用户会放弃这个界面。在设计时做到纵观全局把握每个元素，一致的设计目标、元素外观、交互行为是UI设计最重要的原则之一。

视觉的直观性，设计师在设计界面时可以通过改变文字、图片来表达自己的思想，设计之初要找出重点，在吸引使用者兴趣的地方着重处理，由于手机的屏幕小展示的内容多，所以设计师在设计界面时要简洁明了、逻辑清晰、明确地表达内容，让用户一目了然。

操作的简易性，简易就是简单、容易，是为了让用户更简单、更容易地使用产品，减少发生错误的可能。

3 用户体验下的手机UI《念》主题设计

（1）手机UI的市场调查。自从苹果公司推出智能手机滑屏解锁方式，扁平化设计基本是一统天下，可以说苹果开创了手机触摸的新纪元。但是随着时间的推移其界面设计的缺点也暴露出来：一是界面图标设计的表现形式太单一。二是整套界面设计包括开锁和图标的内容缺少故事性。三是图标之间关联性不大，没有统一的主题思想。一款好的界面设计除迎合市场发展趋势还需要满足用户心理需求，在设计初准备200份《手机界面设计市场调查报告》做市场调查，此次参与调查的人员以35岁以下居多。调查情况如下：有41%的用户选择简洁大方的设计风格；有16%的人喜欢手机自带的UI设计，说明这部分人图省事可以用就不换，同时也说明智能手机的自带UI界面设计能满足部分用户需求；有12%的人喜欢自定义手机界面，说明这部分人喜欢风格独特、彰显个性的手机界面。经过分析对比，发现大部分用户喜欢界面干净、整齐，交互功能体验明确、快捷；发现简约型、功能明确的界面设计符合大多数用户的欢迎，因此在项目实施初就决定采用画面简洁、交互舒适、主题突出、故事生动的设计方案。

（2）手机UI《念》主题的风格设定。《念》主题从个性的角度融合活力、唯美、怀念元素来设计的智能手机UI界面，植入动态的解锁方式增强趣味性，使用户在彰显个性的同时体验解锁的快乐。通常用户喜爱的产品是风格上认同内容上共鸣，通过调查分析发现用户群体中很大一部分为离开父母的学子或闯天下的年轻人，作为一个远离家乡，远离亲朋好友，独自在外求学、工作的异乡人，时常牵挂着家乡的人、家乡的景，尤其是每逢佳节倍思亲，别有一番辛酸。由此设计一套采用信封和邮戳为题材，以《念》为主题的手机UI界面，以表对家乡的思念，对远方亲人的牵挂，对儿时童年的怀念。在手机界面设计中色彩的搭配是视觉基础，色彩也最能体现设计意图，随着客户群体的广泛化，客户的性格、爱好以及生活环境而产生不同的心理需求，手机界面的色彩也越来越潮流化、多元化、丰富化。本套设计在色彩搭配注意下面几点：第一，特色鲜明。第二，搭配合理。第三，讲究艺术性。第四，避免使用单色。第五，使用邻近色。第六，背景色的使用。第七，色彩的数量不宜过多。在风格设计上体现明快、简洁，操作快捷，做到解锁和图标风格统一，色彩以米白色为主色调，采用扁平化的制作手法，达到在手机屏幕上浏览时舒服度，同时能体现对家乡的思念。

（3）手机UI《念》主题的开锁界面设计。目前市场上解锁界面分为两类：第一类如iPhone、三星的简洁型，除了时间日期显示没有太多的其他功能，界面清爽。第二类：步步高、魅族、华为等功能型，界面基本为环形，有信息、未接来电等功能的预览，刚用觉得一目了然，用久了会产生操作繁琐的感觉。本款解锁界面设计采用简洁型设计，色调上采用米白色为主色调，蓝色和白色点缀，既符合信封的特质，又简洁大方。界面上保留基础的时间日期，预览时没有短信、电话，运用美式信封为主背景，邮票部分可以让用户选择拍照或者图片进行替换体现界面的独特性，下方的时间显示数字效果和日期都是用设计好的字体效果进行替换。解锁方式是通过手指拖动邮戳部分开始解锁动画，邮戳的埃菲尔铁塔塔尖是解锁位置，拖到爱心松手的话是进入主界面，拖电话则进入拨号界面，拖信息则进入短信界面，快速便捷，通过拖拉邮戳的方式使客户在操作中体验舒适与愉悦，使机械化的东西不再机械，更具人性化，更能吸引消费者。

（4）手机UI《念》主题的系统图标设计（如图1）。图标的基本功能在于提示信息与强调产品的重点特征，以醒目的信息传达让用户知道操作的重点。在手机UI界面中，与用户接触最多的就是手机系统操作界面中的图标按钮，现在各设计工作室把图标设计提高到了一个新的高度，不但强调示意性，强调主题文化，品牌意识，图标设计的表现形式多样，目的是传达出产品的设计理念。《念》选择为信封邮票来表达主题，图标的制作为简洁风格图标，运用整套的配色来完成设计，和开锁界面的用色相互呼应。图标上选用了简介的设计，通过非常大的色差来表现图标的各个部分，图标识别性比较高，同时采用动态的画面植入手机，使简单的图标变得更有趣味性。因此，做得比较符合用户的直观感受，简洁明了，同时强调体现每一个图标的设计功能性，整套手机UI的设计详见图1。

综上所述，整套手机UI《念》主题的界面设计力图做到形式美观、内容完整，主题突出，打破市场上大批人云亦云的手机界面设计。当然要制作完整内容的手机主题还有很多问题有待研究开发，本文只是作一个简单的研究探索。

4 结语

手机产业随着技术标准化生产以及激烈的价格竞争下，手机的人机交互界面（UI）给手机市场提供新的卖点，手机UI界面在未来的发展空间会更大，被认为是新的产业动力。手机UI的新设计与功能开发是根据各种客户群体的喜好及使用习惯而进行的，随着手机用户年龄层的扩大，性别、环境、生活方式的多样化，其开发范围和潜力正在无限扩大。这些新的趋势使得界面交互可能不再囿于某个具体产品本身，它可能开始涉及了与使用环境及其他用户之间的交流。根据对当前手机技术的分析以及对国外在人机交互及相关领域研究的关注，提出了“泛交互”的概念，并对新的趋势、新的设计进行展望。

参考文献：

[1] 周陟. UI进化论移动设备人机交互界面设计[M].清华大学出版社，2010.

[2] 董建明，傅利民，扰培伦.人机交互第3版——以用户为中心的设计和评估[M].清华大学出版社，2010.

[3] Robert Hoekman.Jr .瞬间之美：Web界面设计如何让用户心动[M].人民邮电出版社，2009.

[4] Susan Weinschenk .设计师要懂心理学[M].人民邮电出版社，2013.