一个UI设计项目从开始到结束是怎样的一个过程

如题所述

UI设计师在工作中需要清楚知道设计的目的,需要非常的了解你做的产品把针对的群体是哪一类人,如果你做的不是大众型产品,设计师就更应该站在用户群体的角度出来想问题。而不是从自身的喜好和偏爱来设计。不同年龄不同阶段的人群对颜色都各有偏好,而且生活习惯和生活方式也会有所区别,这就需要UI设计师合理的把控要点,就比如小米手机的老人模式一样,老人会喜欢什么样的颜色呢?增加样式是会产生干扰还是更好的体验感?按钮要多大才合适?在这种产品的UI设计时,设计师需要从头参与,而且到了设计环节时,设计师基本上已经心里有数了。
  交互设计的合理安排
  UI设计是指“界面设计”,UI设计也属于平面设计的一个分支,界面的的交互策划与设计是很重要的前置步骤,对最终的用户体验有很大的影响。
  一般来说,一个APP设计团队由产品经理、交互设计师、UI设计师、程序员组成。以我的了解,很多公司不设专门的交互设计师,而由产品经理完成相关工作。以下是我这里的工作流程。这个流程希望整个产品团队都能参与其中并共同加强对产品的理解。或者借一个时髦的概念,我是希望团队能具有更多Design Thinking,“设计思维”,来加强和推动解决问题的能力,并激发更多创新。
  在这之前,一定要把脚本应用场景和人物角色做出来。你做的产品在什么样的情况下会被人所接受,你的产品最重要的特点。设计是否合理,这都需用户角色来实现,而不是设计师或产品经理自己。把场景和角色描述清楚,并且让整个团队理解透彻,这能保证团队少犯错误。
  用户角色,实际工作中写文字描述就好,不用做的如下图一般高大上。如果你要给客户或Boss提案,可以做一个提升逼格。
  1.故事版:
  主要负责人:产品经理或交互设计师
  最早大家开始讨论用户体验流程,在白板上边画流程边添加粗略的UI元素。会后交互设计师会在在纸上做手绘版线框图。这阶段产品经理、交互设计师、UI设计师、包括技术工程师会一同作大量的讨论,而且主要讨论的是流程和主要功能,因此手画故事版最快最方便并易于修改的。
  此环节要敲定Userflow,用户流程及其中的关键步骤,每一步骤都是一个主要界面。
  2.关键界面线框图
  主要负责人:交互设计师
  在确定的用户流程中,选出几个关键的,有代表性的步骤,做细化的Wireframe线框图。线框图里要确保每一个UI元素的设计,包括其大小和位置。我们做的线框图是1:1的,也就是线框图与实际界面尺寸一致。1:1的线框图能在前期避免考虑不周和执行困难等很多问题的出现。
  此环节要确定关键界面里的UI元素和布局,以及全局的布局排版风格。
  3.重要界面设计
  主要负责人:UI设计师
  此环节交互设计师会按确定的用户流程及确定的布局风格来继续做其它界面的线框图。UI设计师则同时开始做关键界面的视觉设计,进行配色、样式不同风格的尝试。
  此环节要确定产品界面的视觉设计风格。
  4.原型线框图
  主要负责人:交互设计师
  此环节交互设计师要完成全部界面的线框图(1:1的)设计并且团队确认。
  5.原型设计
  主要负责人:交互设计师
  此环节依产品需求而定。如果静态的线框图还不能完整的体现出产品特点,那就需要做成可操作甚至有关键界面动画示意的可动原型。通常是HTML的可动原型,特殊项目也曾经做过Flash的。我还有一个奇葩朋友用PPT做过(PPT的开发工具+VB)几乎接近成品界面的可动原型。
温馨提示:答案为网友推荐,仅供参考
第1个回答  2020-03-18
先在蓝湖上看产品文档,然后用sketch作图,把图传到蓝湖上,工程师看标注切图
第2个回答  2020-03-13
UI 设计师接到产品需求后,完成设计图,然后用蓝湖标注切图,再交接给开发,一般来说,就是这个过程。
第3个回答  2019-06-20

不少刚刚入行做UI设计的朋友,都期待着可以参与公司项目设计的整个流程,但是不同的公司,具体的流程可能是不一样的。为了满足广大学员的需求,小编姐姐就UI设计流程简单分析如下:

一、确认用户需求

在UI设计过程中,需求设计角色会确定软件的目标用户,获取最终用户和直接用户的需求。用户交互要考虑到不同目标用户的交互设计重点,将这些重点融合。例如:老年人用户和专业用户的设计重点就不尽相同,所有的目标用户的需求都要考虑进去。

二、采集交互方式

目标用户不同交互习惯也千差万别。习惯性的交互方式往往来源于其原有的针对现实的交互流程、已有软件工具的交互流程。在此基础上通过调研分析找到用户希望达到的交互效果,并且以流程确认下来。

三、讨论并制定草图框架

在一个项目的开始,UI设计师就需要参与到整个项目当中。对于产品需求的了解,不只是产品经理或者项目负责人的事情。所以,需要UI设计师、项目负责人、产品经理和客户一起作出讨论。这个时候,你就需要画出一个大概的框架草图。

对于一些外包项目,客户的需求很多时候都是模糊的,这个时候,整个产品的功能、结构框架也都是模糊的,所以,可能需要UI设计师积极的与客户或者项目负责人沟通,了解清楚。要不然,你就会抓瞎,没法开始接下来的项目。

四、流程图

这个时候,你需要结合开始的产品需求和框架草图,用思维导图工具做出一个具体的流程图,理清你的设计思路。这样你的项目负责人可以直观的看到整个的流程,你在开始设计的时候,也可以依据你做的流程图。

做脑图/思维导图/流程图的工具其实有很多。在这里呢,列举一些常用到的流程图工具,如Mindnode/百度脑图/Xmind/Mindmanager等等。

五、原型图

所需工具:Sketch(框架图)、POP(初步原型)、墨刀(高保真原型图和交互)等

六、确定设计稿和原型交互demo

所需工具:Sketch(设计稿)、Axure(原型交互)、Marvel(原型展示)、Principle(交互动效)、墨刀(原型交互)

七、设计和待开发

所需工具:PS、AI等(设计)、Cutterman (切图工具)、PxCook(标注、切图工具)、Zeplin(切图、设计稿标注)等。

设计过程就不说了,只要你是一位UI设计师,页面怎么做那你肯定清楚。当你设计完成页面以后,要做的工作就是:标注、切图。

八、引导用户交互

软件是为目标用户服务。因此应该由目标用户来使用和控制软件。软件响应用户的动作和设定的规则。对于目标用户交互的结果和反馈,提示目标用户结果和反馈信息,引导目标用户进行自我需求的下一步操作。

九、一致性原则

1、设计目标一致

软件中往往存在多个组成部分(组件、元素)。不同组成部分之间的交互设计目标需要一致。例如:以老年人作为目标用户,以简化界面逻辑为设计目标,那么该目标需要贯彻软件(软件包)整体,而不是局部。

2、元素外观一致

交互元素的外观往往影响用户的交互效果。同一个(类)软件采用一致风格的外观,对于保持用户焦点,改进交互效果有很大帮助。遗憾的是如何确认元素外观一致没有特别统一的衡量方法。因此需要对目标用户进行调查取得反馈。

3、交互行为一致

在交互模型中,不同类型的元素用户触发其对应的行为事件后,其交互行为需要一致。例如:所有需要用户确认操作的对话框都至少包含确认和放弃两个按钮。对于交互行为一致性原则比较极端的理念是相同类型的交互元素所引起的行为事件相同。但是我们可以看到这个理念虽然在大部分情况下正确,但是的确有相反的例子证明不按照这个理念设计,会更加简化用户操作流程。UI设计流程大解析 

十、可用性原则

1、可理解

软件要为目标用户服务,软件各元素对应的功能要被目标用户所理解。如果不能为用户理解,那么需要提供一种非破坏性的途径,使得用户可以通过对该元素的操作,理解其对应的功能。例:删除操作元素。用户可以点击删除操作按钮,提示用户如何删除操作或者是否确认删除操作,用户可以更加详细的理解该元素对应的功能,同时可以取消该操作。

2、可达到

用户是交互的神经,交互元素对应用户需要的功能。因此交互元素必须可以被用户控制。用户可以用诸如键盘、鼠标之类的交互设备通过移动和触发已有的交互元素达到其它在此之前不可见或者不可交互的交互元素。要注意的是交互的次数会影响可达到的效果。当一个功能被深深隐藏(一般来说超过4层)那么用户达到该元素的几率就大大降低了。可达到的效果也同界面设计有关。过于复杂的界面会影响可达到的效果。

3、可控制

软件的交互流程,用户可以控制。功能的执行流程,用户可以控制。如果确实无法提供控制,则向目标用户提示相关的信息。

十一、项目进度管理

所需工具:Trello(任务管理)、Bearychat(团队沟通)

以上是对UI设计流程的内容,内容也许不是最全,但也能让你对UI设计流程有清楚的认识,之前也有分享UI设计的相关知识《ui设计是什么》《浅析ui设计就业前景》、《UI设计7大就业方向》、《ui设计原则要素有哪些》、《ui设计培训课程内容》、《ui设计工具大揭秘》等,感兴趣的可以去看看,后期我还会分享更多UI设计行业知识,大家多多关注!若是有你特别想知道的内容,可以留言告诉小编,小编尽量分享大家想了解的行业知识。

相似回答