7 ms·

Who needs Flash? Build Flash-like game with scripty2

52 points by milesf 16y ago

chaostheory 16y ago
akihabara (http://www.kesiev.com/akihabara/ http://www.kesiev.com/akihabara/) is better.
tzury 16y ago
When I read the tittle I thought there is going to be a library built on canvas with vector graphics capabilities. thank you, but no.
lhorie 16y ago
Linkbait title much? Comparing a js framework w/ the Flash platform is apples and oranges. Any decent web dev could port the API over to actionscript. Also, re: LOC, fwiw, you can do position/dimension .morph()'s w/ zero lines of code in Flash.
antidaily 16y ago
Nice work. Could do without the fancy animation at the end of the game.
- milesf 16y ago
  There's the source :) Remove it and re-release it. Which is, I suppose, the whole point.
ph0rque 16y ago
Is there a jQuery-based framework that's similar? I'm aware of GameQuery, is there anything else?
- madrobby 16y ago
  Disclaimer: I'm the author of the tutorial (and core team member of Prototype, and the author of scripty2) You can probably port the ideas and basic functionality very easily to other frameworks. Prototype or scripty2 don't contain anything specific to games, however. It's easy to write the interactions required in plain old JavaScript... I do like to use Prototype for stuff like this, because it helps clean up the "logic" code a lot (for example the "avoiding stuck cards bit", section 17 in the tutorial. Note that if you like this style of coding, but prefer jQuery, you can use the Underscore.js library, you might want to look into that.
milesf 16y ago
Here's my version (shameless self-promotion) http://coderpath.com/game http://coderpath.com/game
- veemjeem 16y ago
  So you're using prototype & scriptaculous to make a game. How is that easier than flash? How do I do particle effects using scriptaculous? How do I pair it with background music & sound effects? What if I wanted box2d style physics and collision detection? What's the proper way to animate a sprite? jQuery, scriptaculous, prototype, mootools -- all great javascript libraries, but not very good at game development.
kd5bjo 16y ago
When made a game for Ludum Dare last weekend, I decided to see what I could do with Javascript. It was actually much nicer to work with than the flash work I've done. You can play it at http://labs.haleret.com/ludumdare/ld17/ld17.html http://labs.haleret.com/ludumdare/ld17/ld17.html .
- samps 16y ago
  This game is actually fun! Great work and an interesting take of platforming.
Sindisil 16y ago
Very nice. I love the idea of "native" browser games. Sadly, even with the neat new things coming in HTML5 & CSS3, there will be big things missing. Highest on my list is decent sound support. Needing to provide both mp3 & ogg (since different browsers support different sound file formats), suboptimal support for mixing, and lack of decent programmatic control of panning or channel volume all stand out as significant deficiencies, especially as compared to Flash. Still and all, it's obvious that it's worth pursuing native browser games. Even without the sound support, there are a fair number of compelling games that could be done. Users often don't want the sound on in the browser games, anyway. Still, it makes the split between browser games and stand alone games wider than it needs to be, IMHO.
chime 16y ago
Keep up the good work guys. I'm loving all the JS/HTML5/CSS games coming out these days. I made another game this week: http://games.zetabee.com/chains http://games.zetabee.com/chains I hope to make tons more over the next month. I use Raphaeljs and JQuery. The best part about making games in JS/HTML is that you can pick and choose the good parts from each platform. It is easier to do rotations in Raphael so I use its .rotate() function. It is easier to make a navigation menu using ul, li tags in HTML/CSS so I use that and overlay it on top of the Raphael canvas. You can even use JQuery to bind events to nodes created by Raphael. I can easily include images and backgrounds natively and monitor mouse events. The best part is that the games work in all browsers and iPad/iPhone natively. Also I don't have to worry about loading native fonts etc. because I can just use the default browser fonts for most everything. Testing is also very easy because it's just a single JS file that I work with. I want to create a simple library for others to use but I don't have much idea on how to go about it. I don't expect to create something as complex as http://www.kesiev.com/akihabara/ http://www.kesiev.com/akihabara/ but I think having a good framework for creating browser-based games would help.
- kingsley_20 16y ago
  the mechanic in chains has a lot of potential. the implementation feels solid too!
andybak 16y ago
If you're going to put 'Who needs Flash' in the title then this is low hanging fruit. :-) Has anyone got any examples of more complex games in HTML/JS? I'd be interested to see how far people can push performance. The only benchmarks I remember seeing currently put Canvas+JS at a significant disadvantage over Flash but I'd love to be corrected on that.
- chime 16y ago
  JS/HTML5 games certainly won't replace every Flash game but given enough time, there will be a new ecosystem for these games. When Flash games came out, this is what everyone said and compared them to PC games. But now we have hundreds of thousands of Flash games coexisting with PC/Console games. I think JS games will flourish because they are so easy to make compared to Flash or PC games. Also, they work in almost all the new browsers/devices. Even though the speed/performance may not be up to par, good games will be made. And I'll do my best to make that happen. It is so much fun making these games. Seriously. Give it a shot. Flash games are a headache to build/deploy compared to plain-JS.
- WilliamLP 16y ago
  I have yet to see a game written in Canvas + JS that was anything but explicitly an advocacy demo for Canvas + JS. I don't think anyone is writing games with the main focus being to create something for the game's sake that people want to play. (A good metric would be, how many games or even demos are written in Canvas + JS where the author doesn't think it's important to mention the platform it was written on in the title.)
- nihilocrat 16y ago
  This is a much better example of games you might actually see on flash portals, done in HTML5: http://www.kesiev.com/akihabara/ http://www.kesiev.com/akihabara/
  - mikepurvis 16y ago
    Oh wow, those are great. It's been in my mind for years (basically since I discovered Comet) to create an in-browser 2D MMORPG based on a very large programmatically-generated trackable map. Looks like Legend of Sadness has got a start on at least some of that.
benologist 16y ago
Eh, as games go I'm not impressed. If you want to impress the guys using Flash to produce games (like me) you're going to have to make something much better than that. Show me something that fits in at Kongregate or ArmorGames, not something that was probably done in Flash a dozen years ago.
- milesf 16y ago
  Whoops. It seems you missed the point.
  - benologist 16y ago
    Half of the point seemed to be to build Flash-like games. That's not a Flash-like game it's a one page tutorial that's probably been written for every language in the last 30 years. The other half was who needs Flash? Until you can show games comparable to these - http://www.kongregate.com/top-rated-games http://www.kongregate.com/top-rated-games - with no omissions or compromises or exceptions, the answer is people who are serious about producing casual games need Flash. JavaScript is improving in a lot of areas but "not Flash" is a horribly weak argument especially when backed by examples such as this. "Not Flash" implies the platform's actually a problem itself ... consumers, developers and an enormous portion of the internet don't share that mindset. If you want to win marketshare against Flash you need to be better in most or all areas, not almost equivalent in some.
    - milesf 16y ago
      It's not about the game. You're still missing the point.
      - benologist 16y ago
        If your point isn't the title of your submission then what is it?
        milesf 16y ago
doki_pen 16y ago
Looks like it doesn't use canvas. I would expect that performance will suck and it won't get any better in the future. Am I wrong?
sshumaker 16y ago
I think the real news here is the release of Scripty2, the successor to scriptaculous. Check out this demo: http://scripty2.com/demos/cards/ http://scripty2.com/demos/cards/ All in 70 lines of Javascript.
kingsley_20 16y ago
for the real story on why non-flash web games matter, you have to look at ease of porting to mobile/smartphone/social network platforms. If you could write a game that had 50% of the richness of a flash game, but worked quite nicely on (highly monetizable) facebook and could be easily ported to the (highly monetizable) iphone, is that worth more to you than the richness and playability on IE?

52 points by milesf 16y ago

akihabara (http://www.kesiev.com/akihabara/ http://www.kesiev.com/akihabara/) is better.

tzury 16y ago

When I read the tittle I thought there is going to be a library built on canvas with vector graphics capabilities. thank you, but no.

lhorie 16y ago

Linkbait title much? Comparing a js framework w/ the Flash platform is apples and oranges. Any decent web dev could port the API over to actionscript. Also, re: LOC, fwiw, you can do position/dimension .morph()'s w/ zero lines of code in Flash.

antidaily 16y ago

Nice work. Could do without the fancy animation at the end of the game.

milesf 16y ago
There's the source :) Remove it and re-release it. Which is, I suppose, the whole point.

ph0rque 16y ago

Is there a jQuery-based framework that's similar? I'm aware of GameQuery, is there anything else?

madrobby 16y ago
Disclaimer: I'm the author of the tutorial (and core team member of Prototype, and the author of scripty2) You can probably port the ideas and basic functionality very easily to other frameworks. Prototype or scripty2 don't contain anything specific to games, however. It's easy to write the interactions required in plain old JavaScript... I do like to use Prototype for stuff like this, because it helps clean up the "logic" code a lot (for example the "avoiding stuck cards bit", section 17 in the tutorial. Note that if you like this style of coding, but prefer jQuery, you can use the Underscore.js library, you might want to look into that.

milesf 16y ago

Here's my version (shameless self-promotion) http://coderpath.com/game http://coderpath.com/game

veemjeem 16y ago
So you're using prototype & scriptaculous to make a game. How is that easier than flash? How do I do particle effects using scriptaculous? How do I pair it with background music & sound effects? What if I wanted box2d style physics and collision detection? What's the proper way to animate a sprite? jQuery, scriptaculous, prototype, mootools -- all great javascript libraries, but not very good at game development.

kd5bjo 16y ago

When made a game for Ludum Dare last weekend, I decided to see what I could do with Javascript. It was actually much nicer to work with than the flash work I've done. You can play it at http://labs.haleret.com/ludumdare/ld17/ld17.html http://labs.haleret.com/ludumdare/ld17/ld17.html .

samps 16y ago
This game is actually fun! Great work and an interesting take of platforming.

Sindisil 16y ago

Very nice. I love the idea of "native" browser games. Sadly, even with the neat new things coming in HTML5 & CSS3, there will be big things missing. Highest on my list is decent sound support. Needing to provide both mp3 & ogg (since different browsers support different sound file formats), suboptimal support for mixing, and lack of decent programmatic control of panning or channel volume all stand out as significant deficiencies, especially as compared to Flash. Still and all, it's obvious that it's worth pursuing native browser games. Even without the sound support, there are a fair number of compelling games that could be done. Users often don't want the sound on in the browser games, anyway. Still, it makes the split between browser games and stand alone games wider than it needs to be, IMHO.

chime 16y ago

Keep up the good work guys. I'm loving all the JS/HTML5/CSS games coming out these days. I made another game this week: http://games.zetabee.com/chains http://games.zetabee.com/chains I hope to make tons more over the next month. I use Raphaeljs and JQuery. The best part about making games in JS/HTML is that you can pick and choose the good parts from each platform. It is easier to do rotations in Raphael so I use its .rotate() function. It is easier to make a navigation menu using ul, li tags in HTML/CSS so I use that and overlay it on top of the Raphael canvas. You can even use JQuery to bind events to nodes created by Raphael. I can easily include images and backgrounds natively and monitor mouse events. The best part is that the games work in all browsers and iPad/iPhone natively. Also I don't have to worry about loading native fonts etc. because I can just use the default browser fonts for most everything. Testing is also very easy because it's just a single JS file that I work with. I want to create a simple library for others to use but I don't have much idea on how to go about it. I don't expect to create something as complex as http://www.kesiev.com/akihabara/ http://www.kesiev.com/akihabara/ but I think having a good framework for creating browser-based games would help.

kingsley_20 16y ago
the mechanic in chains has a lot of potential. the implementation feels solid too!

andybak 16y ago

If you're going to put 'Who needs Flash' in the title then this is low hanging fruit. :-) Has anyone got any examples of more complex games in HTML/JS? I'd be interested to see how far people can push performance. The only benchmarks I remember seeing currently put Canvas+JS at a significant disadvantage over Flash but I'd love to be corrected on that.

chime 16y ago
JS/HTML5 games certainly won't replace every Flash game but given enough time, there will be a new ecosystem for these games. When Flash games came out, this is what everyone said and compared them to PC games. But now we have hundreds of thousands of Flash games coexisting with PC/Console games. I think JS games will flourish because they are so easy to make compared to Flash or PC games. Also, they work in almost all the new browsers/devices. Even though the speed/performance may not be up to par, good games will be made. And I'll do my best to make that happen. It is so much fun making these games. Seriously. Give it a shot. Flash games are a headache to build/deploy compared to plain-JS.
WilliamLP 16y ago
I have yet to see a game written in Canvas + JS that was anything but explicitly an advocacy demo for Canvas + JS. I don't think anyone is writing games with the main focus being to create something for the game's sake that people want to play. (A good metric would be, how many games or even demos are written in Canvas + JS where the author doesn't think it's important to mention the platform it was written on in the title.)
nihilocrat 16y ago
This is a much better example of games you might actually see on flash portals, done in HTML5: http://www.kesiev.com/akihabara/ http://www.kesiev.com/akihabara/
- mikepurvis 16y ago
  Oh wow, those are great. It's been in my mind for years (basically since I discovered Comet) to create an in-browser 2D MMORPG based on a very large programmatically-generated trackable map. Looks like Legend of Sadness has got a start on at least some of that.

benologist 16y ago

Eh, as games go I'm not impressed. If you want to impress the guys using Flash to produce games (like me) you're going to have to make something much better than that. Show me something that fits in at Kongregate or ArmorGames, not something that was probably done in Flash a dozen years ago.

milesf 16y ago
Whoops. It seems you missed the point.
- benologist 16y ago
  Half of the point seemed to be to build Flash-like games. That's not a Flash-like game it's a one page tutorial that's probably been written for every language in the last 30 years. The other half was who needs Flash? Until you can show games comparable to these - http://www.kongregate.com/top-rated-games http://www.kongregate.com/top-rated-games - with no omissions or compromises or exceptions, the answer is people who are serious about producing casual games need Flash. JavaScript is improving in a lot of areas but "not Flash" is a horribly weak argument especially when backed by examples such as this. "Not Flash" implies the platform's actually a problem itself ... consumers, developers and an enormous portion of the internet don't share that mindset. If you want to win marketshare against Flash you need to be better in most or all areas, not almost equivalent in some.
  - milesf 16y ago
    It's not about the game. You're still missing the point.
    - benologist 16y ago
      If your point isn't the title of your submission then what is it?
      - milesf 16y ago

doki_pen 16y ago

Looks like it doesn't use canvas. I would expect that performance will suck and it won't get any better in the future. Am I wrong?

sshumaker 16y ago

I think the real news here is the release of Scripty2, the successor to scriptaculous. Check out this demo: http://scripty2.com/demos/cards/ http://scripty2.com/demos/cards/ All in 70 lines of Javascript.

kingsley_20 16y ago

for the real story on why non-flash web games matter, you have to look at ease of porting to mobile/smartphone/social network platforms. If you could write a game that had 50% of the richness of a flash game, but worked quite nicely on (highly monetizable) facebook and could be easily ported to the (highly monetizable) iphone, is that worth more to you than the richness and playability on IE?