Bsport体育平面设计设师怎么入行UI设计?
栏目:Bsport体育 发布时间:2023-08-31
 本人大学视觉传达,毕业后从事1年多的平面设计,之后转行入ui。接下来我将从这3个方面来讲述转行的过程方法。另外,以下这些也都只是我个人的一点点经验,并不一定正确,希望题主能够有意识的吸收。  我一直认为平面设计转行ui的门槛会比起他行业低许多,并且某些角度来说更具备一定的优势。例如,色彩的感觉、造型的能力、对画面平衡的把控等等。这都是我认为在做ui时非常重要的东西,也是有平面基础同学的优势。但

  本人大学视觉传达,毕业后从事1年多的平面设计,之后转行入ui。接下来我将从这3个方面来讲述转行的过程方法。另外,以下这些也都只是我个人的一点点经验,并不一定正确,希望题主能够有意识的吸收。

  我一直认为平面设计转行ui的门槛会比起他行业低许多,并且某些角度来说更具备一定的优势。例如,色彩的感觉、造型的能力、对画面平衡的把控等等。这都是我认为在做ui时非常重要的东西,也是有平面基础同学的优势。但是,二者的区别也非常明显,其中最应该优先分清的就是可交互性。

  虽然平面设计中输出的作品也具备交互性,但是相对来说比较薄弱同时不具备实时性。一张海报,一个包装完成之后展示在那里,就只能消费者当方面的获取信息而它们并不会给予反馈和互动。因此你在刚转行的过程当中应该主动的去培养用户体验的思维(好吧,我承认这个词已经烂大街了)将之前做印刷物时的思维转换到做互联网产品的思维上面。下面的几个网站你可以逛逛。

  没有很多,但是对你目前来说基本够了。坦白说,就算你多看用户体验技术类文章,对你现在的工作也不会有多大用处。但是,对你培养互联网的感觉和营造氛围还是有一定帮助的。

  在具体的操作方面,ui和平面设计就完全是两种东西了。索性现在已经是扁平化的时代,所以在ui的软件层面,你之前平面时的那些技巧基本够用。这时候我个人感觉你优先要了解的是各平台的尺寸,控件大小比例,字体的大小等等这些东西。之后才是流行的风格,不同的表现手法这些更高阶的东西。否则你在真的做一个app或者网站时你会茫然不知所措。

  那么如何了解这些基础的东西呢?我认为最方便的就是临摹。临摹这里可以有两种方式ui设计,根据你自己的情况来选择。

  拿app界面来举例,你找一张原尺寸的产品界面(最方便的就是手机截屏)然后拖到ps里面。将它放在最底层,Bsport体育然后在它的上面依样画葫芦的画出所有的元素。

  在画的时候最好不要从上到下一点点元素的临摹,而是先从大的框架开始然后细化到里面,就像画画一样。

  在参照界面外另外新建一层画布,然后手动测量元素之间的大小距离,然后在新的画布上根据测量的结果一摸一样的画出来。

  在做界面的过程中,一定要记得所有单位都是像素哦。同时,在临摹的时候也应该主动的去理解各元素的大小,比例,留白间距等等,这也是临摹的目的。

  这类的临摹不用太多,适当做些就好了。在你觉得对app或者网站的尺寸什么有了一定的理解之后就可以停止了。这时候,基本也算是入门了,在面对app时应该也不会完全不知道从哪里开始下手。

  这个阶段是一个长久的过程,说实话我目前也处在这些阶段。但是对于刚入门需要提高的同学来说我还是有一些小小的心得可以分享的。

  第一点是对技法的深造。在你对ui有了一定的了解之后要做的就是如何把界面做的更加精致,更加的易用。首先你可以多看看设计相关类的网站(有些网站你可能已经知道了,不过还是贴出来吧)

  在多看之后,更重要的就是练习。练习可以是自己假设的项目,也可以是对目前市面上已经上线的产品进行重新设计。例如Bsport体育,可以对优酷的客户端,淘宝的客户端进行重新设计,当然我只是举例,你可以找一些体量小一些的产品来进行练习。练习完成后最好对前期的思考、交互稿的绘制、界面的展示等等进行有设计的整理,这些东西对你找工作都有很大的帮助,特别是在你没有很多ui相关的作品时。

  第二点是资源库的积累。和平面设计一样,ui资源库的积累也非常重要,而且你平面时期积累的东西很多也对ui非常有帮助,千万别全部放弃了。

  第三点是产品思维的培养。这也是我目前特别需要提高的东西,随着界面越来越轻量化,纯粹的视觉设计在工作当中的比重可能会逐渐的减少,未来更需要的是对产品的理解更全面,对业务的理解更透彻,能够实际帮助公司盈利的商业设计师,而不仅仅是把东西做好看的艺术家。

  以上是我个人的一点点经验,希望能对题主或者有相关问题的同学有一些帮助。潜水那么久,第一次认真回答问题,觉得有帮助的麻烦点个赞哦,谢谢~~

  时代的变迁,科技的进步,工具的发展,薪资的差距,促使许多人转行的原因,但平面与界面两者之间有着哪些的差异呢?如果,想要转行又该具备哪些条件呢?

  平面设计以『视觉』为主轴,强调资讯阅读的可视性以及爆炸的视觉效果,来吸引人们关注,而界面设计除了考虑视觉效果外,还同时需要专注在『使用需求』,一个好的产品讲究界面操作的逻辑性与流畅性,再搭配视觉的张力,才能让产品贴近于完美。

  小型公司担任平面设计经常处于单打独斗,讨论的对象通常是老板、客户等(看公司产业性质而定),内容的需求、品味多数以主、客的需求为主;而界面设计则需考虑操作的流程、界面使用平台平面设计、界面解析度等,针对侧重点的不同做出相对应的调整,面对讨论的对象也多了许多,比如RD、PM、UX、老板等,项目的成员相对多元,项目的流程规划也缜密许多,不再是只椅靠『视觉』就可以解决的事,而是必须清楚阐述设计方向、基于哪些论述、论点,以及与竞争对手产品设计上的差异等,通过各种的数据分析来佐证自己的设计,才能更贴近使用者的需求或者老板的需求。因此面对沟通的角色变多了,相对的也能提升自己跨领域的协作能力。

  如今设计工具不断推陈出新(比如协作设计工具摹客iDoc),界面设计不再只是仰赖Illustration/ Photoshop了,而有更多专为界面设计所开发的工具,让界面设计师可以快速产生Wireframe/mockup/prototype等,加速讨论的步调,让设计需求也可以快速既明确的产生。

  无论你是否有无设计相关背景,学习曲线差异只在于对『视觉、美感的敏锐度』,其他,解读设计的角度上均有所不同,是需要花些时间重新学习。

  从小地方着手,生活周遭事物都可以是训练对设计的敏锐度、洞察力的选择,培养设计洞察力首先需换位思考,把自己当作是产品的设计者、生活上的体验家,将产品分解拆解研究它,研究产品的阶层、内容、色彩的搭配与文字间如何呼应、视觉动线等,并清楚了解该产品的目标对象、受众族群等。

  视觉的敏锐度不只是在于好看、美观,而是需要拥有大量的视觉理论,去了解每个设计背后的论点与设计的逻辑,比如icon的设计、配色的协调及Layout视觉动线、内容呈现的可视性等。

  大多平台各自会定义一套设计规范,提供给开发人员、界面设计、视觉设计参考,必须清楚各规范才能避免错误问题产生,建立出一致的使用体验,并可做为与开发人员沟通的脚本。如果想要打破该设计规范,不是不可行,但需要能够提出一份强而有力的说词,避免受到质疑。

  不同屏幕尺寸、解析度会影响设计细节,越高解析度像素越多可产生越多的细节,在低解析度的屏幕下,则需要舍弃一些细节。

  工具推陈出新,找出适合自己又可快速的开发工具,并习能新的技术,必能提高工作效率。

  养成固定观察分析各App或UI相关设计,培养产品思维,同时分析设计背后的原理,当你正式进入UI设计时,脑袋已充满资源,也会产生更多看设计的不同角度。

  其次,以现有的产品/App练习重新设计,练习时,Bsport体育尽量出2–3种设计方向,并试着提出设每个设计方向是依循什么设计理论、参考什么设计,甚至可以找出与该产品的竞争产品,分析各家产品在设计上的架构、阶层、优缺点等,便可找出你的产品在设计上可呈现的差异化。

  最后,我想说的是,不同产业或公司属性的差异,面对职责会有不同范畴,有些界面设计师只专注在视觉呈现,有的则是需包含前期的流程规划、视觉呈现甚至prototype等,平面转界面视觉似乎衔接点较容易,如须涵盖流程、prototype,便需要做更多的精进及工具上的学习。

  摹客iDoc是更快更简单的产品协作设计平台,支持智能标注、一键切图,设计师再不用手工标注;更有多样批注、交互原型、全貌画板、团队管理,帮助产品团队高效协作。现在起,产品、设计,到开发,一份文档就足够,永远告别沟通难、协同难、效率低的问题!

  还有更多精妙功能,帮助你的团队高效协作,等你来探索!快戳下面的链接体验吧!

  想要从平面转到UI设计,题主最重要的是打好基础,明确UI设计的基础定义及设计基本原则,在这基础之上,结合自己平面设计的经验其实就能很快上手。下面康石石便就UI设计的基础定义、入手方向及基本原则做简单介绍,望能为题主提供一些帮助。

  UI设计,即User Interface Design,简单地说就是用户界面设计,又称用户界面工程。也就是说,UI设计不仅仅是指针对手机APP或者网页的设计,但凡需要用户交互的界面设计,都可以被认为是UI设计的范畴。

  比如在汉艺L同学的作品集中,UI设计作为互动装置的一部分出现在了整个设计项目中,该设计是自动售货机上的界面设计。可以看到,这个界面设计相较于手机上的app设计更简单一些,因此其只作为了项目设计中的一部分,而未作为单独的项目而存在。

  UI设计包含的领域伴随着科技的发展不断在拓宽,从电脑的界面设计扩展到了汽车、商业飞机等领域,因此,想要入手UI设计时需要题主具备基本的人类交互知识,还要求具有一定的跨学科知识,将界面设计和人类交互的基本知识有机结合起来,不断地延展、探索UI设计在视觉传达领域的更多的可能性。

  同时在进行用户界面设计的时候,需要题主对用户的需求有深入全面的理解,一般情况下,需要理解并掌握以下几个方面:

  简单来说,就是需要题主收集自己设计项目中目标人群的确切需求,并且将其总结归纳,最终转换为不同功能体现在界面设计之中。

  用户和任务分析需要题主进行大量的调研和数据支持,这些数据调研的内容都需要通过完整、合理的方式呈现出来,形成一个完整的数据可视化的图表。

  在这个过程中,需要设计者将界面中需要的内容罗列出来,并形成一个树状流程图,这个流程图将决定之后页面整体层次结构和逻辑流程。

  线框是指整体结构的草稿,其可以有手绘和简单的交互式界面两个方式,在线框中不需要添加图片或是文字等具体的内容,只需要将整体的界面设立的框架展示出来即可。

  在整个界面初步完成之后,设计者需要对目标人群进行设计的可用性检查,来检验此设计是否真的符合用户的使用习惯和使用逻辑。

  设计者需要针对界面的整体风格和设计要求Bsport体育,将整个界面里面的平面化设计元素进行整合和完善,对于一个平面专业的人来说,需要注意的就是界面的设计风格需要和项目中其他分项的设计风格相统一,注意不要出现界面中的设计元素和其他分项中的设计元素相脱节的情况。

  保持良好的清晰度是在界面设计中最重要的工作。为了使界面设计是有效的,用户必须能够识别出来界面中内容的意思,并了解如何使用。在设计的过程中切忌将太多的内容堆放在一个界面中,要知道一百个清晰的界面比一个混乱的界面更好用。

  在设计UI界面时,题主需要知道用户需要的优先行动是什么。简单来说,即界面设计和海报设计一样,需要在设计的时候产生一个比较明确的信息层级,需要理解用户打开这个界面的时候,第一步要做什么,第二步要做什么,最后又要做什么,以此去完成界面设计。

  当用户使用一个界面的时候,他们通常希望接口控件靠近他们想要控制的对象。举一个简单的例子:当用户想要在微信中更换头像时,需要点击屏幕右下角的“我”→点击头像栏→点击头像更改。同样,微博的操作流程也差不多。

  这就是说,用户在使用界面进行交互的时候会遵循一定的上下文逻辑关系:点击头像就是更改个人信息,点击对话框就是输入对话内容,滑动界面就是返回上一级……但如果此逻辑关系遭到了破坏,用户点击头像之后才能输入自己对话的内容,这就会使用户对整个界面的操作感到不适。

  所以,在进行交互页面的设计时,需要针对用户的使用逻辑和交互时的就近原则,将界面的控件合理地、有逻辑地进行放置。

  大部分用户很少会更改一个交互界面的默认设置。比如当地铁里一个人的手机铃声响起后很多人会同时看是否是自己的电话,这就是因为大多同一品牌的手机出厂时设定的铃声都是相同的,而大部分的用户不会更改这一设置。

  因此,在设计一个界面的默认值时,要尽量保证该默认值是普遍适用的。设计的过程中要尽量确保所有的默认值是有用和实用的,尽管很多人从不改这些设置,这些设置也要保证是最合适的。

  如果一个界面能在用户使用时给予清晰和持续的反馈,用户可以在使用这个页面的时候感到更加地舒适和自信。比如,当用户在搜索引擎中的搜索框中输入关键词时,搜索框下会出现联想词,这就是对用户输入搜索关键词时的及时反馈,这样的交互界面会让用户觉得自己的操作是被反馈的,提升用户在进行界面交互的时候的使用感受。

  比起繁琐、细小的步骤,用户在进行界面交互的时候会倾向于直接进行一个整合的操作。比如下图中,比较两个个人信息填写页面,不难发现右边的页面更容易填写。大多用户都不喜欢在操作时填写冗长复杂的表单,不仅在无形中给人压力,也会让人觉得无聊。

  因此,在进行界面设计的时候,题主需要将信息进行缩减处理,必要的时候,可以将用户填写表单的动作拆分成不同的步骤,并显示进度,这样可以使用户在填写比较复杂的信息时不会无聊厌烦。轻松简单的任务也不会让人感到恐惧,一旦任务结束,用户也可以在操作的过程中获得成就感。

  之后找UI领域的朋友看一眼,或者发布到平台上邀请其他人评价。你会发现有些细节在跨领域时有些区别。这个过程能帮助你更快的理解UI,并且很深刻。

  说白了,UI设计本来就是平面设计的一个分支,有什么好不好转的?无外乎,你需要重新熟悉一下尺寸规范、和交互,毕竟手机屏幕与传统的纸质印刷的最大差异就在于此。

  当然,前提是你对平面设计的排版、色彩、字体计、光影刻画表现,已经有一定的掌握。倘若没有,请参考:平面设计自学教程,选择自己薄弱的知识来系统学习。

  还有就是,对UI图标设计可以适当增进一下。同时在学习一些交互知识,让自己从外行变为内行,可以通过买两本书或者网络课程来学习。参考这两本书:

  另外,就是切图,Android和iOS版本的切图有点区别,在有拉伸的情况下Android需要切.9.png图,IOS需要@1、@2、@3,三个倍率的图。这个也并不难,百度几篇文章,看一看就能明白。推荐你用这个Cutterman插件切图、用PSMirror在手机上预览设计稿,另外,官网也有对应的教程,这个难不倒你的。

  然后就是通过临摹,找到UI设计尺寸大小的感觉,做个20张页面,你就有经验了。所以,哪里还需要去花几万报个培训班嘛,互联网时代,自学能力才是你的核心竞争力。另外,如果还需要学习UI动效、交互稿制作的实战知识,可以参考这两个教程: