►
From YouTube: GitHub Universe 2020: Day 1 - Play Asia Pacific
Description
Get inspired with entertaining performances, tutorials, and unexpected stories, all driven by code. You'll hear from speakers exploring the intersection of technology and art, enjoy tutorials and performances by creative coders, and discover innovative projects that are challenging the boundaries of technology. Whether you're a seasoned software engineer or just starting out, now’s your chance to play.
https://githubuniverse.com
A
A
A
A
B
B
B
B
B
B
B
B
B
C
C
C
C
D
D
D
D
B
C
C
C
C
C
C
C
B
B
E
Good
morning
welcome
to
github
universe.
Today
we
are
going
to
walk
you
through
how
we
use
github
at
github
and
along
the
way,
show
you
some
of
the
really
cool
new
features
we've
been
building,
let's
check
it
out.
I
start
my
morning
with
the
github
mobile
app.
I
check
out
my
notifications
and
I
catch
up
with
my
favorite
communities.
E
E
E
F
F
F
F
F
F
G
G
G
Looking
at
the
pr,
we
can
see
that
there's
some
new
dependencies
to
power
these
animations,
we
should
give
them
a
once-over.
That's
super
easy.
With
our
upcoming
dependency
review
tool,
that's
built
into
pull
requests
it
automatically
surfaces,
security,
vulnerabilities
and
helpful
information
about
the
added
dependencies
when
you
preview
the
package
json,
I
see
we're
pulling
in
a
couple
of
libraries
that
have
vulnerabilities
so
I'll
need
to
update
these
to
the
patch
versions
before
we
merge.
G
E
With
github
sponsors
you
can
fund
the
open
source
projects
you
depend
on
and
the
developers
you
admire.
Github
sponsors
has
already
been
a
game
changer
for
developers,
including
some
who've,
been
able
to
quit
their
jobs
and
go
full
time
as
professional
open
source
developers.
They
don't
work
for
any
single
company.
They
work
for
the
internet.
E
Now
we
want
open
source
to
thrive
for
years
to
come,
and
given
that
every
company
in
the
world
now
depends
on
open
source,
we
know
our
community
can
do
more
so
starting
today,
companies
can
sponsor
projects
and
developers
through
their
existing
billing
relationship
with
github.
So
let's
sponsor
this
project.
G
G
And
now,
for
the
coolest
part
manually,
merging
a
pull
request
is
nice
and
all,
but
how
about
we
let
the
robots
do
the
work
here
check
out
auto
merge
now,
when
your
branch
protection
rules
are
met,
your
change
is
approved
and
your
checks
are
green.
Github
can
automatically
merge
your
pull
request
for
you
just
tell
github
how
you
want
to
merge
with
a
commit,
rebase
or
squash
and
we'll
make
it
happen.
F
Whoa,
it
looks
like
nao
cranked
this
out
already,
let's
check
out
the
pull
request,
give
it
an
approval,
so
we
can
ship
it
with
github
mobile.
Not
only
do
I
get
push
notifications
for
things
like
comments,
but
I
can
keep
working
on
any
of
my
repositories,
no
matter
where
I
am,
let's
jump
to
neo's
pull
requests
and
take
a
look
with
ui
changes
like
this.
Sometimes
it's
hard
to
know
if
everything's
working
just
by
looking
at
the
diff.
I
As
you
can
see,
we
already
have
actions
up
and
running
in
our
repo
for
pull
request
and
code
ql
automatically
looking
for
security
vulnerabilities
with
our
test,
all
green,
I
think
it's
time
to
kick
off
this
deployment.
Github
actions
is
so
much
more
than
ci.
It
can
react
to
any
github
event
to
manually
trigger
a
deployment.
I
I
This
new
ui
is
looking
fresh.
You
can
see
exactly
what's
happening
in
your
workflow,
how
steps
and
jobs
relate,
and
even
what
state
they're
in,
for
example,
here
we're
running
the
final
minification
of
bundling
steps
in
parallel,
while
regenerating
our
project's
documentation
before
we
deploy
out
the
staging.
Now
we're
ready
to
talk
about
the
final
workflow
step.
I
I
E
Tens
of
millions
of
developers
use
github,
but
so
do
hundreds
of
thousands
of
companies,
including
some
of
the
biggest
in
the
world.
For
those
users,
we've
been
hard
at
work,
adding
all
the
new
features
you
saw
today
to
github
enterprise
server.
So
you
get
all
the
power
of
the
best
teams
in
the
world
running
on
your
company's
network.
That
includes
github
actions,
packages,
code
scanning
and
support
for
the
native
get
up
mobile
apps.
All
of
this
is
available
in
a
major
new
release.
We
call
github
enterprise
server
3.0.
E
This
is
the
biggest
release
we've
done
of
github
enterprise
server
in
years.
Okay,
that
was
an
awesome
day.
The
team
went
from
an
idea
that
came
from
our
community
all
the
way
to
production,
using
discussions
issues
the
new
cli,
our
native
mobile
apps
code,
spaces,
pull
requests
code,
review,
branch
protection,
continuous
deployment,
advanced
security
scanning
tools-
you
saw
it
all
at
github.
The
thing
we
care
about
the
most
in
the
world
is
developer
experience,
so,
whether
you're
an
open
source
developer,
you
work
at
a
company
or
you're
a
student
just
getting
started.
E
E
H
L
L
L
L
L
Microbium
was
built
using
web
technologies
and
packaged
with
electron
for
distribution.
It's
comprised
of
two
main
pieces,
the
visualizer
engine
and
ui
control
interface.
The
controller
ui
is
composed
of
modular
components
built
with
the
viewjs
framework
and
the
visualizer
is
rendered
with
a
custom
engine
using
a
webgl
back
end.
L
The
main
visualizer
view
is
built
with
webgl
library
regal,
which
is
described
as
a
functional,
data-driven
abstraction
layer.
On
top
of
the
native
webgl
api,
the
library
exposes
two
primary
interfaces,
commands
and
gpu
resources
command
is
a
complete
representation
of
the
webgl
state
required
to
perform
some
draw
call
a
resource
is
a
handle
to
a
gpu
resident
object
like
a
texture,
fbo
or
buffer.
L
L
The
system
is
based
on
the
one
used
in
the
first
hitman
game,
known
for
its
ragdoll
character.
Physics
drawn
vectors
in
a
scene
are
created
with
the
vector
network
architecture,
unlike
most
vector-based
systems,
which
compose
individual,
isolated
paths.
All
paths
in
this
network
can
become
connected
and
merged
into
any
other
path.
This
allows
complex
structures
and
shapes
to
be
built
up
out
of
interconnected
paths
and
lines.
L
L
This
style
is
much
different
from
an
object-oriented
design
such
as
3js,
which
manages
discrete
objects
in
a
graph,
for
instance,
to
draw
8
radial
iterations
of
a
line.
The
draw
command
is
run
8
times
according
to
the
underlying
data.
In
contrast,
3js
would
require
managing
the
addition
and
removal
of
unique
objects
from
the
scene.
L
Scene
state
is
serialized
in
multiple
steps.
Repetitive
keys
are
remapped
to
abbreviated
names.
Typed
arrays
are
converted
to
compact
string
representations.
Then
everything
is
stringified
to
json
and
saved
to
disk
as
a
gzip
text
file.
This
process
is
reversed
for
loading
a
scene
and
generally
takes
one
to
two
milliseconds
allowing
hot
swapping
scenes.
While
simulation
is
running,
microbium
is
an
open
source
project
hosted
on
github
under
the
microbial
organization.
L
L
M
M
M
Hi,
I'm
sam
aaron
and
I'm
here
to
talk
to
you
about
how
you
might
be
able
to
use
your
coding
skills
or
learn
some
coding
skills
to
become
expressive.
What
on
earth
do
I
mean
by
that?
Well,
I
mean
well
typically,
you
learn
to
program
to
build
business
apps
or
web
apps
or
as
a
career,
which
is
a
great
thing
to
do,
and
many
of
you
out.
M
There
may
be
already
doing
that
and
that's
brilliant,
but
there
are
many,
many
others
who
yet
to
really
touch
code,
to
become
familiar
with
it
to
understand
what
it
is
and
for
them,
particularly.
I
think
we
need
to
find
ways
to
reach
out
to
help
them
to
understand
what
code
is
and
what
it
can
do,
and
I
think
building
business
apps
is
one
thing,
but
I
think
that
being
expressive
with
it
using
it
to
share
your
feelings
and
thoughts
in
new
ways.
M
I
think
actually
is
a
really
powerful
and
wonderful
and
yet
to
be
really
fully
explored
aspect
of
programming
and
that's
really
what
I've
spent
most
of
my
life,
exploring
myself
and
all
the
tools
I've
built
all
the
things
I've
learned.
I've
tried
my
best
to
compact,
together
to
squish
into
a
little
small
thing
that
I
can
give
to
you
to
play
with
and
that
the
latest
version
of
that
is
a
tool
called
sonic
pi,
and
this
is
an
open
source,
fully
free
tool
that
lets
you
write
text.
M
In
the
same
way,
you
might
write
it
right
in
a
word
document,
but
it
has
a
special
button
which
you
can
press,
which
then
turns
that
text
that
code
into
music
we're
going
to
see
how
that
can
help
you
get
started
to
program,
but
also,
if
you're,
a
professional
programmer.
This
is
still
a
really
interesting
tool
for
you,
because
it
has
concurrency
has
event
data
stores.
M
It
can
do
distributed
programming,
it's
deterministic,
it's
got
all
sorts
of
cool
fancy
features
that
let
you
really
do
some
really
explorational
advanced
things
with
your
skills
and
that's
actually
really
what
this
is
all
about.
It's
about
creating
an
equivalent
of
a
guitar,
and
why
would
I
talk
about
guitars
well
think
about
guitars,
like
it's
an
object,
you
can
pick
up
that
most
people
can
pick
up,
but
most
people
can
play
and
strum
hit
all
the
strings
so
starting.
M
It's
probably
because
they've
seen
their
favorite
artist,
jimi,
hendrix
or
taylor
swift,
perform
and
they've
seen
this
weird
wooden
medallion
around
their
neck
and
they've
said
what
on
earth
is
that
wooden
thing
around
their
neck?
I
need
one
of
those
and
their
friends
have
said:
that's
a
guitar,
and
so
that's
why
often
they've
picked
up
a
guitars,
because
they've
seen
motivational
aspirational
figures
using
that
instrument
to
do
amazing
things.
M
And
I
think
that's
true
of
the
guitar
and
it's
also
true
with
sonic
pi
and
I'll,
be
showing
you
a
little
bit
of
that
today
in
this
workshop.
But
really
this
workshop
is
about
getting
started,
but
at
the
end
of
the
conference
towards
the
end
of
the
conference,
I'm
going
to
deliver
a
performance
and
that
performance
is
going
to
be
my
demonstration
to
you
of
what
what
you
could
do
if
you
practiced
now
that
performance
is
going
to
be
pretty
special,
it's
going
to
be
the
first
time
I'm
ever
going
to
live
code
or
performance.
M
M
So
that's
going
to
be
quite
exciting.
So
today
we're
going
to
get
to
understand
the
beginning
and
how
we
can
get
started
and
then
the
performance
is
going
to
really
show
you.
Hopefully,
what
you
could
achieve
and
give
you
hopefully
that
that
that
motivation
to
really
to
learn
this
thing
and
to
become
the
dj
of
the
future?
Really,
yes,
that's
how
I'm
going
to
describe
it.
I
mean
I
mean
like
the
dj
of
the
future
right.
M
So
here
I
am
in
performance
mode
and
I've
got
my
code
on
the
screen
and
I've
got
my
crazy,
visuals
and
stuff.
So
you
can
do
this
kind
of
thing,
but
what
you're
really
seeing
is
this
code
here,
and
this
is
the
sonic
pi
editor
and
this
text
head
environment.
It's
just
a
text
over
environment.
I
can
type
words
and
those
words
have
to
mean
something
to
the
environment.
So
this
this
crazy
load
of
letters
does
obviously
means
nothing.
M
So
if
I
try
and
run
that
program
that
doesn't
work,
so
we
obviously
need
to
know
the
very
basics
of
the
system,
and
so
the
basic
program
you
can
write
is
the
word
play
and
choose
a
number
like
70
and
then
hit
the
run
button
and
it
creates
a
beep.
So
this
is
a
complete,
fully
functioning
syntactically,
valid
semantically,
correct
program,
and
this
is
a
kind
of
program
that
many
children
all
over
the
world
have
used.
Sonic
pi
to
learn
to
start
programming
have
all
written,
and
this
is
lovely.
M
I
mean
it's
a
great
way
of
just
getting
started
where
you
have
a
very
simple
thing
to
write
and
you
have
immediate
feedback,
you
haven't
you're,
not
looking
through
tools
of
logs
or
where
things
are
you're
just
hearing
a
beep,
and
you
have
control
of
that
people
and
you
can
play
some
options.
I
can
play
that
beat
louder
or
quieter.
M
I
could
play
two
and
choose
how
high
or
how
low
that
beep
is,
and
so
I
have
the
ability
now
to
manipulate
the
pitch,
the
the
how
high
or
how
low
that
note
is
by
changing
this
number
for
those
who
are
interested
there's
the
units
of
this
is
what
we
call
midi
notes.
They
kind
of
map
on
to
notes
and
a
piano,
so
each
whole
integer
that
goes
up.
M
M
This
exact
note,
you're
hearing
now
is,
is
determined
and
defined
by
western
standards,
so
we're
hearing
what
western
orchestras
might
play
for
note,
55
and
that
just
happens
to
be
a
decision
that
has
been
agreed
upon
and
it
only
really
holds
in
the
western
traditions
of
music.
And
if
we
break
out
of
those,
we
really
start
to
explore
all
sorts
of
interesting
ways
of
choosing
how
high
or
how
low
your
note
is,
and
so
sonic
pi.
Although
it
makes
the
western
tradition
easy
by
using
integers,
it
does
give
you
access
to.
M
To
playing
whole
fraction
for
a
whole
fraction,
it's
fractions
of
notes,
so
you
have
essentially
floating
point
access
to
the
the
range
of
notes
you
can
have.
So
you
can.
You
can
play
essentially
any
note
you
can
perceive
you
can
play
with
the
system
by
just
choosing
the
right
number
and
you
don't
have
to
stick
to
whole
numbers.
You
can
stick
to
floating
points
if
you
want
to
break
out
of
the
western
traditions,
which
I
think
is
pretty
exciting.
M
M
M
Oh,
they
played
at
the
same
time
now
you
might
have
expected
it
to
play
in
note,
70
and
then
note
75
and
actually
in
the
early
days
of
sonic
pi.
When
I
first
created
it,
that's
exactly
what
it
did,
but
it
did
it
so
fast
after
one
of
one
after
another,
you
couldn't
hear
it
just
was
the
computer
is,
is
crazy,
fast
and
interpreting
the
instructions,
but
actually
in
their
more
recent
versions.
M
This
is
actually
played
sample
accurately
at
the
same
time,
so
really
really
precisely
at
the
same
time,
because
timing
and
music
are
something
which
really
work
and
are
important
and
then
necessary
for
each
other,
and
so
sonic
pi
has
extremely
good
timing.
Semantics,
that's
really
one
of
its
core
skills.
M
M
Lovely
now
this
might
be
fun,
it
is
fun.
I
think
it
is
anyway
and
but
it
might
be
fun
to
you,
but
what
I
think
is
really
interesting
is
this
is
likely
to
be
fun
to
many
more
people
in
your
lives
than
talking
about.
I
don't
know
nginx
configuration
or
enterprise
java
service
beans.
They
still
thing.
No,
probably
not.
What
else
might
you
talk
about
javascript
promises?
I
don't
know
whatever
the
latest
technology
lace.
M
Whiz
bang
thing
is
the
chances
are
most
the
people
in
your
lives
who
aren't
programmers
are
going
to
struggle
to
follow
along
and
be
interested,
whereas
if
you
talk
about
music,
actually,
I
found
it's
much
more
easy
to
have
that
conversation
and
to
keep
them
engaged.
So
I
think
this
is
more
likely
to
interest
a
broader
audience,
and
I
think
this
is
the
goal
of
sonic
pi.
So
sonic
pi
is
meant
to
be
two
things.
It
was
meant
to
be
a
musical
instrument.
M
I
was
talking
about
guitars
talking
about
the
fact
he
can
get
started
and
how
easy
it
is
to
get
started
with
a
guitar
piano
here.
Hopefully,
you
can
see
that
this
is
also
easy
to
get
started
with.
We
have
access
to
pretty
much
any
melody,
you've
ever
heard
or
will
hear
with
two
commands
which
note
to
play
and
when
to
wait.
How
long
to
wait
for
the
next
note,
but
this
is
a
crucial
thing.
This
also
gives
you
access
to
doing
really
sophisticated
and
really
interesting
detailed
music.
M
So
we
can
take
any
of
the
synthesizers
here
and
bring
them
all
in
and
mix
them
together
and
all
sorts
of
events
and
sounds
and
have
a
lot
of
fun,
and
we
can
have
access
to
all
of
that
here
as
well
and
all
you
need
to
do,
for
that
is
to
start
adding
more
code,
essentially
to
ask
to
explain
the
different
kinds
of
things
you
might
want
to
do.
So
what
do
I
mean
by
that?
Let's
play
those
70
a
bit
more
code.
Is
the
release
commands?
M
M
Some
of
you
might
want
to
know
why
I'm
doing
this
subtraction
here.
Actually,
you
can
obviously
just
do
put
throw
some
maths
in
there,
but
12s
in
western
music
is
an
octave.
So
three
times
12
is
36.
That's
going
down.
Three
octaves
just
saves
me
having
to
do
that
mental
arithmetic
in
my
head,
so
we
have
now
ability
to
play
these
notes.
Let's
go
for
release
eights.
M
So
17.
I'm
able
to
mix
kind
of
like
drone
music,
essentially
by
layering
the
sounds
on
top
of
each
other,
probably
for
this
kind
of
environment.
You
want
to
be
in
sort
of
dark
mode,
so
that
you're
in
some
sort
of
like
a
nightclubby
environment
and
you're
playing
these
sounds.
So
what
we've
got
here
essentially
is
multi-threaded
environment.
M
So,
each
time
the
code
goes
pink,
it
creates
a
new
thread
of
execution
and
gives
that
thread
the
code
that
you
can
see
on
the
screen
to
execute,
and
it
runs
through
that
code
from
the
top
to
the
bottom
and
when
it
finishes
it
automatically
stops
that
thread
garbage
collects
it
tidies
all
the
things
all
the
resources
it's
been
allocated
and
then
frees
it.
So
you
can
have
another
thread.
M
Yep,
and
so
this
gives
you
access
to
a
huge
amount
of
music
possibilities
already,
you
can
essentially
compose
your
own
piece
of
music.
You
can
change
the
sound
as
it's
being
played.
You
can
change
the
length
of
the
sound.
You
can
change
the
qualities
of
the
sound
with
this
cutoff
and
other
things,
and
each
of
these
synthesizers
has
documentation
describing
all
the
different
things
it
can
do
and
all
the
options
it
supports
in
the
documentation
system
already
there.
M
So
you
have
a
lot
of
fun
and
power
there,
but
there's
one
more
was
two
more
really
actually
quite
exciting
things
to
show
you
that
really
can
get.
You
started
and
advance
pretty
quickly.
The
second
one
is
well.
Obviously,
you
can
use
control
structures,
that's
not
even
a
thing
to
explain!
Look
at
this
eight
times,
so
I'm
going
to
play
that
note.
Wait
for
a
small
amount
of
second
here's,
an
eighth
of
a
second.
M
So
let's
play
it
75
or
I
can
do
a
scale
for
double
e3
minor
pentatonic.
I
can
choose
a
random
note:
it's
pretty
cool,
so
this
is
actually
this
code.
Here
is
pretty
much
the
start
of
the
challenge
which
we'll
get
on
to
in
10
minutes
or
so,
but
so
just
to
get
you
get
in
your
head.
This
is
the
kind
of
code
I'm
going
to,
hopefully
ask
you
to
write,
but
listen
to
this,
but
first
of
all
notice
that
it
plays
the
same
thing
every
time.
M
So
what
we're
hearing,
even
though
we've
got
this
word
choose
which
you
think
might
be
to
do.
Randomization,
maybe
I've
got
like
a
bag
of
letters,
I'm
playing
scrabble
and
I'm
pulling
out
random
letters.
If
I
pull
out
eight
letters
and
then
put
them
back
in
again
and
pull
out
a
different
eight,
I'm
gonna
get
a
different
eight
letters,
but
we
get
with
sonic
pi.
M
I
always
get
the
same
ones
and
that's
because
by
design
sonic
pi
is
what
we
call
deterministic,
which
means
that
it
always
does
the
same
things
every
time
it
runs
and
that
might
sound
limiting
like
oh,
but
I
want
my
randomization
to
always
be
random.
That's
surely
that's
the
point
of
randomization.
Well,
actually,
you
want
probably
two
things
you
want
it
to
feel
random
so
that
you
can
try
new
things
out
and
we
can
get
that
feeling
by
changing
what
we
call
the
random
seed.
So
by
default,
the
random
scene
is
zero.
M
What
we
heard
before
is
the
same,
but
actually
by
putting
some
random
number
in
here,
we
get
it
to
make
different
choices,
or
this
number
or
this
number
now,
if
we
like
that,
we
now
have
the
ability
to
reproduce
it.
So
the
cool
thing
now
is,
if
you
were
to
take
this
code
and
copy
and
paste
it
or
just
type
it
out
again
into
your
version
of
sonic
pi
that
you've
downloaded
from
the
website.
M
You
will
hear
exactly
the
same
notes
played
in
exactly
the
same
way.
So
that's
the
second
benefit
of
a
deterministic
system.
Is
it
allows
us
to
share
the
code
and
to
know
what
the
people
who
play
that
code
are
going
to
hear
that
that
turns
out
to
be
really
useful
for
collaborative
jamming
and
for
composing,
together
with
friends
in
a
distributed
fashion,
which
means
that
code
that
you
upload
to
github
and
to
just
say
you
paste
copy
and
paste
in
sonic
pie?
M
You
know
you're
gonna
hear
what
the
person
who
created
that
intended
due
to
here.
That's
that's
a
critical
thing,
but
then
another
thing
to
show
you
is
the
effects.
I
can
use
an
effects
block.
Well,
what
do
I
mean
by
that?
Well
here
we
have.
This
do
end,
which
describes
iteration
how,
where
to
start
the
iteration?
Let's
do
so
I'm
gonna
do
something
eight
times.
This
is
what
I'm
gonna.
M
M
And
we
could
nest
these
things
together,
so
this
play
sound
goes
through.
The
crush
goes
to
the
flanger,
goes
through
the
reverb,
and
then
you
hear
it
and
then
so
we're
able
to
to
combine
all
these
effects
together.
So
this
is
a
really
cool
technique
for
being
able
to
change
the
quality
of
the
sounds
in
the
same
way,
a
guitarist
can
change
the
quality
of
their
guitar
by
using
these
effects
pedals.
M
So
now
we've
learned
how
to
play
notes.
We
learned
how
to
play
any
note
you
can
hear
by
using
floating
points.
We
can
wait
between
notes.
We
can
make
any
melody.
We
can
change
the
sound
of
the
sound
by
changing
the
synthesizer
and
also
we
can
change
some
of
the
options
of
the
synthesizer,
which
are
basically
like
these
kind
of
knobs
on
this
synthesizer
here,
but
they're
just
words:
key
value
pairs,
an
associative
map
as
it
were,
of
control
values
which
are
passed
to
as
a
parameter,
an
optional
parameter
to
the
function
play.
M
So
that's
a
lot
of
fun,
and
this
is
essentially
what
I'm
hoping
you
might
come
up
with
with
the
challenge
which
we'll
talk
about
in
a
moment,
but
before
that
I'd
like
to
show
you
one
more
thing
which
I
think
is
really
quite
fun
and
that
is
being
able
to
live
code.
So
everything
we've
talked
about
so
far,
sort
of
a
compositional
mode.
Where
we're
writing
a
bunch
of
codes.
Changing
the
sounds.
Changing
the
timing,
pressing
run
hearing
the
sounds.
M
M
An
endlessly
repeating
drum
break,
which
is
pretty
cool,
so
let's
just
part
that
for
one
second-
and
let's
do
it
again,
but
with
a
different
sample,
let's
play
the
bass,
drum
power
sample
and
let's
take
for
half
of
it
cool
now
I'm.
I
was
amazed
actually
by
the
number
of
times
I've
seen
people
write
this
code.
So
let's
actually,
let's
perfect
do
this.
M
So
now
we
have
this
code
here
again,
as
we
saw
before
the
way
to
learn.
Sonic
pi
is
to
read
the
code.
Imagine
what
it
sounds
like
in
your
head
and
then
press
the
run
button.
So
just
spend
a
moment.
You
heard
the
kick
drum.
You
heard
the
r
men
break
spinning
around.
Let's
hear
what
they
sound
together.
M
M
Where's
the
arm
and
break
well,
if
you're
a
professional
programmer-
and
this
is
an
interview
question-
why
can't
you
hear
the
arm
and
break
I'm
sure
some
of
you
are
screaming
out
to
me.
It's
because
you've
got
a
single
threaded
application
and
the
loop
is
infinite
and
the
program
never
exits
a
loop
okay.
What
do
you
mean?
So,
let's
think
about
this.
The
code
starts
at
the
top
of
the
program
and
works
its
way
down.
Typically,
what
happened
in
most
traditional
programming
languages,
so
we
get
to
this
loop.
M
Here's
the
first
thing
really
these
two
lines
here
are
blank
and
this
means
loop
forever.
So
we
play
our
sample
our
bass,
drum.
We
wait
for
half
a
second
and
then
we
loop
around
play
a
sample,
wait
for
half
a
second,
then
we
loop
around
and
loop
around
and
loop
around
forever,
and
we
never
ever
ever
get
down
down
here.
So
that's
a
problem,
so
the
solution
to
this
is
to
use
threads.
M
Now
they
might
be
a
nightmare
concept
that
you
sort
of.
Oh,
don't
touch
them,
you
get
out
your
garlic
and
and
then
you
hunt
them
away
like
vampires,
but
inside
tonic
pie.
Actually,
threads
are
really
nice
and
they're
really
friendly
and
the
way
to
use
threads
inside
sonic
pi
is
to
use
live
loops.
Let's
call
this
kick,
let's
call
this
drums,
you
give
them
names,
and
then
you
run
the
code.
M
So
live
loops
have
two
cool
properties.
One
is
that
they
can
play
things
at
the
same
time,
so
this
idea
of
concurrency,
so
this
actually
is
completely
natural
in
a
band.
Now
you
have
a
singer
and
a
guitarist
and
a
bass
player.
They
will
all
play
at
the
same
time
to
make
the
band,
but
they
do
another
thing
actually,
which
is
pretty
critical,
which
is
play
playing
not
just
at
the
same
time
but
in
time.
M
So
these
two
threads,
the
kick
thread
and
the
drums
thread
are
not
just
executing
simultaneously,
as
you
might
imagine,
a
traditional
programming
thread
to
do.
They
also
play
in
time,
which
means
that
the
kick
drums
kicks
exactly
the
same
time
as
the
r
men
starts
and
no
matter
how
long
they
play
they
don't
drift
out
of
time.
They
don't
drift
back
in
time
and
mess
around
there's.
No
none
of
that
everything's
completely
hard
synced.
I
mean
I've
spent
a
long,
a
lot
of
time
and
effort
actually
behind
the
scenes
making
this
work.
M
A
lot
of
my
time
has
gone
into
making
the
timing
system
as
precise
and
deterministic
and
accurate
as
I
can.
I'm
still
working
on
that
as
well,
so
we
had
the
concurrency,
but
there
was
one
other
thing:
we
could
change
the
code
as
it
runs
and
that's
a
critical
thing.
This
is
this:
is
the
sort
of
the
opening
gateway
to
what
we
call
live
coding
being
able
to
play
the
code
and
modify
it
as
it
runs,
and
when
you
see
me
perform
in
my
performance
you'll
see
me
writing
a
bunch
of
these
live
loops.
M
They're
all
doing
a
simple
thing,
but
a
few
of
them
together
combine
to
make
something
interesting
and
complicated,
just
like
if
you
took
out
the
bassist
of
a
band
and
just
played
them
on
her
own
she's,
probably
going
to
play
quite
a
simple
riff
and
the
guitarist
she's
also
going
to
probably
play
a
siberia
but
pull
them
together
and
it
sounds
much
more
interesting.
That's
the
same
with
the
live
loops
each
one
of
them
probably
only
does
a
simple
thing,
but
combined
together
you
get
really
cool
effects.
M
M
And
if
you
want
to
get
more,
you
get
started,
learn
more
about
this.
You
want
to
actually
open
up
the
tutorials,
so
you
just
click
on
the
help
system,
and
you
can
see
here.
There's
a
full
tutorial
built
in
this
is
also
available
on
the
website.
If
I
go
to
the
website,
you
can
actually
see
that
I
can
click
on
the
tutorial
section
and
I
can
work
my
way
through
the
website
as
well.
So
you
can,
you
can
read
everything.
M
Minor
pentatonic
scale
now,
if
this
doesn't
mean
anything
to
you,
don't
worry.
This
is
kind
of
like
a
color
palette.
If
you're
designing
a
website,
your
designer
might
give
you
a
bunch
of
colors
and
say
only
use
these
colors,
please
this
particular
red
this
particular
green,
this
particular
yellow
or
whatever
the
colors
are.
As
long
as
you
stick
to
those
color
palette
of
colors,
it's
going
to
be
fine
and
this
scale
is
essentially
a
color
palette
of
notes.
M
It's
just
a
list.
Actually,
I
can
print
that
on
the
right
hand,
side-
and
you
can
actually
see
here-
it's
52,
55,
57,
59,
62
and
64.
there,
your
notes.
So
if
we
will
stick
with
those
notes
and
then
we
can
do
anything
with
them,
so
I'm
going
to
I'm
going
to
spend
the
next
one
minute
30,
giving
you
as
many
ideas
as
possible
and
as
long
as
you're
working
with
these
notes.
M
B
M
M
M
N
Hi
nice
to
meet
you,
my
name
is
sabine
villuch,
I'm
also
known
as
bleeptrek,
and
I
work
a
lot
with
generative
and
ai
art,
and
I'm
very
happy
that
I
was
invited
today
to
give
you
a
super
quick
dive
into
generative
art
and
how
you
can
code,
your
own
generative
art
with
paper
js,
so
yeah,
let's
get
started
and
what
what
is
generative
art.
So
the
main
goal
is
to
make
some
sort
of
art
in
the
end.
N
This
can
be
anything
you
can
think
of
images:
videos,
music,
poems
whatever
you
like,
though,
in
this
workshop
we
will
go
with
images
and
to
make
this
even
more
detailed,
we
will
create
vector,
graphics,
svgs
and
yeah.
When
we
talk
about
generative
art,
we
always
use
some
sort
of
rule
set
to
make
our
art.
N
This
rule
set
in
our
case,
will
be
created
by
code
by
algorithm
that
we
write.
But
this
doesn't.
This
doesn't
need
to
be
the
case
all
the
time.
Some
people
also
work
with
dices
and
they
just
yeah
use
dices
in
a
physical
in
the
physical
world
to
generate
random
numbers
and
then
put
that
in
their
rule,
set
that
they
have
in
their
mind
and
then
draw
certain
shapes
that
also
works,
but
we
will
go
with
code
and
that
that's
yeah
when
you
today
hear
generative
art,
you
usually
think
of
code
and
art
yeah.
N
As
I
already
said,
there
are
different
kind
of
input
types
you
can
use.
You
can
use
yeah
random,
random
numbers.
You
can
also
make
interactive
generative
art
so
that
the
user
can
or
generates
the
input,
for
example,
with
the
kinect,
and
you
can
scan
the
body
pose
and
use
that
as
input.
It
also
works.
You
can
also
use
completely
different
sensors
that
don't
have
to
do
anything
with
users.
Let's
say
you
have,
I
don't
know.
N
Maybe
a
water
sensor
in
your
plant
that
could
also
work
or
maybe
also
any
different
kind
of
data
doesn't
need
to
be
sensors.
You
could
also
connect
to
a
large
databases
like
wikidata
and
draw
information
from
that
and
use
that
to
generate
your
art,
so
the
generative
models
that
you
write.
They
can
have
a
lot
of
different
parameters.
This
can
either
be
like
binary
values.
You
can
either
use
rectangles
or
circles.
Something
like
that.
This
can
also
be
a
range
of
numbers,
and
usually
you
want
to
set
a
fixed
minimum
and
maximum.
N
So
you
find
out,
I
don't
know,
maybe
circles
should
at
least
be
a
certain
size
and
should
not
get
bigger
than
another
size
so
that
it
still
looks
good
in
some
way.
So
this
is
something
you
have
to
figure
out
yeah
and
when,
when
we're
all
already
at
figuring
out
stuff,
there's
one
important
thing
that
I
want
to
tell
you
about
generative
art.
When
you
imagine
the
space
that
you
are
in
with
your
generative
model,
you
have
basically
two
spaces.
There's
the
possibility
space.
N
That
is
the
space
of
all
possible
outcomes
that
you
can
do
with
your
parameters
and
your
settings.
So
every
permutation
is
a
dot
in
that
space,
and
you
also
have
that
generative
space.
This
is
usually
a
sub,
a
subset
of
generative
outcomes,
because
you
have
some
certain
constraints
that
you
put
on.
Let's
say
when
circles
are
small,
you
make
them
blue
and
when
they
get
bigger,
you
make
them
red.
Something
like
that
and
for
generative
art.
There's
a
very
important
thing
to
consider:
how
large
should
your
generative
space
be?
N
N
N
I
wanted
to
show
you
some
of
my
work
to
give
you
a
bit
of
inspiration,
what
it's
possible,
and
maybe
you
can
already
find
a
bit
of
a
a
certain
path
or
certain
thing
that
you're
interesting
to
do
later,
yeah.
So
the
first
project
I
want
to
show
you
is
called
gen
chair
and
I
found
a
paper
that
was
really
interesting
about
how
you
can
simulate
the
vein.
Growth
in
tree
leaves,
and
it
gives
super
interesting
pattern
and
that
rule
set.
N
That
algorithm
is
actually
super
easy
to
implement
and
that's
what
I
did
and
yeah
to
make
it
more
like
a
leaf.
You
would
put
it
in
a
leaf
shape,
but
in
my
case
I
wanted
to
create
a
chair
out
of
it.
So
I
let
these
veins
grow
inside
of
a
rectangle
shape
and
then
just
through
that
onto
my
cnc
machine,
which
actually
took
quite
long
so
the
the
backside
and
the
seating
plate
took
five
hours
each
to
cut
out
of
my
cnc
machine
and
yeah.
N
When
I
put
that
together,
I
ended
up
getting
a
really
interesting
chair
made
out
of
a
thick
verch
plywood
and
it
looks
quite
fragile,
but
actually
it's
really
sturdy
and
I
think
that's
a
nice
example
that
you
can
also
use
sorts
or
simulation
to
create
generative
art.
It
doesn't
need
to
be
like
a
super
hard-coded
rule
set
that
you
came
up
with
it
can
also
be.
You
can
also
use
yeah,
some
sort
of
maybe
predefined
simulation
tools
that
usually
works.
Great
can
also
be
like
gravity
simulation
or
something
like
that.
N
The
one
point
that
I
was
missing
when
I
started
getting
into
generative
art
was
a
very
good
export
for
svgs
or
vector
graphics,
because,
as
you
can
see,
I
work
a
lot
with
machines
that
need
these
paths
to
yeah
to
cut
along
or
draw
along,
like
cnc
machines,
pamphlets,
laser
cutters
and
all
that
stuff.
Also
3d
printing
usually
benefits.
N
If
you
have
a
nice
dxf
file,
for
example,
that
you
can
work
with,
and
that's
why
I
started
using
paper
js
and
that's
also
the
tool
I
want
to
show
you
today,
and
this
project
is
that
you
can
see
here
is
called
over
flower
yeah.
It
generates
some
sort
of
flowery
images.
Maybe
it's
looks
a
bit
like
succulents
succulent
plants,
and
what
you
can
see
here
is
what
I
talked
about
earlier
about
the
importance
of
choosing
the
right
size
of
your
generative
space.
N
You
can
see
that
these
flowers,
they
look
quite
different
and
some
have
pointy
leaf.
Some
have
more
round
leaves
there
are
different
filling
patterns,
they
are
placed
in
different
locations
and
they
are
in
their
square,
so
they
look
quite
different,
but
they
also
you
can
see
that
they
belong
to
the
same
model
and
that's
a
nice
feeling
that
I
usually
want
to
create.
With
my
artworks
that
you
have
a
nice
that
you
can
generate
a
nice
row
of
different
images,
they
look
like
they
belong
together,
but
each
one
is
interesting
on
its
own.
N
That's
super
important
to
me.
My
latest
project
is
called
pico
planet
and
yeah.
I
like
a
lot
to
experiment
with
different
materials
and
how
I
can
transfer
these
digital
artworks
into
the
physical
world
and
with
this
project
I
tried
to
yeah
put
generative
art
on
pcbs,
and
it
was
a
very
interesting
task
for
me
because
for
each
new
material
that
you
experiment
with,
you
need
to
find
out
prerequisites
on
how
you
need
to
prepare
your
digital
file
so
that
it's
easy
to
process
it
in
the
basically
in
the
processing
path
that
you
choose.
N
In
this
case,
I'm
not
sure
if
you
maybe
have
looked
at
a
pcb.
You
have
different
layers.
You
have
these
copper
layers,
then
there's
a
solder
mask
on
top
and
on
the
solder
mask
there
can
be
a
screen
print
in
this
case.
That's
the
that's
the
white
screen
print
and
I
want
to
somehow
utilize
these
different
layers,
because
different
combinations
give
different
colors,
for
example,
with
pico
planet.
N
You
can
see
these
swirls
in
the
background
and
they,
the
lighter
swirls,
are
a
combination
with
copper
and
solder
mask
and
the
dark
background
are
places
where
there's
no
copper
under
the
solar
mask.
So
you
can
play
with
that
or,
for
example,
the
these
little
sort
of
yellow
stars.
They
don't
have
layers
on
top
of
them
at
all,
so
it's
only
the
base
plate
and
you
can
use
them
to
shine
light
through
the
pcb
so
always
think
about
what
your
end
product
will
be.
N
You
have
similar
interesting
cases
when
you
use
pen
plotters,
because
when
you
create
digital
paintings
and
for
example,
you
have
a
circle
without
another
circle
on
top
and
they
have
a
fill
color,
you
can
just
draw
them
on
top
on
and
one
will
partly
over
that
overlap,
the
other.
That's
totally
fine.
N
If
you
put
the
same
svg
later
on
pen
plotter,
you
will
have
a
problems
with
that
overlap,
because
both
circles
still
exist,
so
both
circles
will
be
drawn
completely
and
you
need
to
find
a
way
to
like
cut
out
certain
shape
paths
so
that
they
are
not
drawn
later
in
the
image.
So
this
is
all
stuff
that
you
need
to
think
out
in
the
best
case
before
you
start
to
write
your
code,
or
maybe
you
need
to
refactor
that
later.
N
N
One
super
quick
last
idea
that
I
want
to
give
you
what
you
can
do
with
your
generative
piece
and
also
maybe
the
generator
that
we
will
write
at
the
end
of
the
day
is
to
make
it
into
a
twitter
bot
or
a
social
media
board
doesn't
need
to
be
twitter,
of
course,
but
it's
a
very
interesting
thing
to
experience,
because
you
give
your
art
a
very
con.
A
very
casual
way
to
be
viewed
like
people
can
just
subscribe.
It's
let's
stay
with
the
twitter
example.
N
You
can
just
subscribe
to
the
twitter
feed
of
your
creative
art,
bot
and
yeah
every
now
and
then
every
few
hours
a
new
image
will
be
created
and
they
can
just
watch
it
and
can
comment
on
it,
and
this
is
a
super.
I
don't
know
like
yeah,
open
and
public
way
to
show
your
art
and
also
it's
a
very
nice
way
for
you
as
the
creator
to
consume
your
art,
because
I
guess
you
will
also
follow
your
art,
bot
and
yeah.
N
N
This
is
the
javascript
library
that
we
will
be
using
and
there
are
three
links
that
might
be
of
interest
to
you.
One
is
the
references
link
where
you
can
find
all
the
documentation,
there's
also
a
link
called
tutorials.
This
gives
nice
written
short
tutorials
on
different
topics
and
most
important
one
is
the
sketch
link,
because
paper
js
has
a
great
online
editor,
and
this
is
where
we
will
start
now.
N
I
prepared
certain
steps
in
the
coding
process
for
you
so
that
you
don't
have
to
watch
me
writing
down
all
the
code,
and
I
can
better
explain
you
what
we
do
and
how
it
works.
So,
in
the
first
step
we
end
up
with
a
red
rectangle
paper.
Js
has
a
class
that
is
called
path
and
that
basically
holds
every
kind
of
vector,
graphic
path
that
you
would
usually
use,
but
it
has
also
some
nice
predefined
forms
of
paths,
for
example
rectangles,
and
these
rectangles.
They
need
some
certain
information,
so
they
know
how
to
look.
N
Rectangles
need
the
position
in
this
case.
That's
the
top
left
point
and
also
the
size,
so
how
big
the
rectangle
should
end
up
being.
In
this
case,
we
placed
it
in
position
8080
and
the
size.
That's
a
bit
hard
to
read
the
size
is
50
by
50
units
with
vector
graphics.
You
usually
don't
work
with
pixels
it's
more
units
and
sometimes
also
depends
on
the
exports,
what
the
units
end
up
being
with.
Sometimes
it
might
be
millimeters
or
different
stuff.
N
This
rectangle
also
needs
some
styling
information
so
that
it's
visible
in
vector
graphics.
You
have
usually
two
main
options
to
style.
You
have
the
fill
color
and
you
have
the
stroke,
color
and
yeah
also
the
stroke
width-
and
these
are
just
set
here
with
the
attribute
stroke,
color
with
and
fill
color
and
with
paper
jazz.
It's
really
nice
that
you
for
colors
can
use
basically
any
type
of
color
descriptions.
You
know
from
css,
so
you
can
use
the
css
color
names.
You
can
go
rgb
or
hsl.
N
Basically,
anything
you
want
and
to
make
this
a
quick
example.
I
just
use
the
color
strings
black
and
red,
and
I
set
a
stroke
width
to
two.
So
when
I
run
the
code,
you
can
already
see
the
result.
We
get
a
little
rectangle.
So
let's
take
this
one
step
further.
We
want
to
make
a
grid
out
of
the
rectangles,
so
I
you
can
basically
choose
any
grid
size.
You
want
to
make
this
a
bit
easier
to
look
at
in
the
recording.
I
choose
a
smaller
grid
without
six
by
six
rectangles.
N
I
put
this
in
a
separate
variable
so
that
we
can
reuse
this
later,
better
and
yeah.
Basically,
we
just
take
two
for
loops
and
make
a
grid.
I
didn't
change
much
interesting
parts.
It's
just
a
placing,
maybe
so
we
can
use
the
x
and
y
coordinates
to
place
it
in
a
nice
grid
when
they
have
the
size
of
50
by
50.
We
maybe
want
to
have
a
bit
of
space
between
the
rectangles.
N
N
N
N
N
For
example,
let's
say
we
take
it
times:
three,
that's
also
it
yeah,
it
rotates
a
bit,
but
it
could
be
more
and
we
could
also
maybe
make
it
more
fancy
and
just
throw
in
our
grid
size
in
there,
for
example,
it
rotates
it
even
more.
So
we
end
up
with
a
six
in
the
end
and
to
make
it
even
more
interesting.
N
And
that's
more
or
less
what
I
did
here
in
the
beginning.
We
have
our
factor.
We
have
a
also
a
random
factor
and
also,
we
always
add
a
certain
number,
because
if
we
would
not
do
this,
we
might
up
end
with
a
zero
overall,
because
math
random
can
give
you
a
zero
and
that
would
make
the
whole
term
a
zero.
So
we
always
want
to
have
at
least
three
degrees
and
then
maybe
more,
and
that
looks
quite
fun
if
we
press
play
a
couple
of
times
here.
N
That
looks
good.
I
think
we
can
go
to
the
next
step
and
play
even
more
with
that
sketch.
Let's
get
some
colors
in
there.
This
is
what
we
want
to
end
up
with.
We
want
a
color
gradient
from
the
top
left
spot
in
our
grid
to
the
bottom
right,
and
we
choose
two
random
colors
to
do
so,
and
we
need
to
calculate
the
steps
from
one
color
to
another.
So
let's
figure
out
how
to
calculate
that.
N
First,
we
take
two
random
colors
like
here.
That's
what
you
have
already
seen.
That's
nothing
new!
The
nice
thing
with
paper
js
is
that
you
can
that
paper.
Js
uses
a
nice
way
of
operator
overloading,
so
you
can
just
use
plus
minus
divide
and
stuff
to
add
or
subtract
vectors,
and
colors
in
paper.js
are
also
basically
just
vectors
in
their
color
space.
So
what
do
we
do
when
we
want
to
calculate
a
gradient?
Is
we
want
to
calculate
the
vectors
in
the
color
space?
So
first
we
have.
N
We
have
color
one
color
two
and
we
need
to
know
a
little
bit
the
little
vector
steps
that
we
can
iteratively
add
on
to
make
that
gradient.
So
this
is
what
the
color
dist
function
does.
So
we
take
the
large
vector
from
one
to
two
and
then
divided
by
the
number
of
steps
we
need.
So
how
did
I
come
up
with
that
number
super
easy?
We
have
that
we
have
our
grid.
Let's
see
how
many
colors
we
need
so
because
all
all
rectangles
that
are
diagonally
on
the
same
line.
N
N
Maybe
that's
maybe
an
idea
if
you
want
to
work
further
on
that
code
to
make
sure
that
colors
are
not
too
similar
or
maybe
choose
colors
that
are
on
the
opposite
side
of
the
color
spectrum.
Maybe
that's
everything
you
can
do
later.
Okay,
next
step.
We
want
to
add
a
bit
more
interesting
stuff
to
the
image,
it's
basically
more
or
less
the
last
step
that
we
will
do.
We
add
more
rectangles
that
are
not
filled,
but
are
a
bit
not
distorted
but
rotate
differently
and
also
scale
differently.
N
So
that
makes
it
more
interesting
to
look
at
and
that's
not
a
lot.
We
have
to
do
to
make
this.
We
just
add
another
nested
loop.
This
is
this
loop
that
counts
I
until
it
reaches
two
like
three
times
so
we
add
three
rectangles
the
first
rectangle.
This
is
this
one
here
that
gets
the
fill
color
like
in
the
step
before
the
others:
don't
get
a
fill
color,
so
they
stay
transparent
and
then
we
need
to
play
a
bit
with
the
rotation
and
especially
the
scaling.
N
To
be
honest,
we
don't
need
to
change
a
lot
or
actually
nothing
with
the
rotation,
because
it
also
already
has
that
random
factor.
So
they
will
always
look
a
bit
different,
nothing,
nothing
much
to
change
here,
but
the
scale
factor
we
can
add
the
I
in
here,
which
is
really
nice,
so
the
scaling
from
each
stacked
rectangle
is
already
one
step
ahead.
Basically,
this
is
where
they
look
a
bit
bigger
like
this
rectangle.
N
And
then
there's
one
last
teeny
tiny
thing
that
we
can
do
currently,
you
can
see
that
the
whole
sketch
is
basically
glued
to
the
top
left
corner
because
of
the
way
we
calculate
the
positions,
and
it's
easy
to
do
it
in
that
way,
but
maybe
we
want
to
center
it
to
make
it
look
a
bit
more
appealing
if
you
would
integrate
that
to
a
website
or
something
and
that's
a
easy
thing
to
do-
that
we
put
everything
in
one
group.
This
is
also
a
paper
js
class
and
every
every
path
object
that
we
create.
N
We
need
to
add
that
to
that
group,
that's
done
by
add
child,
and
in
our
case
we
just
throw
in
the
rectangle
and
now
comes
the
the
fancy
part.
We
can
just
set
the
group
position
to
the
view
center.
The
view
is
also
an
object
that
is
given
by
paper
jazz
and
that's
like
a
super
helpful
line
to
just
center
stuff
can
highly
recommend
using
that
and
that's
how
we
end
up
with
our
nice
rectangle
generative
art
piece.
N
That
link
will
bring
you
directly
to
this
paper,
js
sketch,
by
the
way,
it's
super
nice
to
share
them,
because
the
url
in
cole
encodes
the
whole
code.
So
the
links
get
quite
long,
but
you
can
share
your
whole
project
with
that.
So
yeah
just
just
go
there.
You
will
find
the
example
we
created
together
today
and
yeah
feel
free
to
experiment
further
with
it
go
crazy
experiment
with
colors
or
certain
ways
to
choose
two
colors
for
the
gradient.
Maybe
you
can
also
play
with
opacity
or
blending
modes.
N
That's
the
thing
we
didn't
talk
about
at
all,
which
makes
really
nice
effects.
Maybe
you
know
these
blending
modes
from
photoshop,
where
you
can
like
have
a
multiply
layer,
so
you
can
mix
different
half
transparent
layers
together
to
get
new
colors.
That's
super
fancy,
maybe
make
it
interactive
or
animate
the
rectangles,
make
them
pulsating
or
create
shapes
by
scaling
in
an
animation
or
make
it
interactive
by
I
don't
know,
maybe
people
can
choose
their
color
or
can
drag
some
rectangles
around
or
change
the
rotation
or
something
so
yeah
yeah
go
crazy
experiment,
a
lot!
N
That's
the
fun
thing
with
generative
art.
Just
try
a
bunch
of
things
that
come
to
your
mind
and
see
how
it
goes
and
where
it
takes.
You
have
fun
coding
and
I
hope
to
see
you
soon.
If
you
have
any
questions
or
want
to
reach
to
me,
you
can
find
my
contacts
on
my
website
bleeptrack.de
or
you
can
also
find
me,
for
example,
on
twitter
or
instagram
or
other
social
media
channels
by
the
name
of
bleeptrek.
O
Good
morning,
everyone,
so
my
name
is
alexandra
and
I'm
going
to
be
your
host
for
this
session
and
today
I'm
going
to
be
talking
about
nanu
and
that's
a
creative
coding
framework
that
has
been
written
in
rust,
so
I'll.
Try
to
keep
this
interactive
in
the
sense
that
I'll
try
to
do
a
live
demo
of
working
with
the
framework
so
that
you
can
get
a
feel
about
how
it
feels
to
actually
work
with
rust
and
this
wonderful
framework.
O
O
O
So
if
you're
not
familiar
with
creative
coding,
it's
the
use
of
computers
and
technology
to
create
interactive
pieces
of
art,
installation
or
whatsoever,
and
you
might
have
heard
of
processing
or
open
frameworks
or
even
cinder
for
what
matters.
So
you
have
a
lot
of
different
frameworks
out
there,
but
the
only
one
that
I
know
of
and
where
you
can
do.
A
lot
of
interesting
thing
in
rust
has
been
nanu.
O
So
nano
has
been
developed
by
the
wonderful
people
behind
mind,
buffer
design,
studio
and
they're
doing
like
awesome
installation
using
the
framework.
Personally
myself,
I'm
using
only
for
doing
graphics
so
far,
and
you
can
even
look
at
the
homepage
of
the
project
and
you
can
see
a
lot
of
my
sketches
here.
I'm
not
part
of
the
team,
I'm
just
maybe
a
heavy
user
of
the
framework.
O
O
So
that's
going
to
be
it
for
the
introduction
and
let's
jump
into
the
live
code.
So,
if
you're
not
familiar
with
rust
I'll
try
to
keep
things
as
simple
as
possible,
but
if
you're
familiar
with
russ,
please
tell
me
where
I'm
wrong,
because
I
will
obviously
make
a
lot
of
mistakes
along
the
way,
so
we're
going
to
use
cargo.
Obviously
the
package
manager
for
rest
and
we're
going
to
ask
cargo
to
create
a
new
binary
application
for
us.
I've
called
it
universe
because
I'm
completely
lacking
any
originality
here.
O
O
You
want
to
use
the
number
version
and
then
you're
good
to
go
so
that's
wonderful,
and
when
you
try
to
run
your
project
using
cargo
cargo
will
fetch
all
the
dependencies,
all
the
libraries
that
you're
using
using
and
compile
everything
for
you
just
a
quick
note
here
on
my
machine.
I've
set
up
a
cache
of
all
the
libraries.
So
that's
why
it's
super
fast.
If
you're
trying
to
do
the
same
on
a
fresh
install,
it
will
take
a
few
minutes
here.
O
So
if
I
just
print,
if
I
just
run
the
basic
hello
world,
it's
not
interesting.
So
I'm
going
to
cheat
here
just
once,
I'm
going
to
take
the
template
application
source
file
that
is
available
from
the
new
framework
and
I'm
going
to
put
this
into
my
main
and
file.
So
let's
look
a
little
bit
about
how
you
would
use
nano
in
an
actual
setting.
O
So
I'm
going
to
try
to
create
something
interesting
within
the
time
frame
that
I
have
so
I
might
go
a
little
bit
fast
on
some
points,
but
I'll
try
to
explain
as
best
as
I
can
how
this
works
so
in
our
main
function
here
we're
going
to
just
create
a
new
application
that
will
start
by
making
model
and
a
model
if,
if
you're
familiar
with
the
model,
view
controller
design
pattern.
This
is
what
nano
has
been
designed
with.
O
So
now
that
I
have
this
in
my
main
file,
if
I
try
to
run
this,
we'll,
hopefully
get
something
that
looks
like
this-
and
this
is
the
beauty
of
using
a
framework
like
nano.
Nano
is
taking
care
of
all
the
heavy
lifting
for
you
in
the
back
end,
it's
using
the
latest
graphics
technology,
so
it's
using
here
metal
via
web
gpu.
So
if
you've
heard
of
web
gpu
you're
in
good
shape,
it's
basically
the
future
of
the
graphics
api,
where
you're
trying
to
use
the
gpu
to
their
fullest
and
you're
not
held
into
the
past.
O
You
also
have
window
management.
You
have
event
handling.
Everything
is
done
for
you
and
the
nice
part
about
nanu
is
that
nanu
is
not
hiding
a
lot
of
stuff
behind
a
complex
structure
that
you're
not
able
to
access
to.
So
if
you
really
want
to
you
can
get
to
the
gritty
inner
working
of
the
framework,
so
we're
gonna
try
to
modify
some
interesting
parts
here.
So
I
have
here
my
background.
Colors,
I'm
gonna
say
it's
black.
O
O
So
this
is
how
you
would
start
working
with
the
framework.
You
would
start
to
use
the
existing
function
and
try
to
work
around
this.
So
let's
do
a
little
bit
more
introduction
stuff.
I'm
gonna
try
to
do
a
circle
of
circles,
so
I'm
using
a
for
loop
here
in
rust.
You
work
with
over
ranges.
So
that's
how
you
define
ranges.
O
I'm
gonna
define
the
angle
as
my
I
value
here
that
I
need
to
recast
as
a
float,
because
it's
not
a
free
operation
to
cast
a
variable
into
a
different
type,
so
I'm
dividing
dividing
it
by
10,
multiplying
it
by
tau.
You
should
never
use
pi
by
the
way
side
note,
and
I'm
just
saying
if
you
remember
your
basic
geometry
classes,
I'm
now
asking
nanu
to
draw
10
circles
that
are
laid
out
over
a
circle
and
we
should
get
something
like
this.
O
O
Of
course
nano
can
give
you
the
time
as
the
amount
of
time
that
has
been
elapsed
from
the
beginning,
but
I
prefer
to
use
actually
the
number
of
frames,
because
when
you
do
heavy
stuff,
it's
easier
when
you
are
just
rendering
frame
by
frame.
I'm
just
going
to
add
the
time
value
to
my
angle
here
and
so
far
so
good.
O
The
compiler
is
agreeing
with
what
I've
been
doing
so
far
and
that's
the
power
of
first,
if
the
compilers,
if
the
compiler
agree
with
you,
then
you're
you're
good
to
go,
you
you're
pretty
much
sure
that
your
code
will
run
very
fine.
So
that's
that's
really
the
basics.
How
do
you
work
with
the
framework?
O
So
in
order
to
do
this,
I'm
going
to
define
a
new
structure,
I'm
going
to
define
something
that
I
will
call
call
sings
because
yeah
it's
going
to
be
interesting
to
just
work
with
things
and
I'm
defining
those
things
are
just
having
a
position
for
them.
So
they
have
a
position.
So
I'm
using
this
vector2.
That
is
a
two-dimensional
vector.
O
O
So
here
in
my
constructor,
I'm
just
declaring
a
new
struct,
defining
its
position
to
be
p
and
in
rust
when
you're
not
using
the
semicolon
at
the
end
of
a
a
logical
line,
then
it
returns
that
so
that's
how
this
function
is
returning,
my
sim.
So
now
I
have
my
structure
here
that
is
defined
and
the
compiler
is
not
complaining.
So
if
I
were
to
run
this,
I
will
get
my
circle
again
and
since
I'm
not
doing
anything
with
my
things
right
now,
this
is
still
the
same.
O
So
we're
I'm
going
to
use
my
model
here
to
store
a
lot
of
those
things.
So
let's
say
that
in
my
model
I
want
to
have
a
dynamic
vector
of
my
thing,
so
that's
how
you
would
define
a
vector
of
type
thing
in
rasp
and
when
I'm
just
initializing
my
model.
I
also
need
to
put
my
things
here
and
I
need
to
define
what
syncs
is
so
I'm
just
just
going
to
say
that
same
is
going
to
be
a
new
empty
vector.
O
O
So
if
I'm
still
not
putting
anything
in
my
vec,
it's
it's
it's
pointless.
So
we're
gonna
try
to
add
one
element
to
our
vector,
so
I'm
gonna
define
a
new
one,
I'm
going
to
try
to
put
it
at
the
center
just
using
the
macros
that
nano
provides.
So
here
I
have
the
vecto
function.
That
just
create
me
creates
a
point
in
space
and
I'm
trying
to
push
that
into
my
list
of
things
and
now,
oh
here
we
have
an
error
and
I'm
going
to
show
it
on
the
left
screen.
O
So
you
can
see
it
better.
This
is
something
that
you
will
encounter
a
lot
when
you're
working
with
rust
in
the
beginning,
rest
is
going
to
make
sure
that
you
are
really
willing
to
do
the
things
you
are
asking
it
to
do,
and
here
I'm
asking
it
to
mutate
the
things
and
when
I'm
declaring
things
here.
I'm
saying
this
is
by
default
an
immutable
variable.
So
rust
is
saying
you're
trying
to
mutate,
something
that
should
not
be
mutated
and
that's
where
the
safety
that
people
associate
with
rust
is
coming
from.
O
The
compiler
will
complain
a
lot
about
what
you're
trying
to
do
and
will
guide
you
to
make
it
safer
in
a
sense.
So,
in
order
to
solve
our
issue
here,
we're
just
going
to
declare
things
as
immutable
and
then
everything
is
fine
and
it
works.
We
can
still
go
on
and
combine
things
so
I'm
going
to
represent
my
model
now.
So
I'm
going
to
get
rid
of
my
for
loop
here,
I'm
not
going
to
draw
this
bunch
of
circle,
I'm
going
to
iterate
over
my
list
of
things.
O
So
I'm
going
to
start
by
asking
an
iterator
over
my
list
of
things
and
I
need
to
rename
the
variable
name,
because
if
you
are
not
using
a
variable
in
rust,
rust
will
will
also
complain
that
you're
not
using
the
variable
and
that's
a
potential
for
errors.
So
if
you
want
to
get
rid
of
this
warning,
you
need
to
use
an
underscore
in
front
of
your
variable
name.
So
that's
why
you
have
here
an
underscore.
So
if
I
erase
this
and
the
compiler
is
happy,
it's
able
to
find
a
scene.
O
O
And
now
I
should
get
if
you've
been
following
along
just
one
point
in
the
middle
of
my
screen
and
that's
fine,
that's
what
we
wanted
and
it's
boring.
Yes,
it
is.
The
whole
thing
starts
by
being
boring
and
then
we
add
more
until
it's
interesting,
so
we're
going
to
add
a
lot
of
those
things.
So
I'm
going
to
try
by
adding
a
constant
here.
O
A
bunch
of
new
things
all
over
this
the
place.
So
if
I
were
to
run
this
right
now,
I
will
have
2
000
sinks
at
the
center
of
my
screen.
So
it's
not
really
interesting.
So
we're
going
to
spray
those
things
evenly
over
the
wall
screen.
So
for
this
we're
going
to
use
the
random
function.
So,
let's
say
random
will
return
me
a
float
between
0
and
1.
So
I'm
going
to
center
this
and
I'm
going
to
multiply
it
by
the
size
of
my
screen.
O
O
You
can
have
multiple
definitions
of
the
same
thing,
but
when
you
need
to
specify
you
need
to
be
really
explicit
about
which
version
you
want
to
use,
because
when
you're
saying
random,
it
doesn't
mean
that
you
want
a
float,
it
could
be
a
bull,
it
could
be
an
integer
could
be
anything
else.
So
you
need
to
use
this
slightly
non-familiar
syntax
for
me
at
beginning
to
ask
for
the
specific
version
of
random
that
you
want.
So
this
is
going
to
ask
for
a
float
that
is
between
0
and
1..
O
So
if
we
run
this,
we
should
be
fine,
because
the
compiler
is
not
complaining,
and
then
we
got
our
bunch
of
points
that
are
shown
all
over
the
place.
Boeing
again
we'll
get
to
the
interesting
part
soon
enough.
So
I
hope
you've
been
so
following
along
so
far,
I'm
just
creating
a
lot
of
things
here
in
my
model
and
in
the
view
function,
I'm
trying
to
display
them.
So
now
we're
going
to
add
movement,
we're
going
to
try
to
work
with
the
animation
parts
of
what
makes
creative
coding
interesting,
especially
for
myself.
O
So
when
we
are
looking
at
our
code
right
now,
you
might
think
that
in
your
loop
here,
you
could
be
able
to
just
do.
Okay,
I
want
to
move
the
position
of
my
things
just
by
a
small
vector
and
but
the
compiler
is
saying
yeah
now
you
can.
You
can
do
this.
This
is
not
how
you're
asking
the
code
to
do.
We
are
asking
to
mutate
our
sin,
we're
asking
it
to
change,
but
we
don't
have
a
mutable
reference.
O
We're
not
allowed
to
mutate
this,
because
when
you
ask
for
an
iterator
you're,
not
asking
for
a
mutable
one,
so
you
would
ask
for
a
mutable
one
by
using
the
item
function,
but
the
problem
is
our
model
right
now,
when
we
look
at
in
the
declaration,
definition
of
the
view
function,
we're
only
having
an
access
to
an
immutable
reference
to
word
view
to
our
model
and
that's
by
design
the
people
behind
anu
are
following
the
model
view
controller
pattern
and
you're
not
allowed
to
mutate
your
model.
In
the
view
function.
O
O
So
it's
going
to
be
cleaner
in
a
way
where
everything
that
is
related
to
modifying
our
model
is
going
to
be
in
the
update
function
and
everything
that
is
about
showing
it
is
going
to
be
in
the
view
function.
So
I'm
going
to
clean
my
view
code
so
that
it's
back
to
showing
the
ellipse
and
in
my
update
function,
I'm
just
going
to
ask
to
mutate
my
things
and
make
make
it
make
them
move
just
slightly
to
the
right
and
then
now
I
have
points
moving
to
the
right.
O
It's
super
boring
again,
but
we'll
get
to
the
interesting
part,
and
I
hope
you
understand
why
rust
is
interesting
to
work
with,
because
it
will
put
a
lot
of
safety
checks
for
you
when
you're
writing
your
code.
So
let's
say
we
do
not
want
to
work
with
this
weird,
slightly
displacement
and
to
the
right.
Let's
say
we
want
to
move
things
randomly.
O
So
I'm
going
to
grab
my
random
code
here
and
I'm
not
gonna
move
by
it
that
much
I'm
just
gonna
move
by
just
a
few
and
just
one
pixel
one
point
wise
per
step.
So
then
you
can
see,
maybe
that
my
points
are
slightly
moving
and
it's
called
pruning
motion.
It's
the
state
of
particles
when
they're
moving
in
liquid,
for
example,
it's
boring
because
it's
lacking
direction,
it's
lacking
scale,
it's
lacking
contrast.
O
O
So
when
we're
talking
about
pure
randomness,
it's
not
really
interesting,
because
randomness
is
boring,
so
we
want
something
that
has
more
meat
than
just
pure
randomness
and
we're
going
to
use
for
this
noise
and
noise.
It's
basically
like
gold
in
form
of
a
mathematical
function.
So
I'm
going
to
define
the
noise
function
here,
I'm
going
to
use
prone
noise-
that
is
that
is
named
after
ken
perlin,
the
professor
at
the
nyu,
and
he
actually
won
an
academy
award
for
his
work
on
this.
O
So
I'm
adding
the
noise
to
my
model
and
since
noise
is
not
by
default,
included
in
the
scope,
I'm
just
putting
everything
that
I
need
in
scope
using
the
use
keyword.
So
now
I
have
noise
and
noise
is
a
mathematical
function
that
will
return
me
a
smooth
random
value
when
I'm
trying
to
ask
for
something.
O
So,
instead
of
moving
my
points
around
randomly
I'm
going
to
move
them
along
the
value
of
this
noise
function,
that
is
there.
So
I'm
going
to
get
my
noise
generator
and
I'm
going
to
ask
for
the
value
of
the
noise
field
at
the
position
of
my
scene.
So
I'm
going
to
ask
to
create
a
new
vector
here
that
takes
the
position
of
my
things
and
since
I
want
a
two-dimensional
displacement,
I'm
going
to
use
three-dimensional
noise.
So
that's
a
trick.
O
You
can
always
get
interesting
results
because
you
have
more
dimensions
to
play
with
the
compiler
is
complaining
again,
because
the
noise
crate
that
nano
is
using
is
expecting
doubles
instead
of
floats.
So
this
is
going
to
be
dirty
so
put
on
me.
Excuse
me
for
doing
this
right
now,
but
for
the
sake
of
time,
I'm
going
to
do
the
dirty
fix
here
by
just
converting
everything
to
doubles
as
we
need
to
and
converting
them
back
to
float
afterwards.
O
So
now
I
should
be
getting
points
that
are
moving
not
completely
randomly,
but
just
along
this
noise
function
that
we
asked
for,
and
it
looks
the
same
so
this
is
a
huge
easy
to
make
a
mistake
in
the
beginning.
It's
because,
when
you're
dealing
with
noise,
noise
is
not
designed
to
work
along
huge
spaces
noise,
we're
designed
to
work
along
very
small
spaces.
So
here
when
we're
talking
about
the
range
of
positions
that
we're
looking
at
so
sure
is
going
over
the
wall
screen.
O
O
If
I'm
not
on
the
first
frame
of
my
animation,
that
is,
if
I'm
not
starting
fresh,
I
will
not
erase
the
background
before
drawing
the
following
frame.
So
this
might
sound
complicated,
but
it's
really
easy,
I'm
just
just
drawing
over
the
previous
drawing
all
the
time.
So
suddenly
we
see
those
lines
that
are
moving
around
and
we
see
history,
we
see
the
past.
So
we
get
a
feel
about
the
what
was
happening
before
and
it
starts
to
look
interesting
as
an
image
by
itself,
but
the
animation
part
is
is
lost.
O
So
in
nanu
you
would
use
something
like
this
to
define
a
black
rectangle.
That
is,
if
you're,
following
along
I'm
using
a
very
transparent
black-
and
this
looks
like
this
now
so
I
am
drawing
over
my
animation
with
something
that
is
almost
black
all
the
time.
So
I
get
this
fade
to
black
effects
for
free.
O
Basically-
and
this
is
where
nanu
shines,
because
nanu
is
using
float
precision
for
colors,
but
not
for
the
wall,
color
itself
for
every
channel
for
each
channel
of
a
color
information,
you
have
a
floating
point
precision
all
the
other
frameworks
that
I
know
of
are
not
able
to
do
something
as
pure
as
this.
So
yeah
go
go
go
here
so
now
you
can
see
that
the
interesting
part
of
this
is
the
beginning.
O
I
hope
it's
not
that
choppy
on
your
on
your
side,
but
it's
really
showing
the
beginning
is
where
we
see
the
noise
and
getting
here
in,
and
that's
the
interesting
part,
so
we're
going
to
try
to
do
this
in
the
remaining
minutes
that
I
have
I'm
going
to
try
to
show
the
lines
and
not
just
the
actual
position.
So
I'm
going
to
change
my
things
here
to
not
be
just
one
point
going
to
be
a
list
of
points,
so
I'm
going
to
create
a
list
of
points
here
that
is
going
to
be
empty.
O
O
So
I'm
going
to
take
the
last
position,
it's
going
to
be
the
same
position
and
I'm
going
to
use
the
head
of
my
list
for
this
and
I'm
going
to
say
that
the
new
position
is
going
to
be
the
last
position,
plus
the
same
displacement
that
we're
using
and,
of
course
I
need
now
to
refer
to
this
last
position
and
not
the
position
of
my
thing,
and
I
also
need
to
push
back
my
new
position.
So
I'm
going
to
insert
it
at
the
end
of
my
list-
something
like
this.
O
So
what
I'm
doing
right
now
is
I'm
just
adding
this
new
position
to
the
list.
So
the
same
will
hold
the
gr
ever
growing
list
of
position.
So
I'm
going
to
represent
this
using
the
polyline
function
of
nano
that
is
designed
to
do
exactly
this.
So
it's
going
to
take
a
list
of
points
and
it's
going
to
show
it
to
you
so
excuse
my
pretty
fast
explanation
of
what
poly9
is
doing.
O
Poly9
wants
to
hold
the
positions,
so
you
cannot
actually
give
the
positions
and
of
the
things
directly
to
the
point,
because
rust
will
say:
no,
no,
you
cannot
move
things
around.
So
I'm
cloning,
the
all
the
information
here
and
then,
if
I
try
to
render
this,
we
see
a
bunch
of
lines
that
are
being
drawn
on
the
screen
and
if
I
don't
stop
here,
you
might
guess
that
this
will
crash
eventually
because
I'm
just
adding
more
and
more
points
all
along
the
way.
O
But
this
is
interesting
because
we
see
the
structure
of
the
noise.
We
see
some
things
that
are
interesting.
We
start
to
see
where
the
noise
is
driving
our
points
around
and
it
gives
you
a
feel
about
the
structure
of
what
we're
using.
We
have
interest
points
and
everything,
so
I'm
gonna
do
one
final
trick
just
to
spice
things
up
and
I'm
gonna
speed.
Basically,
the
drawing
here
you
can
see
in
our
update
function
we're
just
going
one
step
forward.
O
I'm
gonna
say
screw
this:
let's
go
for
50
steps,
I'm
gonna
say
I
want
you
to
go
50
steps
forward
and
we're
going
to
draw
this
all
the
time
and
I'm
also
going
to
reset
my
thing
every
time
I'm
going
into
a
new
frame.
So
in
order
to
do
this,
I'm
going
to
clear
my
positions
list
and
I'm
going
to
add
a
new
position
at
random.
So
I'm
going
to
define
a
new
vector
and
I'm
going
to
use
the
same
code
that
I
was
using
to
create
the
things
in
the
first
place.
O
O
Suddenly
it's
going
to
be
completely
different.
We
have
a
grayscale
representation
of
our
noise
field
right
now
and
if
you
have
the
time
the
code
is
going
to
be
available,
of
course,
on
github,
please
try
to
execute
the
code
on
your
machine,
so
you
can
see
the
animation
in
its
complete
glory,
and
this
is
this
is
what
you
can
get
when
you're
trying
to
represent
something
as
complex
as
just
one
mathematical
field
along
the
way.
O
I'm
going
to
add
a
final
trick
just
to
convey
the
point
that,
when
you're
working
with
creative
coding
or
something
like
this
you're
allowed
to
do
a
lot
of
weird
stuff,
that
might
not
make
a
lot
of
sense.
So
let's
say
I'm
gonna
change
my
parameter
here.
My
scale
parameter
here,
so
I'm
just
going
to
add
the
time
I'm
going
to
take
the
cost
of
the
time
I
need
to
use
doubles
because,
because
rest.
O
B
B
B
B
B
B
B
B
B
B
B
B
B
B
B
B
B
B
B
P
Hi
there
I'm
jaral
savaitis
a
game
developer
and
technical
artist
from
athens,
greece.
I
am
here
to
give
you
a
gentle
introduction
into
the
magical
world
of
seder
coding,
and
I
hope
that
in
the
next
10
minutes
I
will
be
able
to
demystify
some
of
the
black
magic
that
surrounds
the
concept
of
sailors.
P
Let's
start
with
the
very
basics.
What
are
shaders
shaders
are
small
programs
that
define
how
objects
are
shaded
and
rendered
on
the
screen.
They
run
directly
on
the
gpu,
because
it's
way
faster
for
them
to
do
so.
There
are
different
type
of
shaders
like
vertex,
shaders
fragment
or
pixel
shaders
and
geometry
shaders.
P
P
P
P
P
P
Let's
now
see
how
we
can
use
our
coordinates
to
make
the
simplest
shape.
We
can
a
circle.
A
circle
in
shaders
can
be
drawn
by
measuring
the
distance
of
any
point
from
the
center
of
the
circle.
Using
our
uv
coordinates.
We
can
express
that
as
the
length
of
the
vector
which
goes
from
the
center
to
our
current
uv,
coordinate,
assuming
the
center
of
the
circle
is
also
the
center
of
our
uvs.
We
can
write
that,
like
so.
P
P
P
P
This
is
what
we
want.
Let's
now
see
how
else
we
can
use
math
to
get
some
interesting,
shapes
and
forms
we'll
come
back
to
the
cycle
later,
we'll
be
using
a
very
well
known,
math
concept,
the
sine
wave.
We
can
pass
the
uv
dot
x,
the
sine
wave
and
multiply
it
by
some
number
say:
5
to
increase
the
wave's
frequency.
P
P
P
P
P
If
the
third
parameter
is
smaller
than
the
first
smooth
step
returns
zero
if
the
third
parameter
is
greater
than
the
second
one,
it
returns
one
if
it's
between
the
first
and
second
parameters,
smooth
steps
smoothly
interpolates
between
zero
and
one
based
on
where
the
third
parameter
is
placed
between
the
other
two.
Let's
see
it
in
action.
P
P
Mix
or
lerp
on
other
environments
takes
three
parameters
and
returns
the
value
of
the
first.
If
the
third
parameter
is
zero,
the
value
of
the
second,
because
the
parameter
is
one
and
it
linearly
interpolates
between
the
values
of
the
first
and
second
parameters
based
on
where
the
third
parameter
is
between
zero
and
one
mix
can
also
be
written.
Like
so.
P
Q
For
those
of
you
who
don't
know
what
3js
is
3js
is
a
3d
javascript
framework
that
works
with
webgl
and
lets.
You
do
amazing
things
thanks
in
3d,
also
2d
you
can
make
or
take
advantage
of
the
gpu
to
whatever
your
needs
are
and
well
that's
pretty
powerful
by
itself.
Okay,
yeah!
Let's
do
this
so
I'll
skip
a
bit
of
boilerplate
for
time's
sake
and
well.
The
premise
is
quite
simple:
we
have
a
3d
object
and
we
want
to
paste
on
top
of
the
surface
some
kind
of
texture
that
has
text.
Q
There
are
also
several
ways
to
do
it,
but
I
found
the
most
simple
one
just
to
use
a
texture.
In
this
case
it
has
the
word
universe
and
well
sample
it
in
the
on
the
texture.
So
for
that
first,
we'll
need
to
load.
The
texture
here
comes
texture
equals
new.
We
that
texture
loader,
that
load
image
and
in
this
case,
I'm
going
to
pass
a
callback
function
just
to
fix
some
weird
line.
Artifact
that
happens
in
this.
In
this
case,
it
says
texture
that
mint
filter.
Q
Okay,
and
instead
of
using
a
mesh
normal
material,
we
have
to
use
a
shader
material
to
move
things
yeah
to
modify
the
shape
of
the
torus
geometry.
Did
I
mention
that
this
is
a
torque
geometry
or
a
doughnut,
and
and
also
change
its
colors,
so
for
that
we
use
a
shader
material
and
pass
a
vertex
shader,
a
fragment,
shader
and
some
uniforms
where
we'll
define
time.
Q
View
texture
all
right,
also,
let's
enable
the
transparent
flag
because
we're
using
a
png
and
we
want
to
make
things
transparent
and
yeah
for
now.
Let's
use
3d
double
side,
so
it
also
renders
the
inside
of
the
donut
before
jumping
to
the
shaders.
Let's
update
the
time
uniform,
perform.u
time
value
equals
the
boiling
plate
already
has
a
clock
variable,
so
we
can
get
the
time.
K
Q
So
a
shader
is
a
program
that
runs
in
the
gpu
like
blazingly
fast,
and
we
have
two
types
of
shader
we're
interested
for
this.
We
have
a
vertex
shader
that
runs
for
every
vertex
of
a
object
and
the
fragment
shader
that
runs
for
every
pixel.
First,
let's
jump
to
the
fragment
shader.
So
we
can
sample
the
texture
on
the
surface.
Q
Q
Let's
use
a
variable
instead
call
back
two
repeat:
that's
vector
two
and
let's
do
something
crazy,
like
six:
six
on
the
y,
I'm
sorry
x
axis
and
12
from
the
y
axis
so
heat,
and
we
should
see
a
lot
of
text.
Oh
yeah,
it's
time
to
get
better
now,
oh
nice!
Now,
let's
add
time
to
it,
and
for
that
we
do
back
to.
I
think
it'll
it'll
look
better
if
we
move
it
like
like
this,
and
for
that
like
this,
and
for
that
we
need
to
pass
time
to
the
y
component.
K
Q
Q
Q
Q
So
for
that,
let's
do
this.
Let's
call
this
variable
transformed
that
is
equal
to
the
position
and,
let's
use
transform
here,
which
should
affect
nothing
for
now,
but
when
we
do
this
transform
plus
equals
sine
of
position
that
well
transform.
This
z
component
is
plus
equals
the
x
for
now
plus
time
what
you
time
yeah!
R
Q
Q
Yeah,
I
think
yeah
it's
looking
good
now
in
my
opinion,
so
so
yeah.
I
think
this
is
it
for
now.
You
can
imagine
that
you
you
can
even
just
using
one
texture,
can
get
you
like
pretty
far
in
terms
of
visual
or
aesthetics.
Imagine
if
you
could
like
replicate
this
instead
of
using
a
taurus,
you
could
use
a
sphere
geometry,
a
cone
box
geometry
and
and
having
like
thousands
of
box
of
geometries
or
instancing
them
could
get
you
like
a
pretty
interesting
result
and
well.
This
is
just
like
a
overview.
Q
Q
S
Hi,
I'm
kate
compton,
I'm
better
known
on
the
internet
as
galaxy
kade,
and
today
I'm
going
to
be
showing
you
a
tool
that
I
made
called
tracery
and
a
website
called
artbot
club,
artbot.club
and
I'll
be
showing
you
how
to
make
a
twitter
bot
in
just
10
minutes.
A
lot
of
people
think
that
making
a
twitter
bot
or
making
a
conversational
agent
needs
to
be
this
whole
big
production,
using
machine
learning
and
advanced
techniques.
S
So
it
takes
as
input
what's
called
a
grammar
which
is
just
a
way
of
specifying
symbols
which
are
kind
of
buckets
of
things
and
replacement
rules,
so
you
can
always
replace
the
bucket
with
a
bunch
of
the
different
replacement
rules.
So
you
can
see
right
here.
I've
just
got
one
symbol.
This
is
called
origin.
This
is
where
all
the
grammars
and
tracery
start
off,
and
it's
just
hello
world.
It's
not
terribly
exciting.
S
So
you
can
see.
I've
got
five
different
variants
of
hello
world
there,
but
they're
all
the
same,
because
we
don't
have
any
variants
yet.
So
I
can
create
a
symbol,
so
I
can
make
a
symbol
for
world
and
I
make
I
can
make
some
options
for
that,
so
maybe
github
and
world
and
where
I
am
right
now,
chicago.
S
And
how
do
I
use
this
symbol,
so
I
can
use
the
symbol
by
making
a
hashtag,
so
you
just
say
hashtag
world,
and
then
you
close
it
with
another
hashtag.
Now
you
can
see,
I've
got
hello,
world,
hello,
chicago,
etc.
These
are
all
randomly
rolled,
so
I
have
to
re-roll
them
to
see
if
I
can
have
some
variants.
So,
oh
there
we
go,
there's
the
github
one.
S
S
So
this
is
not
terribly
exciting,
but
I
might
want
to
say,
switch
out
hello.
So
what?
If
we
had
another
symbol
for
hello,
so
I
can
replace
hello
with
hello
in
hashtags,
and
you
can
see
that,
even
though
I
haven't
specified
that
symbol,
yet
tracer
is
still
okay
with
this.
It
knows
that,
like
sometimes
you
make
a
bot-
and
you
haven't
actually
finished
all
the
stuff
in
your
bot
before
you
need
to
use
it.
S
S
Hello
and
so
now
I've
got
ola
chicago,
etc.
There's
another
neat
feature
in
tracery,
which
is
you
can
have
modifiers,
so
you
might
want
to
have
hello,
but
I'd
like
to
capitalize.
Whatever
comes
back,
so
you
can
imagine
well,
okay,
maybe
I
can
just
do
that
here
and
I
can
capitalize
hey.
Maybe
sometimes
I
want
to
use
this
capitalize,
and
sometimes
I
want
to
use
uncapitalized
and
so
tracer.
S
Has
this
neat
feature
where
you
can
just
do
dot
capitalize,
so
there's
a
number
of
modifiers
like
dot,
capitalize
and
dot
s
to
pluralize
things
and
I'm
trying
to
add
in
some
new
ones
that
are
useful,
and
so
you
can
see
now.
I
have
got
hey
me
how
etc,
but
today
I
wanted
to
show
you
making
a
quick
bot
that
I'm
going
to
call
t
and
a
compliment.
So
it's
rough
times
right
now.
S
S
S
S
All
right,
so
you
know
now
I've
got
like
my
my
cup
of
tea
and
now
I
might
want
to
have
another
one
that
says:
here's
my
so
this
is
just
giving
us
some
practice
here.
So
you
know
what
is
like.
Oh
and
actually
the
thing
that
I
want
to
do
with
this
tea
is
you
can
see
it's
a
little
ungrammatical.
I
want
to
have
a
cup
of
tea,
oh
and
maybe
I'll
say
an
ounce
of
coffee
or
not
so
espresso,
that's
better,
I'm
pressured
so.
I've
got
some.
Maybe
I'll
just
have
an
espresso.
S
I
just
need
to
start
with
the
this,
because
you
could
say
see
that
if
I
said
okay
here
is
a
t,
espresso
is
ungrammatical,
and
so
we
go
back
to
our
modifiers,
and
so
we
say
t
dot
a
and
now
it
like
correctly
puts
a
or
n
in
front
of
things.
So
that's
a
neat
feature
so
yeah
we're
going
to
make
our
quick
complement.
S
S
S
S
Maybe
rich
flavor
yeah.
So
now
I
have
valid
eyes
thoughtful
ideas.
Let's
see
yeah
and
you
have
rich
cinnamon
emotions,
so
this
is
very
complementary.
So
I
like
this
bottle
a
lot
already
I'll
show
you
very
quickly
just
one
other
thing
which
is
you
can
save
things
so
you
might
want
to
save
something
to
use
later
on.
S
S
S
So
you
can
see
that
this
allows
you
to
reuse
things
multiple
times,
which
is
something
you
might
want
to
do
in
bots
all
right,
so
this
bot
is
looking
pretty
great.
If
you
want
to
explore
around
some
more
on
artbot.club,
you
can
also
unpack
things,
so
this
allows
you
to
kind
of
visualize
what's
going
on
here.
S
You
also
have
this
section
over
here,
which
shows
you
how
your
symbols
and
rules
are
being
parsed.
So
I
can
look
at
origin,
but
I
can
also
look
at
maybe
here's
the
complement
you
can
see
that
it's
got
all
these
different.
It
shows
that
I've
got
my
symbol
rules
here.
It
shows
me
that
my
noun
is
something
that
it
doesn't
know
about.
So
that's
just
some
more
options
on
this
artbot
club
site,
but
now
I
think
we
should
actually
put
this
bot
on
twitter.
Why
don't
we
all
right?
S
So
I'm
going
to
head
over
to
twitter
in
just
a
moment:
okay,
the
next
thing
that
we're
going
to
do
is
to
create
a
twitter
account
to
host
our
bot
on.
So
we
need
a
place
that
our
bot
can
post.
I've
already
made
one
called
complimentt
and
twitter,
so
twitter
requires
you
to
make
a
new
email
account
for
each
bot
that
you
make,
which
is
kind
of
annoying.
I
use
the
plus
trick
in
gmail
to
help
me
out
there.
S
Then
I
create
the
account
I
go
to
cheatpostdonequik
and
I
have
to
allow
access
and
that
will
allow
me
to
post
from
that
account.
Okay,
we're
at
the
final
stage
of
our
bot
making
process.
I've
come
to
cheat
box
done
click
here
and
I
can
go
back
to
artbot.club
copy.
My
grammar
from
there
go
over
to
cheap
boston,
quick
and
paste
it
in
you
can
see.
Now.
I've
got
some
example
tweets
down
there.
S
I
can
choose
one
and
tweet
that,
and
hopefully,
if
I
reload
yep,
we
can
see
that
it's
tweeted
here
and
I
can
set
how
often
I
want
it
to
post
a
tweet
as
I
can
have
it
post.
Every
10
minutes
to
once
a
year
and
then
there's
also
a
neat
feature
where
you
can
say
reply.
So
if
people
tweet
at
this
bot,
it
will
say
hello
and
give
them
a
tea
and
a
compliment.
Custom
made
just
for
them.
So
that's
it.
You've
made
a
twitter
bot
in
just
10
minutes.
S
T
Hola
welcome
to
abstract
sketches
with
p5es.
My
name
is
elitia
and
I'm
a
digital
artist,
creative
developer
and
designer.
Today,
I'm
going
to
help
you
get
started
with
the
p5.js
library
as
we
make
an
interactive,
minimal,
astra
sketch
of
a
github
universe.
Let's
get
started
when
I
make
digital
art
an
idea
not
always
falls
from
the
sky.
Oftentimes
person
for
inspiration
is
always
a
big
help.
I
wanted
us
to
create
a
sketch
inspired
by
origami
art
and
stop-motion
animation,
which
is
one
of
my
favorite
things
to
do
with
p5s.
T
T
Then
we
have
an
image
with
origami
figures
for
the
ones
who
don't
know
what
origami
is
it's
the
art
of
paper
folding,
as
you
can
see
here
and
lastly,
we
have
a
stop-motion
animation
example,
where
we
see
objects
moving
in
small
increments
and
being
captured
one
frame
at
a
time
we'll
do
something
similar
when
we
animate
our
sketch.
Let's
put
our
inspiration
all
together
and
start
sketching.
We
have
a
short
amount
of
time
for
this
little
tool,
so
I'm
not
gonna
go
into
that
with
the
code
today.
T
So
if
you're
here
and
are
new
to
javascript
or
never
used
it
before,
don't
worry
I'll
be
sharing
the
resources
of
the
short
tutorial
at
the
end.
So
you
can
work
on
your
sketch
at
your
own
pace.
Grab
your
favorite
code,
editor
on
your
computer
or
online
code
editor
and
let's
start
setting
up
our
project,
go
to
p5js.org
and
click
on
the
link,
get
started
scroll
down
until
you
find
the
downloading
a
copy
of
the
p5.js
library
or
using
a
hosted
version.
T
If
you're
working
locally,
you
can
go
either
way
if
you're
using
an
online
code.
Editor.
Probably
the
best
way,
is
to
use
the
link
of
the
cdn
of
the
library
I'm
using
codepen,
which
is
an
online
code
editor.
So
I'm
going
the
cdn
way
and
make
sure
to
link
the
library
within
a
script
tag
inside
the
body
tag
at
the
bottom
of
the
body
in
your
html.
T
If
you
are
relatively
new
and
don't
know
about
editors
or
online
code
editors,
you
can
use
one
from
p5.js.
So
if
you
go
to
the
home
page
click
here
on
editor,
and
then
you
will
find
this.
Let's
start
coding.
I've
added
some
basic
css
for
us,
because
that's
going
to
help
us
so
that
the
canvas
that
is
going
to
be
rendered
via
p5.js
to
create
our
sketch
doesn't
have
any
weird
margins
or
patterns
overflowing
and
also
I've
added
my
favorite
color.
T
As
a
fallback
in
our
javascript
file,
I've
commented
the
plans
for
sketch
today
we're
going
to
start
by
defining
some
global
variables.
Then
we're
going
to
make
a
custom
mold
for
a
space
plan
because
in
our
gig
hub
universe,
anything
is
possible
and
I
wanted
us
to
have
some
space
plants
we're
going
to
have
more
than
one
so
that
it's
going
to
be
very
useful.
Then
we're
going
to
draw
our
github
universe
with
those
plants
and
we're
going
to
have
a
moon
afterwards.
T
We
will
make
our
little
sketch
interactive
by
adding
some
stars
and
galaxies
on
mouse
over
and
we
will
animate
such
universe
and
have
the
possibility
to
stop
and
play
such
animation
with
a
canvas,
click
or
mobile
touch.
Let's
first
declare
global
variables:
we're
going
to
need
a
background,
color
a
shape,
color
and
a
stroke
color.
As
you
can
see,
you
can
declare
the
colors
be
a
hex
value
or
color
name
or
even
rgb.
Please
feel
free
to
use
any
colors
as
you
like
and
change
this.
T
If
you
want
now
we're
going
to
need
as
well
as
shapes
as
variable,
this
is
going
to
be
useful
because
once
we
start
drawing
our
sketch
and
we
want
to
make
the
elements
a
bit
smaller
or
bigger,
we
can
always
come
up
to
this
variable
and
resize
everything.
Another
two
valuable
variables
that
are
going
to
serve
us
are
these
ones
that
I
created
and
call
them
shapecap
x
and
check
back
up
y.
These
two
variables
are
going
to
help
us
to
achieve
the
origami
effect
of
paper
folding.
T
T
T
We
are
going
to
add
this
function,
just
to
make
sure
that
once
we
have
our
sketch
here,
we
will
be
able
to
resize
everything
and
everything
is
going
to
be
resized
automatically.
For
us.
We're
going
to
create
now
or
customer
for
space
plans
we're
going
to
do
that
via
javascript
classes.
If
you
don't
know
what
javascript
classes
are,
I
recommend
visiting
the
mdn
web
docs
to
learn
how
classes
in
javascript
work
our
javascript
class
is
going
to
be
called
plant.
As
you
can
see,
your
class
is
broken
into
three
sections.
T
The
constructor
method
is
going
to
allow
us
to
customize
each
plant
by
choosing
a
leaf
size,
a
leaf
count.
How
many
leaves
do
we
want
that?
Our
plant
has
and
a
position
on
the
x
axis.
Then
we
have
two
functions
that
I
created
for
us
one.
I
call
it
spot
because
it's
going
to
help
us
to
find
a
spot
for
a
plan
on
the
ground
on
the
x-axis
and
the
second
function
that
I
created
for
us
is
the
one
that
is
going
to
create
our
plan.
T
There
are
four
functions
in
our
class
that
we
didn't
create
that
come
from
p5.js.
The
first
one
is
the
translating
function.
This
one
is
allowing
us
to
move
an
element
in
the
x
and
y
axis
and
we're
not
using
the
third
value
set
because
we
are
not
drawing
in
3d,
but
in
2d
the
other
one
is
the
triangle
function.
This
is
allowing
us
to
draw
a
triangle
via
the
canvas
happy
by
entering
the
parameters
of
the
size
of
the
triangle.
T
I
already
did
the
math
for
us
and,
as
you
can
see,
I
drew
two
triangles
because
each
plant
is
going
to
have
two
leaves
and
it's
going
to
expand
vertically
to
choose
the
size
of
the
plant
depending
on
the
leaf
count.
The
other
two
functions
from
p5.js
that
I'm
using
is
push
and
pop
and
we're
going
to
need
those,
and
I
will
explain
that
later,
let's
draw
our
first
plan
into
our
sketch
by
using
the
function
draw
from
p5.js.
T
As
you
can
see,
it's
going
crazy
because
the
function
draw
is
iterating
several
times
and
in
order
to
have
only
one
plant
we
can
add
a
background
color
and
then
each
iteration
is
not
only
going
to
draw
the
plant.
But
it's
also
going
to
draw
the
background
and
it's
going
a
little
bit
too
fast
to
my
taste,
so
we're
going
to
go
back
to
the
setup
and
tweak
the
frame
rate.
Normally
this
the
default
frame
rate
from
p5.js
is
30,
so
we
lower
it
to
four,
and
now
we
have
this
top
motion.
Animation
effect.
T
I
talked
about
in
our
mood
board.
Also,
you
can
already
see
that
our
plan
has
this
folding
paper
effect.
Looking
like
origami,
and
it's
in
here
where
you
can
customize,
for
example.
Maybe
you
actually
don't
want
to
have
any
color
in
your
plan?
Maybe
you
only
want
the
wireframe
so
then
there's
this
function
from
p5.js
called
no
fill.
T
Maybe
you
want
to
use
another
fill
color
the
default.
One
is
white.
I
also
had
white,
but
maybe
you
had
green,
and
this
is
where
you
can
change
it.
For
example,
if
I
were
to
change
this,
to,
I
don't
know
eight
nine
seven
another
hex
value
here,
you
will
see
that
it's
gonna
change
to
this
color
greenish
that
I
was
talking
about
and
now
also
you
can
decide.
T
If,
maybe
you
don't
want
a
stroke,
for
example,
and
you
maybe
you
want
to
only
have
your
plans
feeling
but
without
stroke
and
the
stroke
color
can
also
be
customized
is
the
same.
The
default
is
black,
but
if
you
wanted
it
to,
for
example,
make
it
blue,
you
could
totally
change
the
variable,
and
now
we
have
a
different
stroke.
T
So
just
come
back
to
your
variables
and
change
and
adapt
as
you
wish,
and
also
the
stroke
white
you
can
choose
if
you
want
thicker
or
if
you
want
the
default,
which
is
one,
let's
add
more
space
plans
into
our
little
universe.
I
already
move
everything
to
a
function
expression
here
in
our
javascript
and
it's
very
easy
to
create
our
plants.
T
You
can
see
that
you
can
choose
how
tall
you
want
your
plants
to
be
and
how
wide
the
leaves
or
how
thin.
I
also
wanted
us
to
have
a
moon
in
our
universe.
So
we
do
that
via
the
circle
function
from
p5.js,
and
I
created
eight
circles
to
represent
the
real
eight
moon
faces
via
the
slope
motion
animation
that
we
have
going
on
in
here.
I
wanted
to
show
you
real
quick.
What
push
and
pop
does.
Let's
comment
that
out
and
see
what
happens
with
this
triangle
that
we
were
translating.
T
We
see
the
translation
happening
differently,
because
the
translation
is
taking
place
after
the
other
translation
that
we
have
previously
done
push
function,
saves
the
current
drawing
style,
settings
and
transformation,
while
pop
restarts
the
setting.
So
I
wanted
to
have
this
translation
on
the
second
triangle,
independent
from
the
other
translation.
This
is
the
reason
why
I'm
using
it
often
when
I
don't
want
the
translation
to
be
dependent
of
the
previous
one.
T
Lastly,
let's
add
some
stars
and
galaxies
on
mouse
over
to
our
sketch:
let's
make
it
interactive
with
the
function
mouse
move
from
p5.js,
I
decided
that
or
stars
or
galaxies
shouldn't
have
a
stroke,
and
I
created
them
with
a
circle.
I
decided
that
each
circle
should
be
drawn
by
following
the
mouse
in
the
x
and
y
axis
and,
as
you
can
see,
the
stars
are
randomly
different
sizes.
T
I'm
using
the
random
function
from
p5.js,
which
takes
one
value,
which
is
the
choices
or
you
can
set
up
a
minimum
and
maximum
value,
as
you
probably
already
noticed-
and
I
forgot
to
tell
you-
is
that
we
were
using
already
the
random
function
on
the
moon
and
also
when
we
created
our
plan,
as
we
were,
translating
the
x
axis
randomly
from
one
value
to
another
in
order
to
create
or
stop
motion
animation
effect.
We
implemented
a
way
to
draw
our
stars
and
galaxies
on
mouse
over,
but
we
see
them
disappearing.
T
Every
time
we
move
the
mouse.
This
happens
because
the
function
draft
from
p5.js
resets
the
function
mouse
move
every
time
it's
drawing
again
or
sketch.
We
need
to
find
a
way
to
stop
the
drawing
function
from
p5.js
to
continue
so
that
we
can
draw
our
actual
stars
and
galaxies
in
order
to
do
that,
we
can
use
the
mouse
press
and
touch
start
functions
from
p5.js.
T
T
This
is
going
to
allow
us
to
stop
our
animation
and
draw
our
stars
or
reset
the
stars
that
we
draw
and
look
back
to
our
animation,
we're
using
two
functions
from
p5s
to
achieve
that,
one
is
called
no
loop,
which
is
actually
stopping
the
drawing
function
from
p5.js
and
when
we
want
to
redraw,
we
call
the
loop
function
from
p5.
Yes,
now
let
me
show
you
the
final
sketch,
where
I
drew
my
stars
and
abstract
galaxy
going
on
in
here.
As
you
can
see,
you
can
go
crazy
and
add
as
many
stars
as
you
want.
T
Maybe
you
want
to
have
more
plants
too
at
the
bottom
have
a
full
bush,
or
maybe
you
want
actually
less
plants
like
only
two.
Maybe
you
want
to
have
two
or
three
moon
faces
happening
in
your
little
github
universe.
Really,
anything
is
possible
and
you
can
do
as
you
want
feel
free
to
share
your
work
with
us.
If
you
want
on
twitter
and
instagram
by
using
the
hashtag
github
universe-
and
you
can
tag
me-
I'm
elitia
underscore
net
I'll
be
happy
to
see
what
you
came
up
with
in
this
little
tutorial.
T
I'm
also
sharing
with
you
the
link
to
the
resources
of
this
tutorial,
which
is
a
github
repository
where
you
will
find
everything
that
we
did
today,
so
that
you
can
practice
after
this
tutorial
at
your
own
pace
and
create
your
own
after
sketches.
Thanks
for
being
here,
and
I
hope
that
you
learned
something
new
today.
A
A
A
A
One
thing
to
understand
about
the
api:
is
it
works
around
the
concept
of
nodes?
Each
bit
of
functionality
is
a
node.
There
are
input,
nodes,
ways
of
loading
or
creating
sounds.
There
are
modification
nodes
these
make
up
quite
a
bit
of
what
you
can
do.
You
can
adjust
volume,
apply
filters,
add
echo
or
spatialization
you
can
even
analyze
the
sound.
A
A
A
A
A
A
A
This
method
is
good
for
things.
Like
white
noise,
you
can
fill
a
buffer
with
random
numbers,
I'm
going
to
create
an
oscillator
as
my
input
node,
which
plays
a
clean,
sound
wave
like
a
sine
wave,
a
square
wave,
a
triangle
wave
or
a
sawtooth
wave.
The
difference
between
these
types
of
waves
is
the
shape
of
the
actual
wave,
and
we
tend
to
have
these
shapes
by
default
with
electronic
oscillators
is
they
are
easy
to
generate
electronically?
A
We
want
to
start
and
stop
the
oscillator
for
which
the
oscillator
gives
us
methods,
so
we
do
oscillator
start
and
oscillator
stop
we'll
add
a
parameter
for
when
we
want
to
stop
the
oscillator
it
takes
in
the
time
it
wants
to
stop.
In
our
case,
I'm
going
to
be
one
second
from
when
we
start
it
to
do
this,
I'm
going
to
use
the
audio
context,
dot
current
time
property,
which
returns
the
time
in
seconds
since
the
audio
context
was
instantiated.
A
A
A
I
also
want
to
make
the
frequency
higher,
as
it
gets
played
so
over
the
seconds
that
we're
actually
playing
this
oscillator.
We
can
do
this
with
a
method
called
exponential
ramp
to
value
at
time.
All
that
really
does
is
a
bit
of
a
mouthful.
Is
it
moves
the
value
which
you're
specifying
over
a
specific
amount
of
time,
but
adds
a
nice
curve
rather
than
just
linearly.
A
A
A
A
A
R
Welcome
to
this
10
minute
run
through
of
modv.
What
is
mod
v
well.
Mod
v
is
a
free
and
open
source
piece
of
software,
which
allows
you
to
pipe
in
audio
and
generate
audio
reactive
visuals,
which
are
great
for
live,
shows
such
as
av
shows
and
gigs.
Anything
with
a
projection
behind
it,
which
needs
to
be
synced
to
audio
really
moderate,
is
built
on
web
technologies,
and
I've
been
working
on
it
for
around
six
years
now
we
have
two
main
contributors
who
are
myself
and
tim
pietrowski.
R
R
R
R
And
click
enable
you'll
see
in
the
preview
window
that
the
module
is
drawing
over
itself
each
frame.
We
can
stop
this
behavior
by
unchecking,
inherit
and
checking
clearing.
This
will
clear.
The
canvas
at
every
frame
modules
can
be
mixed
and
matched
as
you
like,
so
we
can
drag
and
drop
and
just
click
enable,
and
now
we
have
another
module
drawing
to
the
screen.
R
R
So,
let's
drag
and
drop
scale
and
we'll
put
it
before
concentrix
click
enable
and
you'll
see
that
nothing
much
happens
yet.
But
if
we
uncheck
clearing
now
we
have
this
infinite
drawing
to
the
screen
and
every
time
the
frame
draws,
it
will
draw
the
previous
frame
a
little
bigger.
So
you
get
this
tunnel
effect,
which
is
quite
nice.
R
We
can
extend
this
even
further
by
finding
a
block,
color
dragging
and
dropping
this
clicking
enable
and
we'll
turn
the
alpha
up
slightly
and
now
every
frame
that's
drawn
to
the
screen
will
be
drawn
slightly
darker,
so
we
get
this.
Nice
fade
to
black
you'll
notice
that
in
the
input
configuration
panel,
each
property
that
we
click
can
be
configured
so
let's
go
to
scale
and
select
scale
and
in
the
audio
drop-down
we'll
select
energy.
R
Now
this
looks
like
it
maybe
hasn't
done
much,
but
if
we
slightly
restrict
the
maximum
value
of
energy,
we
can
see
now
that
every
time
I
speak
and
let's
just
turn
down
the
circle
spacing
slightly.
So
this
is
a
little
more
obvious
that
the
scale
is
being
affected
by
how
much
my
voice
is
making
zones.
R
Sorry
but
yeah,
so
we've
now
assigned
an
audio
feature
of
the
incoming
audio
to
a
modules.
Property
media
is
the
audio
analysis,
library
that
we
use
underneath
modvey.
It
allows
us
to
select
certain
features
of
incoming
audio,
rather
than
just
using
the
standard
f
of
t
values
which
I've
found
produces
a
much
more
punchier
result
than
just
sticking
to
standard
fft
values
we're
looking
to
bring
fft
into
mod
v
at
some
point.
But
for
now
we
only
support
mater's
audio
features
which
work
surprisingly.
R
Blend
modes
can
also
be
set
for
modules
and
groups,
just
like
you
would
in
photoshop,
and
let's
look
at
that
here
and
we'll
click
difference,
and
now
we
can
see
there's
some
funky
stuff
going
on
over
here.
Let's
maybe
try
hard
light.
Instead
and
now
we
have
this
hard
light,
looking
kind
of
blending
going
on
a
little
bit,
let's
check
out
what's
going
on
in
the
output
window,
so
this
would
sit
on
your
secondary
screen
or
projector.
R
R
R
R
So
let's
un
comment
props,
and
this
is
kind
of
like
your
view
or
react
properties,
so
we
have
one
property
called
size,
one
property
called
color
and
we
give
it
some
details
about
the
properties
here.
So
it's
an
integer,
it's
default,
20
minimum
should
be
zero,
maximum
should
be
100
and
it
should
always
be
zero
or
above
that's,
abs,
absolute
and
the
color
is
a
type
of
color.
So
we'll
save
that
switch
back
to
mod
v
and
we'll
see
that
we
have
size
and
color
properties
enabled,
but
it's
still
not
drawing
anything
to
the
screen.
R
So,
let's
look
at
the
draw
function.
This
drop
function
is
similar
to
what
you'd
find
in
p5.js,
processing
or
open
frameworks.
So,
let's
uncomment
that
save
it
and
look
back
at
mod
v,
we
have
a
red
circle
drawn
in
roughly
the
center
of
the
screen.
So
what
can
we
do
with
with
this
red
circle?
Well,
let's
change
the
color.
R
R
So
as
we
saw,
we
can't
go
past
zero
and
we
cannot
go
above
100,
but
we
can
still
assign
these
audio
features
to
these
properties.
So
this
is
a
little
quieter,
so
we're
just
going
to
turn
up
the
maximum
on
our
audio
input
and
there
we
go.
We
have
a
bouncing,
a
green
circle
super
interesting,
but
there's
more
that
you
can
do
with
mod
v
than
just
grip,
bouncing
green
circles
so
to
show
off
mod
v.
R
R
R
B
B
R
Modvey
is
a
long-term
passion
project
of
mine
and
we're
always
looking
to
improve
and
add
new
features.
If
you'd
like
to
have
a
go,
visit,
gl
modvey.vsync.gl
see
the
getting
static
guide.
We
sometimes
run
workshops
on
my
fee,
so
if
you'd
like
to
see
a
more
in-depth
run
through
of
mod
v
and
have
a
go
for
yourself
with
a
little
support
on
the
side,
then
check
out
our
twitter
page
as
we
have
one
coming
up.
R
U
Hey
everyone
I'm
moritz,
simon
guys,
and
I
welcome
you
to
my
talk,
making,
futuristic
music
with
robots.
I'm
super
happy
to
be
here
at
the
github
universe
conference.
Actually,
I'm
not
here,
I'm
more
in
the
internet
kind
of
here
I'm
in
dresden,
germany,
in
my
workshop-
and
this
is
a
good
thing
because
I'm
surrounded
by
all
my
robots.
I
brought
several
robotic
systems
here
and
in
this
talk,
I'm
gonna
be
talking
a
little
bit
about
how
to
make
music
with
robots.
U
What
that
actually
means,
because
I'm
a
robotic
musician,
how
to
create,
build
and
play
with
them,
and
then
I
will
also
talk
a
little
bit
about
how
to
perform
with
them
and
I'm
also
giving
a
small
performance,
and
so
let's
get
started,
I'm
a
musician,
robotics
engineer
and
hacker.
So
more
of
a
hardware,
hacker
type
and
a
lot
of
times.
Often
people
ask
me
hey
maurice:
what
are
you
actually
doing
as
a
robotic
musician?
What
does
that
mean?
U
And
so
I
tell
them
30
of
the
time
I'm
making
music
30
I'm
building
robots
30
of
the
time,
I'm
thinking
about
the
future
and
the
other
30
percent,
I'm
doing
business,
and
that
is
combined
120,
because
I
sleep
less.
I
don't
know,
okay
anyway,
I'm
here
in
the
middle.
You
see
me
in
the
gray
part
when
you
mix
other
colors,
it's
great,
wonderful,
yeah.
So
basically
I
started
off
as
a
bass
player
in
a
punk
band.
U
I
did
music
for
most
of
the
time
of
my
life,
also
playing
piano
and
clarinet,
and
then
I
thought,
okay,
making
music
is
actually
not
such
a
good
way
to
earn
money.
So
I
studied
something
scientific.
I
studied
electronical
engineering
here
in
dresden
and
I
well
went
on
the
route
for
making
really
scientific
things
in
semiconductor
science,
but
I
soon
realized
that
to
work
in
an
office
and
like
have
all
these
like
research
things
around,
that's
actually
not
the
thing.
U
I
soon
changed
my
student
apartment
into
a
big
mess
and
I
put
a
lot
of
cables
and
things
around
there.
And
out
of
this
mess
came
my
first
installation,
which
is
the
mr808.
Maybe
some
of
you
have
seen
it?
It's
a
huge
installation,
six
by
four
meter.
The
lamp
here
is
for
scale
and
no
not
six
by
four
meter.
That's
too
big,
like
two
by
three
meter:
that's
the
size
and
it's
basically
a
replica
of
the
808.
U
Brought
to
market
in
1981
by
a
japanese
company-
and
I
thought,
okay,
I'm
going
to
replicate
most
of
the
modules
there
and
the
idea
was
to
have
no
electronics
involved
and
to
replicate
all
the
sounds
of
this
electronic
drum
synthesizer
with
actual
drums
and
with
small
mechanics
and
small
motors.
So
this,
for
example,
here
is
the
the
drum
module
with
the
bucas,
and
then
we
also
have
like
a
clap
module,
and
you
can
definitely
check
it
out
in
the
internet.
U
If
you
want
to
see
a
video,
it
was
viral
in
2012
when
the
internet
was
still
young
and
the
installation
was
also
still
young,
because
it's
from
2012.
yeah.
The
goal
is
for
the
808.
Actually
I
didn't
have
a
plan,
but
like
it
appeared
that
the
goals
for
the
808
would
be
to
have
a
sound
creation,
which
is
much
more
visual
appealing.
U
That
means
that
you
have
like
all
these
small
things
and
they
basically
move,
and
you
can
really
touch
them
and
go
there
and
just
like
do
stuff,
and
this
is
something
that
you
cannot
do
when
you
have
like
a
computer
or
which
was
really
lacking.
I
started
making
electronic
music
a
long
time
before
I
started
building
robots,
but
what
was
always
lacking
for
me
was
like
this
touch
of
physicality,
that
you
cannot
actually
touch
something
and
it
changes.
U
So
definitely
another
goal
would
be
to
have
no
more
sound
creation
inside
the
computer
and
also
like
this
extension
of
creativity,
because
it's
a
very
limited
scope
of
sound
creation.
Actually
you
have
only
the
sounds
that
come
out
of
this
instrument,
so
maybe
enough
for
the
forwards,
I
would
say
now
I'm
starting
my
life's
hat
and
I
will
switch
to
my
software
of
choice
which
is
ableton
live.
U
I
don't
know
if
you
know
the
fact
magazine
they
do
something
called
a
10
minute
track
something
a
track
in
10
minutes,
and
I
will
do
the
same
here.
So
maybe,
let's
start
off
with
the
bass
when
I
play
live.
My
first
question
is
always
like:
what's
the
most
important
thing
in
electronic
music
bass
drum,
what's
the
most
important
thing
in
electronic
music
bass?
Definitely
so
we're
gonna
start
with
space.
There's
only
one
person
here
paul,
which
is
cool,
but
of
course
it
doesn't.
U
I
cannot
play
live
this
year,
but
it's
fine.
Okay,
let's
start
with
bass
drum
the
bass
drum
the
bass
drum
here
is
an
old
vinyl
player,
which
I
converted
so
that
it's
basically
not
moving
anymore,
but
it's
only
hitting
on
the
on
this
plate
on
the
cardboard
it's
amplified
with
a
little
eq,
and
then
you
basically
have
a
wonderful
bass
drum
out
of
like
a
small
mechanical
motor.
Okay.
The
next
thing
is
like
a
hard
drive,
because
I
figured
out
a
hard
drive
is
a
wonderful
thing
for.
U
U
U
U
U
U
U
U
D
U
U
U
U
Okay,
so
one
of
my
favorite
instruments
is
this
instrument?
Okay,
it's
basically
it's
basically
a
shell
which
somebody
gave
me
as
a
present,
and
it
has
the
wonderful
sounds
ever
because
what
I
also
like
is
to
find
hidden,
well
hidden
properties
in
objects,
and
this
one
wasn't
meant
to
make
a
sound,
but
I
can
show
you
how
it
does.
V
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
U
Hey
that
was
my
contribution
to
this
year's
pandemic
version
of
git
hub
universe,
and
I
hope
that
30
minutes
are
fit.
I
don't
know
what
time
is
it
now,
so
normally
you
would
find
these
kind
of
music
in
a
club
or
a
media
arts
festival
or
such,
and
since
there
is
not
so
much
possibility
right
now
to
do
this,
you
can
find
me
in
the
internet
at
various
places,
and
I
hope
you
enjoy.
U
You
enjoyed
my
performance
and
if
you
have
further
questions
concerning
the
setup,
I
didn't
go
into
detail
about
the
programming
of
the
robots,
for
example,
because
that's
a
little
bit
hard
to
do
here
with
this
particular
setup.
And
so,
if
you
have
further
questions,
you
can
just
post
them
or
write
me
an
email
or
come
over
to
dresden,
germany.
We
have
a
wonderful
workshop
and
let
me
just
finish
with
this.
W
W
I
call
that
discomfort
and
that
testing
and
intelligent
interruption
before
music.
I
actually
came
from
tournament
chess
and
my
opponents
were
my
greatest
collaborators:
the
idea
that
to
have
ownership
over
that
discomfort
they're
the
ones
that
pushed
me
further.
So
sometimes
it's
not
about
harmony,
it's
about
how
our
expertise
and
our
skills
can
be
forced
into
new
corners
and
new
places.
W
This
max
patch
allows
me
to
interact
with
these
different
audios.
It
listens
to
me
and
I'm
gonna
have
four
to
five
chess
matches.
With
these
different
collected
audio
pieces.
I
have
no
control
over
what
they
do.
It's
a
chaotic
process,
but
the
idea
is,
I
will
do
unexpected
things
and
it
forces
me
to
write
and
compose
in
a
new
way.
B
B
B
X
B
B
B
B
B
B
X
B
D
D
B
B
B
B
B
X
X
X
M
B
X
B
B
B
B
B
B
B
B
B
U
B
B
B
B
V
V
Hello,
everybody
and
welcome
to
the
github
universe
highlight
show
I'll,
be
your
host
kyle
daigle
over
the
next
15
minutes.
I'll
be
sharing.
Some
of
the
highlights
from
today,
including
our
huge
keynote
in
all
of
its
announcements,
highlights
from
the
17
talks
that
you
definitely
can't
miss
are
absolutely
killer,
play
track
and,
of
course,
I'll.
Have
you
completely
ready
to
go
for
tomorrow's
session
of
github
universe
which
kicks
off
at
9
00
a.m?
Pacific.
V
I
know
it's
a
little
fast
to
be
worrying
about
tomorrow,
but
I
don't
want
you
to
miss
out
on
any
of
our
totally
virtual
github
universe
this
year,
but
before
we
worry
about,
what's
coming,
let's
sink
our
teeth
into.
What's
already
happened,
kicking
off
today,
nat
neja,
ryan,
diana
and
brian
gave
us
a
jam-packed
overview
of
what
it's
like
to
use.
V
Github
these
days,
we've
made
quite
a
few
changes
in
the
past
few
years
that
make
github
more
useful
day-to-day
easier
to
get
your
daily
work
done
and
hopefully,
a
little
bit
more
enjoyable
too
kicking
off
the
keynote.
We
announced
that
github
discussions
is
now
available
in
public
beta
to
help
you
and
your
communities.
Collaborate
together.
E
Can
I
catch
up
with
my
favorite
communities?
Github
discussions
makes
this
so
easy.
We
announced
it
a
few
months
ago
as
a
great
place
for
q,
a
and
open-ended
conversations,
and
today
we're
announcing
that
every
open
source
community
can
try,
get
up
discussions
with
our
new
public
beta
just
head
to
your
repo
settings
and
turn
it
on
right
now.
E
V
V
F
G
I
V
These
new
improvements
are
so
good
at
github
were
able
to
use
auto,
merge
to
get
pull
requests
into
their
action
workflows
faster
than
ever
for
some
projects
and
for
parts
of
the
app
that
need
a
little
bit
more
review
manual
approvals.
Allow
us
to
check
our
test
deployments
before
letting
our
continuous
deployment
workflows
take
over
for
us.
Github
actions
is
now
a
full-featured
ci
and
cd
platform
ready
for
you
to
use.
I
can't
wait
to
get
these
features
into
your
hands
because
sometimes
it's
the
little
things
that
make
the
biggest
difference.
V
And
finally,
if
you
use
github
on-premises
we're
bringing
all
these
amazing
features
to
github
enterprise
server,
with
our
new
release,
github
enterprise
server
3.0,
including
github
actions,
packages,
code
scanning
and
more
we'll
catch
up
with
maya's
talk
covering
all
of
these
new
features.
In
just
a
few
minutes,
you
can
learn
more
about
enterprise
at
enterprise.github.com,
oh
and
one
more
thing,
let's
shine
a
huge
light
on
something:
that's
a
little
dark,
github,
dark
mode.
V
I
gotta
up
my
slipper
game
after
watching
that
I
know
you've
been
asking
begging,
pleading
for
this
feature
for
a
while
and
we're
happy
to
announce
that
it's
here,
github,
dark
mode
is
available
now
today,
right
this
minute,
either
use
your
system
settings
or
the
settings
within
github
to
quickly
enjoy
the
dark,
dark
bliss
of
a
much
darker
coding
experience.
I
promise
as
soon
as
I'm
out
from
behind
all
these
lights
I'll
be
turning
on
dark
mode
too,
and
you
all
love
the
announcements
that
much
is
clear.
V
Let's
take
a
dive
into
your
hot,
takes
on
social
media
and
see
what
you
all
thought
about
the
keynote:
I'd
love
for
you
to
share
what
you're,
loving
or
finding
exciting
about
github
universe.
All
you
need
to
do
is
tag
it
with
the
github
universe
and
your
tweets
and
instagrams
might
show
up
in
our
highlight
show
as
well.
Alright,
let's
take
a
look
at
what
you
thought.
First
of
all,
meet
bruno
a
cat
programmer
who
seems
to
really
be
enjoying
or
maybe
is
utterly
confused
by
the
play
track
performance.
V
I'm
not
sure
I
love
seeing
where
you
all
were
watching
from
home.
Today
and
bruno
please
stick
around
for
day,
two
moving
on
brady's
family
was
a
little
confused
by
his
big
excitement
for
get
up
dark
mode.
Listen.
I
think
I
could
hear
all
of
you
from
my
house
and
this
room
is
pretty
sound
proofed.
I
assume
you
explained
to
them
the
utter
importance
of
dark
mode,
brady
and
finally
sunny
caught
a
line
from
nat
in
the
keynote
about
how
github
sponsors
can
let
open
source
developers
work
for
the
internet.
V
We
already
have
many
developers
on
github
sponsors,
making
six
figures
full
time,
which
is
awesome
and
maybe
not
quite
a
cat
and
mouse
duo.
But
now
we
have
boris
watching
github
universe
from
miles
house
and
I
think
he's
taken
a
liking
to
martin
and
dana
boris
should
meet
bruno
and
then
mona
feels
like
we
have
a
whole
programming
cartoon
on
our
hands
share
what
you're
thinking?
What
was
your
favorite
part
of
universe,
use
the
get
up
universe,
hashtag,
I'd
love
to
feature
you
in
the
show.
V
V
I
wanted
to
share
a
few
of
my
favorite
moments
from
the
talks,
but
you
can
see
all
the
talks
on
replay
by
going
to
githubuniverse.com,
as
you
saw
in
the
keynote
code,
spaces
is
the
best
way
to
both
edit
and
run
your
code
with
the
power
of
vs
code
right
inside
your
browser.
Earlier
today,
bailey
matthew
and
allison
shared
how
you
can
start
writing
new
code
run.
Your
tests
run
your
actual
application
and
then
deploy
to
production
from
almost
any
browser.
V
Personally,
I'm
looking
forward
to
not
fumbling
around
when
I
set
up
a
new
code
base,
I'm
really
excited
to
be
able
to
use
my
laptop
or
an
ipad
to
develop,
while
linked
to
a
vm
in
the
cloud
be
sure
to
check
out
both
the
replays
from
both
the
code
spaces
talks
to
learn
more
or
just
go
and
sign
up.
Today,
you
can
find
the
link
at
github.comcodespaces
or
just
head
on
over
to
github.com.
V
Okay.
Now
we
have
a
new
feature
that
is
very
important
related
to
security.
Now,
what
is
one
thing
that
basically,
every
new
feature
has
its
code
and
what
does
almost
every
piece
of
code
eventually
have
security
vulnerabilities
during
today's
talks,
a
bunch
of
our
speakers
shared
how
github
their
companies
and
many
open
source
communities
are
trying
to
make
it
easier
to
write
secure
code
much
much
earlier
in
the
process.
Here's
maya
sharing
how
github
can
help
make
it
even
easier.
V
Z
Okay,
this
is
kind
of
like
the
faucet
that
you
go
to
or
the
sink
that
you
may
go
to
and
when
you
turn
that
left
knob,
you
expect
the
water
to
be
hot.
That's
universally
true,
you
didn't
have
to
ask
anyone
for
it,
and
you
didn't
have
to
tell
the
plumber
to
install
it
that
way.
It's
just
the
way
that
that
operates,
and
so
in
a
lot
of
ways.
That's
the
way
that
people
think
of
security
today
is.
V
Now,
maya,
william
shared
how
we
can
keep
vulnerabilities
out
of
our
code
and
keith
talked
about
the
importance
of
security
as
a
feature.
What
happens
when
you
know
you
leak
a
production
secret
into
the
code
base?
Look,
don't
judge
me,
you've
done
it.
I've
definitely
done
it,
but
luckily
for
us,
sasha
shares
how
github
code
scanning
protects
us
from
getting
into
this
big
mess
at
all.
V
You're,
not
mining
any
bitcoin
on
my
dime
I'll.
Tell
you
that
all
the
many
tokens
I've
pushed
up
have
already
been
revoked
by
github
and
its
partners,
thanks
to
computers
being
both
wonderful
and
completely
and
utterly
terrible
spencer
from
the
metasploit
project
spoke
about
how
to
write
an
exploit
module
and
then
check
it
against
targets
for
vulnerabilities,
here's
spencer,
describing
why
he
finds
working
on
metasploit
so
interesting.
AB
I
mean
I,
I
talked
a
lot
about
like
writing
the
exploits,
and
that's
that's
really
where
it's
at.
I
always
find
that
incredibly
exciting,
because
you're
you're
tinkering
with
things
and
it's
oftentimes.
You
know
a
puzzle
where
you're
trying
to
create
content
to
leverage
functionality
or
a
feature
or
a
bug
in
a
way
that
wasn't
originally
intended
to
be
leveraged.
V
V
There's
more
where
that
came
from,
though,
just
to
name
a
few:
we've
got
github
actions
on
premises,
automated
code
and
secret
scanning
alerts,
conditional
access
policies
to
better
lock,
down
your
environment
and
extended
branch
protection
rules
that
are
environment.
Aware,
there's
too
much
for
me
to
cover
here.
You
should
check
out
maya's
whole
talk
as
a
replay
and
best
of
all
these
features
will
all
be
available
to
you
in
a
release
candidate
starting
next
week
in
our
third
track
of
sessions.
V
The
university
track
had
sessions
today
aimed
at
student
developers
like
a
talk
from
emoji
miller,
technical
advisor
to
the
ceo
about
the
myth
of
innate
technical
ability
and
a
talk
from
mike
swift,
ceo
and
co-founder
of
major
league
hacking
about
how
everything
you
think
you
know
about
tech.
Internships
is
wrong.
If
you're
a
student
and
interested
in
diving
in
yourself,
head
on
over
to
the
university
track
to
prep
for
day
two
and
few,
if
three
tracks
of
talks
and
sessions
weren't
enough
for
you,
did
you
take
a
look
at
the
play
track.
V
The
play
track
has
some
of
the
coolest
most
artistic
uses
of
technology
that
we
could
find,
and
we
are
so
excited
to
bring
you
more
this
year
and
check
this
out.
This
is
sarah
davis,
who
also
goes
by
dj
dave
on
spotify,
go
check
that
out.
She's
live
coding.
This
amazing
track
that
helped
kick
off
github
universe.
The
github
team
was
so
loving
every
second
of
this
performance.
In
so
were
you
on
twitter,
be
sure
to
check
out
her
performance
and
all
of
the
amazing
performances
on
the
play
track
tomorrow
I
promise
you.
V
They
are
worth
a
watch
and
listen
all
right.
We've
covered
the
keynote,
the
talks,
the
four
tracks
and
all
the
performances
from
today.
How
about
we
take
a
look
at
what's
coming
tomorrow
to
help
us
out
with
that
I've
invited
liz
sailing
director
of
software
engineering
to
tell
us
a
little
bit
about
what
she'll
be
helping
to
present
tomorrow.
Hey
liz,
hey
kyle!
V
AD
Absolutely
I
am
so
excited
to
share
with
you
how
we
coordinated
the
efforts
of
dozens
of
engineering
teams
and
hundreds
of
engineers
to
pay
down
technical
debt
here
at
github
that
we
were
able
to
significantly
invest
in
the
state
of
our
software
and
our
systems
and
making
it
faster
and
easier
to
build
and
ship
github.
And
even
I
was
in
the
middle
of
it
right.
Well,
it
happened
and
I
love
seeing
what
we
put
in
place
to
keep
improving
on
this
new
and
improved
state.
AD
So,
if
you're
interested
in
how
we
do
devops
here
and
the
metrics
that
we
watch
to
know
how
we're
doing
and
frankly,
if
you
just
want
to
hear
from
a
couple
of
the
amazing
engineering
leaders
that
I
get
to
work
with,
come
hang
out
with
us
tomorrow.
As
we
talk
about
how
we
came
together
to
tackle
our
technical
debt.
V
AD
AD
V
And
you
can
watch
liz,
keith
and
kk's
talk
about
reducing
github's
technical
debt
tomorrow
on
the
developer
track
at
10
30
a.m:
pacific,
along
with
liz's
talk.
There
are
a
bunch
of
great
talks
for
you
to
check
out
tomorrow
at
9
30
a.m.
Pacific.
You
can
learn
more
about
visual
tests
on
every
pull
request
from
angie
jones
at
10
a.m.
Pacific
join
github's
own
brian
douglas,
who
will
help
you
get
traction
with
github
actions
and
finally
check
out
the
newest
continuous
deployment
features
that
you
saw
in
today's
keynote
at
11.
V
45
am
pacific
with
chris
patterson.
Thank
you.
So
much
for
joining
me
for,
for
today's
github
universe,
highlight
show
I'd
love
to
hear
your
highlight
from
today.
Use
the
hashtag
github
universe
and
feel
free
to
mention
me,
k,
daigle
and
you
might
end
up
in
tomorrow's
show.
Getup
universe
will
also
kick
off
a
rebroadcast
with
live
hosts
at
9
30
a.m.
India
standard
time.