毕业论文：手机界面的交互设计(2015-04-18)

1、重庆工业职业技术学院毕业论文（2012届）手机界面的交互设计学生姓名 方玉凤 学 号 201250430141 院 别 信息工程学院 专 业 图形图像制作 指导教师 谢雪晴 完成日期 2015年3月9日 手机界面的交互设计摘 要 本课题主要分为两部分：(1)手机交互设计的现状调查，包括手机的市场、使用人群、使用功能、键盘与界面的关系分析。（2）手机交互设计包括：设计定位、设计要求，创新之处，树状结构、图标设计。通过现状调查分析现有手机界面设计的优缺点。研究学生人群智能手机短信功能的界面和操作，了解拇指的运动习惯和缺陷，分析键盘与界面的关系。使现有的手机界面更人性化，置界面于用户的控制之下。关键

2、词 计算机辅助工艺设计 数码产品 交互设计目 录第一章 手机交互式设计的概念及发展21.1手机的概念21.2交互设计的概念和发展21.3 界面设计的概念31.4 交互设计和界面设计的区别4第二章 手机图标交互设计的发展前景42.1交互的概念及交互设计的原则42.2手机图标交互式设计的发展前景8第三章 手机交互设计93.1 选题背景93.2 主题确定103.3 主题制作的难点及解决方案11第四章 手机图标的设计过程114.1 绘制草图114.2创意思维114.3绘制整体界面124.4参考市面上的各种手机菜单144.5归纳要设计的菜单内容，分别对其选项进行绘制144.6最终效果16结论19致 谢2

3、0参考文献21 引 言现在的社会，处于知识经济时代，在满足了物质需求的情况下，人们逐渐开始追求自身个性的发展和情感诉求，设计必须要着重对人的个性需求进行考虑。人的个性不只是表现在审美、价值观方面，还要深入研究生理、心理、环境对人的影响，从而做到真正的设计以人为本。手机设计的个性化已经不仅仅局限于手机硬件的外观，用户的直接操作和应用才是主体。界面的设计已也不只是皮肤的变化这么简单，人机逐渐渗透到其中，个性化界面正日渐成为该款手机是否具有竞争优势的重要条件。第一章 手机交互式设计的概念及发展1.1手机的概念我们所用的移动电话，通常称为手机，是可以在较广范围内使用的便携式电话终端，目前已发展至4G。

4、手机日日随身备用，在数码产品当中使用率是最高的。手机已成为时代的必须品，随着技术水平的提高，人们在对手机需求的同时，对它的造型以及款式的要求也很高，当然也少不了手机的操作界面，较以往更加人性化，各种手机界面图标主题层出不穷，方便使用人员的操作以及视觉上的享受不一样的效果。1.2交互设计的概念和发展历史具体来说，人机交互用户与含有计算机机器之间的双向通信，以一定的符号和动作来实现，如击键，移动鼠标，触屏、传感、显示屏幕上的符号/图形等。这个过程包括几个子过程：识别交互对象-理解交互对象-把握对象情态-信息适应与反馈等；而人机界面是指用户与含有计算机的机器系统之间的通信媒体或手段，是人机双向信息交

5、互的支持软件和硬件。这里界面定义为通信的媒体或手段，它的物化体现是有关的支持软件和硬件，如带有鼠标的图形显示终端等。交互式设计与其他元素的关系如下图1.2-1图示说明 1.3 界面设计的概念界面设计是人与机器之间传递和交换信息的媒介，包括硬件界面和软件界面，是计算机科学与心理学、设计艺术学、认知科学和人机工程学的交叉研究领域。近年来，随着信息技术与计算机技术的迅速发展，网络技术的突飞猛进，人机界面设计和开发已成为国际计算机界和设计界最为活跃的研究方向。软件用户界面（Software User Interface）是指软件用于和用户交流的外观、部件和程序等等。如果你经常上网的话，会看到很多软件设

6、计很朴素，看起来给人一种很舒服的感觉；有点软件很有创意，能给人带来意外的惊喜和视觉的冲击；而相当多的软件页面上充斥着怪异的字体，花哨的色彩和图片，给人网页制作粗劣的感觉。软件界面的设计，既要从外观上进行创意以到达吸引眼球的目的，还要结合图形和版面设计的相关原理，从而使得软件设计变成了一门独特的艺术。1.4 交互设计和界面设计的区别从广义上来说，也可以认为界面设计包含交互设计，在这样的情况下，它同时还包含另外的部分例如外观设计或平面设计，这些都是可以单独进行研究的更细的分支。交互设计更加注重产品和使用者行为上的交互以及交互的过程。而界面是一个静态的词，当进行界面设计的时候，我们关心的是界面本身，

7、界面的组件，布局，风格，看它们是否能支撑有效的交互，但是，交互行为是界面约束的源头，当产品的交互行为清清楚楚地定义出来时，对界面的要求也就更加清楚了，界面上（如果存在可视界面的话）的组件是为交互行为服务的，它可以更美，更抽象，更艺术化，但不可以为了任何理由破坏产品的交互行为。第二章 手机图标交互设计的发展前景2.1交互的概念及交互设计的原则人机交互是指人与计算机之间使用某种对话手段，以一定方式，为完成确定任务而进行的人机之间信息交换的过程。人机交互方式是指人机之间交互信息的组织形式或语言方式，又称对话方式，交互技术等。人机通过不同的人机交互方式实现成人向计算机输入信息以及计算机向人输出信息的工

8、作，常用的人机交互方式有：问答式对话、菜单技术、命令语言、填表技术、查询语言、自然语言、图形方式及直接操纵等。交互设计时应该遵循以下的原则。2.1.1友好性     友好性是指用户操作系统时主观操作的复杂性，如果主观操作复杂性越低即系统越容易使用，则说明系统的用户友好性越好。例如在设计幼儿课件时，由于儿童的手的活动还不是很灵活，难以通过拖动鼠标来完成屏幕对象的移动，因此尽量避免设计这一类的游戏活动，而多采用单击鼠标左键等方法来进行游戏。如果交互界面友好，系统能容易地处理各种基本交互：例如各种输入、输出功能、通信功能以及扩展功能等。2.1.2灵活性

9、60;   交互系统灵活性是指系统能用不同的交互方式去完成某一特定目标，也就是说，交互方式不应该是死板的、不可改变的。交互系统灵活性应该包含以下含义：（1）系统能完全适应各类用户（从偶然型用户、生疏型用户到熟练型用户，直至专家型用户）的使用需要，提供满足各种要求的界面形式，但是不同的界面形式决不会影响系统任务的完成，因为系统完成的任务仅由用户及其目标决定，而不应由交互方式决定。（2）用户可以根据需要制定或修改交互方式，在需要修改、扩充系统功能的情况下，也可以提供动态的交互方式，如修改命令、设置动态菜单等。（3）系统能按照用户的希望和需要提供不同详细程度的系统响应信息（包括反

10、馈信息、 提示信息、帮助信息、出错信息等）。为使交互系统灵活，不能简单地提供大量界面去对付每一种可能情况，较好的方法是通过动态分析用户状态和模型，把用户模型作为系统设计的一个因素，从而建立起灵活的系统，当然使系统有高灵活性是要付出代价的，它将导致程序复杂化和运行效率的下降。2.1.3功能性      交互系统的功能是指交互系统对每一用户命令所能完成的工作量，如果一条命令能完成许多任务，则说明它的功能强。使用者都希望系统提供强有力的命令，然而同时应考虑与用户具有的知识和能力相符合。2.1.4明确性     交互系统的

11、明确性是指系统功能和行为对用户是明确、清楚的，这意味着不管系统本身是多么复杂，用户心目中的系统都具有清晰的、一致性的模型，用户可清楚地了解系统的功能并随时预测系统的行为。2.1.5一致性     交互系统的一致性首先是指系统采用一致的方式工作，要求系统工作方式或处理问题的步骤尽可能和人的思维方式一致；其次是指系统不同部分及不同系统之间有相似的交互显示格式和相似的人机操作方式。一致性的交互系统可帮助用户把他们当前知识经验推广运用到新系统、新命令、新操作中去，从而减轻用户重新学习和记忆的负担。2.1.6可靠性    

12、交互系统的可靠性是指系统正常（无故障）工作的能力。交互系统应使用户能正确地使用系统，保证有关程序和数据的安全。另外，系统应具有一定的容错能力。 2.1.7图形化      图形具有直观形象、信息量大等优点，因此使用图形和比喻来表示程序、实体和操作，使用户的操作及响应直接可视和逼真。 使用图形和比喻设计交互时应做到以下几点： （1）用户控制软件及运行。由用户决定、定义应用程序以何种交互方式进行工作，用户可以选择软件的交互方式。（2）用户直接操控，用户通过借助直观、可视的屏幕对象，直接控制软件的运行。（3）保持应用系统交互与现实世界的一致性，不同系统之间和应

13、用系统内部交互的一致性，使它们有相似的外观和操作。 （4）使用可分辨的比喻，增加系统的可理解性和易学易用性（5）适应和认识人类的能力及弱点，使交互活动满足人的认知、行为因素的要求，充分发挥人、机两方面的特长。2.2 手机图标交互式设计的发展前景当今社会，科学技术突飞猛进，新兴产业的兴起主要靠的是知识的创新。例如诺基亚企业凭借充满灵感的设计迅速从强大的竞争对手中夺取自己的市场份额，而创新是提高竞争力的有效手段。当那些市面上琳琅满目功能齐全的手机出现在消费者面前时，越来越多的人开始注重手机的美化。这其中也包括了手机美容这种新兴行业的发展。DIY手机，在改变越来越多传统的人对于手机使用的观念，尤其是

14、时下的年轻人。他们对于个性的追求更加强烈。手机美容正是在这种背景下产生的，早在2000年初日韩等国便已开始，现已发展成为市场炙手可热非常成熟的一个服务产业。如饰品、镀膜、实物彩色快印，而现在发展最快，赚得利润最高的是手机贴膜，装在手机机身表面、屏幕及其他有形物体的一种冷裱膜，这样手机可以焕然一新、光亮夺目，不仅可以起到旧机翻新的效果，而且可以防水、防止灰尘进入键盘、屏幕，起到保护的作用。现在，这种行业在大街热闹的地方或者流行的区域频频出现。不过手机美容仅仅是局限于手机外观的美化，对于手机界面图标的美化，这种却出现的很少。很多商家只是注重产品开发的形态以及功能，数码产品，其外观及功能越来越趋向同

15、化，很难有更大的突破。即使产品出现新技术新功能新形态设计，也会被同类产品争先模仿，往往难以突破这一瓶颈。而市场上对于手机交互式设计这一块涉及的领域却不多。人们为了追求手机个性化总是喜欢去网上下载一些主题图标，除此之外很少有别的渠道进行美化手机固件。但往往手机主题下的都是千篇一律，出现重复的现象也并不稀奇。要是有种专门为自身喜好订做的手机主题，那无疑是时尚的领军人物，而专门从事这种行业的人少之又少。对于手机的交互式设计，所用到的技术也是很简单的，无非就是平面软件的设计。而平面软件，它往往上手难度相对不是很高，只要用心去做，并富有一定的创造力和想象力，并把握时下流行的方向，就能制作出一款很棒的手机

16、主题。比起对数码产品设计那种冗长的三维造型，对尺寸结构的精密分析，平面软件的设计相对有趣味性。市场决定设计开发的方向及理念，只有用创新的思想做产品设计，才可使自己与其他人处于同一起跑线上甚至领先于其他人之前，置自己于绝对的竞争优势地位。第三章 手机交互设计3.1选题背景一个设计师,首先应以创新求变为自己的设计理念,以产品的不断革新发明为自身的宗旨。从这个意义说,工业设计体现了人类精神积极进取的一面。要给予想象，给予创造。 好的构思就能造就好的产品，供世人赏析。目前，市面上的手机大致分为商务手机、相机手机 、学习手机 、老人手机 、音乐手机 、电视手机 、游戏手机 、隐形手机 、智能手机。每种手

17、机均能满足不同身份的人使用。例如学习手机，适合学生使用，商务手机则适合办公的人使用。各个年龄段使用的手机也有所不同，像年轻人比较倾向于音乐手机，游戏手机，而老年人则喜欢使用老年手机。也可以根据爱好的不同手机类别的受众也有所区别，如爱好摄影的用相机手机等等。市面上的这些手机外观颜色上上往往或多或少地接近符合手机定位的主要人群。因此，手机图标的设计也要符合以上所述的。首先，不用急着去想主题的内容，而是去思考设计的主题到底符合那种类型的手机，甚至是哪个公司的何款手机。3.2主题确定 本人制作一款手机图标主题，比较符合音乐手机的主题。音乐手机，顾名思义，是MP3与手机的相加，但并非简单的叠加，其同时还

18、必须拥有一个可靠的数字音乐播放器，能够支持MP3和AAC等开放的标准音乐格式，并且产品的容量需求等方面均有一定的要求。同时，音乐手机还需要具备音乐搜索、音乐下载和从其他设备上传输音乐文件的功能。鉴于音乐手机在产品、价格、技术、使用以及业务应用方面有很大的突破点，因而在短期内能够担当市场主流的重任，并得到迅速普及与发展。音乐娱乐功能得到大力推广，个性化及时尚非常受年轻人的欢迎。年轻人虽是手机用户的主要受众，但它不仅适合年轻人，只要喜欢音乐的人都适合使用。不像一些如商务手机那样有局限性。主题有很多可以考虑的方向，也结合音乐手机的特点进行选择。我选择以复古为主调的手机图标。此外，设计的方向主要走欧式

19、风格的，与主题的形象相一致。3.3 主题制作的难点及解决方案确立好主题后，仔细分析其制作存在的问题。尽管主题的制作简单，不用太过复杂的工具，仅仅使用一些PHOTOSHOP等平面软件具可以了，但简单有时也意味着设计的单调性，如何在主题简单的情况下设计出富有创造力时尚感的图标，这是本人要认真去探索的。可以去借鉴网上的一些素材图片，寻求灵感。可以引入很多素材，在不影响整体性的情况下，尽可能避免直接使用其形象，要对它的组成进行细致的分析，进行夸张的变形，甚至直接取用形象的整体颜色，但给使用者直观地感受到主题。这是难点，也是值得挑战的地方。第四章 手机图标的设计过程4.1 绘制草图 4.2创意思想先市场

20、上大多都是智能手机，而智能手机大多都是年轻人在使用，年轻人是一群比较张扬个性的群体，因此在设计时考虑的是年轻人这一大群体的心理。现代经济飞速发展，人们的生活节奏越来越快，也就越来越感怀怀旧，就我个人而言也是非常喜欢有材质感有复古感的东西，所有首先就被复古这个词牵引了。浏览了一个主题的软件，发现复古的图标界面和有材质感的图标界面是下载的非常多的，但是同时具有材质感和复古两种元素的图标界面却是很少的。因此更加确定了这一设计方向。4.3绘制整体界面桌面底部图片如图4-1-1，4-1-2所示，先用Corel DRAW画好外框，然后导出，导出的是矢量图，再导入photoshop里，进行一定的后处理，图4

21、-1-3为完成后的手机底部图片。图4-3-1图4-3-2图4-3-34.4参考市面上的各种手机菜单图4-4-14.5 归纳要设计的菜单内容，分别对其选项进行绘制先用PS里画草图，并贴上颜色，再用添加材质，添加图层样式，使图标具有复古材质感（如图4-3-1,4-3-2，4-3-3）图4-5-1图4-5-2图4-5-34.6 最终效果图4-6-1全部图标如下全部功能栏图标归类整理如下图 结论本文通过对手机界面图标分析和设计，得出以下结论：（1）通过此次设计，旨在自身的工业设计上获得新理念、新观点，发展和提升工业设计水平，并具备一定的图像创意设计能力，使以后的设计时候提供从容的应对方案。（2）对工业设计的重视程度提高了，了解工业设计是一门涉及相当广博的学科，以往的产品只体现在用上，而现