Sissejuhatus generatiivsesse kunsti: mis see on ja kuidas te seda teete

Generatiivne kunst võib olla hirmutav teema - tundub, et sellega on seotud palju matemaatikat ja kunst on iseenesest keeruline!

Kuid see ei pea olema keeruline - ilma matemaatika- või kunstikraadita saab ehitada tõeliselt lahedaid asju. Selles postituses antakse ülevaade sellest, mis on generatiivkunst üldse ja kuidas saate oma generatiivkunsti üles ehitada.

Esiteks, mis on koodikunst?

Koodikunst on mis tahes kunst, mis on ehitatud koodi abil. CodePenil on lõputult näiteid - näiteks CSS art.

Mis on generatiivkunst?

Sageli ammutab generatiivne kunst inspiratsiooni kaasaegsest kunstist, eriti popkunstist, mis kasutab korralikult geomeetrilisi mustreid.

Kuid see on väga lai ja rikkalik kunstikategooria, mis on loodud keskse tunnusega koodiga. Generatiivne kunst sisaldab mingil moel iseseisvat või autonoomset süsteemi.

Juhuslikkus on üks autonoomse süsteemi tüüp. Juhuse kaasamisel koodikunsti juurde saate iga kord, kui skripti käitate, lehte laadite või kasutajate suhtlusele vastate, erineva, täiesti ainulaadse kunstiteose.

On ka korrapärasemaid autonoomseid süsteeme. Üks näide on petlikult lihtsast võrrandist tuletatud Mandelbroti Fractal.

Samuti võime integreerida mõlemad lähenemisviisid, segades kokku korra ja kaose!

Kunstiteost saab arvuti ja kunstniku koostöö. Mõningaid kunstiteose aspekte kontrollib kooder, kuid mitte kõiki. Kunstnik kontrollib kunstis nii juhuslikkust kui ka järjekorda.

Mõnes mõttes loobub kunstnik autonoomse süsteemiga kontrollist oma kunsti üle ja arvuti teeb seda nende eest. Nüansirikkam perspektiiv ilmneb siis, kui kaalutakse uut loomeprotsessi.

Kodeerija-kunstnik tegeleb tagasisidega, kus nad muudavad süsteemi pidevalt, et saada soovitavamaid ja sageli üllatavamaid tulemusi.

See protsess hõlmab eksperimenteerimist ja õnnelikke õnnetusi viisil, mis kujundab ümber kunstniku rolli. Generatiivsete artistidena kasutame koodi põhitõdesid, nagu silmuseid, juhtimisvoogu ja spetsiaalseid funktsioone. Seejärel segame need sageli ettearvamatute jõududega, et saada täiesti ainulaadseid tulemusi, erinevalt muust olemasolevast.

Generatiivse kunsti näited

Kate Comptoni lilled

Mobiilsed automaadid ja kaose piir

Animeeritud generatiivne kunst mitmevärvilisena Phil Nash

Impressionistide plekid, autor Murasaki Uma

Genereeritud puu autor Miriam Nadler

Mis läheb generatiivse kunsti juurde?

  • Generatiivse kunsti loomisel on juhuslikkus ülioluline. Kunst peaks iga põlvkonna skripti käivitamisel olema erinev, nii et juhuslikkus on tavaliselt suur osa sellest.
  • Algoritmid - algoritmi visuaalne rakendamine võib sageli luua suurepärase kunsti, näiteks ülaltoodud binaarse puu.
  • Geomeetria - enamus generatiivset kunsti sisaldab kujundeid ja keskkooli geomeetria klassi matemaatika võib aidata mõningaid väga lahedaid efekte.

Kuidas saab läheneda generatiivsele kunstiteosele?

Generatiivse kunsti loomiseks on kaks peamist strateegiat, kuigi enamik jääb nende kahe strateegia vahele.

Esimene on see, et teil pole tulemusi silmas pidades ja vaadake, mida arvuti mängides mängib.

Teine on see, et teil on väga lõplik idee, kuidas soovite kunsti välja näha, ja juhuslikkus muudab lõpptulemust vaid veidi.

Kust peaksite alustama?

Kui oskate JavaScripti, on p5.js alustamiseks vinge koht. Selle eesmärk on muuta kodeerimine kunstnike, disainerite, koolitajate ja algajate jaoks kättesaadavaks. See on ümbris Canvas API-l ja see lihtsustab palju matemaatikat. See keskendub joonistamisele, kuid saate ka sellega heli-, video- või veebikaamera abil suhelda, kui olete huvitatud nendest kunstiliikidest!

Kiire sissejuhatus P5-sse

Kõigepealt laadige p5 CDN. Seejärel lisate oma JavaScripti faili kaks funktsiooni, mida kasutatakse peaaegu kunagi varem p5 skriptis: setupja draw. Need nimed on vajalikud p5 helistamiseks.

setupkutsutakse programmi käivitamisel. Tõenäoliselt loote createCanvasfunktsiooni abil lõuendi, millele selles joonistada , ja võite seal määrata mõned vaikesätted. Seda nimetatakse ainult üks kord!

drawkutsutakse pärast seadistamist ja seda käivitatakse pidevalt, kuni helistate noLoop, mis peatab selle uuesti töötamise. Funktsiooniga saate kontrollida, mitu korda drawsekundis jookseb frameRate.

Generatiivse kunsti puhul panin tavaliselt noLoopsisse setupfunktsiooni, mis paneb drawpidevalt töötama ainult ühe korra.

Siin on p5 käivitusmall CodePenis.

Kuna me oleme nii palju rääkinud juhuslikkuse tähtsusest generatiivse kunsti jaoks, on p5 teine ​​oluline funktsioon random. See töötab sarnaselt JavaScripti omadega, Math.randomkuid saate numbritele vahemiku määrata nii, et numbri kasuliku vormingu saamiseks ei peaks te tegema nii palju matemaatikat.

p5 read

P5.js-is saate luua rea ​​järgmiselt:

line(startX, startY, endX, endY)

Seejärel saate juhuslikult genereerida hulga ridu ja luua sellise lihtsa generatiivse kunsti:

Isegi väga lihtsad skriptid võivad luua lahedaid kunstiteoseid!

p5 Kujundid

Kujundeid saate luua ka p5-ga - nagu ringid, kolmnurgad ja ruudud.

Siin on näide p5-ga mõne kuju loomisest:

// circle ellipse(xCoordinate, yCoordinate, width, height) 
// square rect(xCoordinate, yCoordinate, width, height) 
// triangle triangle(xCoordinate1, yCoordinate1, x2, y2, x3, y3)

Seejärel saame luua veel kujundeid, et luua midagi lõbusamat!

p5 Liikumine

Saame oma joonistele lisada liikumise, eemaldades noLoopfunktsioonist funktsiooni väljakutse setup- vaadake seda!

Värv

Värvidega saab mängida ka generatiivse kunstiga, valides juhuslikult värvid. Seda saate teha matemaatiliselt RGB-väärtuste kaudu või saate oma lemmikvärvivalijaga luua värvipaleti (oleme seda kasutanud).

colorFunktsiooniga saate määrata täitevärvi . Selleks on vaja hulgaliselt erinevaid vorminguid, nagu nimevärvid, RGBA-d ja heksakoodid.

Kasutades saate muuta ka kontuuri värvi stroke. Selle kontuuri saate ka eemaldada, kasutades seda noStrokevõi muutes selle teiseks laiuseks strokeWeight.

Kõike kokku panema

Kui kõik need tükid on paigas, saame kombineerida tehnikaid, et luua tõeliselt lahedat kraami.

Teine strateegia: õpetuste kohandamine

Võite luua ka tõeliselt laheda generatiivse kunsti, võttes kellegi teise teose ja ehitades selle üles. Näiteks on siin Dan Shiffmani õpetuse tulemus:

Siin on kaks efekti erinevate efektide loomiseks:

Siin on Codepeni kollektsioon veelgi rohkemaga!

Võite jälgida õpetusi, kahvlite CodePens või Glitch projekte ja luua midagi uut ja ainulaadset. Andke ka originaalartistile au.

Spikker

Siin on petulehel kõik P5 funktsioonid, mida selle õpetuse jaoks kasutasime.

Loe rohkem

  • Generatiivne kunstilisus
  • Kodeeriv rong
  • Rääkis Tim Holman

Hoidke ühendust

See postitus on kirjutatud koos James Reichardiga. Kui loote oma kunsti, siis piiksutage seda kindlasti meie juures! (Ali ja James).

Algselt avaldatud aadressil dev.to.