Module

01

Lines

/ Lesson

01.2

Your first line

8

min

Free preview

moveTo, lineTo, stroke. Then change one number.

01.2Your first line
Change it
▶
04:12 / 08:00

Preview renders the module’s sketch live. Drop your lesson video into the player’s Video field to replace it.

Space to play · ← → to seek

( The code )

The line that does the work.

sketch.js

ctx.moveTo(40, 40) ctx.lineTo(360, 220) ctx.stroke()

Open the Lab from the player and change the numbers in this line first.

( What it draws ) One render of this module’s sketch.

In this lesson

moveTo, lineTo, stroke. Then change one number. We build it live in about 8 minutes, then you change it in the Lab until it is yours.

Try this after

Change one number at a time and write down what it did. Most of the good surprises in this course come from the third or fourth change, not the first.

( In this module )

Keep going.

← Previous lesson

The canvas is a grid

Next lesson →

Loops that draw

Create a free website with Framer, the website builder loved by startups, designers and agencies.