全有哦产品APP UI用户界面设计方案 论文

大庆师范学院本科毕业创作（设计）全有哦产品APP UI用户界面设计方案 一、设计方案的背景及意义 （一）设计方案的背景 全有哦产品APP UI用户界面设计方案来源于所在实习公司张家港普西信息科技有限公司接触到的实际项目。这是公司自主研发的一款生活服务类O2O项目手机客户端软件，其专注于本地生活服务的商城，为用户提供各种餐饮、休闲、服务行业的优惠商品。所谓O2O的电子商务模式，即online to offline,其实也可以理解成是B2C的一种变相模式，是将线下的商务机会与互联网结合，让互联网成为线下交易的前台。我所做的是通过分析用户体验和需求，对之前的这款手机APP界面进行改版及再设计，这其中就包含了外卖、预定、家政、车行、零售等服务项目的设计工作。纵观当今社会，移动设备已经成为人们生活娱乐的必需品之一，移动设备的用户界面及体验也越来越受到用户的关注。这里所说的用户界面也就是UI，即user interface。字面上看是由用户与界面两个部分组成，实际上还包括了用户与界面之间的交互关系。目前在国内UI还是一个相对陌生的词，即使是一些设计人员也对这个词不太了解。我们经常看到一些招聘广告上写着：招聘界面美工、界面美术设计师等等，这表明在国内对UI的理解还停留在美术设计方面，认为UI的工作只是描边画线，缺乏对用户交互的重要性的理解。我国的UI设计师市场尚在萌芽阶段，人才缺口巨大。目前，中国市场上的手机、软件、网站等产品同质化程度非常高。过去企业在设计产品的时候，主要是在功能、质量或者产品外观上和竞争对手有所区别，而现在随着技术的进步和市场的发展，越来越多的企业意识到用户体验的重要性了，而这种用户体验的提升则要依赖于UI设计师的劳动。 （二）设计方案的意义 在用户把软件下载下来以后，他们和企业的联系，以及该企业形象在用户眼中的表现，很大一部分是通过软件的界面来传达的，一个简洁美观的界面会给用户带来舒适的视觉感受，拉近彼此间的距离，为商家创造卖点。信息处理成为消费者对手机使用的日常功能，而作为手机人机交互的平台，UI直接影响着用户的产品选择。美观友好的用户界面对于宣传企业文化，对用户灌输企业理念，甚至于对企业的宣传运作都将是非常有益的，美观的界面都会给客户以信心和良好的印象。我认为检验一个界面好坏的标准是用户的感受。所以界面设计要和用户感受紧密结合，这是一个不断为目标用户设计满意视觉效果的过程。 二、设计的意图 全有哦是张家港普西信息科技有限公司旗下的生活服务平台，通过移动端应用解决人们各种生活的不便，例如人们就餐时产生的选择，预定和支付餐饮服务的需求。全有哦最初的概念是针对本地用户，通过“全有哦”，本地居民可以方便搜索到附近的快餐、水果、西点等外卖信息，通过“全有哦”用户可随时随地自助下单，付款，留下送货地址和电话，十几分钟后，外卖商户就把新鲜出炉的美食送上门。不仅仅是外卖，消费者还可以通过“全有哦”中的美食馆查看餐厅的电子菜单，通过图文介绍点好菜后保存订单，到店用手机扫描餐厅二维码，就直接下单到厨房，省去找服务员现场点菜的时间，同时可享受商家提供的折扣优惠，结账时再扫一下二维码，就能使用支付宝钱包快速付款。当然，本款APP还包括了零售、车行、家政的服务项目，可以说操作简便，为用户提供了一个可以尽情选择和比较的服务平台。 三、设计过程详尽陈述 （一）前期准备与调查分析 需求分析：对于一个产品来说，必然要对用户进行需求的分析，一般可以直接与产品经理交流获得相关产品需求。 我觉得好的设计建立在对用户深刻了解之上。了解产品的现有交互以及用户使用产品的习惯等，要站在用户角度思考，如果我是用户，这里我会需要什么？通过前期调查与交流了解到，本地餐饮业商户比较集中的区域，多位于市中心的一些商业圈和写字楼中，部分小型的餐饮店则分布于居民区附近，而像零售、车行和家政公司则同样选择了位于社区附近的地段。由此看出，连锁或者高档一些的餐厅比较青睐于购物圈，入驻到大型商场中，当前来逛街的人们在一天的购物目的达到时也许会感到饥肠辘辘，但又不想拖着疲惫的身子回到家中做饭，于是，商场中的餐厅便成了他们的首选。部分小型的餐饮店、家政公司、车行和零售商店青睐居民区的原因也大多是出于便民，居民可以不出社区，到餐厅内就餐，到商店里购买所需，到车行洗车，到家政公司咨询，其主要针对的是本社区的居民。而更多的商户则希望自己的东西可以让其他社区的居民知道，从而提高销售量。在后来我自己的体验当中，通过对比使用不同的服务性APP，发现在预约这个板块中，对于了解预约时间这个方面做得不够人性化，用户操作起来稍有些繁琐。对此，我会在接下来的设计当中去逐步解决这些问题。 （二）全有哦产品APP UI用户界面设计过程1.交互设计阶段首页： 首页广告一级导航栏：美食馆、外卖、电影、零售、家政活动栏目：美食馆、外卖栏目（好汇吃、午后休闲时光、晚餐）零售栏目：（超级好、第二件半价、限量大抢购）大牌优惠券栏目任务栏：首页、发现、附近、我的我的：我的头像、用户名、我的收货地址、关注、我的优惠券、我的订单（外卖订单、预定订单、点菜订单、零售订单、买单记录）、意见反馈（内容反馈、电话反馈）。我以美食馆预定流程为例：美食馆预定流程： 菜单 点菜 点菜 未点菜 保存菜单 预定用餐日期、时间、人数 到店 未到店 下单（支付定金） 点菜订单（待扫码） 餐后密码支付 点餐 （删除 修改 扫码下单） 交易完成 提交菜单 扫码下单 餐后密码支付 餐后密码支付 交易完成 交易完成 2.界面设计阶段 界面色彩：由于之前版本的APP主要是提供外卖服务的，为了增强用户的食欲，所以大多用了橘红色作为主要色调，改版中我也选用了橘红色，沿袭了之前版本的色调。界面风格：关于界面的风格，存在着扁平化设计风格与拟物化设计风格这两种风格，在这款APP中我大多采用的是扁平化的设计风格。在之前的几年间，拟物化趋于流行，但从目前的设计理念来讲，设计师会更偏向于扁平化，扁平化更多的是去掉了该去的一些东西，所以图标看起来不像拟物化那样立体那样有真实感。但是扁平化中的一些绘画元素则并非必须要以抽象来表达，完全可以使用拟物化中的那些具有形象意义的绘画。这种设计在一些系统UI上我们现在也看到不少，整体看上去同样是非常漂亮的。 界面色彩 界面风格 界面留白：UI设计中重要的要素之一就是留白的运用。文字、按钮等元素周围的留白越大，越能提升存在感，有时候留白并不意味着页面的信息容量降低。因为智能手机上下滚动是很舒适的，所以并没有必要为了让所有内容在一个页面内全展现出来而让字号变小。这样做反而会让信息更加难以阅读。信息容量大的界面，对用户来说是一种阅读负担。在设计这些交互界面时，我特别注重了留白的运用。这样能让界面富有层次感，让用户的视觉得到“喘息”。 界面留白 记得一位UI工程师曾经说过:“最好的设计不是用来看的，是用来体验的。”这意味着，你的UI应该让用户去体验，而不是放一些花哨的东西给用户看。UI设计越简单，用户体验越好，所以我的界面中不会滥用设计元素。本款APP界面像素是1136*640px，界面中的字体则采用苹果系统专用字体，基于中国用户的使用习惯，首页与多数的服务性APP客户端相似，用户可以在首页找到熟悉的icon,icon设计采用常用的icon，以便用户更快进入应用，在高效操作的同时，享受愉快的交互体验。 icon3.与开发、测试人员配合阶段当完成了我的高保真原型界面后，需要配合程序员进行切图，配合开发人员对于PSD格式的图片切图操作，对于不同的开发人员的要求，切图方式也有不同，我需要配合相关的开发人员进行最适合的切图配合。 icon切图 （三）设计作品的完成通过大量的尝试与反复认真的推敲，画了大量的草图和设计图，最终确定了大概的设计方向，最后制定了效果图，完成了此次设计。 四、完成作品的自我评价 互联网飞速发展的今天，手机成为了我们平日里不可或缺的一部分，而UI的设计师也会随着这股发展的势头急剧成长，对于我一个即将毕业的大学生来说，机遇与挑战史无前例的多，产品UI设计中夹杂着许多设计原则要求，统一公司UI设计流程，使UI设计师参与到产品设计整个环节中来，对产品的易用性进行全流程负责，使UI设计的流程规范化，保证UI设计流程的可操作性等。每个产品的生命周期中，要严格按照流程，完成每个环节的职责，确保流程准确有效的得到执行，从而提高产品的可用性，提升产品质量。为此，我必须去不断了解新事物，新动态，为了让用户有更好的体验，我还要了解人们在想什么，用户的视线首先落在什么地方，哪个设计要素在第一时间吸引用户的注意力，它们对战略目标来讲是否是很重要的东西，用户第一时间注意到的东西与你的目标是否一致等。对我来说，这是前所未有的挑战。而我，面对这些从来没有遇见过的东西，也将一步一步开始学习，不断丰富自己的学识，踏入一个全新的领域。 当然，作品中有很多不足之处，也证明了我还有很多东西是要学习的，在以后漫长的设计道路上我会多多向别人学习，汲取各家之所长，努力提升自己，将来设计出有独立风格和审美价值的作品。通过这次的毕业设计让我对设计充满了热情，尤其是在这过程中我看到了很多国内外的优秀设计作品，我相信那些所谓的大师也不是生来就会设计的，他们今天的成就也是昨天无数次的尝试和数年数日的学习和积累而得的，就是这个促进了我学习UI设计的热情。它促使你每天都要有新发现，不容你对美的事物视而不见，抓住每一个灵感。让它出现在你的作品里。通过这次设计我也明白了UI设计真的不是看似那么简单的，软件只是我们实现自己想法的工具，真正重要的是要有自己的创意和源源不断的灵感，这样才能在UI设计的道路上走的更远。0参考文献1 (美)Theresa Neil.移动应用UI设计模式M.北京：人民邮电出版社，2013.2 (美)弗林.移动应用的设计与开发M.北京：电子工业出版社, 2010. 3 (英)Giles Colborne.简约至上M. 北京：人民邮电出版社,2011.4 马卫娟.方志刚.人机交互风格及其发展趋势J.航空计算技术,1999，(05):10-11.5 王艳江.浅谈当下O2O模式新机遇J.电子世界, 2012，(12):23.6 徐萌.界面交互设计在个人移动通信设备产品设计中的应用D.同济大学,2006.