iLab Workshop


  • Trial workshop, kickstarts in Feb
  • P5 is short hand form for processing
  • Javascript frameworks
  • Vector Maths, Autonomous Agents, Craig Reynolds’ Boids, Steering Behaviours, Flocking


  • Explanation of how HTML works and its basic setup
  • HyperTextMarkupLanguage
  • Head, Body, Paragraph, Headings, Titles
  • Displays/Organises (through Tags) Text


  • Cascading Style Sheets
  • Styles the HTML document
  • Colours, Spacing, Font Sizing, etc.
  • More control over how it looks


  • <p id=”demo”></p>
  • document.getElementById(“demo”).innerHTML = Date();




  • CTRL + / = Commenting in SublimetText
  • (125,125,50, 100, 100) = (location on ‘x’ L->R, location on ‘y’ Top->Down, size in pixels, Height)
  • ‘Fill’ applies to anything you create after
  • Things occur chronologically
  • ‘++’ means add 1
  • ‘+=’ means add the 1st and 2nd variable and make it equal to the 2nd variable
  • ‘[]’ means empty array/list
  • ‘.push’ means add to array (top of)
  • ‘.splice’ means remove from array (from the end)
  • CTRL+D – select values of the same type within code for editing (have to press it for each one)




After break…



  • Speed – Scalar Quantity
  • Velocity (has a direction) – Vector Quantity
  • Position,  x and y, can be represented as a vector
  • Velocity Vector = Final Position – Start Position
  • Start Position + Velocity Vector = Final Position
  • ‘.add’ is vector addition
  • F=ma – Force = Mass x Acceleration


Screenshot of one of my results:







  • Interesting how you can change the colours randomly (FOLDER: Day 1, Test 2, Workshop 1 and 1.1) – could be a cool effect to see on an object in AR
  • Final flocking example (Workshop 2) could be really interesting see in VR or AR… Is there a way to apply this (easily) to objects in Unity? Could be worth finding out…

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s