UX/UI设计工具的选择:对设计师的重要选择标准

原作者信息:Tom Koszyk    资深设计师,自由的产品设计师, Pixology 艺术总监 . 音乐爱好者. 游戏爱好者.

原作者Medium地址:Tom Koszy的Medium

原文地址:The Perfect UX/UI design tool.

译者:UI设计爱好者一只,欢迎交流。第一次试译,欢迎指错。

||  Adobe Photoshop, Affinity Designer Sketch 3?—?UI设计三工具

多年之前,不管是做简单的网页,还是做复杂的原生APP,Photoshop曾经是做界面设计时的首要选择。

但是在我试用了近年来多次被拿来与Ps比较的软件—Sketch3和Affinity Designer之后,我才意识到设计师其实可以尝试去用一用新的工具,老的软件有一点过时了。说实话,这可能是我第一次不使用Adobe的工具去做UI设计,我不得不说这种体验让我有很大的意外惊喜。

不同的视角

我尝试了不同的视角去看待设计。Sketch改变了我的工作流程。因为Sketch就是为了UI设计而产生的工具,它的设计初衷就与Ps大相径庭。

尝试像Sketch和Affinity designer这些其他的设计工具,改变了我对传统设计过程的看法。

它们让设计的心思集中在...额…怎么说呢,更集中在产品本身上?对我来说,用它做设计的过程更像开发的过程。它不会让你把设计当做仅仅就和在一张既定的画布上画画一样。

设计工具影响我们的设计进程

我开始进一步思考,我们应该在我们的设计流程中用多少设计工具。

我们正处于一个令人激动的时期,Ps现在已经老了,它开始在配置不那么高的电脑上运行的越来越慢。它的核心代码对于现在来说严重过时了,但毕竟它是作为一个照片编辑器被设计出来的产品,而不是针对UI设计而产生。作为前冠军,它开始慵懒然后越来越臃肿。其实最近针对Ps做的竞争产品越来越多,但是也没有一个是完美的。在UI设计工具Fireworks的市场占有率改变之前,我们这种想法是对的。Adobe现在有两种处境,要么他们重新对旧的设计工具做出改变,要么他们就只能把市场份额拱手让人。

最完美的设计工具?

让我们静下来想一下?—?完美的设计工具应该是什么样子的呢?

它的工作区对设计师更友好?还是说增加了我们的设计效率? 或者让我们的设计工作发生革命性的巨变? 下面是我认为重要的十三个方面。

1. 流畅性

现在Ps最大的问题就是太耗内存了。就像一个怪兽一样无止境吃着你的内存—让电脑运行的越来越慢。我最近发现在我用14年购入的8G内存MBP retina跑Ps的时候,仅仅是做一张单独的网页设计图的时候已经有点困难了。

Ps和Affinity相比,需要多于两倍的内存空间。

设计工具的轻快性是显而易见的需求,不管是Affinity Designer还是Sketch在这点上秒杀掉了Adobe。

2.可靠性

没有人愿意让自己呕心沥血工作了几个小时之后软件崩溃然后一切重来。但是现在这种事情真的常常出现在工作中,我觉得现在这些受大家欢迎的设计软件,没有一个完全解决了这个问题。

Affinity 就跟个熊孩子一样总是闹啊,特别是在用透明度工具的时候。Ps就和铁索桥一样…(晃晃悠悠..)我用有一段时间不用Sketch了,所以我也不知道它现在到底怎么样了,但是我记得之前用的时候有一些让人崩溃的时候......

3. 专注于UI的界面

(译者注:Adobe将在16年推出一款专注UI设计与Sketch定位相同的软件Project Comet,参考Adobe 推出UI设计工具)

Sketch在这一点上胜利了。Ps根本就不是一个UI设计工具,它的核心是一个照片编辑工具(不顾一切的添加各种小工具)。Adobe曾经介绍了一个Ps中用于UI设计的工作区的测试版本,首先,它砍掉了太多的设计功能,其次,它让我觉得看起来更像Winamp中的一款皮肤。我们需要一款真正针对UI设计的设计工具。

Affinity看起来比Ps更好那么一点点,但是它缺少一些测量工具。它不能告诉你对象之间的距离,也不能通过百分比来进行对象的缩放。

Sketch 基本上是完美的,它的工具对UI设计来说足够了,但是它的界面可以设计的更人性化一些便于使用。

4. 基于矢量的工作流程

对我来说,矢量图现如今是必不可少的。我们为多种设备做着设计,各种设备的显示屏大小千奇百怪。我们的设计图必须是易于调整的。软件工程师们也有着和我们一样的想法。

我提到的三个设计工具都可以做矢量图,这里我最喜欢的设计工具是有着非破坏性布尔运算的Affinity。最不舒适的是Sketch,它的功能有一定的局限性。

5.有基本的编辑位图的工具

(Affinity Designer 有很多种工作模式:设计模式,位图编辑模式,切图输出模式)

你在做设计的时候会时不时的对栅格化的图形进行色彩的调整,而且另外开一个工具去处理会比较麻烦。Ps在这点上做的比较好,它的功能比较全。

Affinity Designer最看重的是效率,除此之外,它也有一个姊妹应用,Affinity Photo,他们协同工作的话对设计师十分友好。

不幸的是,Sketch在这一点上实在做的不怎么样。它基本上没有任何位图工作所用到的基础工具。可能你会觉得它这样做是为了让你把一些位图素材放进去之前好好考虑,但是真正做起来的时候你或多或少会需要对素材进行一些小调整。

Sketch在这一点上完完全全是个Loser!

6.图层缩放不会对像素造成破坏

可能这一点Ps存在最大的问题。当你缩放像素层的时候,图像会被压缩并且质量下降。除非你首先把它转换为智能对象。但是智能对象比较大,让工作效率下降。

对我来说,智能对象是有别的用途的。比如,你在做一个按钮的设计的时候,你只用创建一个对象,然后把它复制到任何你需要它的地方。当你改变一个按钮的颜色的时候,所有的按钮的颜色都会改变,这一点真的很棒啊!我觉得把智能对象用在为了让图片的质量不下降这一点上真的很奇怪。

Affinity在这一点上做的很不错,你可以缩放一张图片十次,保持原有的图片质量。这一点十分让人欣喜,我发现这一点的时候整个人都兴奋了。然后我想了想,一张图缩放保持质量不应该是理所当然的吗...顿时感觉之前用Ps就像呆在石器时代一样。

7.即时的预览功能

Affinity中不同的预览模式,分别为矢量图,Retina,Default screen

让我说一个Affinity最好的地方的话,就是它让你的设计保持矢量(形状和字体)

并且让你能够实时预览它在不同像素级的屏幕上的效果。并且它有Retina屏幕预览模式!目前没有任何一个竞争产品做到这一点。

8.预置的网格系统

对我来说,不管多么简单的设计都要基于网格标准。网格是结构化布局的重要组成部分,它可以帮助你平衡所有设计元素之间的关系。除此之外他们可以建立引导作用,使用户体验更加友好,这一点至关重要。

我更希望能有一些小的工具去建立网格。能够根据我的计算和分配快速建立网格,我更爱那种虚线状态的参考网格,但是现在还没有看到实现的。

9.易用的测量工具

只放一下Sketch里面测量工具是怎么工作的,我希望到处都能见到这种测量工具!

10.不错的排版功能

我最近写了一篇关于排版规则的文章。

流行的UI设计工具支持所需要的所有功能,自定义字间距,标点的设定等等。我认为如果CSS能做到这些的话 ,这些工具都应该要能做到这一点的。

11.艺术板

||   图为Sketch3中的多艺术板显示

艺术板让你能够在一张开放的画布上设计。如果我们分开设计交互性强的网站或者App的每一个页面的时候,我们会想把他们放在一个界面中看一看。艺术板同样允许你在整个文件中使用智能对象。所有的页面在同一个文件中十分的方便!现在只有Affinity Designer不支持者一点了,我希望它快点支持这一点。

12.多种导出选择

每个设计工具进入市场都是会想要去抢占市场份额的。不会每一种设计软件都使用同一种工程文件,不同的团队会有不同的工程文件使用习惯。有的设计师给开发者PSD文件有的会帮开发将素材全部打包。那就意味着一个好的设计工具需要能够支持导出多种格式的文件。

这一点上,我十分偏爱Affinity,它让你能够打开PSD文件(太棒了!)并且也能够把你在Affinity中做的设计文件导出为PSD文件。PSD现在仍然是最常见的格式,并且我觉得PSD可能会持续占有大份额一段时间。

13.直接导出CSS样式

最后一点十分简单,Ps和Sketch都可以在对象上直接使用右键复制它的CSS代码。Affinity目缺失这个功能,但是它即将推出这个功能了!

Apple Music redesign是完全用Affinity Designer设计的。你可以在我的Behance上面看到我的作品,下载源文件。链接

What about you?

尽管前景可观,现在似乎没有一个完美的解决方案。

以上就是我对设计工具选择参考的一些关键点,大家都是怎么选择设计工具的呢?

时间: 2024-10-09 21:42:34

UX/UI设计工具的选择:对设计师的重要选择标准的相关文章

App开发者必备的运营、原型、UI设计工具整理

转:http://blog.csdn.net/jinzhu117/article/details/8194301 一.运营类 1. APPVIEW,网址:http://lab.hakim.se/appview/ 帮助iOS 应用开发者追踪所有地区App Store最近的用户评论,可以按时间.评分.地区排序,缺点是可能更新较慢,评论不全. 2. AppBrain,网址:http://www.appbrain.com/ 可以在此查看Android应用在应用商店的用户评论,更新及下载量变化. 3. a

21个免费的UI设计工具和资源网站,不管是web,js,android都

本帖最后由 hua631150873 于 2014-9-12 18:26 编辑 Lumzy 官方地址:http://www.lumzy.com/ Lumzy是一个网站应用和原型界面制作工具.使用Lumzy,您可以轻松创建UI模型并即时发送到客户电脑中. Lumzy还具有团队协作编辑工具. Mockingbird 官方地址:https://gomockingbird.com/ Mockingbird(中文名:百舌鸟)是一个在线工具,它使您轻松地创建UI界面模型,预览UI,并可以共享你的版面编排效果

40个UI设计工具

摘要:用户界面设计在持续的基础上不断成长和演变.要跟上时代,你需要关注趋势.新资源和正被实施和谈论的新技术. 导读:用户界面设计在持续的基础上不断成长和演变.要跟上时代,你需要关注趋势.新资源和正被实施和谈论的新技术.同时,你也要亲身尝试,并提出原创的见解和应用.下面列举的这些工具能帮你做到这些.尽情分享下面这些我找到的注释出的资源中你认为有用的部分. 看看这些其他人已经想出的对一般用户界面挑战的解决方案,它不仅能帮助你找到正确的现有解决方案,还能作为你提出新的和原创的东西的基础. 一个在线文字

关于Android开发的免费UI设计工具

推荐使用 http://pencil.evolus.vn/ 它在全平台上都可以安装使用,同时也包含了 Android Material Design 的一些组件库 非常方便使用与 APP 开发过程中的原型设计 提供两个 Material Design 的开源素材地址 Widgets(组件): https://github.com/nathanielw/Android-Lollipop-Pencil-Stencils Icons(图标): https://github.com/nathanielw

15款优秀移动APP产品原型设计工具

一款优秀的移动APP产品原型设计工具应该具备: ①.支持移动端演示(随时随地演示给BOSS,厕所&食堂&电梯-以体现我是那么的敬业--长点工资必备) ②.组件库(高效复用,谁用谁知道) ③.可以快速生成全局流程(程序猿看不懂拆解的,给丫的看这个) ④.在线协作(多个PM狗一起用) ⑤.手势操作.转场动画.交互特效-(这些都不需要,留给专业的交互.视觉,搞那么虚的不如多想想产品流程逻辑做做减法.写写xxRD啥的) 这些年,产品狗们折腾过的原型工具: 1. POP(Prototyping on

20款优秀的移动产品原型和线框图设计工具

线框图(Wireframe)是app.软件或者网站设计过程中非常重要的一个环节,它可以合理地组织并简化内容和元素.线框图除了可以帮助开发者节省时间外,更可以加深开发者对产品的认知,给开发者一个清晰的产品构架,避免了开发者陷入层次不清.功能不明的产品设计和开发混乱状态. 1.Proto.io Proto.io是一个专用的手机原型开发平台——可以构建和部署全交互式的移动程序的原型,并且可以模拟出相似的成品.它可以运行在大多数的浏览器中,并提供了3个重要的接口:dashboard.编辑器以及播放器.

UI设计

摘要 源于ajlr项目的验收,过程中ui的设计被屡次提到.所以就有了这样一个思考,什么是ui设计?对于开发人员来说,ui设计是否很重要?以及如何来进行ui设计? ui设计? User Interface,简称UI.从字面上来理解,用户与程序交流的接口.对于一般的程序员开发来说,一般认为不过软件的界面尔尔.通常对于程序员来讲,更多的关注的是软件功能的实现和性能的优化.恰恰相反,对于用户来讲界面才是最终与客户见面的主体:而在使用程序过程中频繁和程序交互的中介.对于客户来讲程序使用何种数据库.什么算法

UX/UI使你的产品拥有病毒式传播力

正好受用,非常感谢作者,分享给大家,希望大家从中受益 什么样的理想化的ux流程,能够使产品具有病毒式传播力?我们通常避免谈论什么理想化,因为这是相当矛盾的范畴.不过,我们非常热切地想分享关于在UI/UX阶段让产品具备病毒传播力的想法.今天我们就跟Medium读者分享这些观点. 病毒式营销的本质 病毒式营销概念的背后,是能让用户快速理解,以及在用户体验过程和传播过程中,拥有简单的产品自我升级功能.像一种传染性的疾病,它从一个人传染到另一个,并且不需要对这个过程有特别的干预,而是一个顺其自然的过程.

【干货分享】2014年UI设计类资源汇总

现在UI设计不仅仅是UI设计师的工作,程序员也需要学习,优质界面的重要性就不再赘述,博主简单盘点一下去年的UI设计资源. 在学习之前,先来看一看UI设计心理学,用户认可才是最重要的.了解了用户心理,新手要从最基础开始,可以看看菜鸟应该怎样学习UI设计,资深人士从咋看.咋想.咋做详细讲述新人学习技巧. 在UI设计方面,现在一骑绝尘的小米手机可以给我们一些启发,从2010年8月的MIUI 1到2014年8月的MIUI 6,MIUI正逐步走向扁平化. 那什么的用户界面才是优秀的呢,研究用户体验的设计机