Wat zijn Bézier-curven in computergraphics?

Bézier-curven kunnen veel dingen doen. Je kunt ze gebruiken om vormen te tekenen en patronen te ontwerpen, om maar een voorbeeld te noemen. Ze kunnen ook wiskundig worden gebruikt, in plaats van een lineaire weergave van verandering, waarbij ze geleidelijk en subtiel verschuiven tussen het ene keyframe of de ene waarde en het andere later.

Je herkent deze toepassing misschien in animatieprogramma's als Adobe Animate, maar het gebruik van Bézier-curven gaat veel verder dan de wereld van de kunst.

In deze eenvoudige uitleg gaan we de numerieke analyse opzij zetten ten gunste van iets slechts een klein beetje relevanter voor onze eigen behoeften, zoals het gebruik van Bézier-curven in creatieve apps zoals Photoshop en After Effecten. Wat maakt ze eigenlijk zo geweldig?

Wat is een Bézier-curve?

Bézier-curven, gebaseerd op een concept in de wiskunde dat de Bernstein-polynoom wordt genoemd, werden uitgevonden door een Franse ingenieur genaamd Pierre Bézier. Sinds zijn tijd zijn Bézier-curven geëvolueerd tot de voorkeursoplossing voor ontwerpers die een manier nodig hebben om van punt A naar punt B te komen op de meest esthetisch mogelijke manier.

Bézier-curven worden gegenereerd door middel van een algoritme dat wordt bepaald door een reeks controlepunten, uitgedrukt in n + 1. Dit algoritme is met name geschikt voor het onderverdelen van de tussenruimte, het evalueren en differentiëren van elk progressief punt in de gewenste afstudeercurve.

Bézier-curven zijn van nature vectoren - in tegenstelling tot gerasterde bitmapcurven zijn ze schaalbaar, wat betekent dat ze bepaalde eigenschappen behouden wanneer u ze omhoog of omlaag schaalt.

Waar vind je Bézier-curven?

Bézier-curven lopen niet alleen ongebreideld door de Adobe-suite (in creatieve apps zoals Premiere, Photoshop en After Effects), maar je vindt ze in vrijwel elk type creatieve app.

Apps voor het maken van visuele media zijn waarschijnlijk de eerste die in je opkomen, maar laten we audio niet vergeten technische apps zoals Pro Tools, waar Bézier-curven kunnen worden gebruikt om activa per parameter of meer aan te passen tijd.

Een paar veelvoorkomende voorbeelden van Bézier-curven in het wild:

• De Pengereedschap in Photoshop en op vectoren gebaseerde ontwerpprogramma's Leuk vinden Adobe Illustrator (en vrijwel elke andere creatieve app, in de Adobe-suite en waar dan ook).
• Elke app die gebruikmaakt van Easy In / Easy Out keyframe-curven, zoals After Effects​​​​​​.
• Wanneer je te maken hebt met NURBS, ook bekend als B-splines, in een 3D-animatie- of modelleringsapp zoals Maya of Blender, je werkt massaal met Bézier-curven.
• CAD-toepassingen, of een ander digitaal hulpmiddel dat voor ontwerp wordt gebruikt, gebruikt ook Bézier-curven voor veel dingen.

Bézier-bochten liggen overal op de loer, overal om ons heen. Hoe doen deze dingen precies wat ze doen?

Verwant: Een patroon maken of bewerken in Adobe Illustrator

Hoe werken Bézier-curven?

Wanneer u een nieuwe Bézier-curvevector op uw canvas maakt in een app als Illustrator, begint u meestal door het programma twee punten te geven om mee te werken; het eerste punt, en het tweede, met de curve ertussen.

Een kwadratische Bézier-curve is elke Bézier-curve die is gemaakt met alleen deze twee beginpunten: kubieke Bézier-curven bestaan ​​uit drie, enzovoort. Voor nu zullen we ons concentreren op de eerste; de eenvoudigst mogelijke Bézier-curven die je kunt maken in elk van de soorten software die we hebben genoemd.

Meestal geeft u de app de opdracht om een ​​Bézier-curve te maken in plaats van een lineaire vector door met de muis ingedrukt te houden en de curve op zijn plaats te slepen voordat u het tweede punt loslaat; na het loslaten heb je twee interpolatiehandvatten voor elk punt dat de curve vormt, inclusief eventuele extra punten die je achteraf invult.

Wat zijn alle dingen die bepalen hoe uw Bézier-curve er uiteindelijk uitziet?

• De plaatsing van je twee punten, inclusief hun "hoogte" ten opzichte van elkaar en de afstand ertussen.
• De interpolatie van de handvatten die op elk punt worden gevonden - u gebruikt deze handvatten om de curve te "sturen" en op zijn plaats te buigen.
• Controle punten; "denkbeeldige" punten gevonden op het hoogtepunt van een lineaire interpretatie van zowel de positie als de integrale toonhoogte van uw startpunt en je eindpunt (dit deel heeft meer te maken met wiskunde dan Bézier-curven in praktische, creatieve zin, maar het is nog steeds erg reëel)

Hoe zien deze controlepunten eruit?

Stel je twee rechte lijnen voor die vanuit beide uiterste punten naar elkaar toe schieten, terwijl ze gewoon tegen de buitenrand van beide zijden van de curve kijken. Het punt waar deze twee lijnen elkaar in het midden kruisen, zal het "controlepunt" zijn, wiskundig gezien van elke kwadratische Bézier-curve, ondanks het feit dat geen enkele set interpolatiehandvatten er noodzakelijkerwijs op aansluit direct.

Verwant: Een afbeelding vectoriseren in Adobe Illustrator

Nadat je al een curve voor je hebt uitgestippeld, kun je je handvatten gebruiken om het traject naar believen aan te passen. Bézier-curven zijn per definitie gebonden en daarom kunnen ze worden gebruikt om twee willekeurige punten op een eindig veld elegant en in perfecte balans met elkaar te verbinden.

Het maken van een Bézier-curve is eenvoudig en intuïtief; het is zo gemakkelijk om te zien hoe dit type tool de alomtegenwoordigheid heeft bereikt die het momenteel geniet.

Bézier-curven kunnen worden gebruikt om uw eigen originele ontwerpen te maken of om bestaande vormen, afbeeldingen en composities over te trekken. Ze worden vaak prominent gebruikt in op vectoren gebaseerde 2D-animaties, bijvoorbeeld als onderdeel van het opruimproces.

Hoewel de artiesten van de wereld dit concept zeker hebben overgenomen en ermee aan de haal zijn gegaan, is het wiskundige wortels maken het buitengewoon nuttig in een aantal andere beroepen en disciplines, ook.

Een paar andere toepassingen voor Bézier-curven naast kunst en design zijn onder meer:

• Architectuur en constructie, zoals bij het ontwerp van snelwegen.
• Industrieel ontwerp, inclusief het ontwerp van speelgoed, meubels en auto's.
• Robotica - Bézier-curven kunnen helpen bij computerondersteunde voortbeweging en gebiedstoewijzing.
• 3D-scanning in een biomedische context, waarbij een digitaal object wordt gemaakt op basis van vele 2D-doorsneden van het echte werk (zoals CT-scans, om maar een voorbeeld te noemen).

Dit wil nog niets zeggen over de waarde van Bézier-curven in een intellectuele hoedanigheid, zoals ze nu zijn tussen de rest van wat de mensheid weet over wiskunde en de ware aard van de werkelijkheid in het algemeen gevoel. Het is hardcore spul, en soms absoluut angstaanjagend.

Verwant: Illustrator versus Photoshop: wat is het verschil?

Wiskunde is leuk: leef het uit met Bézier-curven

Nu u iets meer weet over hoe Bézier-curven werken, nodigen we u uit om deze curven te nemen en ermee aan de slag te gaan. Waar uw volgende project u ook brengt, Béziers garandeert een vlotte en continue voortgang van hier naar daar, zowel letterlijk als figuurlijk.

Een patroon maken in Adobe Illustrator

Wilt u een patroon in uw ontwerp opnemen? Ontdek hoe u eenvoudig een patroon maakt in Adobe Illustrator.

Lees volgende

Over de auteur