参考线用不好,设计效率全白搞?手把手教你驯服这匹“野马”

mysmile 9 0

做设计这事儿吧,说实话,真不是光有灵感就完事儿了。咱平时用那些个设计软件,里头五花八门的功能多得跟牛毛似的,但最磨人的,往往不是那些大特效,反而是“对齐”这种看着不起眼的小事儿。你想想,是不是经常有这情况:两个图层恨不得用眼神儿去瞄它是不是在一条线上,放大缩小来回折腾,最后打印出来一看,妈的,还是偏了一两个像素,歪了那么一丢丢,那种感觉就像吃米饭吃到了小石子,咯得慌。

所以今天咱就来好生摆一摆这个“ai对齐参考线”。别觉得它就是个死板的辅助线,用好了它真是个宝贝,用不好那就是给你添乱的祖宗。我刚开始接触那会儿,也是被它搞得五迷三道的,甚至想给它两耳屎(耳光),但现在摸透了它的脾性,才晓得啥叫“真香”。

首先咱得整明白,这“ai对齐参考线”到底是个啥玩意儿。官方点儿说,它叫智能参考线,英文叫Smart Guides。你跟那些个老设计师聊天,他们嘴里蹦跶的“把智能参考线打开”,说的就是这个东西 -1。它跟你从标尺上【Ctrl+R】调出标尺后,自己用手去拖出来的那种天蓝色参考线不一回事儿。那种手拖的参考线是死的,是静态的,你放在那儿它就钉在那儿了,像个老实巴交的卫兵 -3

但这个带“ai”名头的家伙就不一样了,它滑头得很。你啥时候移动图层、画个形状、或者拽个选区,它就蹭地一下冒出来了,而且还是那种骚粉色的(默认颜色,能改),在你图层边缘、中心点那儿闪一下,提示你对齐了或者距离是多少像素 -1。说句心里话,刚用的时候我还觉得这粉色挺碍眼,心想Adobe这审美莫得救咯,但用久了也就习惯咯,谁叫它好使喃。

但是哈,但是来了。这玩意儿虽然叫“ai对齐参考线”,但它的那个“ai”有时候脑壳是方的,不晓得转弯。不晓得你们遇到没得,反正我是遇到过多回。啥子情况喃?就是画面头元素一多,好几十个图层堆在那儿,你动其中一个,好家伙,满屏幕的粉色线到处飙,横七竖八的,看起比蜘蛛网还密。本来是想把这个小图标对齐到中间那个大框框,结果它一会儿识别左边的,一会儿识别右边的,那个参考线跳得来跟吃了炫迈一样,根本停不下来 -2

这种情况咋整?莫慌。这时候你如果还指望这个“ai对齐参考线”帮你,那你就是自找麻烦。我个人的土办法,就是干脆利落,先下手为强。快捷键【Ctrl+U】给它关了再说 -2。关掉之后世界清净了,你凭到感觉先把东西挪到大概其的位置,然后再按一下【Ctrl+U】打开,让它帮你做最后那一下微调。这就好比啥子喃,好比你要把车停进一个很窄的车库,你总不能一直靠自动泊车吧?有时候自己先把车摆正了,再让系统帮你修正那最后一两公分,反而更撇脱。

关于这个“ai对齐参考线”失效的问题,以前我也纳闷过。明明菜单栏“视图——显示”里头,那个“智能参考线”是打上勾了的,咋个移图层它就是装死不出来喃?后来才搞醒豁,多半是你把“视图——对齐”里头的一些选项给勾岔了。比如说你同时勾起了“对齐网格”或者“像素预览”,那它就只认网格不认参考线了 -6。这就跟脚踩两只船一样,总要翻一个嘛。所以下次遇到它罢工,莫急着重装软件,先去“视图——对齐到”里头瞄一眼,把那些勾勾儿该取的取了就对了。

还有一点我要吐槽,这个“ai对齐参考线”虽然名字头带ai,但它其实是个“偏科生”。它对于那种正儿八经的矩形、正圆,识别得飞快,准得很。但你要是遇到啥子不规则的图形,比如你自己用钢笔勾的歪歪扭扭的路径,或者是那种手写的艺术字,它的老毛病就犯了。它认不到图形的真实边缘,它只认得到那个图形外头的那个大框框,啥子术语叫“定界框” -2。这就很尴尬了,你以为你对齐的是那个图画的尖尖,实际上它给你对齐的是那个框框的边边,视觉上看起来就是歪的。这哈咋个整?没得法,只能靠肉眼,或者自己手动拖参考线来辅助。所以说,工具这东西,你越是了解它的局限性,就越不会被它带到沟里去。

另外还有一个很容易遭忽略的点。有时候你不小心点了啥子,突然发现那个“ai对齐参考线”还在,但是那些你自己从标尺头拖出来的参考线(就是那种天蓝色的线)移不动了,像焊死了一样。这个就不是智能参考线的问题了,是你把参考线给“锁定”了。去“视图”菜单头,把“锁定参考线”前面的勾勾取消掉就对了 -8。当然也有可能是你图层选错了,你要移动参考线,得先选中那个图层,让它在活动状态,不然它也是不理你的 -8

讲到这儿,可能有人要问,那这个“ai对齐参考线”到底有没有啥子进阶的用法,能让人觉得“哎,这哈钱没白花”?有的兄弟,有的。比如在做那种等间距排列的时候,比如一排按钮,你要让它们之间的距离都相等。你要是凭感觉挪,挪到眼睛瞎都可能不平均。但你把智能参考线打开,它在你挪动第二个按钮的时候,会自动出现一个提示,显示“距离: 20px”,还会有一个双向箭头的样子,告诉你现在这个间距跟上一个间距是不是一样的 -1。这就是所谓的“动态测量”,对于做UI设计的朋友来说,这功能简直不要太爽。

再比如说,要做那种斜着的对齐,咋整?平时那些参考线都是横平竖直的,遇到个30度角、45度角,常规参考线就抓瞎了。但你看那些老油条是咋操作的?他们会在Illustrator里头(PS里头操作稍微麻烦点,但也行),先画个路径,旋转到你想要的那个角度(比如30度),然后选中这个路径,直接按快捷键【Ctrl+5】,把它变成参考线 -4。这哈你再移图层,打开智能参考线【Ctrl+U】,它就乖乖地贴到你这条斜线上来了。这才是“ai对齐参考线”的高级玩法,用路径去定义对齐的规则,而不是被软件预设的那些死规则框死。我觉得Adobe应该把这个功能宣传得更凶一点,好多人用了几十年软件都不晓得有这操作。

最后说点感性的话。做设计这东西,其实就是在跟“精确”二字打交道。灵感是天马行空的,但落地的稿子必须是一丝不苟的。这个“ai对齐参考线”,说穿了就是帮你把脑子里那些抽象的“对齐”概念,变成屏幕上具体的、能看到的粉色线条。它不是什么玄学,就是个实实在在的帮手,而且是个有时候还比较扯拐的帮手。你得学会跟它磨合,晓得啥时候该用它,啥时候该关了它,啥时候该用手拖的参考线去补它的不足 -3

希望今天摆的这些龙门阵,能对正在看文章的你有点帮助。下次再被这个“ai对齐参考线”搞到头大的时候,莫要发火,想起我今天说的话,换个思路去盘它。毕竟,咱才是坐在电脑面前的人,它是死的,咱是活的,对吧?搞设计的,哪能跟一根线过不去喃,划不着嘛。