Category: Code

Game AI Keynote Slides

Last week I went to the Game AI conference in Paris, arranged by the AI Game Dev web site to hold a keynote titled “Building the Battlefield AI Experience”. The slides to the talk are now available on slideshare and as a downloadable powerpoint file. If you want the quick version, flick through the slides online:

The powerpoint presentation and the two movies that go with it contain more information, however, including notes for each slide that loosely reflect what I was talking about in the presentation. They are all available on DICE’s publication page.

I’ll try to turn this presentation into a post in a way that makes more sense online eventually. If you’re subscribed to the AIGameDev web site you will be able to watch the presentation video online eventually as well.

Enjoy!

The Apple Voodoo

I love the iPhone. As usual when it comes to Apple gadgets, the feeling for design and thinking outside the box produced a phone that finally made me see the point of a smart phone.

The one thing that’s always bothered me though is the App Store and conditions. A central directory of apps and central point of download is a good idea. A standardized update procedure is an even better idea, at once solving all the bullshit problems windows users have to put up with (how interested are you in updating Adobe Reader or Java all the time, really?)

The one thing I don’t agree with is the approval process. And Apple just went from tolerably bad to intolerably worse on that one. I think it’s a bad decision to restrict what you may run on the phone and how, but it’s still a decision I can respect — their rules on how you execute stuff within the context of their operating system.

However, the new terms of service for iPhone OS 4 says this:

Applications must be originally written in Objective-C, C, C++, or JavaScript as executed by the iPhone OS WebKit engine, and only code written in C, C++, and Objective-C may compile and directly link against the Documented APIs

Here’s where Apple has clearly and definitely stepped over the line. Not only must the resulting application conform to certain demands, now my development process must conform to certain demands?

Code generation is an incredibly useful technique, and they’re banning it simply to stop the Flash compiler and make a grand statement? Either way, how in the world are they planning to enforce this? Will this lead to an arms race between Apple trying to detect application code that has been compiled to C, C++ or Objective-C and a company like Adobe making a compiler that compiles Flash to those languages in a way that looks as close to human-written as possible? Unless I have to submit a full-length video of myself coding the entire thing, there is just no way to tell with a reasonable accuracy.

How much collateral damage is acceptable, Apple? How many other companies and customers will suffer over your crusade against Flash? How many developers will hate your guts before this is over? There are just so many pins the developer voodoo doll will take.

The iPhone app craze will eventually die as more people realize the gold rush is over. And at that point, Apple can keep its Objective-C Nazi corner, while the rest of us go back to using the best tools for the task at hand.

The broken web

So I spent the day looking at web design again. I don’t do much of it anymore, but Lethania does and so I tend to get pulled into it. I later ran into this ad, which I thought was kind of funny:

I would be much happier if everyone could start creating flash-free websites. Anyway, today’s ordeal made me think back to the fine old days when everything was a table. HTML wasn’t made to display layout. The nice things about HTML, hyperlinks, worked just fine in regular text documents with some simple formatting, like bold and italic, its creator figured.

The nice things turned out to be really nice though, sparking an incredible development where pages got increasingly sophisticated layouts. The original HTML text format included tables, a fact which was quickly used to hack together all kinds of pages. A table could be used as a grid to stuff things into certain places, and a table inside a table could be used to create more interesting layouts, not to mention a table inside a table inside a table.

Because tables were meant to be (you know…) tables, different browsers rendered them slightly differently. Fine, if all you want is a table of text. Not so fine, if what you wanted was a pixel-perfect design. The solution to this was to add a whole slew of properties to each table, row and cell.

So after hacking together a sophisticated web site layout using table, the result was predictably a complete mess. The tables holding the text in place was mixed in with the text itself, making sites a nightmare to update or maintain, to not even mention changing the design.

A solution was clearly needed, to separate the design from the contents of web pages. So, why not adopt a language that wasn’t meant as a design language either? Sure thing, Cascading Style Sheets (CSS), a language meant for styling rather than layout was adopted during a long and slow process full of bugs, browser incompatibilities and new hacks.

Today’s standard of “good” for the web means using HTML strict (which few do) and control the appearance using CSS. The result is slightly less convoluted than the tables approach, but takes about 20 times as much effort to understand or write correctly, involves just as much hacking and is so fraught with peril that most people simply avoid it, going back to tables or mixing in horribly ugly JavaScript. Or, as seems to be extremely popular with games companies, insist on making the entire website in Flash, even though there’s absolutely no need for it.

So the page we were looking at today needed 3 columns of the same height. Let’s do it the old way with tables, for nostalgia’s sake:

<table>
  <tr>
    <td>Column 1</td>
    <td>Column 2</td>
    <td>Column 3</td>
  </tr>
</table>

Okay. Not too bad. So how to do this with CSS? Generally, you’ll need 3 DIVs next to each other, all with float: left. This makes them each have an individual length though. There are several ways to get around this, but none of them are good. The first involves stretching images across the DIVs as background images, which means you’re now bound to the color of those images instead of a color value. Also, you can’t have borders.

The second way we tried involved a very complicated set of maneuvers using three extra panes and shuffling content out the left side of the screen and then back in. The description for how to do this was about 10 pages long. And oh, it turned out to not work with borders either. Sigh.

So finally we found one way that seemed to work with borders. Only it didn’t, since you didn’t get any bottom border that way. The good part is that you could hack around that by using an image.

So for the old horrible table version, you substitute a mess of nestled DIVs and several pages of CSS, and it doesn’t even work fully without adding a picture where you essentially paint the entire bottom of the border along the page (yes, you actually paint a snapshot of your entire webpage, 1 pixel high). Way to go.

<style type="text/css">
      #container { float: left; background: url(images/example-6.gif)
          bottom center no-repeat; padding-bottom: 1px; }
      #inner { float: left; overflow: hidden; }
      #inner div { float: left; background: #ccc; border: 1px solid #000;
          width: 200px; margin-right: 5px; margin-bottom: -1000px;
          padding-bottom: 1000px; }
      #inner .col2 { background: #eee; }
      #inner .col3 { margin-right: 0; }
      .clear { clear: both; padding-top: 10px; }
</style>
...
<div id="container">
  <div id="inner">
    <div>Column 1</div>
    <div class="col2">Column 2</div>
    <div class="col3">Column 3</div>
  </div>
</div>
<p class="clear">

That seems like a great way to code! Not to mention that part of your design is now locked up in the image.

The best part about all of this is that it’s presented as “without CSS hacks”. Well, if having to use 6 nestled divs, large-number positive and negative margins and all kinds of bullshit like that isn’t an ugly hack, then I don’t know what is. The fact that the art of web design has advanced to the point where the normal thing you have to do is one big hack isn’t encuraging. And then they add the hacks on top of that…

I never liked tables, but at least they worked. In one of those memorable IRC quotes (in Swedish), someone said:

<sycon> imagine 1000 ants, tables are like the cage that keeps them in place, in the right place
<sycon> css is like a child with spasms trying to poke them all into place with chopsticks.

After spending countless hours trying to do seemingly simple things, I think I agree. Something’s still broken with the web, and no one seems to care to fix it. Well, other than inventing more workarounds.

But hey, at least you can draw Homer Simpson with it. So, ok, let the flak begin. Look, a Parrot.

WordPress image upload bug fixed

When upgrading my blogs to wordpress 2.9, I found that the image upload broke. After some fiddling around I managed to get a proper error message out of it, I managed to track down the error to the file wp-admin/includes/file.php, which used a ctype_ function that, for some reason, was disabled on my php version.

Funnily, the exact same bug has apparently been a problem on wordpress before, on version 2.5, in a different file.

Anyway, I fixed the problem. If anyone wants the fixed file, here it is:

Download file.zip

Download the archive, unzip the file.php inside and replace the one in your wp-admin/includes folder with it.

Web Form Verification for Dummies

The standard method for interaction with computer applications has gone from being the command line to being the native GUI, to being the web form. We were awesome at verifying input when it came from the command line — that was simple. Then we were kind of ok verifying input in the native GUI, although quality varied a lot more.

Now we suck at verifying user input from web forms. The current state of code that verifies user input has both managed to take us back to the kindness of the command line when it comes to freedom of input and manages to check all the wrong kinds of things. Why is it so hard to write these checks? I suspect because people don’t really think much about them, and I bet there are more interesting things out there than to write user input verification.

These problems aren’t some beginner coder errors either — they’re rampant on even the biggest sites out there like paypal.

The most common field to get me snared is the phone number field. In 99% of all cases, the site assumes that all phone numbers in the entire world are formatted like US phone numbers. Not, as one could imagine, because I’m claiming to live in America — I clearly just told the site that I live in a European country. So anyway, inputting my actual phone number causes an “invalid phone number” error. Not that there is any mention whatsoever on the site about what the correct format of a phone number is (there are, in fact, even several ways of writing a US phone number).

This sets off a wildly unamusing guessing game of how to “convert” my phone number into a format the site will accept. This practice often costs the sites money as I end up giving up and going somewhere else, frustrated and unable to make a simple online purchase that didn’t really require that phone number anyway, did it?

Passwords

Another highly amusing game is the one where web sites try to force users to choose “secure” passwords by enforcing the formats of passwords. “You must have at least 6 characters, with at least one letter and one number”. Sounds good, except in general these passwords are restricted to only contain letters and numbers. Hold on, isn’t it common wisdom to include at least one non-alphanumeric character in a secure password?

As such, out of my set of passwords, the only password which tends to pass most password verifications is my least secure one. The idea that you could fix a social problem through technology is somewhat funny anyway — “password1” is not more secure than “password” in any way that really matters.

ErrorThe same thing applies to the old trick of forcing your users to change passwords every month. This can have two potential outcomes — users append a counter to the end of their password, and increment it every time they are forced to switch, or they keep a post-it note taped to their monitor with their current password. Neither outcome is a net gain in terms of security.

Some sites even let the user set a password which is then considered invalid when the user tries to log in (ebay, for instance,¬† has done this) — causing a prompt for a new password and much annoyance.

Format wars

Parsing stuff is what computers are good at. So forcing me to input something in a strict format is always a loss. Either separate the fields and force me to select the individual parts of a date separately or actually use all that computing power at your disposal to do your user a favor. Telling me you have no idea what I mean by “2009-12-21” because you expected “20091221” is annoying the user for no good reason, even if you told me to not include dashes.

If you find yourself in a situation where you need to verify input¬† from the web, take an extra minute to consider how you could make things as convenient as possible for the user, which ones of your assumptions only hold true for the region you live in… and when you’re done, whatever you do make sure you tell the user exactly what the expected format is.

WordPress Themes