Home | Rules and Guide | Sign In/Create Account | Write a Post | Reddit | | #ludumdare on irc.afternet.org (Info)

Ludum Dare 29 — April 25th-28th Weekend [9 PM EST] — Theme: ??? (Slaughter!)
  • Ludum Dare 29 Compo Begins: in 9 days, 11 hours, 53 minutes, 21 seconds
  • Ludum Dare 29 Jam Begins: in 9 days, 11 hours, 53 minutes, 22 seconds
  • [ MiniLD 50 | Warmup Weekend April 19th-20th | Real World Gatherings | Ludum Deals | Wallpaper ]


    Posts Tagged ‘canvas’

    Our first Ludum Dare Jam

    Posted by (twitter: @sithdown)
    Saturday, August 24th, 2013 9:15 pm

    Good news, everyone!

    It turns out @Numa1988 and I (@Sithdown) have partnered in our very first LD48 Jam. He is gracing us with these marvelous, espressive characters, while I struggle to bring them to lif-err, DEATH.

    try(If you wanna smile/laugh click the image to view the GIF in its full size)

    Death, you say? Oh of course, let us explain. After some brainfarting we settled with one of Numa’s best ideas: You face an inminent death, so you have to act quickly to avoid that nefarious end: Interact with the objects and characters in scene to save your life. Just clicks and drags, as I wanted the game to be playable on any tablet and we don’t have time to use complex control schemes. Drag things, tap things. Yowzah! You win. Except when you lose.

    We had some difficulties on our late start (secondary computer won’t start) but we kinda sorted those down (thanks Compaq ARMADA M300, you saved our day!). As for the technical part, I decided to use canvasengine (which I didn’t use before, and yeah, I know how much learning to use the framework with so little time was a bad idea BUT who cares, we are here for the fun). It’s an easy to use framework, really -really- easy, but I found its documentation unsatisfying. Time was a precious thing for us so I just resorted to ugly fixes, hardcoded behaviours, and lots of crazy things I’m not embarrassed enough to admit.

    Where were we, the fun I recall? Oh, we had plenty. Some Coke and BBQ pizzas went down our throats; we listened to 8-bit music and some Megadrive classics OSTs, and oh for all the gods did you see those drawings? Hilarious. I’ve been staring at them almost as much as fiddling with the oh-so-messy-code. It’s been an hour since Numa went home and I’m supposedly cleaning the code a bit so we can continue tomorrow, but well, here I am slacking off and calling it a day. This is how the *game* looks and plays as of now:

    woah

    (I keep laughing like an idiot when the poor guy goes badass, thanks for your art Numa)

    We will add more characters and objects tomorrow, with some simple mechanics. Also, sounds/music. We thought of bfxr and some voiceover, but have NO IDEA on what to do with the music. Maybe no music is the best music we can achieve :P

    There were some undeveloped, ditched ideas, as a run from Marathon to Athens in 10(ten!) seconds preformed by a superhuman at several times the speed of sound. (That’s why there are a lot of ruins in there). There were more crazy ones involving japanese grammar puzzles, but… oh, I suppose we can’t do everything -for now-.

    Ah yes, *we* are @Numa1988 and @Sithdown, two Spanish guys seeking for adventure. If you see us on twitter say hi!

     

    So that’s all for now, I’ve been looking through the compo and there are quite many interesting projects! I’ll sure give them a go when finished :)

    Quick Tip for HTML5 Developers

    Posted by (twitter: @brianstegmann)
    Saturday, August 24th, 2013 9:15 am

    If you have jQuery included in your project, here’s an easy way to automatically pause your game if the user changes tabs or the web browser window loses focus:

    $(window).blur(function() {

    //pausing code here

    });

    Voila!

    LD26

    Posted by
    Friday, April 26th, 2013 7:58 am

    I’ll be attempting to use LibCanvas this time around.  Unfortunately, the documentation and some examples are still only available in Russian – but the engine looks too slick not to try.  Hopefully I’ll have something working by Sunday night!

    New Udacity course HTML5 Game Development

    Posted by (twitter: @tristan_lasty)
    Tuesday, February 5th, 2013 7:32 pm

    A new Udacity course has just begun, which may be of interest to (future) HTML5 game programmers.

    https://www.udacity.com/course/cs255

    (Or Watch the short intro video:  https://www.youtube.com/watch?feature=player_embedded&v=F3JeV756B7w )

    The course has only just begun so there is not much content yet, just Unit 0 and Unit 1.

    Free to sign up and participate.

    There are other courses too, ranging from beginners to advanced (python mostly, and even non-computery courses like physics, statistics, algebra)

     

    Frozen Fractal is in again!

    Posted by (twitter: @frozenfractal)
    Wednesday, December 12th, 2012 12:37 pm

    It will be hard to top the success of I Am A Ninja (LD22, 50th place) and Cytosine (LD24, 31st place), but I’m going to try my best.

    Like my last two games, this one will also be HTML5. I’m not yet sure whether it’ll be canvas2d or WebGL, but I’m leaning towards the simplicity of canvas2d.

    My previous two entries were written in raw JavaScript, but this time I’ll be using CoffeeScript instead. It’s just a more pleasant language to work with, and less verbose so quicker to type.

    For preparation, I’ve written a tiny Ruby webserver using Sinatra, which uses a Rakefile to automatically compile my assets:

    • CoffeeScript is compiled into JavaScript.
    • SCSS is compiled into CSS, using Compass for its CSS3 mixins (which automatically add vendor prefixes like -webkit- and -moz-).
    • Inkscape SVG files are exported to PNG files.

    This makes for the quickest development cycle: just save the file, and refresh the page.

    I have three rough game concepts. Here’s to hoping one of them can be bent to fit the theme.

    Good luck everyone!

    Frozen Fractal joining LD24, and announcing a WebGL library!

    Posted by (twitter: @frozenfractal)
    Wednesday, August 22nd, 2012 2:20 pm

    My previous <shamelessplug>entry</shamelessplug>, for LD22, being a resounding success, I’m now back for more! I used to be known as ThomasTC, but now I’m Frozen Fractal on here, frozenfractal on IRC, @frozenfractal on Twitter, and frozenfractal.com on the web at large.

    Like last time, I’ll be using HTML5 and canvas. Unlike last time, rather than plain 2D canvas, I’ll be using WebGL! It’ll be all fancy-like, with shaders and stuff. Maybe even 3D.

    This post is also a kind of base code declaration. “Kind of”, because I’m spending my free time this week writing my “base code” up into a nice open-source WebGL library!

    It’s called Gladder (GL-adder, or G-ladder, or just more glad, take your pick). Gladder is…

    • … opaque. It does not expose WebGL, but rather aims to wrap it in a straightforward way.
    • … thin. Many Gladder classes are direct equivalents of WebGL constructs.
    • … light. It has no dependencies, other than WebGL itself.
    • … flexible. It tries to make as few assumptions about your application as possible.
    • … unobtrusive. It does not change default behaviour of anything.
    • … cross-browser. It abstracts away browser differences.

    The only similar library I could find was Glow, but I found its documentation lacking (read: nonexistent), the website yellow, and the code messy. I’d rather write my own bugs than inherit someone else’s; that way, I have at least a sporting chance at fixing them.

    Another drawback of Glow, as with many other OpenGL wrapper libraries, is that it still forces you to deal with OpenGL and its state changes. Gladder aims to abstract all hidden state away and let you deal just with objects and draw calls. Here is an example; there’s still one gla.enable() call, but no code to bind shaders, programs, buffers, uniforms, attributes… all of that is handled behind the scenes. The advantage of not exposing OpenGL at all is that the library has full knowledge of the GL state, so it can skip expensive state changes whenever possible.

    Since I don’t yet know what type of game I’ll be making, I’m forced to keep Gladder generic. To do that, I’m working top-down from code samples. First, I come up with something I’d like to be able to do, like render a spinning cube. Then I’ll write the code that I would like to result in a spinning cube being rendered, but it won’t work because I haven’t implemented those parts of the library yet. Finally I write the library code that does the actual work behind the scenes. I might iterate a few times, cleaning up the example code even further. I hope this approach will result in a straightforward, easy to use API.

    You can get Gladder on GitHub. Several important things are still missing (e.g. modifying buffer data, loading textures from images), but I’m going to push hard to make it usable before LD24 starts.

    Note that the interface is still in flux while I improve things and make them easier to use. If you would like to use Gladder for the compo or jam, let me know and I’ll focus a bit more on adding JSDoc comments and more examples. During the compo you’ll be on your own though, because I’ll be busy making a game!

    Fake Atmosphere

    Posted by (twitter: @louroboros)
    Friday, May 4th, 2012 2:41 pm

    (This is a cross-post from my post-compo devlog.)

    I’ve been playing around with different ways to fake the atmosphere of a planet in a 2D canvas context.

    That’s interactive, by the way, so mess around with it (Chrome/Chromium is recommended!). Clicking on/around the planet changes the “angle” of light. You can get some pretty nifty looking results. I made this to determine what were reasonable parameter-ranges to use to generate plausible-looking planets.

    The way I get the sort of “volumetric” look for the atmosphere is really simple: I just stack many semi-opaque layers of the same gradient-filled-circle over the planet, each one having a radius slightly bigger than the previous.

    I actually threw this together using with a JSFiddle which you can view/hack here.

    Of course, I still need to figure out how to combine this with a surface/cloud texture (procedurally generated or otherwise…).

    JavaScript Tile Map Editor

    Posted by
    Friday, May 4th, 2012 8:05 am

    One of the things that took me a lot of time during LD23 was level design. This is partly because I didn’t have a tile map editor that I was familiar with and it seemed like working with the CSV data was good enough.

    I decided I wanted to have a more visual editor for future LDs (yes, I’m definitely doing this again!) so I made one. Of course, it’s in JavaScript since that’s what my game was made with and I’m trying to improve my JavaScript programming.

    Please, give it a try and let me know what you think in the comments below. I’m currently hosting it via Dropbox, but I may provide a more permanent home if needed. Also, if there is interest, I’d be glad to put up a bitbucket repo with complete source.

    It has been tested thoroughly in Chrome, and minimally in Firefox and IE9. I recommend using Chrome for now.

    Here’s a simple screenshot to give you a feel for it:

     

    alone with myself – progress, almost there !!

    Posted by
    Sunday, December 18th, 2011 10:20 am

    this is getting close to the end !!, add the main screen, story screen changed the game over, killed some minor bugs of the viewport, now missing the soundtrack, sound effects and build the final map.

    go go go !!

    First LD22 update

    Posted by (twitter: @colincapurso)
    Saturday, December 17th, 2011 4:38 am

    It’s been many hours since Ludum Dare #22 started. To be honest, I was really hoping for teleportation.

    So, just a recap, i’m doing a browser game using javascript/canvas. I want to do something darker than i’m used to.

    This is where i’m at at the moment http://www.stickymill.com/alone/alone_v0.01.html

    Screenshot gallery http://imgur.com/a/6jLGr

    Alone. For Now.

    Posted by (twitter: @adambair)
    Friday, December 16th, 2011 11:57 pm

    And so it begins. Normally I use Ruby/Gosu but decided to try something new… Goal for evening #1 (LD started at 9pm for me) was to get a base app created and deployed using Sinatra, JavaScript/CoffeeScript, HTML5/Canvas, SASS, and HAML. Success!

    code: http://github.com/adambair/afn
    game: http://afn.heroku.com
    log: http://afn.heroku.com/log

    Time to get some rest. More fun tomorrow!

    What i’ll be using

    Posted by (twitter: @colincapurso)
    Monday, December 12th, 2011 6:18 am
    • Language: Javascript / HTML5 Canvas
    • Art: Adobe Illustrator / Adobe Photoshop
    • Audio: If there is audio, i’ll be using sfxr and any modifications to that with Audacity
    • Base Code / Libraries:
      Asset Manager from the Google I/O presentation for pre-loading images.
      My base template
    • Screenshots: I’ll set up to take periodic screenshots, a word of warning though, I can’t guarantee it will be completely SFW :P

    I’m in!

    Posted by
    Monday, December 12th, 2011 3:09 am

    I just realised I hadn’t actually committed to LD22 yet, consider that rectified.

    This will be my second LD48, I did a platform game last time, it turned out ok, but I spent far too long fussing over the graphics and nowhere near long enough getting content in. Hopefully with that lesson in mind this weekend I can come away with something much more complete.

    As usual I will be using HTML5 Canvas / Javascript (all my own libraries / classes) and Photoshop for graphics.

    I am super excited this time, i’ve made sure the entire weekend is cleared of any commitments, the cupboards are stocked with programming fuel, and everything on my computer is organised and ready to go, it’s the most organised i’ve been in years :)

    HTML5 / Javascript gamedev postmortem

    Posted by
    Tuesday, August 23rd, 2011 2:47 pm

    So I chose to make a game with HTML5 / Javascript using the JawsJS html5 gamelib.

    I used the <canvas>-tag since I wanted to make a freeform level with pixelperfect collisions, basically I made the whole thing in graphics gale, could as well have done it in paintbrush.

    The new HTML5 <canvas> tag makes it easy to get the data in raw format, basically an array with RGBA values. From there on it’s to check collisions.. 1 pixel at the feet is a decent start.

    The most annoying thing is probably the audio-formats that’s supported for the new <audio>-tag.

    Safari doesn’t play OGGs for some lame reason, and Firefox doesn’t do MP3s. So all audio has to be provided in 2 formats.. also you wan’t detection at asset-loading time etc. I could have lived without that cruft.

    Otherwise Javascript has become amazingly fast, I think V8 is faster then ruby and python. All browsers come with good debugging possibilites.

    Javascript doesn’t have the traditional classes and inheritence, but rather prototypical inheritence.. which can be confusing at first.

    What I love is the dynamic nature of objects in Javascript.. basically all objects are big key-value storages (hashes).

    So you can whenever you want just set a new flag/property on whatever object.

    /* Player.dead has never been defined or used at this point */

    if(player.dead) { … do sometting …} // won’t throw any error.. played.dead will just return undefined

    player.dead = true

    if(player.dead) { … do something .. } // played.dead is now true and code will be executed

    The biggest upside with javascript is ofcourse ppl not having to download anything. No virus-scan etc etc. Just instant gaming. And the big players are making the javascript engines faster on a daily basis.

    Play my Javascript game here:

    http://www.ludumdare.com/compo/ludum-dare-21/?action=preview&uid=108

    Here’s a teaser-shot from the game, you start in the “west prison” and have to find your way out of a huge castle.

     


    All posts, images, and comments are owned by their creators.

    [cache: storing page]