(whistle blows)
- That's right, this is actually a third video
about the differences between p5.js and Processing,
and in this video,
I'm going to make a list of pros and cons.
I have to admit,
the list is going to be kind of a complete mess,
a terrible diagram.
Maybe somebody on the internet will make
some kind of group-editable document diagram thing
that looks much more beautiful
that we can all share and enjoy and look at.
But in any case, I'm going to go through pros and cons
and features of these environments and
where it might make sense to pick one over the other.
And that sort of thing.
And there's no hard and fast rules here.
I'm going to do my best,
and I'll also, going to answer some questions from the chat.
So, I'll see maybe at the end of this video,
maybe I'll see you in the middle,
maybe I don't actually see anybody,
'cause I'm just looking at a camera.
But, you're a real person.
Thanks for watching.
(whistle blows)
So question number one that came from the chat is,
"What about auto completion?
Does Processing or p5 have auto completion?"
Well first thing I should say is p5,
in the sense that I've shown you as find your own editor,
it's really about does the editor that you're using
have a plug-in or feature that does auto-completion.
And what is auto-completion?
Auto-completion is when you're typing ellipse or background,
and the editor itself gives you a suggestion
to fill that in for you.
And Processing three does actually have this as a feature.
So if I go to the preferences,
we can see here that code completion with control space.
So if I were to enable this, I could get code completion.
And let me give that a try right now.
So I'm going to check this,
and we'll see if I have to restart Processing,
which I don't think I need to do.
So, I could say something like f-i,
and then say control space,
and you can see now, I'm getting suggestions
of do I want to type in fill, filter, or finish.
And I want to do fill.
If I type it in, and it actually would give me
commas there if it had multiple arguments.
And I can say I want to make it some color,
and I could run it again, and we could see,
there we go, now I have it green.
So there is code completion in Processing,
but p5, when we publish a web editor
we could discuss does it have it, doesn't it have it.
But this is a feature that is part of the Processing editor.
Question from Potato Kaboom,
is asking about Eclipse and Processing.
One thing that you can do, you can make processing sketches,
and use the processing libraries
outside of the processing editor.
And you can do that with any Java editor like,
IntelliJ, or Eclipse, or NetBeans is one I think.
I happen to use Eclipse quite a bit,
and I do intend to make a video to show you
how to make processing sketches in Eclipse,
and we'll get to that soon as part of this series
about these different environments.
HNG, HNGSKJ, in that chat writes,
"What about shaders?"
So shaders are really, a shader is a program,
GLSL, Graphics Language Shader Language, GS-
I think I got that right.
Whatever.
(laughs) This is something that is part of WEBGL.
So, Processing as part of the p3 rendering mode,
natively has a way to load shaders,
and change properties in shaders,
maybe I'll open up one of the examples.
P5 shader support in WEBGL is coming soon.
It's a feature that's in development, if your a shader or
WEBGL expert and want to contribute to that,
jump on to the p5 GitHub and you can try to
search in the issues for WEGBL,
and you'll probably find where that is.
So let me at least briefly just show you here,
if I go to file, examples in Processing and
I go under Shaders here, under topics.
I could pick one, I don't know what's a good one,
let's try GlossyFishEye, that sounds like fun.
So if I run this particular example,
you can see that there are these PShader,
I'm standing in front of it, I know, these Pshader objects,
and you could see what this-
every time I click, I guess it changes some properties.
And so this is using a shader.
Shaders itself are beyond the scope of this particular video
but I certainly would love to come
and do some tutorials about shaders
or have a guest do that at some point soon.
Turkey in the chat asks about Mobile.
I completely forgot to add that here.
Here is something we can really put in both columns.
But the wonderful thing about working
in a browser based environment
is you've got Mobile essentially for free.
Because what you program to run on a browser,
on a desktop computer,
can run on a browser on a mobile device.
So p5 sketches will just work in both places.
That said, there are certain kinds
of features and functionality that you might want
that are different for a mobile environment.
And p5 is part of the library, has a ray to track
multi-finger touch events.
It has variables to keep track
of the phone's acceleration and rotation.
So there are a lot of features
of p5 itself that allow you access.
Now you might want to ask though,
"Can I actually make an app?"
Like, yes I know I could send people a URL...
P5 doesn't have any features for you to do that,
but there are systems.
I think the probably the most commonly
used one is something called Cordova.
Cordova is a framework that allows you to take a webpage
and turn it into a native application.
And that actually will allow you more access
to certain hardware things on the phone
that you wouldn't be able to just
through the browser itself.
Processing, because it's built
on top of the Java programming language,
you can actually make processing sketches in Android.
There is something called, Processing Android.
I believe if you go to android.processing.org.
You can add that as a mode to processing.
There are tutorials there, so you can build with
processing native Android applications.
This is not something I personally have
a lot of experience with, but it is out there
and I know it's project that always
needs help with maintaining.
Android's always changing, so if you're interested in that
and want to contribute to that, that's great too.
Fun Electronics Videos in the chat asks,
"What about exporting?"
And boy, this is another really big thing that I missed
from this list and I don't really have a lot of room left.
So, I'm just going to write it right here in the middle.
Exporting.
So one thing that's really good in terms of Processing,
is if, oh, I'm not in the frame.
(chuckles)
One thing that's really good about Processing
is if you want to make something that your exporting
to another environment.
For example, what if you want to render
a high resolution PDF that you can print
to a giant poster.
What if you want to export out and render a movie file
that you import into After Effects for an animation?
What if you want to make a stand alone application
that someone can double click and run?
So there are a lot of ways to essentially export
out your content from Processing to other environments.
This is a bit harder to...
Oh I'm in the p5 side, I wrote this totally
in the wrong place.
That's supposed to be over here.
This diagram is a mess.
P5, it's a little trickier to do that.
There's functions that exist in both, like Save.
Which allow you to save what you drew as a image
and in p5 there's a function that allows you
to save what you draw as an image.
But, unlike file management,
this also goes in this category.
File management, loading files, if you have a directory
of a thousand images, Processing very easily can just
open up the directory, read all the files in it
no matter what their name, stick them in an array,
load them all.
P5, as a browser based thing, doesn't have access
to your hard drive.
So you have to, kind of have images preset
in a certain way, so to speak.
They can be part of the sketch,
this is a longer conversation here.
But working with file systems is certainly a bit easier
to do in Processing and p5 you'll need a server side
framework like Node or something to go along with it,
to have that piece of that puzzle there.
And you can save files out, save JSUM, save image,
but all that's a little tricker.
A browser will just trigger an automatic download
to the downloads folder.
So it's a little tricker to manage all that sort of stuff,
but it's certainly possible.
I should mention that also Processing has a lot of features
and libraries for exporting 3-D models.
So, if want you want to do is generate algorithmically
some three dimensional form to 3-D printed,
that sort of thing, you can do that,
you can save STL files natively,
and I believe there are libraries for doing OBJs
and that sort of thing.
And I have to look into that and do a separate video
about that.
That's certainly another aspect of this.
Also that came up in the chat is Sound and Video.
Which I don't need to write here,
but both of these environments actually have sound libraries
and ways of capturing live and recorded video.
I think there are probably pros and cons in each.
Certainly, what's kind of amazing, what you can do
with web audio these days in the p5 sound libraries
written on top of that,
and there's also a Processing sound library.
If you're interested in that, maybe there's a separate
whole video or discussion about that.
But both of them have, both Processing and p5 have
libraries where you can get access to a live camera
or the microphone, or play sound files,
generate sounds, synthesize sounds, that sort of thing.
And I have a bunch of tutorials for p5, at least,
about sound.
So, thanks for watching this set of videos
about Processing and p5 and the differences between them.
I didn't really get to talk about Python at all,
but certainly if you're interested in number crunching
and data science, natural language processing,
Python is a wonderful language to explore as well.
And maybe someday I'll have some guests
on this video channel.
I'm sure you're going to have follow up questions.
You can, I don't know where the best place to compile
them is, maybe on that GitHub issue that I posted
in that chat, you can ask follow up questions there
and I can come back and answer those
on a live stream someday.
So, thanks for watching this video and I will see you
in the next one.
(whistle toots)
(upbeat music)