布尔计算是UI设计中的一个特别关键的知识点，经常用于各种图标的制作。如果我们想在APP产品中实现图标的视觉统一，我们需要一种更规则的绘图方法，即布尔计算绘图。以下即时设计主导布尔计算思维分析和步骤解释，强烈建议新手UI设计学生打开即时设计工作台一起实际操作！
即时设计 - 可实时协作的专业 UI 设计工具即时设计是一款支持在线协作的专业级 UI 设计工具，支持 Sketch、Figma、XD 格式导入，海量优质设计资源即拿即用。支持创建交互原型、获取设计标注，为产设研团队提供一站式协同办公体验。
https://js.design/?source=csdn&plan=btt4232
布尔运算是什么？
其实布尔运算并没有大家想象的那么复杂，布尔运算（Boolean）它是一种数字符号逻辑演绎方法，包括联合、相交和相减。简单地说，布尔操作是通过联合、相交、相减等操作获得新形状的形状，这被称为布尔操作。
早期主要用于CAD绘图和三维绘图，但现在更频繁地用于UI设计，可以使图形设计更加平衡和规则。通常一些非常复杂的图形看起来非常和谐，这就是布尔计算存在的意义。
布尔运算会应用在哪里？
布尔运算应用于许多场景的设计和生活，从扁平化的标志、布尔计算用于轻纹理图标和三维空间图形。甚至生活中随处可见，比如螺丝、楼梯、古八卦图、风扇等等。总之，布尔计算实际上涉及到我们生活中的各种事情。
什么软件用来制作布尔运算
布尔计算的重要原因是所有的图标和界面都不能与布尔计算的应用分开。从最初的PS到今天的新一代设计合作工具即时设计，布尔计算一直占据着设计工具的主要操作。如果在PS软件中使用布尔计算绘图，则需要在同一层中执行两个或两个以上的图形。所以建议你使用即时设计来制作布尔计算。
即时设计 - 可实时协作的专业 UI 设计工具即时设计是一款支持在线协作的专业级 UI 设计工具，支持 Sketch、Figma、XD 格式导入，海量优质设计资源即拿即用。支持创建交互原型、获取设计标注，为产设研团队提供一站式协同办公体验。https://js.design/?source=csdn&plan=btt4232
如何用布尔运算绘制图标图标？
以即时设计社区资源中的渐变色图标为例，教您使用布尔运算绘制图标。
第一步：寻找基本图形
一般最常用的基础图形有四种：方形、三角形、等边形、圆形。
第二步：确定是否为同一基本图形
从即时设计社区资源渐变图标设计案例中，我们选择一个图标-云文档作为例子，首先确定图标的基本图形。从下图可以看出，图形主要是曲线轮廓，因此可以判断图标是基于圆形的布尔操作。
当我们确定它是圆形的时候，我们应该考虑它是圆形的还是椭圆形的。此时，最好自己画一个圆来验证。当一条曲线被验证时，用相同的圆来验证其他曲线。如果它能完全适应，则是相同的基本图形。（注：需要注意的是，同一基本图形也可能有不同的尺寸！）验证后，可以发现图片中的圆是不同尺寸的圆，半径不同，为相同的基本图形。
第三步：确定图形的计算方法
如果你想得到图形的计算方法，你需要勾勒出所有的运动轨迹作为参考。当勾勒出所有的轨迹时，可以发现云文档图标是由三个圆形、一个椭圆形和四个不同尺寸的矩形组成的。
第四步：提取所需信息
当基本图形完成所有操作时，需要从图形中提取所需的信息，云文档图标所需的信息是由两个交叉图形组成的新图形部分，布尔操作的说法称为：集合。
不同的图形可以以不同的方式提出，如交集、差集、减去顶层。
联合集：两个图形的结合
减去顶层：用上图形区域减去下图形区域
交集：得到两个图形相交的图形区域
差集：删除两个图形相交的图形区域，剩下的留下。
第五步:补充细节，同色区分主图层次
详细的内容是重复布尔操作，与第四步相同，找出图形切割点，再次进行图形操作。切割完成后，进行着色处理。颜色处理采用渐变色处理，最终得到以下标准云文档渐变色图标。
布尔运算图形设计源文件https://js.design/community?category=detail&type=resource&id=6598291d079674a13239fdb0&source=csdn&plan=btt4232
综上所述，布尔运算的关键是形状中有“层次”的概念。只有有了下图中的这个概念，布尔才能更好地计算图形，做出更合理的形状。
图层的顺序直接影响布尔操作的效果。建议在做复杂的布尔操作时，一定要记住谁先谁后。最重要的是，我们必须多动手，多练习，多思考。如果新手开始布尔操作，建议先复制基本图标。您可以打开即时设计，点击社区资源模块，选择您喜欢的图标进行复制练习！
