All Topics:
apps
css
dashboard
games
javascript
php
tehcl
textmate
tools
video

My Zombie Video Commercial

published:
2009.10.20
topics:
video

In the spirit of Halloween, I wanted to post this zombie-themed video commercial for the Gopher Express convenience store. I did much of the writing, directing, and editing for the video with a lot of help from some very talented people. I was definitely making a deliberate nod at director Edgar Wright's work on Shaun of the Dead. I think it shows.

My zombie vide is titled, "Luuuuuuuunch." Watch it now!

I was extremely honored when this video won a Communicators Forum Maroon Award in the "electronic media, video" category in 2008. The video was also submitted this year to the Zombie Short Film Festival in Toronto. With some luck, my co-creators and I will be able to add a "double award-winning film" to our resumes.

[Fingers crossed.]


Equip > Pants, a "Bare" Minimum RPG

published:
2009.08.31
topics:
games

I've been tracking the Experimental Gameplay Project blog since its return earlier this year. I decided to enter the competition this month when I saw the August theme, "bare minimum," which they suggested could be anything including "graphics, sound, gameplay — some have even been so crass as to suggest clothing!"

My idea was to create an extremely basic RPG with gameplay throwbacks to NES titles like Dragon Warrior and Final Fantasy, but with even simpler graphics. The graphics concept I came up with was basically that anything in the game would be represented with giant square pixels of color. And then playing off the theme's implication of bare-as-in-naked, I came up with the game title: Equip > Pants. Here's a very brief review:

Having perhaps the highest hilarious: number of pixels ratio, equip > pants follows the exploits of a pantless hero who must don pants. -Experimental Gameplay Project

In the spirit of the Experimental Gameplay Project competition rules, I spent just seven days developing this game. I put in less than 40 hour of development time total.

The game is written in JavaScript, and should run fine in most browsers. Play it now. Click START below.

And after you've finished, check out the other games from the August theme. Just to give a few more technical details about the game: I used the DOM to draw the graphics instead of a canvas tag. Those of you with Safari, Chrome, or Firefox 3.5 should see a beautiful pixel font in the game thanks to an @font-face rule.

Oh, and don't mind the ABOUT / CREDITS link... that just goes to this blog entry. (Some places have linked to the game directly rather than this post.)


Where Is the Web Revolution Taking Us?

published:
2009.08.24

Today I read an article on happyworm.com titled "HTML 5 - The Revolution will not be Televised." It reminded me of some of the concerns I've been having lately with developments in the web industry. They are concerns I spoke about briefly at the end of my presentation on Web Human Interface Guidelines at MinneWebCon 2009, and now feels like a pretty good time to dust the subject off and say some more about it.

Specifically, I did not share the happyworm article's optimism about these points:

"It seems that it's not so much about the corporations anymore, more about the community."

"...a seismic shift in power towards the community and away from the browser vendors, the consequences of which cannot be underestimated."

First, let me start by saying I'm assuming by "community" the author meant web developers. It is important to note that Apple, and even more so Google, were heavily involved in the HTML5 spec and thus, if only by association, the demise of XHTML2. I ask if maybe the power has moved away from browser vendors towards content-provider corporations, and not towards the community? (It is worth noting that this is a very common trend now in America for decades.) The W3C ceding some control strikes me as perhaps further evidence that the community may actually be losing ground. Google entering the browser vendor market only serves to muddy the waters.

Some fraction of the web developer community was very excited by Google pushing HTML5. Some fraction was very disappointed. Can the community have the power if the community is divided? Maybe Google and Apple are listening only while it is convenient for them and their bottom line. Maybe the HTML5 supporters think they have power because Google's use of power just happens to line up with some of the web development community for the time being.

Personally, I'm very much a supporter of community-based web standards. I'm glad for now that we have Google and Apple blazing ahead with roughly standards-based HTML5, CSS3, and JavaScript. I certainly don't think we should give Microsoft the keys to the car. They've already shown us where they would drive it, if not deliberately then by incompetence or lack of vision. And I think we also must give credit to Opera and Mozilla. They seem to embrace community driven development. I think they've got our backs.

I do think we probably have little to fear on the CSS and HTML fronts. I think the illusion of community derived standards will continue, with the corporations that actually make the decisions acting mostly benevolently. Occasionally they may err on the side of progress over standardization, but the benefits of that will probably outweigh the problems.

I am much more concerned about JavaScript (JS), especially with how Google is positioning itself. We (web developers) enjoy fairly standardized JavaScript language for the moment, with a lush pasture of JS libraries, user interface (UI) toolkits, etc to choose from. Google has entered the browser market and is fully intending to create a browser-based operating system. I'm not so sure we can trust Google to act in the web development community's interests over its own corporate money-making interests in regards to web applications, specifically client-side JavaScript applications and web applications UI. I think there is a real possibility that Google may create a proprietary JavaScript web applications platform and lure many developers in via a "web standards" carrot, custom (read: proprietary) application toolkits with pre-built functionality, a captive audience, and a clear path to individual app monetization. I think this could create some real fractures in the JavaScript language and potentially even web development as we know it.

I will give a simpler example for my concerns for the future of community driven decisions in the realm of JavaScript and Web Applications UI. There has been some talk of incorporating jQuery as part of HTML5/JavaScript. If you are a Dojo, YUI, or Mootools fan, how would you feel about jQuery being selected as an early winner? What are the chances people will want to use some other JS framework, or Web App UI widgets built for some other JS framework, when jQuery would perform dramatically better because it is actually built into the browser?

It is far from certain, but we may soon find ourselves with far fewer choices as web developers than we have now. Or, maybe Google will "do no evil" and blow all of our minds with great stuff while having a ear in the web development community. I, for one, am watching carefully.


jQuery Patch: Animate CSS Rotation and Scale

published:
2009.08.07
topics:
css
javascript

I have created a monkey patch for jQuery 1.3.1+ which enables you to independently set and/or animate both the scale and rotation of any HTML content with jQuery. This code uses the scale() and rotate() CSS transformations that are only supported by Webkit, Safari, Chrome, and Firefox 3.5 at this time.

As an example I have some spinning HTML content below. You can click the content to increase its scale while it continues to spin. Try it out:

Click me to scale up!

After applying my patch, the following jQuery code is used to create this example:

setInterval(
    function () {
        $('#at_ex1').animate({rotate: '+=10deg'}, 0);
    },
    200
);

$('#at_ex1').click(
    function () {
        $(this).animate({scale: '+=0.33'}, {queue: false, duration: 1000});
    }
);

Features of this Patch:

  1. Get and set rotate and scale CSS transforms independently with the added custom jQuery methods rotate() and scale(). These work like setting any other CSS property, i.e. you are rotating to an angle not rotating by an angle. Example syntax:
    $('#example').rotate('30deg'); // rotates to 30deg
    $('#example').scale(1.5); // scales to 150%
    $('#example').rotate('45deg'); // rotates to 45deg
    $('#example').rotate(); // will return '45deg'
    $('#example').scale(); // will return '1.5'
            
  2. Animate rotate and scale CSS transforms independently using jQuery's animate() method. This works like any other jQuery CSS animation, i.e. you can rotate to a specific angle, or you can increase or decrease the angle of rotation by any number of degrees. Here are examples of both syntaxes:
    // Rotate to 30deg and scale to 125%
    $('#example').animate({rotate: '30deg', scale: '1.25'}, 1000);
    // Rotate by 30deg from current position and scale down by 10%
    $('#example').animate({rotate: '+=30deg', scale: '-=0.1'}, 1000);
            

Download and Usage

Download a zip file of the patch now or visit the project on GitHub.

This patch requires another one of my jQuery patches that adds CSS transform support to jQuery. The file jquery-css-transform.js should be included in your download.

To use this patch, load jquery-animate-css-rotate-scale.js after loading jQuery and jquery-css-transform.js. For example:

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery-css-transform.js" type="text/javascript"></script>
<script src="jquery-animate-css-rotate-scale.js" type="text/javascript"></script>

My Art from "Play" and "Together" Shows

published:
2009.06.28
topics:
games

A friend of mine runs umber° studios, an art gallery in south Minneapolis. The gallery is celebrating its second anniversary with a show titled "Together" that brings… together… all the artists who have shown work in the gallery in the last two years. The reception was on June 20, and the show runs through July 12.

Here's a photo of yours truly next to my submission — a nearly life size blowup of some pixel art I've been working on for Zachstronaut:

Me standing next to large pixel astronaut.
The postcard for Together show.

So like I said, the "Together" show was comprised entirely of artists who had previously shown work at umber. I had the great pleasure of showing a variety of fun pieces in a fall 2007 show titled "Play." The show was the idea of my friend Peter Smith, and I was very happy to have him invite me to be a part of it.

My art for the "Play" show was a juxtaposition (oh yes, I dropped the j-bomb) of video games I played growing up — which inspired my career path as a builder of the digital flavor — with the physical toys I used to build stuff as a kid.

First below, photos of four pieces done in LEGO brick on LEGO plate (left to right, top to bottom). Here are links to the games in question: Bubble Bobble (NES), Dragon Warrior (NES), Final Fantasy (NES), Super Mario Bros. (NES). Then, a piece constructed with dominoes, GORILLAS.BAS (QBasic).

Bubble Bobble.
Dragon Warrior.
Final Fantasy.
Super Mario Bros.
GORILLAS.BAS.
The postcard for Play show.

Actually, I had one more LEGO work in the show which was the heart containers from The Legend of Zelda (NES), but that piece has sold. If you're seriously interested in any of this art or commissioning a piece, contact me.

Surprisingly, I've never become a regular Flickr user, but I imagine I should get high-res shots of these up on Flickr or somewhere eventually.