# VectorPaint 天气图标组：统一晴天、阴天与雨天的视觉尺寸

语言：zh-CN
原文：[VectorPaint 天气图标组：统一晴天、阴天与雨天的视觉尺寸](<https://allluckly.cn/guides/vectorpaint-weather-icon-set/>)
中文：[中文 HTML](<https://allluckly.cn/guides/vectorpaint-weather-icon-set/>)
English: [English HTML](<https://allluckly.cn/en/guides/vectorpaint-weather-icon-set/>)
发布于: 2026-10-23T00:00:00+08:00
内容更新于: 2026-10-23T00:00:00+08:00
署名：Bison

制作三枚天气图标，通过共同基线、线宽、外缘和小尺寸预览建立一套协调的视觉规则。

一枚太阳画得清楚，不代表它与云、雨滴放在一起就像同一套图标。本练习在 VectorPaint 中制作晴、阴、雨三种天气，把重点放在整组的视觉尺寸与重复规则，最后得到可以分别输出的三个图形。

## 先在同一张画布上建立比较区

新建一张 960×360 px 的横向画布，留出三个约等宽区域，每个区域放一枚图标。先用网格或临时参考矩形标出共同中线与底线，四边保留空白。三个区域只是工作参照，完成前要隐藏或移除普通参考对象。

这次采用深色线条配少量暖黄色，先规定主要线宽与端点样式，再开始画。可以从 4 pt 描边作为观察起点，但最终按展示尺寸调整。云和太阳不必有相同外接框，它们需要的是看起来分量接近，而不是被强行拉成相同轮廓。

## 用圆与短线画出晴天

用椭圆工具画一个宽高相同的圆，放在第一个区域中央，设为暖黄色填充。另画一条短线作为光芒，设置统一的深色描边和端点。复制短线，再旋转和移动到圆周附近，先完成上下左右四条，观察后再增加斜向光芒。

检查光芒到圆的间隔是否接近，尤其注意斜线的可见长度。不要让复制过程意外改变某几条线的宽度。最后把太阳部件分组，移动一下再撤销，确认没有落下一条光芒。组能帮助后续比较尺寸，但暂时保留各部件可单独修改。

## 用简单轮廓组织云的起伏

第二个区域用钢笔画一条闭合云形：底部相对平缓，上方由几个不同大小的圆润起伏组成。也可以先用少量圆形作为草稿参照，再沿外轮廓建立一条清楚路径。先让最大的起伏承担主体，左右较小的起伏连接到底部。

切换节点工具检查曲线连接，减少顶部不必要的小波纹。云的宽度可以略大于太阳的圆心部分，但要把太阳光芒也算入比较范围。云底不要紧贴区域下缘，稍后雨天还需要在下面加入雨滴，整组底线应提前留出余量。

## 从同一朵云扩展出雨天

复制已经完成的云到第三个区域，保持轮廓和描边一致，再适当缩小或上移，为雨滴腾出空间。用钢笔画一个简洁水滴，或者使用三条倾斜短线表达降雨。两种表达选一种即可，避免水滴与雨线同时堆叠造成复杂度突增。

先完成第一滴的形状和颜色，再复制成三滴，调整间距与高低。中间雨滴可以稍低，左右保持呼应。检查雨滴与云底之间还有可见空隙；小尺寸时一旦粘连，可能看起来像云的锯齿边缘。把云和雨滴组成一个完整的雨天组。

## 调整视觉尺寸而不拉伸图形

将三组放到同一中线附近，先比较最外缘，再比较实色面积。太阳有向外伸出的细线，云有较宽的连续轮廓，雨天还有下垂的细节，因此即使外接框一样大，视觉重量也可能不同。按比例缩放整组，保持圆形和水滴的自然形态。

一次只调整一枚，先让晴天与阴天协调，再加入雨天。若雨天显得过高，可以调整云与雨滴的距离，而不是把整组纵向压扁。把参考框暂时隐藏后再观察，因为读者最终看到的是图标本身，不会看到帮助你排列的几何边界。

## 用小尺寸检查整组规则

导出一份横向预览，再缩到接近常用界面尺寸，比较三枚是否都能迅速辨认。太阳光芒太密时先减少数量，云的小起伏太碎时先合并曲线，雨滴太细时先增加可见宽度。每种图形可以用不同手段简化，但应保持相同的描边语言。

分别放到浅底和深底上查看，判断是否需要另一组颜色版本。深色描边放在深底上看不清，应该做明确的浅色版本，而不是简单提高整组透明度。记录主要颜色、线宽与最小展示尺寸，下一次增加雪天图标时就有可沿用的参照。

## 输出、常见问题与完成检查

分别输出时，可把每个完成组复制到同样尺寸的独立画布，保留一致留白，再导出透明 PNG 和需要的 SVG。检查文件名与天气含义对应，并保留整组比较原稿。不要只按对象边界紧贴裁切，否则三枚图放进同一容器后会显得忽大忽小。

**三枚图必须严格同宽吗？** 不必。先保证容器一致，再按可见面积与辨识度调整图形大小。窄图形可以保留更多侧边空白，不用拉宽来凑数。

**雨天总比晴天重怎么办？** 先减少云内细节、缩小雨滴或增加间距，再比较整体面积。所有图形同时变细会使原本清楚的太阳也变弱，局部调整更容易找到平衡。完成后请逐个确认轮廓、颜色和透明边缘，再把它们当成同一套作品保存。

## 为第四种天气试一次扩展

完成三枚以后，可以先只画一枚“多云”草稿：保留同一朵云，把晴天的太阳缩小后放到后方，露出一部分圆和光芒。检查它是否仍沿用原来的线宽、颜色与留白。如果新图需要完全不同的线条才看得清，先回头比较整套规则，而不是让第四枚独自换风格。这个扩展能检验前面建立的共同规则是否足够清楚。

## 相关教程与资料

[对齐与分布基础](<https://allluckly.cn/guides/vectorpaint-align-distribute/>)、[透明 PNG 输出](<https://allluckly.cn/guides/vectorpaint-transparent-png/>)。

依据 [VectorPaint 官方商店说明](<https://apps.apple.com/cn/app/id1587272880>)与功能入口整理；[Apple 版本信息](<https://itunes.apple.com/lookup?id=1587272880&country=cn>)核对日期为 2026 年 10 月 23 日，公开版本 1.0.7，最低系统 iOS / iPadOS 17。文中的尺寸、文案和图形是练习建议。