# Anyone tried Observable? It looks awesome!

**URL:** <https://discourse.processing.org/t/anyone-tried-observable-it-looks-awesome/10112>\
**Category:** p5.js\
**Created:** [April 9, 2019, 5:03am UTC](https://discourse.processing.org/t/anyone-tried-observable-it-looks-awesome/10112 "2019-04-09T05:03:22Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [April 10, 2019, 3:10pm UTC](https://discourse.processing.org/t/anyone-tried-observable-it-looks-awesome/10112/2 "2019-04-10T15:10:10Z")

</div>

Yes, we had a conversation about observable and p5js integration last year, and I forked a template for it from work by Jeremy Wong:

> [@Include p5.js in Observable notebook](https://discourse.processing.org/t/include-p5-js-in-observable-notebook/458/4):
>
> Here is a template for Observable p5.js notebooks: [p5.js sketch on Observable: Template](https://beta.observablehq.com/@jeremydouglass/p5-js-sketch-on-observable-template) (forkable template by me) Also, Tom MacWright has created a helper function which you can import into a notebook to get started quickly, as well as a template with it already in-place: [p5 (twcw tutorial)](https://beta.observablehq.com/@tmcw/p5-basic-example)[p5 basic example](https://beta.observablehq.com/@tmcw/p5-basic-example) (forkable template) These are instance mode sketches,and you need to prefix everything – get ready write sketch.foo sketch.bar sketch.baz sketch.etc… One thing I discovered while wri…

Observable has been under rapid development, so I believe that the template may need to be updated – or may be superseded if p5 has been better integrated into the core – I haven’t looked recently.

Searching for p5.js / p5:

- [Search p5.js | Observable](https://observablehq.com/search?query=p5.js)
- [Search p5 | Observable](https://observablehq.com/search?query=p5)

…here is an example p5 on Observable sketch:

> **[Breathing Cube in P5.js](https://observablehq.com/@hydrosquall/breathing-cube-in-p5-js)**
>
> Making this Bees and Bombs GIF with p5.js, with the help of d3's scale and color functions. Thanks to Daniel Shiffman for his very detailed tutorial! https://www.youtube.com/watch?v=H81Tdrmz2LA gif Stage 1: Breathing Rectangle - Simple Harmonic...

---

_[View the full topic](https://discourse.processing.org/t/anyone-tried-observable-it-looks-awesome/10112)._