/敲黑板! UI设计师与UX设计师真不一样!

敲黑板! UI设计师与UX设计师真不一样!


之前我们就大家分享过UX设计师的日常工作究竟有哪些,错过的同学可以点击下方图片跳转阅读。


那么作为经常与UX一起提及的UI设计呢?想要成为UI设计师,我们又将面对哪些不同的工作日常呢? 


其实,UI设计师与UX设计师的工作真的不一样!


今天,小编就为大家总结一下,用户界面设计师日常需要做哪些工作?我们将为大家清楚解释什么是UI设计及其涉及到的相关工作内容。




UI元素

01

用户界面与用户界面设计师

用户界面设计 (User Interface Design),是用户体验的一个重要子集,它们都有着相同的最终目标:为用户提供积极的体验。然而,UI设计却包含了完全独立的旅程。简言之,用户界面是我们用来与产品交互的东西,而用户体验则关心这种整体交互所产生的感觉。


由于用户界面设计是一个跨学科领域,因此用户界面设计师往往具有各种教育和专业背景,但毫无疑问,从事或学习设计或Web开发的经验会更加有所帮助。而在日常设计工作中,UI设计师负责创建、设计和组织交互元素,而这些通常需要与制定项目愿景的用户体验设计师进行密切合作。


那么用户体验设计的侧重点又有哪些呢?

视觉方面 (Visual)
UI设计侧重于用户的视觉体验,它决定了用户如何与界面交互。无论是应用程序、视频游戏还是网站,这都完全关于用户如何通过不同的视觉接触点从A导航到B。UI设计师的工作就是设计用户将接触到的所有屏幕界面,并创建促进这种移动的视觉元素及其交互属性

不同的UI交互视觉呈现

人性化方面 (Human)

与此同时,UI设计师在工作时也会考虑人类行为。想象一个我们最喜欢的应用程序,它既美观又易于使用,当我们第一次安装它时,也并没有花很多时间研究如何从A到B的操作路径。


那么这就是一个好的界面所需要具备的,它几乎不需要用户在使用过程中产生任何过多的想法。因此,UI设计师在这一方面的设计就显得至关重要。我们需要考虑人类用户以及大脑是如何工作的,以此使用诸如图案、间距和颜色之类的元素来指导用户进行操作。



在这里,“直观”是关键。我们需要设身处地为用户着想,预测他们在每个阶段的期望。然后,利用这种同理心来设计视觉交互元素,以此让用户感觉这是一种自然的方式并做出响应。


假设,我们正在使用某款应用程序来寻找新的公寓。有一个列表特别吸引了我们的注意,因此我们单击以查看图库。随后我们发现,全尺寸图像占据了我们的屏幕,而标题占据了1/5。这时候,我们知道还有更多的图片,于是便用手指在图库中滑动。很显然,这一系列操作都是我们在没有指示的情况下自然进行操作的,没有任何原因,我们就是知道应该这样操作。


而这就是UI设计师的工作,考虑用户的期望,并相应地设计应用程序的界面。也就是说,用户体验绘制出地图,裸露的骨头。然后UI用可视化、交互式的接触点对其进行充实,尽可能直观地引导用户完成他们的旅程

UX VS UI





02

用户界面设计师的日常工作

么,将UX设计师的愿景变为现实就成为了UI设计师的工作。就此,我们应该怎么做呢?以下,是作为一名UI设计师必须涉及到的工作内容:

合作 (Collaboration)
正如上文所提到的,合作在UI设计中是不可避免的,尤其是在设计开始时。我们需要与客户和UX设计师密切合作。毕竟,UI设计都与人有关,所以我们需要花一些时间来了解这个品牌及其目标用户。当用户在我们的界面中进行操作时,他们的目标是什么?他们的期望又是什么呢?

用户研究和用户角色往往属于用户体验设计,但UI设计师的工作则是获取这些信息并与之一起运行。UX设计师很可能会为我们提供一个可以用来工作的线框。最后,我们需要将设计交付给开发人员。最终,在不同团队之间建立融洽的关系并能够清晰地沟通对于项目的成功至关重要。

设计 (Design)

当然,UI中的角色需要我们非常亲身的体验设计,这包括设计屏幕和创建视觉接触点,以及它们背后的交互性。UI设计师还需要负责确保一致性,因此需要创建一个样式指南或视觉语言,以供全面使用。


那么,UI设计师希望在他们的代办事项列表中看到什么呢?
  • 设计用户将与之交互的每个单独的屏幕,包括布局

  • 考虑应用程序在各种屏幕尺寸上的显示方式,这里可以参考响应式设计

  • 设计UI元素,例如按钮、图标、滑块和滚动条

  • 利用对色彩理论的全面理解来创建一个优秀且独特的调色板,为网站或应用程序注入一些个性

  • 选择正确的字体和排版

  • 设计每个UI元素的交互性,例如,当用户单击按钮时会呈现什么

  • 创建动画

  • 建立在应用程序中使用的样式指南,确保用户的一致性和熟悉度


设计阶段可能包括创建线框,将情绪板放在一起,并为界面的外观勾勒出不同的想法。在这里,UI设计师将会使用Photoshop和Sketch等工具进行设计创作。

Web Style Guide


导航类APP的UI设计

原型 (Prototyping)

作为一名UI设计师,反复测试我们的设计也很重要,这就是原型设计的有用之处。原型可以帮助我们展示实际的视觉设计,并快速识别缺陷然后消除任何粗糙的边缘。原型设计和测试是UI设计工作流程中的关键部分,因为它可以让我们确保最终产品符合所有要求。


以下是三种不同原型类型:

  • 低保真原型是在纸或白板上绘制的基本布局和元素。粗略的用户流程草图是用最少的成本或时间快速传达想法的好方法 
  • 一旦定义了用户流程和屏幕布局,就可以点击原型,这就包含了中到高级细节的静态屏幕
  • 高保真原型通常具有高级交互和过度,基本上类似于最终产品本身。


UI设计师经常会使用工具组合来创建原型。例如,像InVison这样的程序就非常适合为低保真原型设计基本交互,而像Principle这样的工具在改进特定的过度和动画时就很有用。其他流行的原型设计工具包括Proto.io、Adobe XD和Figma

低保真原型 VS 高保真原型

03

必备技能

UI设计师在这一领域茁壮成长所需要的技能比我们想象的要多样化得多。当然,UI设计师需要对细节有敏锐的洞察力。但也正如我们所讨论的那样,UI设计师也需要同时具备硬技能和软技能
软技能 (Soft skills):
  • 沟通是UI设计的关键。当我们将设计交给开发人员时,需要有效地传达每个元素的预期功能。当然,与我们的客户和利益相关者进行沟通是任何UI设计角色的重要组成部分。我们需要尽可能详细地解释甚至证明自己的设计决策。

  • 从UX设计师到Web开发人员,从利益相关者到客户,UI设计师在各个层面都会进行协作在团队中良好合作是一项基本技能,其中包括一起倾听和排除故障以找到问题根源。

  • 我们还需要依靠同理心设身处地为用户着想。将可访问性和包容性放在首位,这对于创建所有用户都会喜欢的界面至关重要。如果我们将美学和创意视觉效果置于可用性之上,那这就不能称作是一个好的项目。

硬技能 (Hard skills):

  • 即使是入门级的UI设计职位,也希望至少精通一种行业标准的设计和原型制作工具。例如Sketch、Adobe XD,以及 InVision 等原型制作工具。

  • UI设计师需要对构成UI设计基础的基本方法、理论和实践有深入的了解。这些包括色彩理论、排版和UI设计模式,以及格式塔原则等基本设计方法,这些方法将帮助我们更深入地了解用户会如何看待和解释我们的产品。

04

关于就业

根据Glassdoor、Indeed和PayScale提供的数据,对世界各地的UI设计师的平均薪资进行了研究。为了方便比较,这里以当地货币和美元列出了这些平均值。(2022年更新)
  • 澳大利亚:68,210澳元(47,877 美元)

  • 加拿大:73,210加元(57,222 美元)

  • 德国:46,392欧元(52,318 美元)

  • 印度:4,61,410卢比(6,127 美元)

  • 英国:43,728英镑(57,829 美元)

  • 美国:77,692美元

不难发现,随着我们越来越依赖数字产品和服务进行工作、社交互动及日常任务,UI设计师将在2022年及以后处于科技行业的前沿。UI设计的工作提供了很多种类,并且需要我们具有敏锐的视觉眼光以及心理素质。想要设计友好的界面,我们就需要了解人们的工作方式,以及每个视觉交互元素是如何塑造他们的体验的。


最后,小编还想为大家分享一些UI设计领域内的专业术语,可以快速帮助大家入门用户界面设计:


Brainstorming:头脑风暴

Contectural:情境设计
Design Session:设计讨论会
Concrete Use Case:创建用例
Essential Use Case:基本用例
Flow Mode:流程模式
视觉设计 (Visual Design):图形设计意义差不多,但更广泛一些,还包含了文字的表现和信息设计
使用环境 (Work environment):包括物理、生理、化学、社会、文化等各种因素
故事版 (Storyboard)用于测试和收集反馈的最终产品的样本或模拟

Product Manager (PM):产品经理
Quality Assurance (QA):测试工程师

编辑:YAN


图文信息源于网络,侵权告知即删


本文来自微信公众号“交互设计小站”(ID:racjiaohu)。大作社经授权转载,该文观点仅代表作者本人,大作社平台仅提供信息存储空间服务。