7 ms·

Holy shit! This is great presentation http://hello.p5js.org/ http://hello.p5js.org/

Flux159 12y ago
Wow. At first I thought it was just a video, but its more like an "interactive intro". I remember being introduced to Processing years ago in CMU's Intro to Programming class, glad to see that it's still being used and developed.
- BinaryBullet 12y ago
  Yeah... The interactive video is really cool. It looks like they're using popcorn.js for it (although I'm still watching, and haven't completely checked out the source).
deleted 12y ago
[deleted]
nfoz 12y ago
> Your browser doesn't support all of the features required for this demo. Please consider using the latest version of Chrome. I guess "today's web" is not an Open web, and has a single-point-of-failure hard-dependency on Google (at multiple levels).
- lccarrasco 12y ago
  played perfectly on Firefox (Win8.1 Firefox 31.0) for me, I think Chrome is just a suggestion.
- acdha 12y ago
  It also works in Firefox, Opera, and WebKit. The only modern browsers left out appears to be Safari 7 (no WebGL) and IE (Web Audio). Give it a year and both of those are likely to work.
  - fred_durst 12y ago
    Indeed. If the authors stop by, consider changing the message to something more like "Your browser does no appear to support a couple things required to play this presentation(WebGL, Web Audio etc). The latest versions of several browsers do. You might want to try one of those instead."
    - _lmccart 12y ago
      thanks, yes, working on a fix right now. we also want to make it clear that those things are not necessarily required for p5.js itself, just the demo.
      - soperj 12y ago
        but they're obviously required to do things in the demo no?
  - azmenak 12y ago
    Works perfectly in Safari 8 running in Yosemite Beta
    - acdha 12y ago
      Yeah, I'm expecting WebGL to be realistic for many sites in the next year. Even Microsoft is moving to automatic updates and Apple would be foolish not to release Safari 8 at least on 10.8/10.9 since the WebKit nightly builds run perfectly there.
  - isaack 12y ago
    Safari 7 has WebGL but is disabled by default. Enable developer menus, then click on "Enable WebGL".
  - masklinn 12y ago
    > The only modern browsers left out appears to be Safari 7 (no WebGL) Safari has WebGL since 5-ish but disabled by default. To enable, Safari > Preferences > Advanced > Show Develop menu, then Develop > Enable WebGL The presentation seems to work allright, although it suffers from some slowdowns.
- teamonkey 12y ago
  It doesn't work in IE11. That page (not the library) does a test for Modernizr.webaudio, which IE11 fails.
- nfoz 12y ago
  For what it's worth, I was browsing with Iceweasel on Debian-stable.
  - e12e 12y ago
    Well, you're comment made me aware I'd better restart my iceweasel session, I'd already upgraded from 29 to 31, but was running old code. And then I found out I'll probably have to reboot, as firefox/iceweasel tries to pull in nouveau-based drivers... and I'm running the binary-blob nvidia drivers. So, still no webgl, but with any luck xorg will come up with accelerated 3d on next re-boot - and webgl will work too. I do wish more hw companies would just release free and open drivers... This particular rig is a hand-me-down -- next gpu will be radeon, among other things for their efforts to be a better driver-citizen than nvidia. Even if for a certain set of configurations, nvidia has delivered better actual hw performance under Linux, for certain fixed configurations.
- chanux 12y ago
  It worked for me on Firefox. 31 but there have been so many times I was disappointed. Also the demo/intro was fantastic.
- deleted 12y ago
  [deleted]
owlish 12y ago
On a slow connection, between buffering and no rewind button, this was rather hard to watch.
JoshTriplett 12y ago
Definitely interesting, but it's unfortunately not very accessible; much of the information is only conveyed through the audio, and the video doesn't have any subtitles or a transcript.
recursive 12y ago
He keeps referring to "this circle", but I think I'm missing something. Is it a metaphorical circle? Edit: OK, eventually I saw some of the stuff he was talking about, but only around the edges of the video frame. It looks like the most of the demo part was hidden behind the video. Further edit: After trying it in firefox, I now realize that the demo just completely doesn't work in Chrome on my machine. The video plays with a big green rectangular background that pretty much breaks the presentation.
- bGriz 12y ago
  It's video in a canvas element which overlays a background canvas visualization. It's unclear in the video if P5.js controls both the video and the visuals, I suspect it does. However, it looks clear to me that a collision detection circle is added to the background visualization, and that the videography is designed to synchronize with that circle. The presenter's head represents the collision zone, where the circle is positioned. It makes the presenters head a "bounce away" zone. It's video/canvas orchestration. God I wish I could scrub the video, though. I would like to say it looks very neat. Hoping the guys chime in on how it parallels or surpasses existing tools. The canvas + feature mashup does appear to have great potential. There is limited reason to believe canvas elements are handicap accessible, unless you invest a large amount of time in custom markup configurations which the framework doesn't appear to have addressed.
Silhouette 12y ago
It's a neat idea, but I wish they'd just put the normal controls on the video. I couldn't read the text fast enough to take it in along with the voiceover, there's no ability to rewind if you miss something, and there's no indication of how long the whole thing lasts or whether you'll be able to replay it when it finishes. It sounds like I missed out on something interesting that happens later, but I gave up in frustration after a minute or two, and I expect I lasted longer than a lot of people will.
- bGriz 12y ago
  http://hello.p5js.org/assets/video.mp4 http://hello.p5js.org/assets/video.mp4
  - Silhouette 12y ago
    Thanks, but the video file alone loses the context that is intended. In particular, you can't see the other information that is overlaid in the intended presentation. I think this is a pretty good demonstration of combining video and non-video information, but it also demonstrates a significant weakness of doing that if you aren't careful about how to synchronize data from the different sources.
    - bGriz 12y ago
      Agreed.
bibinou 12y ago
source : https://github.com/scottgarner/p5.js-video/ https://github.com/scottgarner/p5.js-video/
enraged_camel 12y ago
It was good, but I don't know if I would call it great. The technology is interesting - and maybe that's what matters to most people here - but I found the male presenter (Dan?) to be... distracting, to say the least. My first thought when he started talking was, "wow, is this guy on drugs or what?" And I just couldn't focus on anything he said.
- mbrock 12y ago
  That was my first thought too. Dan might as well be wearing a "LEGALIZE LSD" t-shirt.
- maroonblazer 12y ago
  I had the opposite reaction. I found him laid back, fun and refreshingly unaffected. Not stilted or 'canned' as so many speakers can often seem, myself included.
- muuck 12y ago
  http://vimeo.com/channels/natureofcode/ http://vimeo.com/channels/natureofcode/ You'll get used to Dan very quickly after a few of these videos.
listic 12y ago
Doesn't display right for me http://i298.photobucket.com/albums/mm249/hrenistic/p5_zps40880acc.png http://i298.photobucket.com/albums/mm249/hrenistic/p5_zps408... Either on Chromium 34 or Firefox 30 on Ubuntu.

Wow. At first I thought it was just a video, but its more like an "interactive intro". I remember being introduced to Processing years ago in CMU's Intro to Programming class, glad to see that it's still being used and developed.

BinaryBullet 12y ago
Yeah... The interactive video is really cool. It looks like they're using popcorn.js for it (although I'm still watching, and haven't completely checked out the source).

deleted 12y ago

[deleted]

nfoz 12y ago

> Your browser doesn't support all of the features required for this demo. Please consider using the latest version of Chrome. I guess "today's web" is not an Open web, and has a single-point-of-failure hard-dependency on Google (at multiple levels).

lccarrasco 12y ago
played perfectly on Firefox (Win8.1 Firefox 31.0) for me, I think Chrome is just a suggestion.
acdha 12y ago
It also works in Firefox, Opera, and WebKit. The only modern browsers left out appears to be Safari 7 (no WebGL) and IE (Web Audio). Give it a year and both of those are likely to work.
- fred_durst 12y ago
  Indeed. If the authors stop by, consider changing the message to something more like "Your browser does no appear to support a couple things required to play this presentation(WebGL, Web Audio etc). The latest versions of several browsers do. You might want to try one of those instead."
  - _lmccart 12y ago
    thanks, yes, working on a fix right now. we also want to make it clear that those things are not necessarily required for p5.js itself, just the demo.
    - soperj 12y ago
      but they're obviously required to do things in the demo no?
- azmenak 12y ago
  Works perfectly in Safari 8 running in Yosemite Beta
  - acdha 12y ago
    Yeah, I'm expecting WebGL to be realistic for many sites in the next year. Even Microsoft is moving to automatic updates and Apple would be foolish not to release Safari 8 at least on 10.8/10.9 since the WebKit nightly builds run perfectly there.
- isaack 12y ago
  Safari 7 has WebGL but is disabled by default. Enable developer menus, then click on "Enable WebGL".
- masklinn 12y ago
  > The only modern browsers left out appears to be Safari 7 (no WebGL) Safari has WebGL since 5-ish but disabled by default. To enable, Safari > Preferences > Advanced > Show Develop menu, then Develop > Enable WebGL The presentation seems to work allright, although it suffers from some slowdowns.
teamonkey 12y ago
It doesn't work in IE11. That page (not the library) does a test for Modernizr.webaudio, which IE11 fails.
nfoz 12y ago
For what it's worth, I was browsing with Iceweasel on Debian-stable.
- e12e 12y ago
  Well, you're comment made me aware I'd better restart my iceweasel session, I'd already upgraded from 29 to 31, but was running old code. And then I found out I'll probably have to reboot, as firefox/iceweasel tries to pull in nouveau-based drivers... and I'm running the binary-blob nvidia drivers. So, still no webgl, but with any luck xorg will come up with accelerated 3d on next re-boot - and webgl will work too. I do wish more hw companies would just release free and open drivers... This particular rig is a hand-me-down -- next gpu will be radeon, among other things for their efforts to be a better driver-citizen than nvidia. Even if for a certain set of configurations, nvidia has delivered better actual hw performance under Linux, for certain fixed configurations.
chanux 12y ago
It worked for me on Firefox. 31 but there have been so many times I was disappointed. Also the demo/intro was fantastic.
deleted 12y ago
[deleted]

owlish 12y ago

On a slow connection, between buffering and no rewind button, this was rather hard to watch.

JoshTriplett 12y ago

Definitely interesting, but it's unfortunately not very accessible; much of the information is only conveyed through the audio, and the video doesn't have any subtitles or a transcript.

recursive 12y ago

He keeps referring to "this circle", but I think I'm missing something. Is it a metaphorical circle? Edit: OK, eventually I saw some of the stuff he was talking about, but only around the edges of the video frame. It looks like the most of the demo part was hidden behind the video. Further edit: After trying it in firefox, I now realize that the demo just completely doesn't work in Chrome on my machine. The video plays with a big green rectangular background that pretty much breaks the presentation.

bGriz 12y ago
It's video in a canvas element which overlays a background canvas visualization. It's unclear in the video if P5.js controls both the video and the visuals, I suspect it does. However, it looks clear to me that a collision detection circle is added to the background visualization, and that the videography is designed to synchronize with that circle. The presenter's head represents the collision zone, where the circle is positioned. It makes the presenters head a "bounce away" zone. It's video/canvas orchestration. God I wish I could scrub the video, though. I would like to say it looks very neat. Hoping the guys chime in on how it parallels or surpasses existing tools. The canvas + feature mashup does appear to have great potential. There is limited reason to believe canvas elements are handicap accessible, unless you invest a large amount of time in custom markup configurations which the framework doesn't appear to have addressed.

Silhouette 12y ago

It's a neat idea, but I wish they'd just put the normal controls on the video. I couldn't read the text fast enough to take it in along with the voiceover, there's no ability to rewind if you miss something, and there's no indication of how long the whole thing lasts or whether you'll be able to replay it when it finishes. It sounds like I missed out on something interesting that happens later, but I gave up in frustration after a minute or two, and I expect I lasted longer than a lot of people will.

bGriz 12y ago
http://hello.p5js.org/assets/video.mp4 http://hello.p5js.org/assets/video.mp4
- Silhouette 12y ago
  Thanks, but the video file alone loses the context that is intended. In particular, you can't see the other information that is overlaid in the intended presentation. I think this is a pretty good demonstration of combining video and non-video information, but it also demonstrates a significant weakness of doing that if you aren't careful about how to synchronize data from the different sources.
  - bGriz 12y ago
    Agreed.

bibinou 12y ago

source : https://github.com/scottgarner/p5.js-video/ https://github.com/scottgarner/p5.js-video/

enraged_camel 12y ago

It was good, but I don't know if I would call it great. The technology is interesting - and maybe that's what matters to most people here - but I found the male presenter (Dan?) to be... distracting, to say the least. My first thought when he started talking was, "wow, is this guy on drugs or what?" And I just couldn't focus on anything he said.

mbrock 12y ago
That was my first thought too. Dan might as well be wearing a "LEGALIZE LSD" t-shirt.
maroonblazer 12y ago
I had the opposite reaction. I found him laid back, fun and refreshingly unaffected. Not stilted or 'canned' as so many speakers can often seem, myself included.
muuck 12y ago
http://vimeo.com/channels/natureofcode/ http://vimeo.com/channels/natureofcode/ You'll get used to Dan very quickly after a few of these videos.

listic 12y ago

Doesn't display right for me http://i298.photobucket.com/albums/mm249/hrenistic/p5_zps40880acc.png http://i298.photobucket.com/albums/mm249/hrenistic/p5_zps408... Either on Chromium 34 or Firefox 30 on Ubuntu.