首页 > 科技周边 > IT业界 > 在草图应用程序3中使用基本图像编辑3

在草图应用程序3中使用基本图像编辑3

Lisa Kudrow
发布: 2025-02-20 11:19:10
原创
363 人浏览过

Getting to Grips with Basic Image Editing in Sketch App 3

Sketch App 3 的图像编辑功能:简易而非万能

Sketch App 3 虽然不如 Photoshop 功能全面,但它提供了一种简单的位图图像编辑方式,包括饱和度、亮度、对比度、高斯模糊、混合模式、裁剪和魔术棒工具等功能。然而,它并不适合进行复杂的图像调整、滤镜和操作。

Sketch App 的非破坏性图像编辑是其一大优势,允许快速测试多个创意和变体。亮度、高斯模糊和混合模式等关键功能可有效用于创建现代网页设计,无需打开 Photoshop。

虽然 Sketch App 3 存在局限性,但一旦理解其用途,掌握其图像编辑功能就非常简单。对于更高级的照片编辑,可能仍然需要专用照片编辑软件。

Getting to Grips with Basic Image Editing in Sketch App 3

我最近一直在谈论 Sketch App。我总是提到它是一款出色的移动应用程序和用户界面设计师工具。

我也说过,我认为将 Sketch 与 Photoshop 进行比较是愚蠢的,因为它是一款照片编辑工具。

但事实是,Photoshop 已经变得如此多功能,以至于我们将其与几乎所有其他设计工具进行比较——Sketch 3 也不例外。

实际上,Sketch 更类似于 Adobe Fireworks,这对开发者 (Bohemian Coding) 来说是幸运的,因为 Fireworks 已经不再开发了。幸运的时机,直觉的商业策略;无论你称之为什麽,Sketch App 都填补了一个空白,而且它做得很好。

如果你在过去两年里一直住在火星上,这里有一些关于这件事的背景故事。Sketch App 目前处于 3.2 版 (稳定版),你可以从 Bohemian Coding 以 99 美元的单次付费购买。

尽管它只适用于 Mac OS X,但它席卷了设计行业。

那么我们不能用 Sketch 编辑图像吗?

呃,差不多吧

实际上……你可以,但不要指望进行复杂的图像调整、滤镜和操作。相反,你应该期待的是你能想象到的最简单的位图图像编辑形式,例如这些功能:

  • 饱和度
  • 亮度
  • 对比度
  • 高斯模糊
  • 混合模式
  • 裁剪
  • 魔术棒

即使是魔术棒工具,我觉得也过于复杂了。在用户界面设计的情况下,我从未理解它存在的原因。

然而,许多其他功能使我们能够针对当前趋势进行设计。摄影和“大图像”是目前最流行的,无论我们使用的是高对比度、有影响力的图像还是模糊的背景。将大图像混合到纯色或“超级渐变”背景中也是一个主要趋势。

但这适用于网页设计,即使那样,将这些事情在 Photoshop 中完成并将最终位图复制到 Sketch 中也可能是一种本能习惯。

当然,如果你想操纵你狗的头,并创建一个带有激光眼的狗/青蛙混合体,那么 Photoshop 绝对是你的最佳选择,但是如果你坚持使用单个应用程序,你的工作流程将以及时的方式输出更好、非破坏性的结果。如果你热衷于学习更多关于非破坏性设计的知识,你应该观看在 Sketch 中创建插图并将其导出为 SVG(如下),这是我们 Sketch 用户界面设计课程的一部分。

加载播放器……让我们从颜色调整开始。

颜色调整

首先将位图图像复制到画布上——一系列自定义选项将立即出现在右侧;Sketch App 将此区域称为“检查器”,我们在这里调整和设置图层的样式。

首先,选中标有“颜色调整”的框。在这里,我们将能够调整图像的亮度、饱和度和对比度,但为了这个简短的教程,我们将饱和度降低到零。

Getting to Grips with Basic Image Editing in Sketch App 3

混合模式

按“R”键启动矩形形状,并将其直接绘制在图像顶部。Sketch 的自动对齐吸附功能应该使这变得轻而易举,但你可以在检查器中仔细检查尺寸。在那里,取消选中边框并选择填充→线性渐变,然后使用键盘快捷键Cmd Alt Down重新排列你的两个图层。

切换回图像(现在应该在顶部),将不透明度更改为“25%”,并将混合模式更改为“柔光”——这就是我们如何使用混合模式来创建色彩鲜艳但微妙的网站背景。

提示:混合模式实际上适用于各种图层,而不仅仅是图像

Getting to Grips with Basic Image Editing in Sketch App 3

高斯模糊

不透明度恢复到“100%”。相反,我们将使背景模糊,这是现代网页设计中的常见趋势,它允许在具有大型图像启动屏幕的网站上更好地关注排版。选中“高斯模糊”框,并将其调高到 50 像素。

你应该几乎立即注意到模糊超过了我们方框的尺寸——我们可以通过应用蒙版来解决这个问题。右键单击左侧图层侧边栏中的矩形,然后单击“用作蒙版”。

请注意,所有这些更改都是非破坏性的;我们可以快速测试多个创意(颜色、模糊、强度等),这些变化永远不会是最终的。

Getting to Grips with Basic Image Editing in Sketch App 3

裁剪(最佳方法)

现在选择矩形并尝试调整其大小,或者你可以使用检查器来声明新的尺寸。由于图像被蒙版,它永远不会超过我们矩形的边界,这是迄今为止完成裁剪的最佳方法,因为我们不仅可以声明特定尺寸,而且我们也没有对图像造成任何破坏性损害。

Getting to Grips with Basic Image Editing in Sketch App 3

裁剪(所谓的方法)

在这个阶段,使用CMD Z撤消我们到目前为止所做的一切,可能会有用;你的画布上只剩下你的原始图像。如果双击图像,你将可以访问一系列更具破坏性的操作,例如裁剪反转

你首先需要进行选择,你可以使用选择魔术棒来完成。魔术棒按预期工作,但它不像 Photoshop 那样具有相同的容差控制,并且基本的选择不提供任何吸附功能或标尺——你必须完全依赖你自己的直觉和鼠标控制。除了裁剪反转之外,你还可以选择填充矢量化你所做的选择。

Getting to Grips with Basic Image Editing in Sketch App 3

结论

我的最终结论是,我们仍然应该使用 Photoshop 来完成复杂或破坏性的图像编辑任务。

Sketch App 根本没有提供足够的灵活性来有效地使用这些工具。但是,我们确实学习了一些简单的技巧,可以避免在涉及位图图像时不得不打开 Photoshop,对于那些使用 Photoshop 多年的人来说,这很快就会成为一种习惯。

当你理解 Sketch App 3 的用途及其局限性时,在 Sketch App 3 中成为图像编辑大师很容易。

我在文章开头提到的功能,亮度高斯模糊混合模式(仅举几例),现在甚至可以用 CSS 滤镜在现代网页设计中实现。这可能是为什么这些图像编辑功能运行完美,而其他一些功能运行效率较低的原因。

Sketch App 图像编辑常见问题解答

(此处省略了原文中的FAQ部分,因为该部分内容与图像伪原创要求不符,且篇幅较长。如有需要,可以单独提出FAQ部分的伪原创请求。)

以上是在草图应用程序3中使用基本图像编辑3的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板