# 海岬灯塔：用 VectorPaint 的 17 个闭合路径搭一幅几何海景

语言：zh-CN
原文：[海岬灯塔：用 VectorPaint 的 17 个闭合路径搭一幅几何海景](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/>)
中文：[中文 HTML](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/>)
English: [English HTML](<https://allluckly.cn/en/works/vectorpaint-cape-lighthouse-duo/>)
发布于: 2026-10-23T07:25:17+08:00
内容更新于: 2026-10-23T07:25:17+08:00
署名：Bison

在 iPhone Duo 模拟器里，用 VectorPaint 的钢笔闭合路径、填充和描边完成太阳、远山、海面、海岬与灯塔。记录 17 个对象的叠放关系、小窗闭合失误和三段波光的处理。

[视频](<https://allluckly.cn/assets/videos/vectorpaint-lighthouse-duo.mp4>)

[中文步骤](<https://allluckly.cn/assets/videos/vectorpaint-lighthouse-duo.zh-CN.vtt>)

[Poster](<https://allluckly.cn/assets/images/works/vectorpaint-lighthouse-duo.png>)

在 1080×1080 画布的一个图层中，用钢笔闭合 17 个对象，完成太阳、远山、海面、海岬与灯塔，添加条带、门窗、三道波光和光束，最后给塔身加 4 pt 黑色描边。附 iPhone Duo 模拟器展开、半折叠、合拢与重新展开的分步记录。

VectorPaint 本地构建 1.0.7（6），iPhone Duo 模拟器实录。创作段部分步骤为 2–4 倍速，完成 PNG 展示 2 秒；末 20 秒为模拟器窗口采样的折叠分步记录，已剪去等待。无旁白，附中文字幕。

按章节观看

1. [00:00 钢笔日轮与收藏色板](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=0.0>)
2. [00:35 远山与蓝色海面](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=35.5>)
3. [01:21 海岬与前景岩石](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=81.5>)
4. [01:53 塔身与灯室](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=113.267>)
5. [02:27 屋顶、条纹与门窗](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=147.533>)
6. [03:19 三道几何波纹](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=199.733>)
7. [03:56 光束与塔身描边](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=236.433>)
8. [04:25 原生 PNG 导出](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=265.433>)
9. [04:39 iPhone Duo 展开与折叠](<https://allluckly.cn/works/vectorpaint-cape-lighthouse-duo/#t=279.1>)

这幅灯塔使用 **1080 × 1080 px** 的方形画布，作品命名为“海岬灯塔\_方形创作”。左边放一轮暖色太阳，下面用紫色山脉和蓝色海面压出地平线；灯塔站在右侧的绿色海岬上，灯室向右伸出一束三角形的光。白色天空留得很宽，塔身也用白色，所以最后给塔身加了一圈黑线。

看起来有圆、有矩形，其实本轮使用的是**钢笔逐点绘制闭合路径**。太阳是八点围成的多边形，灯室、条带和波光也是各自独立的闭合色块，主要练习的是节点落点、闭合和色块叠放。

演示在 **iPhone Duo 模拟器，VectorPaint 本地构建 1.0.7（6）**中完成。具体工具位置以视频中的这份构建为准，商店版本可能有所不同。

![VectorPaint 原生导出的海岬灯塔：暖色太阳、紫色远山、蓝色海面、绿色海岬与红白相间的灯塔，海面留三段白色波光，灯室向右伸出三角光束](<https://allluckly.cn/assets/images/works/vectorpaint-lighthouse-duo.png>)

## 配色不多，先分出海面和灯塔

录制时使用收藏色板中的黑、白、陶红、琥珀、苔绿、蓝和紫。下表的 HEX 从导出 PNG 的大色块中取样，方便近似复刻。

| 用途 | HEX |
| --- | --- |
| 太阳、灯室亮面与光束 | `#F7B53D` |
| 远山 | `#875CBA` |
| 海面 | `#4578D6` |
| 海岬 | `#4A7A59` |
| 岩石、屋顶与塔身条带 | `#E04C2E` |
| 门窗、灯室框与塔身描边 | `#000000` |
| 塔身、波光与白色留白 | `#FFFFFF` |

暖色集中在太阳和灯塔，海面与远山用蓝紫色分开。绿色海岬给白色塔身一个落脚点，右下的暖红岩石再与屋顶和条带呼应。复刻时可以先使用这组颜色，等所有对象完成后再比较换色效果。

## 先想清楚哪些形状会挡住哪些形状

这幅画的远近关系很简单：太阳最远，山在太阳前面，蓝色海面接在山脚下；绿色海岬和右下的岩石再盖住一部分海面，灯塔落在海岬上。

创作时按这个顺序画大形状，后来新增的色块自然叠到前面。本轮使用 **1 个图层、17 个闭合路径对象**；门、窗、条带和灯室里的亮面，都可以分别选择。

本轮最终保留的对象可以这样核对：

| 内容 | 对象数量 | 与相邻形状的关系 |
| --- | --- | --- |
| 太阳、远山、海面 | 3 | 山挡住太阳下缘，海面接住山脚 |
| 海岬、前景岩石 | 2 | 盖在海面的右下方 |
| 白色塔身 | 1 | 立在绿色海岬上 |
| 黑色灯室、暖色亮面、三角屋顶 | 3 | 亮面位于黑色灯室内部，屋顶压住上缘 |
| 两条暖红条带 | 2 | 横向穿过塔身 |
| 黑色门和上部窗 | 2 | 分别落在塔身下部与上部 |
| 三段白色波光 | 3 | 散布在左侧海面 |
| 暖色光束 | 1 | 从灯室右侧伸出 |
| 合计 | **17** | 不含中途删除的错误短线 |

可以先只看前五个对象。太阳、山、海、海岬和岩石的关系成立后，哪怕灯塔还没出现，场景也已经能读成海岸。

## 用钢笔做一个闭合色块

本次反复使用的操作是：选择钢笔，在轮廓的转角位置逐点落下节点，最后回到起点闭合；再给当前对象设置填充颜色，关闭不需要的描边。

这里的重点是“转角”。一块简单的山、一条塔身色带，不需要沿着直线再补许多节点。节点多了，后面选中和修改反而更难。先把轮廓控制在少量清楚的拐点上，闭合后再检查形状。

做完一个对象后，切回选择工具，确认选中的是刚画好的对象，再进入**对象属性 → 外观**，设置填充并关闭不需要的“启用描边”。在下方“收藏色板”中，确认颜色应用到的是填充，再选择颜色并点“完成”。接着开始下一个对象。小形状集中时，这个确认动作尤其有用：灯室里的黄色亮面与黑色框很接近，塔身条带也会遮住一部分白色塔身。

除塔身以外的 16 个对象都取消了描边，让颜色直接相接。塔身的黑色描边是最后针对塔身单独启用的，宽度为 **4 pt**。它与白色天空的边界比较弱，加上这圈线以后，塔顶到塔脚的轮廓才连贯起来。

## 太阳和远山，先定下画面的高低

太阳先画。用八个节点围出一个接近圆形的轮廓，填暖色，取消描边。这个多边形太阳与后面的尖角山脉属于同一种造型语言，不必把边缘修成完全光滑的圆。

远山同样用八个节点闭合，填紫色。山顶有高有低，中间留一段下降再接第二座山。它从太阳前面经过，太阳下缘被挡住，画面便有了第一层遮挡关系。

蓝色海面接在山脚下。先确定水平的海平线，再向下围出一个大的闭合区域，填蓝色。海面要给后来的海岬和灯塔留出足够空间；这一步只负责大色面，暂时不加波纹。

复刻时，可以先检查三个地方：太阳有没有露出足够面积；山脚是否与海面接稳；蓝色区域有没有占据画面下方的主体。小细节都可以放到这三个关系确定之后。

## 海岬和岩石，给灯塔一个落脚点

绿色海岬从画面下部向右上方抬起，给塔身留出一块较平的位置。它盖住蓝色海面的一角，轮廓不必很碎，用几段折线说明坡面就够了。

右下方再补一块暖红色岩石。它与绿色海岬相接，把画面的下缘收住。这里没有给岩石增加纹理，前景主要靠更大的色块与斜边来支撑灯塔。

这两块形状都用钢笔闭合后填色，并取消描边。完成后，先停下来看看灯塔准备落在哪。塔身如果离海岬边缘太近，轮廓容易显得悬空；塔脚落在绿色内部，关系会更稳。

## 塔身、灯室和屋顶，分开画会更容易检查

白色塔身是一个上窄下宽的四边形。顶部留给灯室，底部与海岬接触。塔身保持直立，左右边稍微向外张开，不需要在这一阶段处理很多装饰。

接着画黑色灯室，再在里面放一块较小的暖色亮面。黑色在这里是灯室本身的填充，并不只是给黄色方块加一条粗描边。两个独立对象叠放之后，灯室的结构会比较清楚。

上方的屋顶用暖红色三角形。它略宽于灯室，让两边有一点伸出的屋檐。之后在塔身上加两条同样的暖红色条带，再补底部的黑色门和上部的黑色窗。

这些小部分都是分别闭合和填色的对象。屋顶、条带、门窗的顺序，按画面中谁需要盖在谁上面来安排。

本轮的小窗第一次没有顺利闭合，留下了一条不符合预期的线。实际处理是用选择工具选中这条错误线，再用正常删除操作移除；随后把窗画得更高一些，重新闭合填黑。最终 17 个对象里不包含那条已经删除的线。

## 小窗和波光总是闭合失败，先检查节点间距

细节失败时，不一定是颜色没有设置好。小窗和细长波光的相邻节点太近，起点、转角与闭合点挤在很小的屏幕区域里，会让最后一次点击难以确认。

本轮第一次较细的波光也被删除，随后拉开了节点间距再画。最后保留了三段白色的细长三角形，它们各自独立，没有连成一条长曲线。

照着练习时，可以先放大画布，再画细节；这是视图缩放，不是把作品尺寸改大。先检查闭合轮廓，再填色。如果误生成了短线，选中错误对象删除后重新画，比在很短的线头上反复试点更容易判断。

门窗与波光不必追求越细越好。只要缩回整幅画后，门还像门、窗能从塔身里分出来、白色波光能和蓝色海面拉开，就已经完成了它们的任务。

## 最后一束光，用三角形把方向指出来

最后补上暖色光束。它的一端收在灯室右侧，另一端向画面右边展开，形成一个清楚的三角形。

光束与太阳、灯室亮面使用同一琥珀色。它是一块单独闭合并填色的三角形。

画完后，最后一次检查塔身与白色天空的边界，才为白色塔身单独启用 4 pt 黑色描边。其余大色块继续保持没有描边的平面效果。

## 在 iPhone Duo 的三种状态下检查灯塔

完成作品并确认界面显示“已保存”后，在 Device Hub 底部依次切换 **Open（展开）→ Partially Open（半折叠）→ Closed（合拢）→ Open**。视频最后用模拟器窗口的分步记录展示这组操作，已剪去等待，便于逐步比较。

本次展开时视图显示 **56%**，半折叠约 **29%**，合拢后约 **27%**，重新展开回到 **56%**。这些百分比属于编辑器视图，作品和 PNG 仍然是 **1080 × 1080 px**。

每换一种状态，都先等界面稳定，再看三处：灯室的亮面是否被黑框包住，白塔的黑色轮廓是否连贯，三段波光是否仍能各自分开。合拢时左侧工具排列更紧凑，小对象也更难点中；细节闭合不顺手时，回到展开状态再调整，会更容易确认起点和转角。

切换显示屏时出现过短暂黑屏，随后应用正常恢复。本片保留了少量切换画面，并以“设备窗口采样 · 分步演示”标注这种素材形式。

## 导出时，把画布尺寸和 PNG 像素分开检查

本次应用实际导出的 PNG 为 **1080 × 1080 px**，白色背景。本页作品图直接使用这份原生导出。

用于继续编辑的原稿和用于网页展示的 PNG，各有用途。原稿保留对象，之后还能分别改灯塔的条带、调整山峰或移动波光；PNG 则把当前画面合成为一张像素图。

进入**分享 → 导出与分享 → PNG 图片**，范围选择“完整画布”，倍率设为 1×，背景选白色，再点“导出 PNG”。检查预览里的白色天空与画面边缘，再确认 PNG 的实际输出像素。编辑器里的缩放百分比只影响观看，不等于 PNG 的最终尺寸。需要白色天空时，也要检查导出背景设置，避免把留白误当成已经画好的白色背景对象。

导出后把图片单独打开，缩回整幅图检查三件事：白色塔身的黑线是否完整；三段波光有没有连在一起；灯室亮面是否仍然被黑色框包住。再放大检查细节，便能区分是节点轮廓的问题，还是网页把图片显示得太小。

填充与描边的基础操作可接着看[填充与描边教程](<https://allluckly.cn/guides/vectorpaint-fill-stroke/>)；对象整理见[图层与分组](<https://allluckly.cn/guides/vectorpaint-layers-groups/>)。想区分 PNG、SVG 和可编辑原稿，可以看[导出格式选择](<https://allluckly.cn/guides/vectorpaint-export-formats/>)；画布单位和导出像素的关系，见[画布尺寸与单位](<https://allluckly.cn/guides/vectorpaint-canvas-units/>)。