Transcripción
Extracto de la transcripción automática del vídeo realizada por YouTube.
our opening keynote is from a digital artist who uses computers to engage with people and inspire them his passion is demystifying programming and exploring its artistic possibilities his presentations and workshops enable artists to overcome their fear of
code and to encourage programmers of all backgrounds us to be more creative and imaginative so what better way to start the day with this amazing keynote would you please give a very warm Symphony live welcome to seb lead july well thanks very much Tony well
I'm so pleased to be here I love doing talks especially with with programmers so I am like Tony said I am an artist but I make stuff with code yeah so you know I'm a computer programmer here's a computer programmer here yeah pretty much everyone
who isn't a computer programmer no one I was a couple what do you do sir oh that that still counts right I think that counts yes so I am a computer programmer and like Tony said you know I love doing creative things with code and I guess I always was a
programmer really from when I was about 11 and I got one of these computers who started programming on a Commodore pet yeah a few of you who Tony did yeah it's a pretty cool has a cool looking computer that one is there I he like that my dad just brought
home from work little green screen lit up and they had a bit of an attitude they didn't they those computers in those days didn't have any nice shiny start buttons there wasn't any apps well there was but you know I'm eatin right it was just
this blinking cursor when you turned it on and to me that blinking cursor was a challenge to me that computer was saying what and you type something in mistake tabs so that's such a bad attitude those computers and but of course you know cuz I used to
draw and stuff when I was a little kid so my first impulse was to make pictures and animations and actually there was a bit of code that you could use to make graphics I wonder if that's going to start yeah and normally I live code this but I really have
very little time stay so i'm running a video instead so there's this little this is little one line of code that you can use this is a Commodore 64 and and when you run it it creates this sort of art artist it generative art right we'd call it
generative art these days right that's we've got quite pretentious about computing these days but back then it was just a cool little demo and this was actually in the Commodore 64 user manual yeah generative art was in the Commodore 64 user manual
in fact and this bit of code has become quite famous now it's had a book written about it does anyone know know about this book you know what it's called well the book is called 10 print CHR della brackets it was it to a 5.5 + R & D 1 close bracket
semicolon go to 10 and here it is it's a really cool book I recommend it highly and it's it's edited by K series one of the people behind the processing project processing for those of you don't know is a programming language and environment
especially designed for artists I recommend it highly right so how's that translated into modern-day computing well I like to work with particles I'm obsessed with particles particles are almost my favorite thing and I'll show you some projects
that I've made using particles later but I wanted to show straight away rather than just talk about code like the guy over there I thought maybe I should just do some coding right yeah yeah okay oh how awkward was a computer programmers don't you just
love them right ok so I thought I'd do some programmers they're my people right here my people yeah nervous laughter was it because I'm not a PHP programmer is that oh no just kidding we're all very guy it's all the same stuff isn't
it right so I've got this oh can you see that I'm after enlarge a bit right so I'm going to do some programming now I'm going to make a particle system yeah because particle systems well I'm just going to show you right so this is my code
was just my setup it's just a basic blank HTML page you can see I'm making a an html5 canvas element and I'm putting it in the documents yes I've got on empty canvas who's done canvas programming before anyone yeah a few of you canvas is
great right if you want to do just some creative programming canvas is absolutely great um so let's let's draw something well unfortunately the default fill color is black right so you wouldn't see much in this so I'm gonna actually what color
would you like let's choose a color I'm going to do draw some particles in a color what color she wants that's too many green it sounds like green let's go with green because we had a Commodore pet this let's go ahead green so I can just
use green and and then I'm going to draw a rectangle and with Phil wrecked it's the canvas command for drawing a rectangle first two parameters are the X&Y position and then the width and the heights lists let's do that I was are there you
go live reload is working doesn't always work it just adds a little element of danger to my presentation actually really cold as well I think my hands are seizing up like a classical pianist isn't it as much right it is also quite terrifying right
so if I make a mistake please feel free to shout out because it would just be embarrassing otherwise okay so this is my first particle I'm just going to make sure that's purest green chili let's just try it oh there you go a bit better isn't
it as a bit more purist green and black had a reference now okay help see am I really hold me I'm probably out okay so um that's that's as well as let's make hits animate right because a square is cool but it's much better if it's if
it's moving around a bit so let's let's make this square animate well if you want to do any sort of animation in JavaScript well you've got to somehow do something over and over again the modern the modern fancy way to do it is with request
animation frame bar you know I'm live coding i'm just going to use set interval and astonishingly it works reasonably well and so i'm going to call my loop thousand divided by 60 milliseconds with as the interval right so it's about 16 milliseconds
16.6 so every sixteen point six milliseconds my loop function will get cooled so let's make my loop function so now my rectangle is getting drawn 60 times a second yeah I can locate bit boy let's make variable yeah now we're talking right varible
it's cool XO instead of drawing our rectangle at zero let's draw an X and then we can oh yeah there you go oh but you see you like with the canvas every time you draw stuff into it's completely persistent whatever you do you're just changing
the pixels so so you're going to leave them there so in order to create animation the first thing we need to do is actually clear the entire canvas with our car type I'm just going to say my hands are too cold type that's right there you go so
we got animation we got an animating square yeah as well thank you you're too too kind right okay so we've got one particle that's a good start but let's um well let's wrap this particle up well as first of all let's make it a bit smaller
because it's a bit big for a particle particles generally are a bit smaller that's better and let's let's wrap it up into an object yeah so with JavaScript you can just make dynamic objects Oh nearly forgot to do that so now here instead of
just drawing my particular X I'm going to draw at pdx I can get this quite nice actually often I'll do this with a mixed audience it's quite cool with programmers we can just get sure pure yeah okay all right so now I've wrapped it up into
a particle which means that a particle object so I can draw a pedo XP dot y and then I can watch that you know what I can also make velocity right so well X and save five fel y 5 right so we got our x and y velocity as the amount of pixels that it changes
per frame fell x is some muttering if i made a mistake no you're just just talking how rude ok so so we've now got my particle now I can change the direction well it's just put the particle in the beginning of the in the middle of our canvas so
weights / 2 this height / to right so now it starts in the middle but it you can see it always goes in the same direction let's give it a random velocity oh look at that running out of space that's how much code of types actually you know what I could
[ ... ]
Nota: se han omitido las otras 4.280 palabras de la transcripción completa para cumplir con las normas de «uso razonable» de YouTube.