{
  "title": "Perlin Noise Flow Field",
  "description": "In this coding challenge, I use Perlin noise to create a two-dimensional flow field with the p5.js library.",
  "videoNumber": "24",
  "videoId": "BjoM9oKOAKY",
  "nebulaSlug": "the-coding-train-coding-challenge-24-perlin-noise-flow-field",
  "date": "2016-06-27",
  "languages": ["p5.js"],
  "topics": ["Perlin noise", "array"],
  "canContribute": true,
  "relatedChallenges": ["11-3d-terrain-generation-with-perlin-noise", "132-fluid-simulation", "c4-worley-noise"],
  "timestamps": [
    { "time": "0:00", "title": "Introduction" },
    { "time": "0:35", "title": "Two dimensional perlin noise" },
    { "time": "2:02", "title": "Scale" },
    { "time": "5:08", "title": "Create a vector" },
    { "time": "5:45", "title": "Draw vector as a line" },
    { "time": "7:09", "title": "Random angle" },
    { "time": "8:10", "title": "Flow field" },
    { "time": "9:24", "title": "N-dimensional perlin noise" },
    { "time": "9:53", "title": "Add zoff" },
    { "time": "11:56", "title": "Add Particle class" },
    { "time": "15:26", "title": "Add particles" },
    { "time": "16:26", "title": "Add edges()" },
    { "time": "17:34", "title": "Have particles be affected by vectors" },
    { "time": "18:34", "title": "Flowfield array" },
    { "time": "21:00", "title": "Follow()" },
    { "time": "22:56", "title": "Set magnitude of vectors" },
    { "time": "26:42", "title": "Add alpha" },
    { "time": "27:36", "title": "Store particle's previous position" },
    {
      "time": "27:56",
      "title": "Draw line between current and previous position"
    }
  ],
  "codeExamples": [
    {
      "title": "Perlin Noise flow field",
      "description": "This sketch demonstrates how to use Perlin noise to create a 2D flow.",
      "image": "flow.jpg",
      "urls": {
        "p5": "https://editor.p5js.org/codingtrain/sketches/vDcIAbfg7",
        "processing": "https://github.com/CodingTrain/Coding-Challenges/tree/main/024_PerlinNoiseFlowField/Processing/CC_024_PerlinNoiseFlowField"
      }
    }
  ],
  "groupLinks": [
    {
      "title": "References",
      "links": [
        {
          "icon": "🗄",
          "title": "p5.js noise() reference",
          "url": "https://p5js.org/reference/#/p5/noise",
          "description": "p5.js webpage with information and documentation about noise()."
        }
      ]
    },
    {
      "title": "Videos",
      "links": [
        {
          "icon": "🎥",
          "title": "My videos about Perlin Noise",
          "url": "https://www.youtube.com/playlist?list=PLRqwX-V7Uu6bgPNQAdxQZpJuJCjeOr7VD",
          "description": "A collection of videos about noise algorithms in p5.js (JavaScript) and Processing (Java)."
        },
        {
          "icon": "🔴",
          "title": "Live Stream Archive #46",
          "url": "https://youtu.be/sor1nwNIP9A",
          "description": "Live Stream with Perlin Noise and Flow Fields"
        }
      ]
    }
  ],
  "credits": [
    { "title": "Editing", "name": "Mathieu Blanchette" },
    { "title": "Animations", "name": "Jason Heglund" }
  ]
}