您目前所在位置:首页 > 爱工作 > 工作必读
 
如何成为优秀设计师
 
来源:作者:Jon Moore,文章来源:5PLUS | 浏览次数:次 | 发布日期:2019-06-15
 

Timo Kuilder的插图


注意:整篇文章与工具无关。也就是说,无论您使用Sketch,Figma,Adobe XD,Inkscape或Microsoft Paint等软件并不重要。
开始任何职业都很像第一次去自助餐,那里有无数的选择。
热食,冷食,沙拉,甜品,一盘新鲜的培根, 大盘子,小盘子,可爱的小小碗,还有冰淇淋!
选择多的会让人感到非常有压力,你几乎会在第一时间做出错误的决定。你应该吃什么?多少?这个自助寿司可信吗?
自助餐的秘诀在于每次都能学习到新的东西,所以你的方法会随着时间的推移而改善。随着时间的推移,你会知道什么该吃,什么不该吃,以及你的身体一次能吃多少通心粉和奶酪。
学习设计也有同样的感觉。第一次在做设计的时候,你承受了太多,做出了糟糕的决定,把时间浪费在错误的事情上。
请允许我提供一些指导或建议,其中包含了我在无数次的设计自助餐之旅中学到的让我成为一个更好、更有效率的设计师的所有东西:


1.开始使用网格
间距可以说是所有设计中最重要和最基本的技能之一。当我发现你可以从Adobe Illustrator中的标尺拖动参考线来对齐图层时,我哭得像一个刚刚得到一只新小狗的孩子。
间距很难,一致的间距更难。
网格不仅可以帮助您对齐对象,还可以减少在安排数百个图层时需要做的脑力劳动。

为了本文的目的,我们假设您正在设计一个网站或Web应用程序。最好从一个简单的12列网格开始。
为什么12列?好吧,数字12可以很方便地被许多不同的数字整除,这使得创建各种布局变得容易:1列,2列,3列,4列,6列,12列等。

那你的12列网格应该有多宽?这是我使用的一个方便的公式(宽度像素):
(12 *列宽)+(11 *间距)=总容器宽度
我创建的每个设计都基于一个8像素的网格系统,这意味着(几乎)所有填充,边距和对象尺寸都是8px的倍数。这也适用于底层的12列网格。下面是我在许多设计中使用的常见容器宽度:
(12 * 64px)+(11 * 24px)= 1032px宽
这意味着我的所有列都将是64px宽,中间的空间将是24px。由于文本间距和对象边距都是基于8px的倍数,设计感觉和整体看起来和谐。

图片来源:Elliot Dahl


将我设计中的所有内容与此底层网格对齐可消除定位图层时所需的所有猜测和计算,从而为开发人员在开发时创建一致的系统。一切看起来会更整洁。
为什么它让我变得更好:一切都完全一致。简单地说,在设计页面时我没有必要考虑太多。延伸阅读:埃利奥特·达尔的《8点网格系统简介》


2.坚持使用类型系统
我看到初级设计师在设计中最纠结的是文本大小。缺乏经验的设计师对此没有一个参考框架,所以他们的文本设计通常太大或太小。
创建一个简单的类型系统并坚持下去。即使是最复杂的接口也只有不到10种独特的类型,因为大小只是区分文本行的众多方法之一。权重、颜色和间距是其他变量,可以用来以一种容易理解的方式组织信息。

通过为这些类型定义创建保存的文本样式(在某些设计工具中也称为“字符样式”),可以保护自己免受不一致的影响。这将为您省去记住每一个文本属性特征的麻烦。
只需定义这些属性一次,创建一个具有恰当名称的保存样式,以帮助您稍后识别它,然后反复使用它。这里真正的技巧是使用这些类型定义。如果您对文本样式进行了更新,大多数设计工具会将这些更改更新到使用该样式的设计中,这会大大节省您的时间,具体取决于文件的复杂程度。
为什么它让我变得更好:大多数排版属性已经定义。可能的样式列表变得更小,而不是无穷的排列。延伸阅读:Elliot Dahl的《8点网格:网络排版》,Jon Moore的《如何自动创建文本样式和素描层样式》


3.严格要求使用颜色
我喜欢优衣库服装店,因为他们有实惠的基本款,正好符合我的身材。
优衣库的问题在于它们提供了大约93种不同颜色的相同T恤。红色、绿色、蓝色、蓝绿色、蒂尔、绿松石、蓝晶、绿柱石蔚蓝,这样的例子不胜枚举。
这么多选择,对我并没有帮助。我天生优柔寡断,有成千上万种颜色可供选择,这只会帮助潘通获得年度色彩奖。
为了对抗颜色选择恐惧症,我从每个百万富翁的衣柜书(Beyoncé除外)借了一页,严格地缩小了我的选择范围。我给自己一个有限的调色板可供选择,而不是一个满是颜色的壁橱。
颜色应该为一个目的服务。如果你只是为了添加颜色而添加颜色,那么你可能不需要这样做。
我的标准调色板通常有五种主要颜色,加上黑色和白色。使用透明度级别生成这五种颜色的色调(100%不透明... 50%... 25%)。这为我提供了基于相同的五种种子颜色的扩展调色板,使我不必弄清楚确切的十六进制值(在本文中查看#3以获得对此技术的更深入解释)。最后,我通常会为图表,图形和可视化等内容提供二级调色板。
品牌初级:主要品牌颜色。对于Mailchimp,它是黄色的。
品牌次要:次要的强调色。Mailchimp是一种teal-ish。
成功:通常是绿色。这意味着“干得好!”或“事情按计划进行!”
警告:通常是黄色。这意味着“密切注意这一点。”或“事情可能没有按预期进行”。
错误:通常是红色。这意味着“你搞砸了。”或“大规模的系统崩溃。”(也许不是那么戏剧化,但你明白我的意思。)
黑色:只是黑色。有时略带色调。
白色:用于背景和事物。
为什么它让我变得更好:设计感觉更具凝聚力,因为颜色是有意使用的。设计过程会更快,因为颜色系统替我回答了“这应该用什么颜色?”的问题。


4.拥抱设计工具的功能
你使用什么设计工具并不重要。
让我再说一遍:使用什么设计工具并不重要。
重要的是让您沉浸在工具及其过程中。我说我在使用Adobe Illustrator上相当不错,但我也知道它有很多我不知道的功能。我无法告诉你“消失点网格”是如何做到的,但我之前肯定已将其打开,并且不得不谷歌才弄清楚如何摆脱它。
研究你的工具。观看YouTube教程。加入聊天组。寻找聚会。围绕自己的人和资源,可以帮助您了解设计工具的细节,然后将其付诸实践。
当我们在我们的数字产品代理商Innovatemap雇用新的UX设计师时,他们花了前几个月在Sketch上做得非常好。他们了解热键,风格,符号,最佳实践以及更智能,更高效地工作的技巧。之后,设计界面开始感觉就像弹钢琴 - 键盘动作成为第二天性。
除非你完全接受并掌握你的设计工具,否则你只会为自己创造额外的工作。在许多情况下,可能存在这样一个功能,它可以在很短的时间内完成您想要完成的任务。然后你会对自己的时间变得自私,并总是问“有更好,更快的方式吗?”
为什么它更好地让我:设计工具为我工作,而不是与我作对。然后我可以花时间专注于解决方案本身,而不是担心如何执行它。延伸阅读:快捷键、热键和手势:乔恩·摩尔的《成为设计法拉利的5种方法》


摘要
成为一名优秀的设计师始于掌握基础知识。如果你用太多的决定使你的思想负担过重,那么很难取得进展。在一个区域完善您的技术,然后继续前进。
世界上每一个伟大的设计都植根于空间、类型和颜色等基础之上。一旦您为使用和操作这些容易返回的属性建立了一个简单的框架,设计过程本身就会感到轻松得多。


注意:整篇文章与工具无关。也就是说,如果您使用Sketch,Figma,Adobe XD或Microsoft Paint并不重要,这些技巧都会对您有所帮助。
如果
如果您是初次阅读,我建议您从本指南的第1部分开始,该部分为设计最佳实践建立了适当的基础,并将确保您的旅程从正确的方向开始。
本系列的第2部分通过教你如何使你的工具为你工作,而不是与你作对,来帮助你挖掘你的生产力潜力。


5.扩展设计工具的功能
像Sketch,Figma和Photoshop这样的工具是功能的绝对强者,但每个工具都有其局限性,所以不要停止功能结束的地方。
世界上有数百万有天赋的用户,他们中的很多人已经建立了一些实用程序,称为附加组件、插件或扩展,用于执行除工具基本功能之外的各种新的和古怪的东西。
把你的设计工具想象成一个摄像机。这是好莱坞制作团队喜欢用的一个奇特的方法:

一个RED相机机身。照片:雅各布欧文斯在 Unsplash上
相机机身提供其核心功能:录制和存储镜头。但大多数相机都配有插槽,插头,螺纹和夹子,用于添加各种工具:镜头,显示器,麦克风 等:

带有各种插件的RED相机。照片:雅各布欧文斯在 Unsplash上
这些额外的工具使我能够比基本工具本身更快更好地完成工作如:画面更清晰、音频更清晰、电池使用寿命更长等。
扩展设计工具的功能将节省你的时间,并允许你单独使用基本工具执行极其困难的操作。
例如,Sketch已经从开发人员社区积累了大量插件生态系统。这些插件允许设计人员使用外部数据,翻译服务和可访问性测试等资源来补充其工作流程。Sketch本身并不提供这些类型的功能,但插件使它们成为可能。
不要忘记使用辅助工具优化你的工作流程。这些辅助工具可以很好地执行特定的任务,比如重命名层、生成图表或模拟色盲。
有各种菜单栏应用程序,浏览器扩展和实用程序可以改善你的工作流程。以下是我最喜欢的一些:
Sketch:Runner Pro,Connection Arrows,Anima Toolkit,Chart Full,Artboard Manager,Symbol Organizer,Rename It,Stark,KopieChrome:WhatFont,Dimensions,Window Resizer,Design Grid OverlayMac Apps: Nucleo Icons, The Noun Project, SkyFonts, BetterTouchTool
注意:我不能解决插件和插件的潜在危险。插件有点像在汽车上使用售后零件。你可能使用起来会没事,但它们不是由原来的汽车制造商制造的,所以你冒着他们会造成各种破坏的风险。
我强烈建议你熟悉自己喜欢的插件和附加组件的开发团队。。如果一个工具是由一个人维护的,我要提醒您不要将它作为工作流的中心,特别是如果这个工具是免费的。你永远不知道他们什么时候会停止维护它,这对你的工作非常不利。
为什么它让我变得更好:扩展理我的能力,帮助我工作比以前快4倍。我的设计工具感觉就像是我大脑的延伸而不是进步的障碍。使用扩展插件完全改变了我对产品功能的看法,我一直向客户推荐扩展和附加组件作为产品和业务机会。


6.构建自己的可重用工具
我在我的代理机构工作了一年,为各种不同行业的客户提供服务,为多种设计问题提供解决方案。
在我们进行了适当的研究和发现之后,每个项目都从头开始:设置我的文件,创建样式,并组装通常的元素和组件集合,如按钮、字段、复选框、下拉菜单、日期选择器等。

我个人设计模板的截图。在这里查看更多。
起初,我享受着探索和创造的自由。因为这是一个重新开始、从零开始的机会
但是一遍又一遍地重新设计相同的东西开始让我烦躁。我开始着迷于寻找更好的方式来开始新项目。我在Bootstrap中找到了很大的灵感,Bootstrap是第一个帮助开发人员更快地构建网站和应用程序的主流前端UI框架。
受Bootstrap流线型开箱即用体验的启发,我决定构建自己的样板模板来设计应用程序。我检查了过去的项目,以确定每个设计中的常见元素,然后构建一个文件模板,其中已经构建了这些部分。
这是我的Sketch 模板文件:

我个人设计模板的截图。在这里查看更多。

由于所有这些元素和组件都已经设计好,因此可以节省时间来探索和实验视觉风格,微交互,布局以及最终的设计解决方案本身。
在 晚餐时间,厨师不应该花时间切胡萝卜和洋葱,所以这一切都是提前完成的。这也没什么不同。
当你反复重复一个过程,然后找出一种方法来“模板化”它,无论是你自己,使用其他资源,还是使用扩展。
为什么它让我变得更好:通过构建模板,我强迫自己完善并优化可重复元素的构造,以便在实际使用场景中,它们具有灵活性,可扩展性和可维护性。作为设计师构建可重复使用的工具,我已经成长为本指南中的任何其他技术。延伸阅读:Jon和Christian的UX Power Tools, Audrey Hacq的关于设计系统的所有知识,Galya Iliev和Todor Iliev的Sketch App Sources


7.停止重塑常见的设计模式
当你是一名新手设计师时,有一个问题很难摆脱。想要做出“引起轰动”并脱颖而出的设计,这点很诱人。但是你的设计中的每一个元素都觉得创新和再创造的时机已经成熟了。
重新创造是有时间和地点的,但你职业生涯的开始并不是那个时候。可以说,只要你不断地解决问题,你就可以在不挑战极限的情况下获得成功和富有成效的职业生涯。

举个例子:尽管我喜欢从根本上改变提前输入搜索的微交互,但它根本不值得我花时间。也许有一种更好的方法来设计提前输入搜索 - 可能更快,更具预测性或更准确 - 但除非它是产品的核心功能(咳咳,谷歌),否则我会专注于更大,更重要的设计挑战。
约定和已建立的模式之所以存在,是因为它们被习惯性地重用,并且非常成功。仅仅为了与众不同而改变或挑战做事的方式并不是重新创造的理由。你为自己创造了额外的工作,浪费了本可以花在更大的设计挑战上的时间,或者用其他方式扩展产品/业务。
此外,使用公共设计模式可以与涉众建立信任和可靠性。他们会注意到你始终如一地提供深思熟虑和有效的解决方案,并对未来的项目更有信心。
为什么它让我更好:我的精神疲劳减少了。我没有尝试为页面上的每个小交互发明25个独特的解决方案,而是专注于整体用户体验的大局。进一步阅读:由Kari Meric 设计的Netflix设计模式和流程,伟大的UI设计灵感网站以及为什么你会发现它们有用的原因


8.寻找辅助设计资源
如果我用秒表来计算我花费精力组装设计的时间,我可以非常自信地说,其中大部分时间都花在了反复思考虚假的用户名、搜索占位符和编写虚假数据上。
说实话,我很喜欢编造这些假故事。我去年买了一台打字机,它让我感觉像海明威,所以让我们把它归咎于我的时髦倾向。但是你不应该这样浪费时间。
每个设计的关键都是内容或数据本身,因此从一开始就对副本进行深思熟虑和有意的处理是很重要的。如果没有数据,您的设计就无法也不会讲述故事。“Lorem ipsum”毫无意义,但是您的设计不应该如此。如果数据是无意义的,涉众将很难获得价值并遵循工作流,因此值得您花时间通过放入其中的数据或内容来传达设计的功能。
所以,这一切听起来都是一个好主意,但是像这样的数据表由于数据量和差异而设计起来特别耗时:

我不会手工输入每一行,我将使用辅助设计资源来帮助生成真实的虚拟数据。上面图片中的每个IP地址、名称和类别都是使用外部数据源自动生成的,这为我节省了大量的时间。
Sketch有一个内置的数据填充器,允许您从纯文本文件中获取虚拟数据。你可以在网上找到随机的数据列表(我最喜欢的是Populate),或者从头开始创建自己的列表:

填充数据列表的集合。

我为自己创建的自定义列表。
有了实际数据在手,我现在可以使用我的设计工具(或第三方插件/插件)来填充我的设计。
下载或创建自己的文本文件数据源后,请确保将其作为sketch首选项中的源添加。现在,当您选择包含文本的图层或符号时,您可以通过单击数据图标将其填充新的虚拟数据。这将使用数据文件中的随机条目替换任何现有文本。非常方便!
为什么它让我变得更好:因为数据不是重复的,完全没有意义的,或者无关紧要的,所以设计感觉更接近现实。这也使得与关键涉众的评审更具生产力,因为很简单,设计更容易遵循。此外,必须使用实际数据进行测试,以便为溢出和截断等问题做好适当的设计准备。


总结
诸如插件、插件和外部资源之类的工具增强将帮助您更聪明地工作,而不是更努力地工作。有效地使用,你会完成更快、更好的完成成功。
虽然更多的设计并不一定是目标,但是在设计执行方面的效率提高将使您在设计过程的其他地方花费更多的精力(甚至承担更多的风险)。这可能意味着更多的时间用于研究,更多的时间用于改进工作流,或者更多的时间用于创新。
你的设计工具应该只是达到目的的一种手段,它只是你脑海中想法可视化的工具。


这是我们成为一个优秀设计师的三部分系列的最后一部分。第1部分和第2部分让你走上了成为战术设计执行大师的道路。
我们将通过讨论更具战略性的方面以及如何在文章之外扩展你的设计实力来结束本文。


9.减少设计
这似乎违反直觉,因为,你是一名设计师,对吧?
初级设计师倾向于在设计时堆砌很多东西。如果你看一下他们的设计文件,你会看到几十个我们称之为“实验设计”的画板 - 也就是说,在相同的设计模式上进行迭代,试图直接设计出最终版本。

迭代是这个过程的一部分!
这本身并没有什么问题; 实验和迭代是设计过程的基础。但是随着你的职位越来越高,在你打开设计工具之前,你会在脑海中做出更多的决定,因为你会知道哪些模式是有效的,哪些是无效的。这个能力只能通过重复和练习来实现,所以研究你的设计并记下它们的成功和失败。你迟早会将这些决策内部化,而不需要以实际的设计样式来查看它们,从而可以自由地评估更多的潜在解决方案。
随着你职业生涯的进步,你可以更多地参与构思和解决方案形成的过程,而不是执行阶段。你的价值将从视觉设计转向创造性。那时,最重要的是你的设计想法,界面只是达到目的的手段。
为什么它让我变得更好: 通过掌握设计的战术方法,我可以花更多的时间在问题的前端,完善解决方案。


10.写更多
在形成你设计语言和发展你想法的时间里,你会成长为一个优秀的设计师,而不是美化一个登录模式或说明一个空状态。
如果你不确定从哪里开始,这里有一些想法:
你学到了什么?谈谈你是如何到达那里以及它如何让你变得更好。(嘿,这是这篇文章!)教别人如何做某事。将其分解为单独的步骤并提供理由。反思一个坚定的信念,支持和挑战它的研究实例。
最优秀的设计师是杰出的传播者,你的设计动机和理论基础越合理,你就越有效地说服利益相关者并使你的设计成果。
为什么它让我变得更好: 我对我的个人设计技巧,风格和方法有深刻的理解,所以谈论设计和执行它会更有效率。


11.强调成果
这是一项很难培养的技能,因为它涉及到放弃某些事情。作为初级设计师,设计冲动是不可动摇的。你的设计是你的宝贝,所以它看起来应该是职业设计师的产物。
在你的设计生涯中,结果会取代设计。在你专业设计之旅的这个阶段,优先级是关键,不管你喜欢与否,“足够好”都会慢慢进入你的词汇表。
直到你完全理解业务需求和用户需求,你才会开始将强调成果视为战略性关注点。收益递减是设计的敌人,很难知道你何时达到了这个高度。
当你构建一个设计问题时,与产品经理和其他与产品密切相关同事密切合作,以保持对用户、问题和解决方案的高度关注。如果你发现自己偏离了产品经理定义的需求,那么这就说明你正在追逐不必要的东西。
如果你不确定,请回头查看你想要达到的结果并权衡你的设计成果:这是一种装饰还是增强功能?如果不添加,结果是否仍然实现?
为什么它让我变得更好: 我已经成为一个更具战略意义的设计师,总是将结果优先于装饰。但这并不意味着我的设计在视觉上没有吸引力。我是高效且有效的执行设计任务,利益相关者信任我的建议,因为他们知道我一直专注于结果。


12.协同工作
最后,我想提醒大家,我们并不是世界的中心。我们不是天才,我们不优越,我们不是利益相关者。
谦虚,记住需要一支团队才能将产品变为现实。从产品经理到开发人员,再到销售和营销,每个学科在将产品推向市场方面起着至关重要的作用。
作为设计师,我们有责任了解流程并与他人协作,相互提升。
当你与他人合作时,你要主动地了解他们的动机,焦虑和意图 - 这对维持健康的人际关系至关重要。
安排一些产品沟通会议并认真倾听,了解其他同事关注的内容并针对这些问题提出专业的解决方案。你不仅要建立信任,还要建立一支捍卫和支持你的设计团队。
为什么它让我变得更好: 在产品设计领域,无私是成功的关键因素。学习更多相关专业的内容有助于你进行更有效与其他人沟通,并且可以更快地达成共识。


摘要
掌握任何领域的专业知识都需要长时间实践和练习,每项技能都必须得到锻炼和维护,在职场中,还需要你根据你职位、行业、专业需求进行技能的调整。


原文链接:
https://modus.medium.com/the-ultimate-guide-to-becoming-a-great-designer-part-3-of-3-591816a4a4b1
作者:Jon Moore

 
以上内容如涉及您的权益,请告知,我们在此表示道歉并立即删除涉及权益的内容,谢谢!
 
 
 
热点动态
 
九组有东方味道的品牌VI设计案例欣赏
画家艾轩那些触动人心的素描手稿
佃喜翔 | 歌舞伎工笔画,满满的唐风,美极了!
越南的新兴艺术家和时尚插画家 Eris Tran 时装画作品
日本知名设计师吉井宏超可爱呆萌的实体玩偶作品
画Icon时缺灵感吗?给你上千个UI小图标参考,这下有灵感了吧
一组红色系的色彩搭配干货,色谱配有色彩寓意和叫法
画UI小图标没有灵感了吗?这几百个足够给你提供灵感了
 
机架式万兆以太网工业交换机ONU-IA
¥面议 起/ONU-IA
 
扩展式全带宽以太网工业交换机ONU-IM
¥面议 起/ONU-IM
 
 
我要投稿 商务合作
 
| 版权所有 上海振联图文设计有限公司 沪ICP备15046571号 Email:821804456@qq.com © All rights reserved Realtii 2016