话说,以前的前端工程师在入行时都当过切图仔或切图女。曾经,切图作为前端一门基础且必备的技能,不知何时开始已经不再提起。很多面试官在招聘时都忽略了PS的存在,其实在国外一位优秀的前端工程师是包揽设计工作的,PS玩得可溜呢。
现在大部分的前端工程师都说,这个图让设计师去切吧,这个图标这样这样切,那个背景图抽离出来,要这层不要那层。说多了感觉会被设计师拿刀砍死,就像下面那样。。。
有时候设计师切出来的效果可能是下图左边酱紫的,但是你期望的切图效果可能又是下图右边酱紫的。为什么会存在这种差异呢,我曾经当过大半年的UI设计师,从设计师的角度来看,没有过多考虑代码对切图的加成和代码实现布局的影响。
例如轮廓outline、外边距margin、内边距padding、圆角border-radius、 盒子阴影box-shadow、滤镜filter、行高line-height、文字阴影text-shadow等css属性在PS上的表现还是会存在差异的,标准不一,设计师无法理解代码里的规范,开发者无法理解设计里的规范,再加上各种图层叠加效果以及融合变化,所以很难分离出开发者想要的效果。所以只有熟练操作PS才能分离出开发者想要的图层及其效果,为切图规范标准化。
为什么今天我要把这个话题提出来呢,我只想说明有时候自己切出来的图才是自己想要的。如果不想像下面这样,还是赶紧必备下几个常用的切图小技能吧。自己动手,丰衣足食,无可奉告,一边玩去。
贴下切图常用的快捷键,我对这些快捷键操作进行了分类,方便记忆,只需记住以下常用快捷键即可。
文件快捷键
工具快捷键
编辑快捷键
选择快捷键
视图快捷键
图层快捷键
备注
准备:首次使用时先配置
步骤
首次使用时需配置:同上
准备:首次使用时先配置
步骤
步骤
步骤
步骤
步骤
步骤
步骤
准备:首次使用时先配置
步骤
准备:首次使用时先记录动作样本
步骤
Photoshop尽量使用CC版本才能享受以上全部技巧,新版本可通过Adobe Creative Cloud来进行管理(安装和更新),还可以配合其他Adobe软件一起使用。安装和破解的教程就不出了,网上一搜一大堆,都是傻瓜式的安装和破解。
在这里推荐一个PS第三方增强工具:像素大厨(必须下载了PS才能使用),如果不需要切图只需要量取一些标注信息,使用它更快更方便,轻量级的应用,值得一用!
写到最后总结得差不多了,后续如果我想起还有哪些PS切图技巧遗漏的,会继续在这篇文章上补全,同时也希望各位朋友对文章里的要点进行补充或者提出自己的见解。欢迎在下方进行评论或补充喔,喜欢的点个赞或收个藏,保证你在开发时用得上。
原文:https://segmentfault.com/a/1190000020936896
先说说大家平时最苦恼的设计稿还原度问题,一个视觉超赞的稿子,怎么到了前端手里,字体边距就乱七八糟呢?为什么没对齐,为什么没加粗,还有说好的动效怎么都没上,完全不是情感化设计了啊。
网页设计需要注意什么?在不同设备上采用相似的设计,导航的设计要简单易用、清晰明了,改变访问过的链接的颜色,让页面浏览变得更容易,仔细检查所有的链接,确保能点击的元素让用户看起来就能点击、不要让促销广告遮住内容
好的设计能够帮助企业提升数据,同时还可以提供用户一个良好的使用体验。不过今天讨论的重点并不是付费报告,而是这69条设计原则。
User Experience Design(用户体验设计),简称UED。UED是以用户为中心的一种设计手段,以用户需求为目标而进行的设计。以用户为中心的设计, 英文叫做User-Centered Design 缩写为UCD,他是UED的一种具体的设计实现理念。
高层模块不应该依赖低层模块,二者都应该依赖其抽象;抽象不应该依赖细节;细节应该依赖抽象。什么叫高层模块,什么叫底层模块,什么叫抽象,什么叫细节
这篇文章是关于Javascript的面向对象的程序设计,主要从三个方面来介绍,1. 理解对象属性; 2. 理解并创建对象; 3. 理解继承
模式化的设计套路之所以为广大网页设计师所喜爱,很大程度上是因为它们具备有良好的可用性和可访问性,在转化率和用户留存率上有着不错的数据表现。但是这些通过数据来体现的设计模式,在用户的视角里,可能并不那么理想。
初次接触或者想要进入网页设计行业的朋友会经常分不清楚web前端与网页设计之间的区别,不知道网页设计要学什么,web前端要学什么,因此感到很迷茫?
分享一些和设计师成为好朋友的个人经验,注意,这些经验技巧只适用于技术开发人员。如果有事情找设计师商量,千万不要站在设计师的背后
设计系统的产生是为了某领域内产品在不同平台和设备上都保持设计和交互风格的统一。既然是一个系统 ,那必须具有相应的完整性,它为产品设计,产品内容等方面提供相应的指导
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!