简游APP设计文案.doc

学 士 学 位 论 文系 别： 美术与工艺设计系 学科专业： 雕塑陶艺 姓 名： 郝一超 运 城 学 院2016年 4月 简游APP设计文案系 别： 美术与工艺设计系 学科专业： 雕塑陶艺 姓 名： 郝一超 指导教师： 方琼琳 运 城 学 院 2016年 4 月 简游APP界面设计文案摘 要：简游是一个提供海量轻应用游戏的APP。在本文中笔者主要介绍简游的UI设计模式，主要包括界面设计中的架构、布局和色彩搭配。由于产品的主要作用是引导用户更方便、快捷的进行使用。本文试图在探索简游APP的设计中，做到最简单、最舒适的用户界面，让用户以最少的学习成本得到最舒适的操作体验。让轻应用逐渐替代传统APP，成为APP主流发展方向。 关键词：扁平化设计 APP设计 颜色搭配 轻应用 用户体验Jian You APP interface design schemesAbstract：Jian You is a game for amounts light application of APP. In this article, the author mainly introduces Jian You UI design patterns, mainly includes the interface design of the structure, layout and color collocation. Because the main function of the products is guide the users more convenient and fast to use, so in the design of the APP, do the most simple and most comfortable user interface, let users with minimal learning curve to get the most comfortable experience. Predictably, light application will gradually replace traditional APP, become a mainstream APP development direction.Key words：Flat design, APP design, Colors，Web App， User experience目 录前言一 设计构思1二 设计定位1三 视觉表现2（一）主页风格2（二）排版方式3（三）功能架构方式3（四）界面色彩搭配4（五）Android端与iOS端的适配4四 设计心得6参考文献7致谢8附图9前言GUI(Graphical User Interface)是一种结合计算机科学、美学、心理学、行为学，及各商业领域需求分析的人机系统工程，强调人机环境三者作为一个系统进行总体设计。对大多数人来说，用户界面就是软件本身。所以，掌握用户界面设计的技巧与技术是让软件走向市场的最直观因素。界面是一个窗口。界面设计是开发中最重要的方面，并将涉及到整个开发队伍。对于应用软件来说，一个基本现实就是：用户界面是面向用户的。用户需要的是开发者开发的应用软件满足其需求，并且易于使用，用户界面走到今天真是千锤百炼，要做到易用就更是难上加难。太多的开发者自以为是艺术天才，他们不去尽力遵循用户界面设计标准，或花精力使得产品好用；相反，他们错误地认为编写更灵巧的代码或是使用一套确实有趣的颜色方案才是重要的事。Constantine(1995)指出，好的用户界面使得人们不用阅读用户手册或接受培训就能使用应用软件。对于软件公司来说，软件产品就是他们的商品，而软件界面就是他们产品的外观，界面的美观与否，直接关系到了软件产品的营销成败。一 设计构思在轻应用提出以前，想体验游戏只能通过在应用商店下载游戏，安装成功后再开始体验。一是要消耗更多的时间与学习成本，加长了用户的等待时间。二是占用了手机很大的内存，减少了游戏种类的体验。传统APP虽然依靠用户保有量大、起步时间早等优势，成为现今APP应用体验的主要模式。但不可否认的是，随着轻应用的兴起，传统APP存在的依赖流量、需客户端下载、占用系统内存等诸多弊端，已经使其不再适应趋势的发展。轻应用介于网页和客户端之间，具有网页灵活性和客户端业务功能的双重特点。移动互联网对比传统互联网的优势在于为用户提供更明确的身份标识以推送精准服务和更多身份识别业务。结合目前国内详情，产品的开发者并不能享有相应的经济报酬，利润大部分归于渠道商手中。 针对这些问题，结合轻应用理念，以简游为载体，抓住用户的痛点，兼顾普通用户与产品开发者，将海量游戏集合于简游之中。结合社区等功能，创建一个较为完备的游戏中心与产品开发者交流发展社区。因此，良好的用户体验和简洁的界面成为了设计工作中的重点。在简游项目之初，团队做了大量的市场调研，对同类产品进行了科学而系统化的分析归纳。为了体现产品的自身特色，将重点放在了用户体验和服务上，那么产品的发展方向则定在服务和体验的提升上。所以，线上产品包装和设计，尤为重要。本文将着重介绍对于线上产品的界面设计，针对简游涉及到的架构、布局和色彩搭配问题进行论述。二 设计定位经过市场调查及分析，简游作为游戏类APP，目标人群多为男性且年龄多在15-40岁之间。最终对简游的整体风格定义为简单、易用、游戏体验良好，主要是达到良好的用户体验。对于界面的颜色把控，在参考市场内各类型产品，最终将产品色彩定为黄色系风格。在市场和商机并存的情况下，大量的创业者涌入了这个新兴的模式中来。我们面临着极多的竞争和巨大的压力。只有专心做好自己的产品，紧抓用户体验和服务质量，才有可能在众多的竞争者中存活下来。在这个浮躁的社会里，耐下心来安安静静的做一款好产品。将产品的名字定为简游，寓意简单生活，快乐游戏。希望用户在使用过程中得到良好的游戏体验，同时也希望创造一个良好的平台供开发者交流和使用，创造良性竞争。（整个段落写的不深入，应该写的更详实些。）三 视觉表现随着移动互联网的飞速发展和人们设计水平的进步，消费者对于产品的需求发生了翻天覆盖的变化。能被人们的眼球吸引的不仅是产品的功能，现在人们关注更多的是产品的体验，大部分产品在功能良好的情况下被同类产品所替代往往是在细节的表现上。所以达到优秀产品的关键点是功能的易用性和良好的用户体验。在项目中，设计优先，功能为王。对于界面上而言，色彩搭配合适，页面布局科学成为了界面好与坏的一个标准。针对于此，简游的设计遵循统一的准则和完备的控件库。首先，在设计过程中，基于产品休闲娱乐的定位，在一些引导性的提示中会运用一些诙谐幽默的提示性话语，给用户以良好的交互体验反馈，增加产品的趣味性和情感化。其次，在图形设计方面，保持风格一致的基础上，使用直观性、概括度高的图形，指示明显，表意明确。再者，以内容为导向的版式与布局要遵循“具体界面具体应对，既变化又统一”的原则；统一形式的导航栏设计实现了各个界面的连贯性；充分合理的利用了界面空间，让每个功能都有自己的版式和布局，共性中突出了个性。总结如下，在简游界面设计中，颜色使用恰当，使用统一的构图和布局，统一的色调、对比度和风格，以及一套风格适配的ICONS。（一）一目了然的主页风格当本人拿到简游这个项目时，第一要考虑的就是主页首屏的风格。因为一个APP中的主页将影响整个APP的风格走向。在主页的布局中，我们可以这样来看待：当用户第一次下载安装APP，在打开应用的第一时间看到界面，也是给用户留下宝贵的第一印象的界面。手机APP第一屏最重要的一点是它的屏幕分辨率大小的局限性，因此第一屏在保证模块长短的同时，模块可用性、易用性以及界面设计的美观度至关重要。应用的主页是我们在最开始使用应用时使用，应该引导用户去使用的界面。这个界面中展现了这款APP的主页功能和使用特点，所以应用主页界面的用户体验效果将会影响到用户对APP的后续体验。因此，作为设计师应该更加会对主页进行精心考量和思考，根据用户以及各种因素的不同做相应的更新和个性化，制作一个良好的交互效果以此来达到更好地用户体验效果。因此，设计时需要对其设定界面主色调，整体布局和整体信息内容的排版。所以主界面一般用来展示用户与用户之间互动的最新内容，以便吸引用户持续使用 APP。在对简游的主页界面设计上，主要需要突出简游主要功能和使用特点。简游APP是一款相对于比较新颖的产品，那么在简游主页界面设计中就要让用户快速明白简游这款APP的主要功能和使用特点，否则用户在没有真正使用之前可能因为太多的困惑从而放弃使用。当用户使用简游APP时，如果用户不知道这个APP，那么单从简游这两个字眼是很难能够知道这个应用的功能和特点，如果能够在（如图3.1）APP主页设计相关的文字，用户将会对简游的功能和用途一目了然，知道这是一个拥有海量游戏集成的APP。在设计简游主页的时候在充分理解目标用户的使用习惯和需求的基础上，结合上应用的功能和特点以及行业分类进行了设计。在布局上采用列表式的布局方式对首页进行布局，以列表的形式展现具体内容，根据数据的长度自适应展示。对游戏的类别和热度分类，同时加上ICONS和文字的搭配，使得主页功能一目了然，便于用户快速查找和开始游戏，也符合最初的设计目的。（二）触手可及的排版方式  简游的主要功能是游戏体验，同时兼顾游戏经验交流和分享。当用户在使用APP时，可以通过主页的引导到达这个界面，用户根据流程进行游戏体验，简游的流程排版上充分考虑了目标人群对不同类型游戏的需要，可以满足不同人群的游戏体验。版面设计中必不可缺的元素可以肯定地是文字，文字信息是模板内容信息展示的具体表现形式，是传达信息的主体部分。文字的字体，大小，颜色的设计要符合模板的整体风格的表现。文字的排版要保证模板各个板块的统一性。文字作为视觉表现要素之一，与图形与色彩相比较有着更优的传播效力，不仅在模板中，在其他类设计中文字的排版与设计既是设计的重点，也是设计的难点。（图3.2）产品外观决定了设计元素的运用，为了更好的运用图形，就必须对产品的全面了解和对设计要素的充分掌握。简游APP中的各类图形微软游戏这一模块进行设计，例如游戏手柄、操作杆等。同时功能性图标伴随着相应的功能而存在，功能越丰富，图标越多，形成了一整套图标。风格或造型相一致的图标设计使整个 APP 界面和谐、具有整体性，无论从感官还是交互上都可以增加用户使用的好感和愉悦度。由于手机作为设计载体的特殊性，用户会使用手指直接与界面产生互动，完成所有操作。为界面元素安排合理的布局从某种意义上来说就是为手指安排舒适的布局，更准确的说是为拇指安排布局。用户在单手持用手机的情况下，虽然拇指能滑到整个屏幕，但只有三分之一的屏幕是真正容易触及的，也就是拇指正对的区域。因此，产品的重要操作都放在这一区域，给用户提供良好的操作体验。（三）合理的功能架构方式简游APP在布局时，采用宫格、列表等多种布局相结合的方式。主要有以下几种设计原则。移动APP设计中常用的隐藏元素有以下三类： 1有形的控件：如按钮、标签、菜单、导航2手势与重力感应：包括长按手势、横滑手势都是这一类；3操作路径：把不常用的功能或设置项藏得深一点，通过层层递进达到目的。关于简游功能上面的架构考虑到有些时候也有组合一些或者是合并一些相同的元件和功能，保持统一性。譬如移动端应用界面设计中的减法也常常见于各种组件的组合，如输入框与标签、导航与下拉菜单等。这样的功能架构方式体现了以用户为中心的思想，主要功能突出，交互层级浅的特点。移动端屏幕空间非常有限，每一个小小的角落都在界面设计上都非常的宝贵，通过一些共同空间元素的使用，可以使得多个界面的跳转及不同元素状态之间的切换变得更加的流畅。简游更多的设计是为了考虑产品的可替换性，在设计过程中提供各类型模板供开发者使用，易于产品的更新和维护。在产品的交互设计过程中，认真合理的思考了每一个模块、界面之间的跳转与衔接，使之更合理，做到从哪里来，到哪里去，流畅衔接了每一个界面。（四）统一的界面色彩搭配APP 的界面主要由不同功能区块构成，如导航、按钮、图标等，色彩的使用既要有统一性，形成 APP 区别于其他产品的独特个性，也要兼顾不同功能区承载的作用，协调、呼 应、对比，通过合理的配色提升 APP 界面的易用性。在简游界面色彩搭配中，根据简游的标准色黄色进行拓展，运用近似色和对比色的互相搭配。导航用主色调突出、背景用白色弱化便是使用了差异化的色彩 搭配方法，根据主色调的属性，选用不同的辅助色，帮助用户直观地区别不同功能区块，根据自己的需要快速做出选择。对界面中的重要信息在颜色上突出显示，聚焦用户注意力，引导用户完成各项操作。同时用不同的背景色来告诉用户处于应用中不同的版块。用不同的按钮颜色来表示同一按钮的不同状态，引导用户进行下一步的操作点击。（图3.3，图3.4） 在主要功模块，各类标题文字之间的颜色对比，让各个功能模块的视觉层次感增强，色彩的跳跃感让界面视觉感知更加丰富，同时让用户更明确的知道如何操作，引导用户沉入。依据 APP 功能设计的实际情况谨慎使用，处理好每种颜色所传达给用户的含义，不能适得其反，因为过多的色彩或是色彩搭配的不协调引起用户反感。因此在整个APP界面设计中采用了黄色系、黑色、灰色，是界面整体统一。四 设计心得 本文对简游APP设计过程中运用到的一些设计理念和设计原理进行讲述，从视觉、交互、用户体验串联起了简游APP界面的各个环节。分析界面以及各元素之间的设计原则和方法，把握一致性，以用户为中心，围绕用户体验进行设计。 研究产品的设计过程同时也是一个重新学习和认知的过程。设计在这一过程中的创意化表现同时，也预示着未来设计的无限可能。同时也要注重用户体验，以用户为中心进行体验模式的设计，运用互联网思维。作为简游APP项目中的设计师，在设计的过程中很多的时候是设计师的各种尝试。想要出一个好的作品或者说一个好的产品，离不开严谨细致的工作流程，行之有效的手段。涉及到具体的实施要有效率，苛求完美。在被外界的信息影响着的同时要在设计中保持清醒。做自己感兴趣的事，做好自己感兴趣的事。 参考文献（不少于九本书）1（美）托里斯.用户界面设计与开发精解.清华大学出版社M.2002-122 加德纳,费加尔. 21世纪超级标志设计M.上海人民美术出版社.2000. 3 (日)松田行正,黄碧君译.圆与方M.中央编译出版社.2013-2-1（67）4 (日)原研哉著,纪江红译.设计中的设计M.广西师范大学出版社,2013-11(352)5 李杰臣.图形设计原理与实践M.印刷工业出版社，2013-5-1（83）6 范文东.色彩搭配原理与技巧M.人民美术出版社，2006-6-17 王绍强.品牌设计中的色彩M.中信出版社，2011-118 苗雪兰,刘瑞新. 计算机图形学理论及应用技术M.机械工业出版社, 2003-19 蒋陆.手机图形用户界面的图标个性化设计研究J.黑龙江科技信息，2007（49-50）致谢大学生活伴随着这篇论文的完成也接近了尾声。这四年的时光无论是学业还是社会实践都收获颇丰。论文的选题也是围绕自己喜欢的和未来从事的行业 方向展开的。整个研究和书写的过程，不仅是自己再次学习的过程，也得到了老师和同学的很多帮助，在此向他们表示感谢。首先特别感谢我的导师方琼琳老师在论文写作期间给予的教导和指引，让我理清了思路，抓住了重点，顺利完成了全部内容。在我学习期间，方老师严谨细致的工作态度，丰富的教学经验以及给予我的鼓励和支持带给了我很多 积极的影响。感谢我的同学们，感谢你们在论文写作过程中给予我的关心和帮助，对我遇到的细节问题也给予充分的说明，感谢他们，让我感觉所设计的产品展示更有看点。附图 （附图少而且小，可放大些。另外，附图要标注序号和名字 ）