Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Drawing better-looking Bézier curves

beta.observablehq.com

Post reply on HN
Print view View original

31–40 of 45 posts

Re: Drawing better-looking Bézier curves

#31

Post by ericrav »

berendk wrote: post #29
dhotson wrote: post #11

Hello :) I'm the author of this notebook if you have any questions. I'm also currently working on a plugin for Adobe Illustrator based on this. Screenshot: https://i.imgur.com/tIPTjLsr.png

Nice Article! May I ask how you made the notebook interactive? Is this based on a jupyter notebook?

It's a new project from Mike Bostock and others that was on the front page a couple weeks ago: https://news.ycombinator.com/item?id=16274686

Re: Drawing better-looking Bézier curves

#32

Post by paulddraper »

ttd wrote: post #16

If you're looking for more in-depth information on Bezier curves, I've found this document invaluable on more than one occasion, both for math and implementation suggestions: https://pomax.github.io/bezierinfo/

An amazing guide that does not disappoint in either accessibility or depth.

Re: Drawing better-looking Bézier curves

#34

Post by ablaba »

dhotson wrote: post #11

Hello :) I'm the author of this notebook if you have any questions. I'm also currently working on a plugin for Adobe Illustrator based on this. Screenshot: https://i.imgur.com/tIPTjLsr.png

Have you seen the shadertoy implementation? https://www.shadertoy.com/view/XsX3zf He refers to the following paper. http://hhoppe.com/ravg.pdf

Re: Drawing better-looking Bézier curves

#35

Post by egypturnash »

So for what it’s worth here’s the three rules of thumb I’ve followed for about fifteen years in Illustrator:

1. Pull curve handles out to about 1/3 of the curve segment they control. 2. Don’t turn more than 90° between two control points. 3. Avoid S-curves between two control points.

Following these generally results in nice-looking curves that are easy to edit

A lot of “designers” these days like to present a rule of “only put your control points at 0/90/180/270° and keep your curve handles axis aligned”, which makes some degree of sense in the arena of making fonts, but results in incredibly hard to manage curves as you get further away from circles.

Re: Drawing better-looking Bézier curves

#36

Post by matthberg »

dhotson wrote: post #11

Hello :) I'm the author of this notebook if you have any questions. I'm also currently working on a plugin for Adobe Illustrator based on this. Screenshot: https://i.imgur.com/tIPTjLsr.png

Thank you so much for the illustrator plugin work! It was the first thing I thought of after reading and the reason I clicked on it in the first place. I wish you the best with it, if you ever need beta testers or if there's a way you need help I'd love to. (I run CC 18 on a Windows 10 64bit install).

Re: Drawing better-looking Bézier curves

#38

Post by aidos »

ttd wrote: post #16

If you're looking for more in-depth information on Bezier curves, I've found this document invaluable on more than one occasion, both for math and implementation suggestions: https://pomax.github.io/bezierinfo/

I've found this animated page to be the most useful in terms of understanding how they work at a glance:

https://www.jasondavies.com/animated-bezier/

Re: Drawing better-looking Bézier curves

#39

Post by a_e_k »

jashkenas wrote: post #33
pasta wrote: post #3

Maybe the side is down? Only white content on mobile.

The site is up, but is brand new and still in beta — what mobile OS/Browser combo are you using? We'd love to try and debug your white screen...

Not the parent poster, but I use NoScript on desktop Firefox. Beyond whitelisting observablehq.com and observableusercontent.com I found that the content was completely missing until I also unblocked objects from fonts.gstatic.com. Could be a clue.
Post reply on HN