Quickstart

p5.fab Quickstart #

I recommend using the online editor to get started. It allows you to write code, start/stop prints, connect to MIDI devices, and connect to a camera in one place. If you want to edit, extend, or otherwise make changes to the codebase, you can install locally.

Online Editor #

  1. Using Chrome1, open the online editor.
  2. Design your artifact. You can start from one of the examples; try changing some of the values in the sketch to see what happens to the resulting object.
  3. Physically connect your computer to your fabrication machine2 with a USB cable and click ‘Connect’.
  4. Start making! Press ‘Print’ to start streaming commands to your machine. Be sure to keep an eye out for anything that goes wrong; there’s no guarantee that your code will ‘work’ in any conventional sense, but that’s part of the fun!

Alternative Option: Local Installation #

If you’d like to use your preferred code editor while using p5.fab:

  1. Download the p5.fab.js library file and add the path to the <head> tag of your index.html file:

    <script src="p5.fab.js"></script>

    You should also add it’s dependencies, the p5.js library and the webserial communication:

    <script src="https://cdn.jsdelivr.net/npm/p5@1.9.2/lib/p5.js"></script>
<script src="https://unpkg.com/p5-webserial@0.1.1/build/p5.webserial.js"></script>

  2. Run a local server; this is required for communicating between the machine and your computer. See this guide for details on how to do this.

  3. Open your sketch in Chrome and start making stuff.

  1. We use serial communication to communicate with the machine; Chrome is the only browser which supports WebSerial, which let’s us get up and running even quicker! ↩︎

  2. Check out the Machine Compatability Page for more information on what machines are currently supported. ↩︎