how can i make this sketch?

edited November 2017 in Questions about Code




  • Answer ✓

    Well for a start you'll probably want to draw a bunch of lines. Can you write code that draws a bunch of lines? I have to ask, because you haven't posted any code at all so it's impossible to gauge your skill level.

    So anyway, if you have code, post it, if not, try to write a basic sketch that just draws the lines. They don't even have to curve yet. Just start with straight white lines and a black background. Post your attempt at that for more help.

  • void setup(){



    void draw(){


    for(int i=10;i<=width;i+=10) { stroke(255); strokeWeight(3); line(i,0,i,height); } }

  • please don't post duplicates. (i've deleted the other)

  • Great. Next we need a way to draw lines that curve. Thankfully, there is a function that can draw curved lines instead of straight ones:

    Here is an exaple sketch showing that this can draw curved lines instead:

    void setup() {
      size(800, 600); //fullScreen();
    void draw() {
      for (int i=10; i<=width; i+=10) { 
        bezier(i, 0, i+i, i, i+i, height, i, height);

    Notice that the bezier() function takes more parameters than a simple line() function. These additional parameters allow you to specify how much - and in which direction - a curvy line should bend.

    Since you want these curves to move, you will need a pair of variables for each endpoint that track how curvy each curved line currently is. You might also want more variables to track how much their curve is changing. In short, you are going to need to keep track of a lot of information about each line.

    We could do this with lots of variables. But that is a lot of work.

    We could be smart and use arrays. But that is also a lot of work.

    We could write a Line class. This is a great idea. But again, it is impossible to gauge your skill level when it comes to classes.

    If you are familiar with them, write a Line class. It should have enough variables to track the control points for one line, and might also include useful information like its x position. Throw in a draw() function and a method to change a line's control points (upper and lower) by some amounts.

    If you aren't familiar, skim this:

    And come to a deep understanding of this:

    And then give it a go yourself.

Sign In or Register to comment.