3分钟帮你快速了解UI设计全流程

移动开发 Android
“设计是创新的”;“设计是诚实的”;“设计是自然的”;“设计是极简的”;这些是业界领袖们的名言,细细品品就知道设计不是一项简单的工作,面对这个不简单的工作,结合自身在 UI 设计上的经验,为刚入行的新人们梳理了一份基础流程,希望能对大家有一些帮助。

前言

  • “设计是创新的”;
  • “设计是诚实的”;
  • “设计是自然的”;
  • “设计是极简的”;

以上是业界领袖们的名言,细细品品就知道设计不是一项简单的工作,面对这个不简单的工作,结合自身在 UI 设计上的经验,为刚入行的新人们梳理了一份基础流程,希望能对大家有一些帮助。

设计流程

碎片化时代使得注意力非常容易分散,工作中密集的项目也常常多线程并发,清晰的设计流程有利于我们更合理的分配时间和精力,提升工作效率。我一般会把项目设计流程分成三个部分:设计前、设计中、设计后,当然也有很多设计师会把设计流程分为需求收集、确定目标、原型确认、设计评审、细节打磨、跟进开发、结果跟踪等流程,其实细节流程都差不多,不过我把整个设计流程分成前、中、后三个里程碑似的节点,更容易聚焦。

1. 设计前

设计前的环节是最容易被忽略的一个关键环节,我们很容易陷入需求来了就马上开始设计的误区,殊不知这样做会给后续工作埋下无数的坑,比如:反复修改设计稿、需求方临时增加几个页面、设计交付延期、效果不如预期等情况,这样一来反而使得整个项目节奏慢下来,背离初衷。在我的设计流程中“设计前”是最难且最重要的一个阶段,所以在这个阶段我们一定要想办法去争取时间来做好准备,那么我们都有哪些事情要做呢?

聊一聊

设计之前第一件事就是去了解业务,拉上需求方请他讲讲项目背景、业务目标、用户人群、竞品分析以及跟现有业务的关联等,这样做的好处非常多。一方面能通过需求方的讲述了解最真实的需求和产品目标,便于后续设计中的决策;另一方面我们可以反向要求需求方把业务目标梳理得更加透彻,避免在大方向上出现差错;最后也能让需求方知道我们也是奔着业务目标在思考,更有利于与需求方长期的合作与信任,而不是让需求方觉得我们仅是一个页面仔。

看一看

在与需求方做完第一次沟通后紧接着就是去看看是否有相关的竞品。如果项目有竞品,那么这些竞品能让我们迅速看到产品未来的全貌,也能让我们发现一些亮点以及反向思考是否有我们产品没有覆盖到的场景,将这些内容进行整理后作为日后设计的重要依据。如果没有直接竞品也可以去看一看同类型或者同行业的产品。

想一想

有了聊一聊和看一看,我们基本上站在了全局视角,但这时还没到开始设计的时候,还需要再想一想,比如:A.结合自己看竞品过程中的发现,对业务、需求上还有哪些疑问?将疑问点进行整理汇总再次找需求方进行确认,确保与需求方的理解是一致的,这样才会保证后续设计流程的顺利推进。B.想想这个项目设计师的机会点在哪里?设计目标是什么?有哪些地方是设计师可以重点投入的?开发落地成本如何?设计投入是否可以被验证?这样会帮助我们后续更好的分配时间重心,也便于后续设计经验的沉淀,知道哪些设计能带来数据上的变化。C.想想设计如何规划?设计上还有哪些风险?是否需要外部支援等?便于帮助我们给出相对准确的设计排期。

2. 设计中

有了前面的充分准备,基本上就能信心满满的开始设计了,接下来按下方流程逐步进行:

原型设计

视觉设计前我们需要先对交互原型进行不断的打磨,确保交互层面的体验优雅且符合用户使用习惯。如果团队里配备了交互设计师,可以与交互同学做一些讨论,敲定原型后与需求方再次进行确认,对齐各方意见;如果没有交互设计师介入,那么一定要把想法图形化,让大家能更准确地理解我们的想法,可以画在纸上,也可以用原型工具来表达。同时这里强烈建议设计师应该对信息架构以及文案保持高度的敏感,好的信息架构能保证基础页面体验的顺畅性,而准确文案更能保证用户对信息理解不出现偏差。

风格探索

敲定原型后,就可以做风格探索了,关于风格这块我个人理解这是比较感性的,没有标准答案,只要风格定义有依据加上平时对当下流行趋势的关注,风格定调基本上不会有太大问题,也可以根据设计前准备的一些机会点做针对性的设计,比如:插画、质感、细节、动效等。

细节打磨

我经常在回看自己之前的设计产出时,发现有很多自己看不顺眼的地方。为了避免这种情况,我们可以在设计阶段多一些尝试,多一些打磨。与其让”未来的我”或需求方来指出问题,倒不如先自我审视,打磨出最理想的方案后再去做评审。也可以找身边的同事、朋友一起看看,邀请他们来选一选方案并说一说理由。最后再结合设计目标、业务目标和大家的意见输出最终方案。如果在方案上遇到了困难,也要及时做好沟通或者寻求 Leader 的帮助。

设计评审

当团队内部对方案达成一致后可以组织一场正式的评审会议。设计评审能迅速集中的发现问题,对意见相左而迟迟无法定稿的情况也能有效规避。设计评审前我们要做好充分的准备,可以要求上下游关键角色参加,比如需求方和研发人员。提前预设问题管理好各方预期,保证方案足够严谨以及良好的控场。在评审阶段尽可能细致,把设计师想要落地的小细节、小亮点都清晰的讲到,引起研发人员的重视。最后将评审达成的结论文档化,避免后续设计验收时扯皮。

建立 Kit

设计方案开始之初就要有意识的去梳理规范和组件,保证后续功能迭代的效率和一致性。通过关键页面总结出基础规范;通过设计过程中的不断推敲,再次对界面元素进行抽离,形成组件库。

3. 设计后

设计评审通过后,除了输出设计内容和对设计文件进行整理归档外,后面还要做的事情基本上就是推进设计落地与设计验证了。

设计落地环节设计师的参与非常重要,前面所有的工作最终是以上线的效果为标准,所以为了让我们的付出不打折扣,需要在设计验收时细致坚持,确保设计效果完美落地。除了督促开发同学们进行调整,将设计细节标注得更加清晰,复杂的交互输出一份动画 demo,更能帮助开发同学准确理解设计意图。

设计验证有很多方式,比如:数据埋点、用户反馈、线上走查、用户访谈、可用性测试等。有时我们会因为业务忙需求多、数据没埋点、没想过做验证等忽略设计验证这个环节,这些原因归结起来还是对设计验证重视度不够。但设计验证能帮助我们回顾当初目标的达成情况,找到存在的问题,成为接下来迭代的依据;同时也是对自身设计经验的积累。所以我们还是要重视设计验证,努力了就要看见结果,无论好坏。

写在最后

以上是设计流程上的一些粗颗粒度的经验分享,除此之外关于沟通、业务理解、项目管理、总结复盘都是非常大的课题,需要持续的学习沉淀,后续也会继续做相关的分享。

 

责任编辑:未丽燕 来源: 优设
相关推荐

2016-11-30 14:46:27

量子计算机量子计算

2020-11-10 16:01:25

程序员设计模式技术

2018-05-06 16:26:03

关联规则数据分析关联规则推荐

2020-07-17 07:44:25

云计算边缘计算IT

2021-01-27 18:15:01

Docker底层宿主机

2022-09-08 11:12:09

ES6JavaScript

2024-11-07 16:09:53

2021-01-06 05:23:15

ServiceMesh网络阿帕网

2020-07-21 07:42:29

数据库信息技术

2020-03-23 15:18:26

知识图谱Web

2018-02-02 16:08:32

互联网大数据数据分析

2020-11-06 08:54:43

Vue 3.0函数代码

2018-03-12 21:31:24

区块链

2009-11-05 14:53:54

Visual Stud

2021-10-19 07:27:08

HTTP代理网络

2015-10-10 14:11:00

互联网数据挖掘爬虫

2019-11-22 11:10:26

区块链技术

2013-06-27 09:41:19

LuaLua语言Lua语言快速入门

2022-12-16 09:55:50

网络架构OSI

2021-04-30 16:23:58

WebRTC实时音频
点赞
收藏

51CTO技术栈公众号