联系我们 face+ 关于 服务 案例
首页 案例 服务 关于 face+

ui设计产品的流程有什么呢? 让你轻松的学会

Time: 2020-02-09

ui设计产品的流程有什么呢?对于这个问题,想必很多的朋友们都很想搞清楚吧,既然大家都好奇的话,自然就不能够错过接下来的内容,一起来看看具体都有什么吧,帮助大家充分的了解。

  一、前期工作

  1.画

  无论是一张纸、笔记本,还是一片什么能写的玩意儿,都可以。我们需要用纸笔记录下脑中的创意,避免遗忘。有些时候,灵感经常不经意出现,而一时半会儿又找不到合适的纸,因此我会用银行收据、餐馆账单、书籍封面等做暂时记录。

  可以专门用一个笔记本来收集你的创意,不时的翻翻,可能会找到一些非常有趣的旧想法,你可以根据这些旧点子想一些新玩意儿。

  2. 收集图片

  “一位艺术家必定是一位收藏家。他懂得品味藏品,而不是单纯的‘贮藏’。他们懂得有选择得去收藏。他们会根据自己内心的喜好选择收藏的东西“

  还有一项前期要做的工作就是收集图片,我每天都会收集一些图片。收集图片的方法可能有好几百种,但是我还是习惯最Old-School的方法——Dropbox文件夹分类(例如,我会分成后台界面设计、iOS ui设计、插画设计等等)每当我有新的项目的时候,我就会看看这些图片,用来寻找灵感。

  3. 情绪板和准备工作

  Dribbble,Behance,Pttrns,Pinterest——我们有很多可以需找灵感的地方。而且很容易就能找到和你项目相关的作品。多去逛逛,你可能会从别人的经验中学会解决问题。

  当我开始新项目的时候,我总会准备4个文件夹——PSD,屏,资源,灵感。我会把和这个项目相关的东西全部按下面分类丢到文件夹里面。

  可以是Behance上整套案例的研究,也可以是整个应用中的一张界面设计图。

ui设计产品的流程有什么呢? 让你轻松的学会

  (图片来自网络)

  二、开始着手设计

  4. 不必在乎线框图的质量

  不必精雕细琢线框图。毕竟,这玩意儿只是一个过渡,而且客户能够预先准备好线框图就更好了。真正的业界好客户(而且肯定对品质也有追求的)肯定预先会以草图或者线框图的形式来表述需求。

  线框图的作用是就是让彼此更好的理解目的,而不是最终结果。线框图能够帮助架构层级,让你了解大概需要多少屏界面,让你了解客户的想法

  设计师必须懂得去“敏捷”设计,如果真的太在意线框图的细节,那么整个设计流程会拉长,设计师应该学会去取舍。

  5. PSD – 大尺寸画布

  我记得7个月前开始Badoo项目的时候,我最开始观摩了一下同事的工作方法,我觉得他不是很得要领。最好用PS做一个大尺寸画布,用来承载流程中的一些细节。我一般会创建8000*5000的画布,不是用来画出整个应用的UI套件,而是用来记录元素在不同阶段的不同状态——也就是流程。设计复用很方便,开发看到这种东西也会工作的更快。

  6. 所有屏都放入一个PSD中

  如果是移动应用,我喜欢把所有屏的界面设计全部装入到一个PSD中。

  在设计移动应用时,我喜欢把整个流程中所有屏的界面设计全部装入到一个PSD中,整体的对比效果会更好,也更容易让他人理解你的设计理念。

  元素的复用也非常方便,只需要复制一下其他屏的图层/图层组,修改一下背景或者几个图标就成了。

ui设计产品的流程有什么呢? 让你轻松的学会

  (图片来自网络)

  7. 整理、规范图层和图层组

  小编个人认为的规则是,如果超过8个图层,那么就创建一个图层组。

  这里推荐一下《PS礼仪手册》,有兴趣的可以去看看。

  8. 和朋友沟通

  我非常重视那些能够给出专业性反馈意见的人。留意他们的反应和初次看到你设计时的想法,这未尝不是一种用户测试。而且多聆听别人的意见,能够让你从不同的角度看待问题。在整个设计流程中,我尽可能的多和别人沟通,避免出现主观差错。每个人都可以给出一些不错的意见。还记得那句话吗?“只要你进了这个屋子,你就是用户体验设计师。”

  9.图示

  当所有屏的设计都装入到一个PSD中后。应该做一点图示,用来暗示交互流程,我觉得这算是一种早期原型设计吧,与此同时,还能充分感受到视觉设计的细节。集中到一个PSD中的好处是,如果你画多个交互流程,画多个以上的时候,指示线的视觉风格可能会混乱,而一个PSD能够让你整体视觉高度一致。

  ui设计产品的流程有什么呢?相信大家看完之后,都有了全面的认识了吧,总之,希望上面的内容可以很好的帮助到大家。


合作咨询

上海(总部)

上海市浦东新区郭守敬路498号22号楼
021-61057328
service@faceui.com

办公地址地图

北京

北京市东城区后永康17号A座
010-64015620
service@faceui.com

办公地址地图

成都

四川省成都市锦江区东大街牛王庙段100号
028-62790929
service@faceui.com

办公地址地图
首页 | 案例 | 服务 | 关于 | face+ | 智见

Copyright © 2009-2022 FaceUI design. All rights reserved


沪ICP备13044459号-5

上海办公地点地图
北京办公地点地图
深圳办公地点地图
在微信中搜索faceui
或保存二维码在微信中打开