前端必备的两个P图技能

504 阅读1分钟

1.工具介绍

  • 工具不怕老,最重要是实用
  • 使用Fireworks实现高效P图

1. Fireworks是什么

  • 是Adobe的一款网络图形设计的图形编辑软件
  • 虽然已经没有迭代更新,不过老版本功能就已经够用

2.版本与环境

  • 建议使用8或者CS3 的绿色版/安装版
  • 平台支持:windows 和 mac

2.基本概念

1.图层

  1. 有层级
  2. 重叠会遮罩
  3. 可以加锁/可以隐藏
  4. 可以组合
  5. 类型:位图/形状 (注意形状是不能选择内容,这里只考虑位图的情况,位图就是导入的图片)

image.png

2.选择

1. 图层选择

  • 通过直接点击
  • 在右侧列表点击

image.png

2. 内容选择

1. 位图选择

image.png

2. 魔法棒选择(Ctrl+D取消选择状态)

image.png

3.裁剪

1.选中需要导出区域

image.png

4.导出

  1. 另存为 image.png

  2. 另存为类型:平面话PNG image.png

  3. 选项:设置导出的“质量” image.png

3.实战

1. 图片合成

image.png

核心思想:

  • 通过魔法棒抠图,(注意要在大图时候就抠)
  • 用取色工具+油漆填充颜色
  • 多选图层用对齐工具水平垂直居中

2. 无限拉伸

image.png

核心思想:

  • 调整画布的大小,把高度调高
  • 在分别在底部切两块,一块是底部圆弧,一块只有两竖。
  • 只有两竖的拉长高度。
  • 使用裁剪工具裁出需要的高度

资源图片

播放按钮.png

播放背景图.png

产线监控图.png