Example 01 · First open範例 01 · 第一次打開

Hello particles哈囉粒子

The smallest complete app. Read main.js top to bottom and you know the framework.最小的完整範例。把 main.js 從頭讀到尾，整套框架就懂了。

Try these three things試試這三件事

  1. Click the on-screen piano, or tick “keyboard” and play A to L: every note launches a burst.
  2. Tick “simulate performance”, then drag the Hue and Gravity sliders while it plays.
  3. Press Space to play the timeline: the same params now move on their own.
  1. 點螢幕鋼琴，或勾選 keyboard 用 A 到 L 彈：每個音都放出一團粒子。
  2. 勾選 simulate performance，在它彈奏時拖動 Hue 與 Gravity 推桿。
  3. 按空白鍵播放時間軸：同樣的參數，現在自己動了。

No hardware needed. On-screen piano · QWERTY keys · Simulated performer.不需要硬體。螢幕鋼琴、電腦鍵盤、模擬演奏者。

Read these lines讀這幾行

  • main.js:12–18 Params: what the piece can be performed with.參數：這件作品能被什麼演奏。
  • main.js:25–29 A struck note is an event, so it may come straight from a signal.按下的音是事件，可以直接從訊號來。
  • main.js:63–79 One createShow() call brings piano, mapping, timeline, console, sound and backstage.一次 createShow() 呼叫，就帶來鋼琴、映射、時間軸、控台、聲音和後台。

Take this input into your own p5 sketch: one line.把這個輸入帶進你自己的 p5 草圖：一行。 Example 15 · Docs: p5.js in one line範例 15 · 文件：p5.js 一行接上

In the docs文件裡: Writing a world寫一個世界 · Quick start快速開始

Next: 15 p5.js in one line →下一個：15 p5.js 一行指令 → All examples所有範例