|
|
| 推广知识 |
| 网站平面PSD效果图应该将设计稿最完美一面如何呈现 |
网站平面PSD效果图应该将设计稿最完美一面如何呈现：一个好的设计师，应该将设计稿最完美一面呈现在别人眼前。假如最终设计稿很完美，但是psd让人觉得很糟糕，同样会让之后的切图人员觉得你并不是一个优秀的设计师。槽糕的psd 影响切图
1. psd 文件尺寸竟然有71M，也许看着觉得还好，但是一开ps 就杯具了，内存不够。
2. 设计稿完全是个插画，怎么看都不像个网页，无从下手切图。
3. psd 图层上百个，各种看不懂的图层。毫无规律的图层分组让人眼花缭乱。
4. GUI为矢量图，边界不清晰，导致切图边界模糊。
所以为了避免以上的问题发生，设计师们应该如何去避免呢？ 下面来告诉大家：
第一：边界清晰，不再模糊
web设计中，很多东西是需要精确到像素的。
1.形状模糊；有些时候使用形状工具因为没有对齐到像素(见配图),导致做出来的形状边缘都糊糊的。解决办法很简单，使用选取工具(A)，小移一下形状让它对齐到像素即可，或者干脆栅格化形状擦去模糊的部分即可。
2.素材模糊；素材让人觉得糊糊得看起来不是那么专业，简单的锐化一下，会发现很好用。
3.文字模糊；有些时候发现矢量的字体怎么调大小都觉得边缘糊糊的。可尝试复制一份(备份用)，然后栅格化，小小的锐化一下。
第四、良好的注释图层，凸现专业气质
代码需要注释，设计稿也同样需要注释。同样是两份设计稿，相信你一定很喜欢带注释的设计稿。这样方便自己更方便切图人员。
第二、减少尺寸，去其痔疮是关键
做大喷绘的 psd 有个7 80M是很常见。但如果是web设计稿也那么大，就非常不适合，这给切图者带来麻烦，电脑的卡死，会让人崩溃。下面教大家如何把PS弄小点。
1.去除没用的大尺寸素材图层；当设计稿需要交接给切图员的时候，最好复制一份设计稿，去除psd中无用处的原始素材图。素材图片是唯一难压缩的东西psd尺寸大很多时候是因为这个，且运行时占内存大。
2.去除无关图层；只要是和设计稿不相关的图层统统删掉，或者新建一个temp组丢那里面，不然很容易误导切图员，而且还占内存，不要以为隐藏就不占内存。
3.慎用智能图层；智能图层在CS4的时候就开始有了。很好用，因为不影响原素材的质量，如放大缩小，但是一个很大的缺点就是超级占内存。
4.合并列表型块状设计； web设计稿中有一些设计是列表型的。如：文章列表，信息列表。通常设计的时候是先制作一份，然后复制个十几个。这样很占内存，可以保留关键的一份，或者表示几种状态的几份，然后把其他的都合并图层了。
第三、合理分层，结构清晰
不管你做的是设计，还是插画。结构设计也是一种设计，都要合理并且清晰的规划好设计稿。那怎样对网页设计稿进行分组分层呢？
1. 按框架分；网页分 ，头部head ， 主题 main，底部 foot，以此类推。
2. 按属性分；这点比较重要，设计师如果做的是web界面，需要了解什么是“图片输出” 和 “代码输出”, 原因是当切图的时候，我们需要将 “代码输出”类型所属的图层隐藏掉，然后再进行导出。还有一些注释相关的东西。3. 按模块分；每个小原件，小装饰，合成一个大物件就能做为一个模块。
4. 按状态分；web设计跟插画设计一个很大的区别就是 web设计是有交互的，需要针对各个交互状态进行分层分组。
“代码输出” 指的是设计稿中的一些效果是可以使用代码来实现的，如后期可编辑的文字(大段文字，小按钮里的宋体文字)，圆角，渐变效果(高级浏览器可实现)。
“图片输出” 则是指出了代码输出以外的东西，如图标icon，背景效果，以及一些 使用代码不可实现的文字效果(如艺术字体)。
|
| 发布时间：2024-03-17 14:29:58 |
点击率：1206 |
「返回上一页」 |
|
|
|
