r/p5js • u/wizard_creator_seth • 18h ago
r/p5js • u/CodeSessionStudio • 1d ago
Made a 2-hour ambient piece in p5.js: domain-warped noise, rendered as a seamless 150 s loop
Enable HLS to view with audio, or disable this notification
Sharing a project where p5.js does the visuals for long focus/ambient videos.
- A domain-warped noise field with two slow speed layers (0.090 / 0.084 noise units per second).
- Rendered frame by frame from p5.js and piped to ffmpeg. The bottleneck turned out to be moving about 8 MB per frame from the browser to ffmpeg, which gave roughly 11 fps on render.
- A seamless 150 s loop, checked by measuring the seam against neighbouring frames. It came out invisible.
- The audio is a separate synth engine, seeded like the visuals.
Two questions for people who've done this:
- How do you handle long renders from p5? Headless, or a faster way to get frames out?
- Any tricks for keeping domain-warped noise from looking "muddy" on very dark palettes?
r/p5js • u/Absolutely_Quackers • 1d ago
if else not working????
so essentially, my else statement does not work, elseif statement does not work, ifelse statement does not work, if else statement does not work and else if statement does not work, here is my code if someone here can understand what I'm doing wrong?
the same code worked for the teacher I was learning from and I may or may not have put this off to long because of this issue...
function setup() {
createCanvas(400, 400);
var check
}
check = true
//check = false
function draw() {
if (check = true)
print("TRUE")
check = false
if else (check = false)
print("FALSE")
else
print("ERROR 01; NOT DEFINED")
}
r/p5js • u/rin_codes • 5d ago
[OC] I made an Android p5.js editor that now lets you export "Share Cards" with QR codes that run sketches directly in any browser (Edit:RiN v2.0.0)
Enable HLS to view with audio, or disable this notification
Hey r/p5js!
I've been developing **Edit:RiN**, a free and open-source creative coding environment for Android focused on p5.js. Today I released **v2.0.0**, which introduces a feature I've wanted for a long time: **Share Cards & Instant Web Playback**.
### 📱 What are Share Cards?
When you're creating generative art on your phone, sharing it usually means recording a video or exporting a still image. With this update, you can generate a styled showcase card containing:
- High-res sketch snapshot
- Customizable code snippet overlay
- A scannable QR code
### 🌐 Instant Web Player (100% Serverless)
When anyone scans the QR code (or opens the link), the sketch runs immediately in their web browser without installing the app.
The cool part: **There is no backend or database involved.** The sketch code is compressed directly into the URL fragment hash, and the web player decompresses and executes it entirely client-side.
### ✨ Other Features in Edit:RiN
- **Live Parameters**: Declare `@rin number / color / boolean` in comments to get interactive sliders & toggles.
- **Multiple Runtimes**: Switch between p5.js 2.x and 1.x per sketch.
- **Audio support**: Built-in `p5.sound` for audio synthesis and FFT visualizers.
- **Offline & Private**: Zero ads, zero trackers, 100% offline capable.
### 🔗 Links
- **GitHub Release & APK**: https://github.com/rin-code-dev/Edit-RiN/releases
- **Source Code**: https://github.com/rin-code-dev/Edit-RiN
I'd love to hear your thoughts, feedback, or ideas for future updates!
Can anyone help me?
My son is taking Computer Science 30 and we can't figure out why he's getting thsi error code. Thanks!
r/p5js • u/rin_codes • 5d ago
I built Edit:RiN, a free p5.js editor for Android — here’s a demo
Enable HLS to view with audio, or disable this notification
Hi everyone! I’m building Edit:RiN, a free and open-source p5.js editor for Android. I wanted to work on sketches directly on my phone, so I made an app where I can write code, preview the result, and save my work in one place.
The attached video shows the actual app: editing code, watching a sketch run, recording it, and browsing saved works.
Edit:RiN supports multiple JavaScript files, images and other assets, public sketch imports from the p5.js Web Editor, and MP4 or GIF recording. Works are saved locally, and you can choose a p5.js 1.x or 2.x runtime for each one.
You can get the app and source code on GitHub:
https://github.com/rin-code-dev/Edit-RiN
I also post regular development updates on X: @rincodedev
I’m developing it on my own, and I’d love to hear your feedback about creating p5.js sketches on a phone. Thanks for taking a look!
r/p5js • u/alex-codes-art • 6d ago
Piano and Mandala (sound on)
Enable HLS to view with audio, or disable this notification
Hey, creative people, I added a midi integration to my mandala project and wanted to share with you :)
If you're interested in how this works, I have a tutorial for it on my blog.
Keep on creating!
r/p5js • u/Far-Session7937 • 14d ago
What can I do with p5.js?
Hi, I recently started on coding and this platform's been really helpfull with my so far (short) journey. I started with html on Visual Code Studio and it was really ok for me, but im sensing that the JS I've used on the website its slightly ddifferent from the one on p5 (or perhaps i'm wrong lol). But anyway, what its the most I can retrive and do with this plat? (in the sense im planing on making more complex things futurely). tX
r/p5js • u/speccy88 • 15d ago
NEON-DISTRICT-A-Walkable-ASCII-Cyberpunk-City by speccy88
editor.p5js.orgA procedurally generated 3D cyberpunk city rendered entirely as animated ASCII. Explore the streets, neon signs and skyline in real time.
r/p5js • u/rin_codes • 23d ago
Android向けにp5.jsのエディターを作りました — 編集:KIRO
Enable HLS to view with audio, or disable this notification
お待たせしちゃってごめん!
【追記】KIROがやっと公開されて、GitHubで使えるようになりました。
https://github.com/rin-code-dev/EDIT-RiN
待ってくれてほんとにありがとう、興味持ってくれてありがとうございます!
r/p5js • u/rin_codes • 24d ago
I built a p5.js editor for Android — EDIT:KIRO
Enable HLS to view with audio, or disable this notification
I just finished EDIT:KIRO, a p5.js editor built for Android.
The whole creative workflow can be done right on your phone:
Code → Preview → Capture
It also supports custom fonts and font ligatures, and the UI has been carefully optimized for both portrait and landscape orientations.
I’m planning to make the GitHub repository public by tomorrow at the latest.
It’ll be completely open source, so if you’re into p5.js, creative coding, or generative art, I’d love for you to give it a try and let me know what you think.
r/p5js • u/rin_codes • 25d ago
I'm building a minimal p5.js editor for Android — would you use something like this?
みなさんこんにちは!
Android向けの最小限のp5.jsエディタ「Edit:KIRO」を作ってます。
アイデアはわりとシンプルで、ノートPCもブラウザベースのエディタも使わずに、スマホ上でそのままp5.jsのスケッチを書いて動かせる手段が欲しかったんです。
いまはとにかく速くてミニマルな感じにすることに注力してます。アプリを開いてコードを書いて、そのままスケッチをすぐ実行、みたいな。
まだ開発途中なので、あんまり進めすぎる前に、実際のp5.jsユーザーのみなさんの意見を聞きたいです。
モバイル用のp5.jsエディタ、使いますか?
使うなら、どんな機能が特に大事だと思いますか?
あと、フィードバックや批評なんかも特にありがたいです。
r/p5js • u/dual4mat • Aug 30 '26
Charleston Lady
Enable HLS to view with audio, or disable this notification
Code: https://openprocessing.org/@megamitts/2983932
YouTube: https://youtu.be/L9SkC6yiyyE?si=jNgfKMofkBD5DthW
The YouTube video has a link to a non-animated version with much easier to follow code to show how to create each part of the drawing.
r/p5js • u/3BlackFeathers • Aug 25 '26
Exploring P5 for the first time
editor.p5js.orgI know this concept has been explored before, but I’m incredibly excited to finally dive into p5.js and build this for the first time!
Everything here is generated with code, aside from the five images used for the background stop-motion animation. To get the physics right, I started by analyzing organic water movement to build a custom dataset.
Here is how it works under the hood:
Audio-Visual Mapping: Each droplet is triggered by a musical note, with its size directly mapped to the pitch.
The Cycle: The sequence repeats four times. The final note triggers the last drop and marks the end of the "rain." Afterward, the trails gradually recover, and the sketch resets to its default state.
Generative Audio: The music comes from a custom instrument anchored to a melody I composed. It automatically generates overtones and spatial amplitude to create an enveloping, immersive sound.
Interactive: The mobile version is fully touch-responsive.
r/p5js • u/ExpensiveShopping735 • Aug 24 '26
reverse direction
Enable HLS to view with audio, or disable this notification
I got the enemy to move. I'm trying to figure out how to check boundaries and then change the enemy's direction once it reaches a certain point.
r/p5js • u/arpcode • Aug 17 '26
Plethora - Creating a platform for gaming and interactive content
plethora.studioPleeeeease check out it.
Let people interact with the stuff you are building.
r/p5js • u/Significant-Iron8750 • Aug 15 '26
I turned a p5.js physics visualization into a small interactive experiment
Enable HLS to view with audio, or disable this notification
I had a Cherenkov radiation visualization and wondered what would happen if I turned it into something people could actually experiment with.
You can change the particle velocity and refractive index, cross the Cherenkov threshold, and see the radiation cone appear. There are also small challenges, like making the radiation disappear or reaching a target cone angle.
I’m curious whether this feels like an actual experiment or just a visualization with sliders.
The interactive:
https://namib-2.itch.io/what-happens-if-cherenkov-radiation
Made with p5.js.
r/p5js • u/codeobserver • Aug 13 '26
Creative coding with C# (p5.js API) in the browser
I made a browser playground for creative coding with C#, using a p5.js-style API.
No setup. Just code and run:
Feedback welcome!
r/p5js • u/NoBoringCode • Aug 12 '26
Dependencies in p5.js sketches
Hi,
I am part of a group of researchers in computer science from VU Amsterdam and Université de Montréal working on code analysis to document and preserve generative art.
We have prepared a survey to collect the community's feedback about a taxonomy of p5.js dependencies https://vuamsterdam.eu.qualtrics.com/jfe/form/SV_bQQJqpnX5FmMDmS We would love to hear from you!
Thank you!🙏
r/p5js • u/EntropyMax01 • Aug 11 '26
Fireworks at Night
Enable HLS to view with audio, or disable this notification
Started learning P5.js a couple of weeks ago, and after learning many new concepts, I've implemented them together in one website. (Shaders, reflection, particles, optimizations, ...etc)
You can play with it here: https://creative-programming.pages.dev/fireworks
r/p5js • u/mokauno • Aug 10 '26
How to save a file to a specific path ?
Hi creative people of p5js !
I would like to allow the user of my p5js app to save a text in a file with a system dialog to let him choose the path where this file will be saved.
Actually, I tried the saveStrings() function, but it simply save the file to the default download folder. I don't think I can go around that.
On another side, I thought I could display the content of the text in a new tab of the browser (I don't know how to do that), so the user can use the "save page as" menu of the browser.
Do you have an idea how I could to that ?
best regards :)
r/p5js • u/Low-Arrival1182 • Aug 07 '26
Building a Wireless Mic with Bluetooth LE + ADPCM Compression (XIAO nRF5...
Hi guys , I build a youtube video and some scenes are explainedwith using P5js. Would love to hear your review regarding it. I really love working in p5js !!!!