[HN Gopher] The engineering behind Figma's vector networks (2019)
___________________________________________________________________
The engineering behind Figma's vector networks (2019)
Author : alexharri
Score : 117 points
Date : 2024-02-03 16:26 UTC (6 hours ago)
(HTM) web link (alexharri.com)
(TXT) w3m dump (alexharri.com)
| karmakaze wrote:
| I can't tell who this article is for. It describes points, lines,
| nodes, edges, and Bezier curves, so I thought it might be not so
| in depth. But it's long, and skimming down I see talk of
| determinants and think there might be something there. Even
| thinking that a "Vector Network" is some great discovery when
| it's allowing more than a single cycle in a graph needs earlier
| substantiation--I don't have time to read all the background
| intro throughout the piece to the end. I'll guess that the
| 'engineering' here is a review of some graph and/or 2D graphics
| algorithms.
| epistasis wrote:
| It's for the interested person who doesn't have much background
| but wants to go super in depth on the feature.
|
| I've taken some computational geometry classes, and loved the
| interesting theorems and which seemingly trivial problems were
| actually extremely difficult to prove, and which seemingly
| complex things were easy to prove, it's a very fun field.
| Still, I had never actually written the code or seen the
| algorithms for drawing Bezier curves, so this was great for me.
|
| I love drawing with vector graphics, but haven't used Figma
| much, so seeing their vector graphs was very enlightening for
| me. I'll be using Figma in the future.
|
| It feels like this article was tailor made for me, I loved it.
| jsejcksn wrote:
| Paragraph five:
|
| > This post can be thought of as an introduction to a really
| interesting problem space, and as a resource for people
| interesting in making use of some aspects of Vector Networks
| for future applications. I hope it succeeds in providing value
| to both developers being introduced to new concepts and ideas,
| and to designers interesting in learning more about the tool
| they know and love.
| alexharri wrote:
| This post was intended as a source of information for
| developers who might want to implement vector networks in their
| own projects.
|
| Back in 2018 I wanted to support vector networks in my
| animation editor project, but had a really hard time finding
| information. I didn't have a math or CS background, so just
| knowing what concepts to Google was somewhat of a brick wall.
| Googling "vector networks" didn't yield any useful results,
| because there weren't any resources discussing them (aside from
| marketing content from Figma). So in writing this post, I
| wanted to create the resource I needed back then.
| rgovostes wrote:
| Comprehensive!
|
| > In this case, that's b. We repeat the previous step and keep
| selecting the CCW edge until we reach the original node.
|
| Isn't it a?
| matroid wrote:
| It looks like Vector Networks is based on Boris Dalstein's work
| (https://www.borisdalstein.com/research/phd). He even has a
| startup (VGC) for Vector Graphic Editing tool based on these
| concepts. It is pretty cool!
|
| P.S. I have no affiliation with his work, although I did
| contribute 10$ to his Kickstarter Campaign back in the day.
| rjkaplan wrote:
| Figma supported vector networks a few years before that thesis
| was written (I worked there at the time).
| goodmachine wrote:
| Are you sure?
|
| Boris Dalstein first published his work on Vector Graphic
| Complexes (VGC) at SIGGRAPH in 2014 [1]
|
| Figma introduced Vector Networks in 2016 [2]
|
| [1] https://www.borisdalstein.com/research/vgc/
|
| [2] https://www.figma.com/blog/introducing-vector-networks/
| wslh wrote:
| Learning too much from this thread. I tried to look at
| Wikipedia and it seems there is an opportunity for a page
| about vector networks!
| doubloon wrote:
| pretty awesome.
|
| i really feel like Geometric Algebra, specifically the concepts
| of wedge product and bivectors, could save everyone a lot of time
| if it was put into the curriculum. because people keep
| "rediscovering" it all the time and calling it different names.
| (here "determinant")
| nyrikki wrote:
| This!
|
| Gibbs/Heavysides style vectors are convenient because it works
| with our 3D intuition, but Grassman/Clifford style works better
| for the differential calculus of gradient decent, hyper planes
| of DBScan, computer graphics etc...
|
| Here is a programer friendly site that may be of help for those
| who are interested.
|
| The geometric product being the sum of the exterior and dot
| products also solves a lot of things you run into with vector
| and tensor analysis.
|
| https://bivector.net/
| tuukkah wrote:
| TLDR: How to extend Bezier curves to a graph in vector graphics
| editors.
| tsuru wrote:
| I haven't had time to deep read all the way through yet, but this
| feels so similar to the half-edge structure used in many 3d mesh
| editing programs but in 2d...
| jansan wrote:
| Where in Figma can I find those vector networks? I see only see
| very basic path editing features..
| spankalee wrote:
| This is a cool feature of Figma, but in the frontend world it's
| the type of thing that makes Figma not a great tool for UI design
| because it's hard to translate to UI frameworks.
___________________________________________________________________
(page generated 2024-02-03 23:00 UTC)