Intro to Game Programming with JavaScript: Aftermath

Huzzah!

I know I certainly had a really fun time last night with everyone.

To recap, we did a walk through the Pong example (play it here, or read the code here) and saw a lot of things that are common to games programming. We looked at some ways that simple changes to specific values can have a huge impact on the look and feel of the game. We discussed the discovery process of programming and how integral the act of testing is to finding good gameplay elements. And we discussed some tools and habits that are good to learn to be a more effective programmer.
I want to get everyone started with playing with code as quickly as possible now. The more you do, the more you will learn. There have been tons of times in my career that I’ve pontificated on how to do something with no good result coming from mere speculation, only to be able to figure it out within minutes by just trying it. So with that in mind:

Game Programming: A Pong Clone

Class Time!

Tonight is the first lab session for our series on learning how to program in study of games with JavaScript. Can’t wait to see everyone here in just a few hours!

Additionally, for anyone who couldn’t make the weeknight-at-7pm time slot, I’ve cleared some time this Sunday to do a repeat/additional session–Sunday, August 12th, at 3pm. You can get tickets here: https://www.wepay.com/events/intro-to-game-programming-with-javascript-weekend-edition

Or hell, just click the button:
Sunday, August 12th, 3pm – 5pm, @ Hive76 Register

Pong!

The first game is, as promised, Pong. You can see the game in action here: http://wedusc.com/games/pong.html

And you can read the source code online in my GitHub repository here: https://github.com/capnmidnight/JS_Game_Programming_Class/blob/master/pong.html

I’ll have printouts for everyone when you get here. If this is your first time trying to read code, try not to cross your eyes too much. We’ll cover how to read code along the way.

Though this game is pretty simple, it has a few interesting features…

Continue reading “Game Programming: A Pong Clone”

Intro to Game Programming with JavaScript: Update

Only 5 Tickets Left!

Wow, these things are selling a lot faster than I expected. There is still a week left and most of the tickets are gone. If you’re still interested, you should hurry and buy one to secure your place. If you are interested but can’t make it to Monday, August 6th, leave a comment on what dates would work better as I’m looking to have an alternate class schedule as well.

Some Q/A

A few questions came up in the last post, so here are some answers summarized for anyone who doesn’t read blog-post comments.

  • What time is the class? The class starts at 7pm on Monday, August 6th, 2012.
  • Can I just show up? I would prefer if you signed up for a ticket first, so I know how many people are coming.
  • Is there anything we should have/know before the class? You’ll need your own laptop computer, we don’t have enough public computers to go around at Hive. I will briefly cover some options for text editors in a blog post or at the beginning of the class, but if you already have a favorite text editor like Notepad++, Gvim, or TextMate, then by all means use that. Also, it would be advantageous for you to setup some sort of webspace. There are some free places like 110mb.com, or you could even use the Public folder if you have a Dropbox account, which is quite convenient.
  • Is it just JavaScript in general, or does it include HTML 5 and Canvas? Various HTML 5 techs will definitely be covered, eventually. You can’t really do much graphically without it. JavaScript, HTML 5, and CSS 3 all go hand-in-hand. While there are some Dynamic HTML stuff that can be done (and we will certainly cover it just because DOM manipulation is a good skill to have), eventually Canvas and Audio are a necessities.
  • Why not do <insert language> instead? That’s a really big question…

JavaScript games

Just wanted to let everyone know that we’re about two weeks away from the class. You can still register for tickets at the Eventbrite page: http://www.eventbrite.com/event/3943958486?ref=elink

In the meantime, check out some of these games that other people have written to play directly in browsers with JavaScript and HTML 5 http://www.netmagazine.com/features/top-20-html5-games

In particular, if you can read code already, check out the source on Runfield. It’s not commented at all, but the code is fairly well structured.

These should give you an idea of what is possible; basically anything, really. There’s even one game that’s in 3D, *without* using WebGL. We’re not going to go that far (and honestly, I haven’t written a software rasterizer in more than 7 years), but that is quite impressive. When I started learning to program and playing around with little games in JavaScript many years ago, you couldn’t even write a full clone of the original Dragon Warrior and expect it to run at a reasonable frame-rate.

Here are a couple of more links to some game lists
http://web.appstorm.net/roundups/browsers/10-html5-games-paving-the-way/
http://www.casualgirlgamer.com/articles/entry/28/The-Best-30-HTML-5-games/

Intro to Game Programming with JavaScript

Programming is a lot of fun, and games are one of the best ways to get exposed to a variety of different programming tasks. My name is Sean McBeth and I’m versed in many ways of programming, having been working as a professional software developer for over 10 years. In that time, JavaScript has always been there for me. It is a language that everyone can run in some shape or form, thanks to the ubiquity of Web browsers; it is the BASIC of the modern computing era. Sharing that knowledge is important to me, so I am offering a class where everyone learns (or polishes) an extremely useful scripting language (JavaScript, aka ECMAScript, but NOT Java) in a very compelling medium (ahem, games).

Hackers on a Train

Our neighbors at Make Lehigh Valley are hosting Mitch Altman, Jimmie Rodgers, “and crew” (?) for a day of classes, workshops, and talks over at Hive 4A. Hackers on a Train sounds very exciting, and at only $35, it’s probably one of the cheapest ways you’ll get to meet such popular pirate-makers.

These three hours pack in just about everything you need to explore hobby electronics. As a workshop participant, you will learn the basics of Arduino, electronic components and how they interact. Then you will be instructed in soldering up Adafruit’s BoArduino kit. Your boarduino will be used to build a TV-B-Gone which will include learning to use a USB-to-serial ttl cable, the Arduino IDE, solderless breadboards and reading schematics to get their.

Philly Tech Week Signature Gala

We had an awesome time at the Philly Tech Week Signature Gala last week. While certainly any event with free booze is going to be a hit with us, it was surely all of the amazing people we got to meet. We had quite a few things on display and people were very interested in talking with us about our projects, how we got started, and even the very nature of hacking, DIY, and hackerspaces (To quote Adam Savage, “I reject your reality and substitute my own”).

Manning the table we had Jim Fisher, Chris Terrell, Dave Morfin, Chris Thompson, and me. Here is a video showing off our table and some of the things we had there.

Standing Workstations

So the word is out that sitting is bad. And most people have pretty bad ergonomics when they are sitting, anyway. This was certainly the case for me: my desk sits 30 inches above the ground, which is about 6 inches too high for my chair. If I were to raise my chair, then my knees would be overly strained. As you can see, my wrists are at a pretty awful angle.

Bad Ergonomics is Bad

Not to mention that I also have a serious clutter issue.

Clutter Clutter Clutter Clutter

And I can’t even see a large part of my second monitor.

Hidden Monitor
Whatcha doin' back there? Ya hidin?

I yearned for something that would, I don’t know, kinda… fix it.

Actually, now it kind of looks like an escalator for laptops.

And then I remembered, “I work in a freakin’ hackerspace! We have things, like tools, and wood! I could, you know, bang some hammers together or something.So I said…

So I took some measurements and tried to get a better idea of how this would work.

I was actually wearing shorts today, but didn't feel like drawing the back of a shoe.

And then I got really serious.

Aha! Why did I not just use real graph paper? What was the point of drawing a grid first? IDK, I was bored.

And after a couple of hours of banging hammers together, I had something.

It's ugly, but I don't really care. I am the awesomest boy in the world now.

You can’t really see it under there, but I also now have access to my printer, which before was under a pile of papers and other boxes.

UPenn Grasp Lab Robotics Demo

The University of Pennsylvania’s General Robotics, Automation, Sensing, and Perception (GRASP) Lab is performing a demonstration of their work on Saturday, March 24, 2012 from 1:00 PM to 5:00 PM (ET) at NextFab Studios, 3711 Market St., Philadelphia. The event is $30 to attend.

I don’t have very many details on what the event is about, but given GRASP’s description on their website that it “…integrates computer science, electrical engineering and mechanical engineering in a vibrant, collaborative environment that fosters interactions between students, research staff and faculty”, it sounds like it could be a very interesting demonstration of some top-of-the-line robotics research projects. From the details on their site, it looks like they do some work with autonomous drones and quadrocopters. Could be really interesting.

Event: Art Hackathon @ Hive76, March 10th and 11th, 2012

Hive76’s Art Hackathon

March 10th and 11th, 3pm to 7pm

For the second weekend in March, Hive76 is hosting a day of smashing, cutting, gluing, taping, painting, and general making and frivolity. We’re calling it “Art Hackathon”. Inspired by the Bravo TV Series Work of Art, and following closely in the footsteps of Art Hack Day, the event will focus on the rapid creation of meaningful works of art out of a provided supply of recycled materials.

Hive76 will provide massive piles of cardboard, tubs of glue, masking tape, tubs of spackle, box cutter blades, and a few cans of various colors of spray paint, to let every participating individual or team create a work of their choosing. The works will be based on a single theme, to be announced at the beginning of the event.

The event is split across two, four-hour days. While participants are free to use the time as they wish, the time is designed to provide time for planning on and a moderate amount of building on the first day, with some drying and curing time overnight before finishing up the next day.

A fee of $25 per person will be charged at the door, to cover the cost of materials and food that will be provided during the event for both days. Please RSVP for the event before March 6th by emailing smcbeth@hive76.org.