Cómo diseñar un icono usando operaciones booleanas en Sketch

Las "operaciones booleanas" de Sketch nos permiten crear rutas complejas combinando formas existentes. Aprendamos cómo aprovecharlos al máximo mediante el diseño de un icono en este tutorial de screencast..

Mira Screencast

 

¿Qué son las operaciones booleanas??

"Booleano", en términos de programación de computadoras, es un tipo de datos que puede ser "verdadero" o "falso". En términos de aplicaciones gráficas como Sketch, usamos "booleano" para describir cómo se combinan las formas, usando valores como "y", "o", "no", etc..

A veces escuchará operaciones booleanas denominadas herramientas "Pathfinder", y las opciones disponibles son: 

  • Unión: Donde el resultado es la suma de las áreas de ambos caminos.
  • Sustraer: Donde el área de la ruta superior se elimina de la que está debajo.
  • Intersecarse: Lo que deja el área donde se superponen las formas originales..
  • Diferencia: Efectivamente lo opuesto a "intersectarse", dejando las partes donde las rutas originales no se superponen.

Usando Operaciones Booleanas

Crear formas complejas es algo que inevitablemente encontrará en el diseño de iconos, así que echemos un vistazo a cómo las herramientas booleanas pueden ayudarnos.. 

Por ejemplo, al intentar recrear este ícono de anclaje, podríamos comenzar con dos formas circulares, la más alta de las cuales sustraer desde el más bajo.

Después de algunas restas más, agregaremos algunos triángulos al final de nuestra base de anclaje, usando la Unión Operación para combinar las tres formas en una sola..

Edición

Es posible que haya escuchado el término diseño "no destructivo", que se refiere a una forma de trabajar en aplicaciones gráficas que no destruye la información vital a medida que avanza. Aquí, por ejemplo, podrías pensar que tendríamos un problema si quisiéramos agrandar nuestros triángulos, pero gracias a las técnicas no destructivas de Sketch no hemos quemado nuestros puentes..

Cada objeto dentro de este Forma combinada sigue siendo accesible como su propia capa, por lo que aislar y editar los triángulos no es un problema:

En última instancia, cuando todas las formas estén creadas, combinadas, restadas, intersecadas, haga lo que necesite, puede hacer clic en Aplanar para eliminar las capacidades de aislamiento. Al igual que Adobe Illustrator Expandir Esta opción lo dejará con rutas complejas únicas, que podrían ser más apropiadas para distribuir su icono..

Conclusión

Las cuatro operaciones booleanas de Sketch nos permiten construir rutas complejas combinando formas de diferentes maneras. Como hemos demostrado, son muy útiles para el diseño de iconos. Utilízalos hoy!

Enlaces útiles

  • Dibujar documentos booleanos de operación
  • Consejo rápido: Cómo usar los símbolos actualizados de Sketch
  • 2 Métodos rápidos para crear gráficos circulares en Sketch