Author Topic: [Halloween 2018] The ScareCrow  (Read 219 times)

0 Members and 1 Guest are viewing this topic.

Offline Rbz

  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 2708
  • Karma: 484
    • View Profile
    • http://www.rbraz.com/
[Halloween 2018] The ScareCrow
« on: October 27, 2018 »
Hi,

Here is my entry for the challenge!

My first idea was to just make a painting of a scarecrow for practicing, but since I was learning some webgl/javascript I thought I could do something and here it's my first try on web browser coding, there isn't much here, just a particle effect + music player and of course my scarecrow painting.  ;)

I'm really impressed on how much you can do now on browsers these days, very fast and smoothly effects using webgl or even on html5 canvas 2D, pretty cool stuff.

The ScareCrow

Click on the button "Start WebGL Demo" or on canvas to start playing.

Code & Graphics: Rbz
Music: "Blown Away" - http://incompetech.com/
Some webgl code/matrix initialization from developer mozilla tutorial
Challenge Trophies Won:

Offline boogop

  • C= 64
  • **
  • Posts: 66
  • Karma: 42
    • View Profile
Re: [Halloween 2018] The ScareCrow
« Reply #1 on: October 28, 2018 »
I played with webGL some a few years ago, along with something like three.js, and was blown away by what it could do. Smooth is right, your prod is incredibly smooth even forgetting that it's running in a web browser. I've always been held up on this technology by the fact that writing web pages is one of the more annoying aspects of my job. But I'm also stuck in webforms (entity framework doesn't support sql2000 which my employer is on) in which dealing with postbacks and javascript are just drudgery.
Challenge Trophies Won:

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1197
  • Karma: 229
    • View Profile
    • Homepage
Re: [Halloween 2018] The ScareCrow
« Reply #2 on: October 29, 2018 »
Awesome painting!  :clap:
Hopefully youíll do some matte paintings (2.5d) in the future, you can turn this into one too.
Great music as well.

Itís cool to see you getting into js and webgl, itís so easily viewable on pretty much any device. And I hope to look into webgl more seriously in the future myself.
www.kirl.nl
Challenge Trophies Won:

Offline aNdy

  • C= 64
  • **
  • Posts: 34
  • Karma: 24
    • View Profile
Re: [Halloween 2018] The ScareCrow
« Reply #3 on: October 29, 2018 »
Stunning image!

Offline Rbz

  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 2708
  • Karma: 484
    • View Profile
    • http://www.rbraz.com/
Re: [Halloween 2018] The ScareCrow
« Reply #4 on: October 29, 2018 »
Thanks!

@Kirl: 2.5D matte painting looks really interesting, never heard of it before.
I found JS really easy to get, it helps that I've been coding on other languages for some time of course.
WebGL is Opengl ES 2.0 and I've done some of it on my experiments on Android, it was also really nice to code.

@boogop: I've checked webgl before (some years ago), but didn't have enough experience on opengl to fully understand it, also never liked html, always thought it was slow and incompatibly.
Now seems to be a standard that those browsers companies agree to follow (IMHO).
Challenge Trophies Won:

Offline ~Ar-S~

  • C= 64
  • **
  • Posts: 40
  • Karma: 24
  • Demo RuleZ
    • View Profile
Re: [Halloween 2018] The ScareCrow
« Reply #5 on: October 30, 2018 »
 :|| Great work !
Amazing GFX !
~ Ar-S ~

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1197
  • Karma: 229
    • View Profile
    • Homepage
Re: [Halloween 2018] The ScareCrow
« Reply #6 on: November 01, 2018 »
Actually I think parallax scrolling is the term I shouldíve used (although essentially the same idea as matteís). So basically 3d-ifying a 2d scene, by seperating elements in layers, so that you can create the illusion of depth by moving and scaling them at different speeds.

Iím not familiar with opengl, but I have written a few shaders in Codea (ipad coding app), which also happens to use glsl es2. So I hope Iíll be able to implement some of those shaders in my js prods one day. I gave up early on my last attempt because the examples I found seemed quite verbose. I guess should find a good webgl book, to get started for real.

Iíve also grown to dislike html, because back when I was doing a lot of js, each browser had their own interpretation of the standards, which were themselves in constant flux. Itís great to hear this may have improved nowadays. :)

Iím still a big fan of js because itís so accesible for any device with a browser.
www.kirl.nl
Challenge Trophies Won:

Offline Rbz

  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 2708
  • Karma: 484
    • View Profile
    • http://www.rbraz.com/
Re: [Halloween 2018] The ScareCrow
« Reply #7 on: November 01, 2018 »
One day I would like to do a demo using 2D animation like those used on a PS3 game called "Puppeteer" (of course not on the scale of awesomeness of this game :)  ), I think they used  this method you've said, it looks really nice and I loved that game.

I'll for sure code more things using js/canvas/webgl in the near future and hope to get more people here interested on this, because now on browsers you can do any kind of hightech demo you can imagine, there's also the new webgl2 that use opengl glsl es3, but you still can do alot with webgl1 too, and of course people can do all sorts of oldschool intros with it . 8)
Challenge Trophies Won: