Figma: Introducing Vector Networks(

almost 8 years ago from Athyuttam Reddy, Brown University

  • Marc EdwardsMarc Edwards, almost 8 years ago (edited almost 8 years ago )

    Vector networks

    Cool idea. I assume it’s similar to the SVG path move command. I see some benefits, but there’s some downsides, too.

    Wouldn't this mean there’s no shape inside and outside, limiting strokes to only be centred? And if strokes are centred, and if the points are pixel boundary snapped then even width strokes will be blurry due to half pixels.

    What happens with fills on vector networks? The same as SVG paths with the move command?


    Looks good, but how this is presented rubs me up the wrong way. Both Illustrator, Affinity Designer and presumably other tools have this feature. It’s great Figma has it, but it is not new.

    Here’s Affinity Designer’s path bending.


    Again, I'm not sure why you’d present this as new. Other tools do both. Other tools have the option of non-zero and even-odd rule. Here’s Illustrator option for it.

    In practice, I haven’t seen non-zero vs even-odd catch too many people out (especially if good boolean tools are on offer).

    Reinventing something as fundamental as paths was hard.

    “Reinventing” seems like a stronger word than should be used in this case. I don’t want to seem overly negative — there’s good work being done. But, I’m just not sure why all these things were presented as brand new ideas?

    22 points
    • Jonathan SimcoeJonathan Simcoe, almost 8 years ago

      I hear you Marc. Having used tools like Illustrator for years and Sketch for about a year and a half, I think what Figma has done is made the experience of working with vectors much more intuitive and approachable for users.

      I didn't know about these features in Illustrator and the way Figma works is seamless and easy. For lack of a better phrase "it just works". That's why they are saying that have reinvented it. Maybe that's overkill but the experience of using it is truly original and groundbreaker from a user's point of view.

      1 point
    • Thomas DidrelThomas Didrel, almost 8 years ago

      I was hoping you show up in the thread! You have a point, not all is new, but the ability to attach more than 2 lines to a single point is the killer here. But I sense a bit of defensiveness in your post which reinforces my feeling that what these guys are up to is big. Anyways, I can't wait to see what Skala has to offer. Truly exciting times ahead!

      0 points
      • Marc EdwardsMarc Edwards, almost 8 years ago

        But I sense a bit of defensiveness in your post which reinforces my feeling that what these guys are up to is big.

        None at all. Just annoyed to see old things presented as new inventions.

        0 points
    • Thomas DidrelThomas Didrel, almost 8 years ago

      But be fair, even if it IS there, no one outside Adobe's (and other vectors tools) product team has the slightest idea what "use non-zero winding fill rule" means or how it works.

      0 points
      • Marc EdwardsMarc Edwards, almost 8 years ago

        I should have been more clear: Illustrator uses the the non-zero fill rule as default, just like Figma (meaning self-intersecting paths are filled). Photoshop doesn't use path direction for boolean operations — each path has an explicit boolean state.

        1 point
    • Chris DelbuckChris Delbuck, almost 8 years ago

      There's a little more to Figma in terms of the Filling capacity. The node nature of vertices in a vector network allow for arbitrary region inclusion or exclusion. Any region defined by more than 3 points can be included in the fill and stroke behavior.

      Image alt

      In the above example I've toggled the stroke setting as labeled. It's a little odd especially how when Outside stroke is selected what happens to the fill. However I think with enough intentionality while designing (and some tweaks to behavior), the tools allows for some amazing capacities.

      2 points
    • Alexander Adam, almost 8 years ago

      Being a former W3C Member having worked on the first SVG-Spec and taken that Macromedia Freehand was the first one that had this features (that's why we copied it in Gravit as we liked it so much), calling a concept called "Compound Pathes" something like "Reinventing" is quite incorrect and more buzzing than anything else. Oh and of course, the bending tool which Freehand (and thus Gravit ;)) also have...

      1 point
    • Sazzad Hossain, almost 8 years ago

      I agree. Re-inventing is a very strong term. Even when you consider that doing this on the web vs doing it on a native software. This is not new on the web either. In fact, even we have options like this in Gravit and we had it for a long time. There are other vector based tools on the web that can also do similar things. As for even/odd and non-zero fill mode, another feature we've had for some time. Here's a screencast of it in action:

      2 points
    • Aleksander Lenart, almost 8 years ago

      Nothing has been reinvented here, agreed. Still, 2D software manufacturers (Adobe being #1 offender) need a solid kick in the nuts for not improving decades-old tools. Here are Figma's 'inventions' done in SketchUp:

      1 point