《交互界面设计》课件-1.2UI设计流程_第1页
《交互界面设计》课件-1.2UI设计流程_第2页
《交互界面设计》课件-1.2UI设计流程_第3页
《交互界面设计》课件-1.2UI设计流程_第4页
《交互界面设计》课件-1.2UI设计流程_第5页
已阅读5页,还剩10页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

双击安装字体,安装后重启PPT请安装字体山东科技职业学院UI设计UIdesignUI设计UIdesign山东科技职业学院1.2UI设计流程讲课人:王萃学习目的1.掌握UI设计的设计流程UI设计的流程1.2UI设计流程UI设计是一个承上启下的角色这一点都不为过,在如今这个视觉体验传到的社会里,UI设计角色愈来愈重。UI设计制作,一般都要经过“需求分析—设计制作—方案修改—测试改进”四个阶段。1.2UI设计流程UI设计不光要研究产品的外形、图形界面,还要研究产品的交互设计,并且确立交互模型、交互规范,同时要测试交互设计的合理性及图形设计的美观性等。也就是说,UI设计包括了界面设计、交互设计与用户研究3个部分。因此,UI设计师的基本工作流程可以分为以下几个阶段。01需求分析阶段UI设计测试改进阶段方案修改阶段需求分析阶段设计制作阶段测试反馈修改完善Who界面设计WhereWhy交互设计1.2UI设计流程在UI设计开始之前,设计人员需要先分析设计需求,整理思路,然后才能开展有针对性的设计。分析需求可以从以下3个方面入手。01需求分析阶段市场需求用户需求产品需求1.2UI设计流程需求分析完成后,即可对UI设计内容进行视觉定位,一般可从以下3个方面入手。01需求分析阶段色彩与字体的选择设计风格界面布局和构图1.2UI设计流程在需求分析的基础上,我们进入设计制作阶段。设计包括界面设计和交互设计,且要形成设计方案。界面设计当然以美观为主,要有创新,在同类产品中能够脱颖而出。02设计制作阶段1.2UI设计流程界面设计包括启动界面、主界面、详情界面等代表性界面的设计。交互设计要分析产品必需的功能、内容,根据需要制作低保真模型或高保真模型,也可通过原型工具来规划流程。如果有条件的话,可以在设计时,多设计出几套不同风格的方案用于备选。02设计制作阶段1.2UI设计流程02设计制作阶段原型图是设计人员对产品的最初设想,主要对产品内容和结构进行粗略的布局。当明确视觉定位后,设计人员即可进行原型图的绘制,下图所示为两种不同类型原型图效果。1.2UI设计流程03绘制效果图1.搜集素材图片、视频和音效的搜集文字类信息的搜集网上搜集、实物拍摄和绘制。文字类信息主要是根据产品的特性、功能来进行收集。1.2UI设计流程03绘制效果图2.进行UI设计设计人员可先根据原型图的要求绘制主要形状,并按照设计要求添加或绘制素材,进行界面的制作即可。右图所示为使用Photoshop进行UI设计的效果。1.2UI设计流程03绘制效果图3.标注与切图一般来说,设计人员都会使用一些专业的标注工具来提升工作效率,如MarkMan(马克鳗)、PxCook(像素大厨)等工具,而切图工具则可直接选择Photoshop。下图所示为使用PxCook进行标注的效果。1.2UI设计流程04方案修改阶段设计方案提交给客户后,需要与客户进行沟通,根据客户的需求来修改设计。04方案修改阶段在设计方案通过并交付以后,就可以将产品推向市场了。但设计并没有结束,还需要跟踪

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论