The Car

I have the mk.2  car back!  It went together very well, though it was perhaps too tight in some places – the short loops and forks that hold the drive wheels to the gears needed to be shaved a little.  I added 0.1mm to the perimeter of all the shapes, and on thinking about it, it seems likely that it should have been more like 0.08 mm or so.  Needing to make adjustments that tiny is a strange business indeed!

Anyway, here is the finished product in all its lasered glory:

This time there were only two things amiss:  First, I didn’t account for the width of the AA batteries in the bottom compartment in addition to the holder for the power transfer gear, so it can only hold 1x AA in the bottom bay and 2x AA in the top – although you could probably pack a bunch of those squishy Lithium ion batteries in with no problem.  The other problem lies in trying to make the design too cramped – on each side, one wheel is attached directly to the motor, and one wheel is attached via a wooden axle, to a point behind the motor that powers the opposite side.  The current design is so compact, though, that there isn’t really enough room behind the motor for a solid fixture, and it has a tendency to fall off.

Widening the design by 3mm would solve both of those problems and the whole plan would stay well within the 181 x 181 mm limits set by Ponoko though, so I’m pretty pleased with the design.  Ideally I’d like to be able to keep the base design small enough that it can form the basis of a miniature robotics platform, and be able to have room on a P1 board to put holders for sensors or a small robotic arm. Stay tuned!

Arduino Enclosure

I also needed to make an enclosure for the Arduino Duemilanove as part of another project I’ve been tinkering with. After looking online I found surprisingly few examples anywhere – in particular a total absence of  compact, fully-enclosing cases, so I designed one and got it cut.  At first I was going to get it made in 3mm MDF as well but Heather suggested that an acrylic would be more pleasing and I agree.  It looks like this:

There are pass-through holes for the three holes in the Duemilanove board,  so it could be bolted to another object.  I offset the pats for this design by 0.1mm as well, and unfortunately, acrylic is a lot more brittle than MDF, which has meant a couple of small parts snapping off when I tried to force them.  Other than that, though, the design is perfect and the tightness has meant it keeps together really well!

The other good thing about sticking the Arduino in an enclosure is that you can stick other things to it – in this case I wanted to guarantee the orientation and position of a compass module on top of the unit, which is encased in the small box on top.

Once I made the enclosure design (and was able to verify that it actually works), I decided that it would be worth looking into making the interlocking parts more automatically.  I was inspired by Jared Tarbell’s Cubes to start thinking about how to generate the map automatically.  It’s still very much a sketch, but the principle is straightforward enough to automate most – if not all- of the process.

Lay out the lines of a shape by clicking, adjust the tooth width with the slider and hit ‘clear’ to clear the shape.  Enjoy!

Someone interested in the history of of User Interface (UI) will also know that the history on that front has not been quite so dramatic. From the first popular consumer mouse in 1984 to the present day, very little has changed about how we use computers. Mouse and keyboard, windows and icons – up until about 2007, when people started to get excited about NUI.

What NUI is depends on who you ask. People like Microsoft’s Chief research and Strategy officer, think that NUI means doing away with the mouse and keyboard entirely. Instead we should be doing all our computing with a tap of the finger or a gesture of the hand. Not to mention Steve Jobs’ claim that if you have to include a pen in an interface, you’ve screwed up.

While this enthusiasm for futuristic interfaces and simplicity of design is commendable, it ignores the fact that the mouse and keyboard are themselves pretty cool. The speed of input on a keyboard leaves writing, text-to-speech and neat alternatives like Dasher in the dust. The mouse is an incredibly accurate pointing device – one that may be wasted on the majority of computing tasks, but indispensable for CAD and other realms where exactness is more important than fluidity.

The problem with the over-enthusiasm to ditch the old and embrace the new and super-simplified is that it rings hollow to anyone who knows where the old fits best. If you tell a typist that speech recognition is the way of the future, they’ll know that you’re wrong on that point – and consequently will be suspicious of claims in other realms they have less expertise in. Promising that NUI will overturn everything in computing, rather than just where our current solutions need work, threatens to turn people off of the whole thing.

That’s why voices like Bill Buxton’s are so important. In a video interview this year, he said he doesn’t even like the term NUI, let alone the suggestion that it will replace everything. Take the time to watch the video, it grounds the conversation about what comes next in something a little more useful, while still being optimistic about what can happen.  I like his term “Appropriate User Interface”, because 1. it’s less dramatic and 2. it provides a reminder that the application -as in where an interface is applied – is more important than the amazingness of the new- or recently-fangled technology we have available.

Aside from the hilarity at 10:50 when he freaks the presenter out by standing way too close, I was really intrigued by the idea of using distance-aware displays to dynamically scale things up or down depending on how far away you are. I knocked together a Flash-based experiment to that effect. Have a look at it below!

the closer your monitor is to your webcam the better, but it’s an interesting experience having the size of an image remain the same relative to your distance from the screen! It give the impression, like Johnny Chung Lee’s experimnts, of turning the screen into a window through which you just see another world, rather than just a picture. I’m very interested in how this will feel built ino a more robust framework.

The complexity of the thing you simulate doesn’t have to be much either. The term “computer simulation” often evokes imagery of simulating enormous and complex systems – weather patterns or the turbulence flow from a large-scale atomic detonation – but simulation can be useful on a more modest scale too. In University, a friend of mine threw together a blackjack simulation.  He wanted to see the patterns of how well a virtual player does when it follows hard-and-fast rules – refusing cards over a total of 16, 18 and so on.* The first programmable computer, the Z3, ran at a staggering 10 Hertz – roughly one billionth of the speed of a modern computer. Even at that speed, though, it brought the science of aviation forward by a decade through simulating wing flutter at rates of execution that were previously impossible to reach.

The example I often use to explain my fascination with simulation is this: Imagine a child’s sand-pail at a beach. Imagine the light dusting of sand it gets from a long day of use. The smoothness at the joints, the build-up inside any detailing and under the lip. Now imagine taking the bucket away and leaving the sand – the suggestion of form but not the form itself. Next to impossible in reality, but in a simulation, once you have the base action down, setting things to on or off is the easiest thing in the world.

I’ve been using this example of the sand and the bucket for years now, and recently I decided to actually do something about it – make a sand simulation that can show you what I mean, rather than just telling people about it. Here it is! Just move the mouse around on the play field to shift the sand. If you want extra options for playing with the sand fall or changing the pen size, open the options panel. Many thanks to Aidan of Shade and Prime for the fantastic elevation visualizer.

iPhone app, anyone?

* While it might seem like this is a less-than-useful endeavour to use computers for, I’m sure we can all agree that it is better to test a virtual player losing virtual money than trying it at your local casino. In fact, after finding that there is no foolproof approach to blackjack, he gave up on it altogether and started putting his money in the stock market… you win some, you lose some.

I’m not sure whether this is re-creating functionality that other people have already put into papervision, but it was a lot of fun! There are some issues with shaded materials, but so far I have bitmap- and colour materials displaying and it’s looking good.  You can try it for yourself!  Like the pale text says – click in the window to add a vertex, press space to close the shape.  It seems to work even on pretty low-powered machines, so give it a try!

Of course, it’s great when GTA and WoW do it because you know that any investment you make in your character customization is going to be worth it.  Each new installment of GTA offers gameplay for dozens of hours, and you can play WoW, for better or worse, for as long as you can stand it without running out of things to see.  In games of this calibre, the new customization options are a welcome sight, and I enjoy discovering what new options are available as time goes on.

In a new game – particularly one without the backing of recognizable names – customization screens can have the opposite effect.  Without knowing a little bit of what I’m in for, it’s hard to muster up the enthusiasm to define my character.  If it’s a requirement, which it often is, I make rash decisions in a show of contempt for the system that end up making my avatar look something of a mess.  The remainder of my play experience is then realized through this hash of a character, and ends up tarnishing my experience of the whole game.  A difficult-to-implement feature, that is often considered a must-have for social games, can end up ruining it.

So customization screens as a first port-of-call are annoying, but so is a lack of customization options.  It can be made an optional, progressive task, as in GTA: San Andreas, but most games can’t afford to demand the sheer amount of time that GTA can.  In addition, games in a highly-connected, social space have to make this a requirement in order to make concurrent players distinct, so it has to be done, and done before a lot of the fun can begin – so the question we’re left with is “How do you give people a meaningful custom avatar without forcing them into a customization screen?”

Web development to the rescue

I’ve done time as a web developer before, and one of the technologies that has made the job much easier since the 1990s is the development of  Cascading Style Sheets, or CSS.   The Cascading part refers to a neat technique where more general definitions are are inherited by more specific ones, unless otherwise specified.  Basically this means if I want all text to be red, I say “All text should be red”.  Then, headings, subheadings, body and caption text will all be red – unless I want caption text to be green, in which case I say “All text should be red but caption text should be green”.  This has a significant advantage over defining each piece of text colour by hand in that it’s smaller to load, faster to write and easier to change if you decide you want to go with a slightly less gross colour scheme.

..So?

What I would like to borrow from CSS here is the idea that definitions can start out as vague, and become more specific with time – not just definitions of web pages, but definitions of character customization too.  Say I often have pale skin, wear glasses, grey shorts and a red-and-blue T-shirt (I do).  It wouldn’t be a bad place to start for every character I start out as to possess these properties,  and if I want to refine them further, I could.  If a game demanded a character that was an elephant instead of a humanoid, I might decide that I would prefer it not to wear glasses, but I’m not likely to resent the attempt, particularly if it was done automatically.

To an extent, Nintendo already does this with the concept of the portable ‘Mii’, which can represent you in a number of different games.  However, Nintendo requires that the Mii be presented indentically in all the games it appears in, which either limits the aesthetic of the game to the standard set by the Mii art, or jars with the artistic style employed in the game.  On the other extreme is Second life, where there are next to no restrictions on what you can do to your avatar or to your island.  The results of that aren’t pretty either.  I’d suggest we not go there.

I think it would be possible to find something in the middle.  If players could define a character appearance once. with some kind of open standard, then it would be possible to use that as a basis for any new character in a game.  If those parameters were made available to game developers, they could be integrated into the game in a manner that was in-keeping with the artistic direction of the game.  Players get avatars that they can immediately identify with, without having to invest time in building them,  Developers get a recognizable source of customization data that they can interpret how they like.  Everybody wins!

The following is the outcome:  Make sure you click inside the window to get it started, the keys are as follows:

Q: Toggles making the camera turn with the snake, so the head is always pointing down.

W: Toggles moving with the snake, so the head is always center screen.

E: Toggle turn amount (90º or continuous)

R: Get points (increase length)

Arrow Keys: Turn snake.  In continuous-turn mode, or in rotate-with-snake mode, left and right turn CCW and CW,  and in right-angle,  non-rotate mode, the arrow keys behave like a normal snake game.

What do you think of it?  How do the changes in presentation affect your feelings on the game?  Any reactions would be most welcome.

Personally, I’m pretty impressed by how different a follow-mode snake feels.  You could imagine navigating a much wider world, or even a looping one where subtle differences creep in over time. Making the game focused on the player (rather than the level) makes me think of it as a much more character- or story-focused environment.

I was also very surprised by just how sickening the motion is in first-person mode.  After messing around with it for about three hours today,  I think I’m going to need a lie-down.

LSO (Wikipedia) stands for ‘Local Shared Object’, and is a native  interchange format which is integrated into flash at the very core.  It’s also very old – They first appeared in Flash Player 6 / Flash MX,  so they enjoy near-universal support.  You create and edit them by calling

var lso:SharedObject = SharedObject.getLocal("local","/");

lso.data["message"] = "Hello, World (of Local SharedObjects!)";

The parameters here, “local” and “/” are less important than maintaining consistency.  They refer to how the locally-saved SharedObject data will be stored – something we don’t really need to concern ourselves with.    All we need to care about now is using this lso.data object as the container for the persistent data we want to store.  If a user leaves your website or closes the flash player window, the data is still stored in the same form as it was prior to closure.  It’s locally stored per-user on a machine so if the same user goes to the same window, then the flash files will have access to the same LSO.  The Wikipedia article suggests that some have gripes with this, since it’s a data store that isn’t flushed along with the other private data in a browser, but as long as you’re using it for good then it’s not the end of the world.  This has the upside that there is more limited room for abuse of things like number-limited offers – since nobody really knows about what LSOs are and how they work,

The other great thing about this system is that the objects are shared, so that any flash files (again, on the same domain and for the same user, to prevent misuse)  will have access to the same data.  So in FuelYourSenses I have about 5-6 separate .SWF files communicating with one another indirectly – told about new data through Event dispatches, and then reading the new data from these agreed-upon Shared Objects.

RTMP (Wikipedia) : Real-Time Messaging Protocol

RTMP is another one of Flash’s native tricks for multimedia streaming.  It’s a proprietary protocol, which means in order to get the full functionality out of it you need to buy the Flash Media Server, but for our purposes we were happy to use the very excellent opensource version or the Media Server,  Red5.  It’s a Java-based implementation that apparently only contains a portion of the full Media Server functionality, but it was more than sufficient for our needs.  If you’re interested in Media streaming (Audio, video, both or neither(!)) then it would be well worth your time to download Red5 and start experimenting.  The Demo files show you all you need to know to start recording and rebroadcasting streams as soon as you can get a server that you have permission to run a Java application on.  Once you have a video feed up, say, from a webcam or a locally stored .flv file, you just publish to the RTMP server and you’re done!  I was shocked.

EC2 (Wikipedia, Official site):  Elastic Compute Cloud

Amazon EC2 is a place where you can hire a (virtual) server by the hour.  You have full and unfettered access to machines that run either Linux or Windows,  with a number of pre-installed options for software provided by Amazon and other third parties.  We were initially unsure about the level of traffic the site would attract, whether one server would be sufficient or whether we would need to scale up.  Because of this, and the entirely reasonable concern that QTel had of letting a rogue developer have unfettered access to a server in their data center,  we decided early on to manage the audio/video streaming with a solution we could 1.  have complete control over without freaking anyone out, and 2.  scale without having to divert existing servers or purchase new ones.

EC2 isn’t the easiest thing in the world to work with, but there’s a lot of good help out there.  We learned a lot from this very useful Youtube tutorial.  We did as the tutorial says and used ElasticFox, Amazon’s Firefox plugin, to manage the whole process – without it I think it would be just about impossible.  Between that,  Amazon’s documentation and our undergrad dabbling in Linux we were able to select a flavour of Linux, install Apache, Java and Red5 .  The default installations are seriously minimal so you’ll have to install a lot of things that you would have expected to come built-in.

I hit an irritating stumbling block in getting a Linux instance up and communicating with my Windows desktop:  if you’re using puTTY rather than a straight SSH command in OS X / Linux, you’ll need to convert the keypairs as generated by Amazon,  into puTTY’s native format for handling credentials.  This is done with puTTYgen.  Aside from that and making sure that you have opened the appropriate ports for SSH and other traffic to the server, it was relatively straightforward.

All in all it was a fascinating project to jump into,  and I’d like to thank ADabisc and QTel for the opportunity to work on it.  The site went live on November 22, and after a pretty modest start it is now up to 10,000 Pageviews, and has broken 1,000 Daily views for the past 3 days!  Not bad for the 16 days or so it has been up.  My blog has had 1,800 pageviews in the 14 months it has been online,  so it has been by far the mos-viewed piece of work I have ever created.  The numbers are exciting but bring with them their own worries.

A lot of these guys have flickr accounts that show off some of their more entertaining screenshots as well, so I browsed through them too – it’s equal parts amusing and disturbing that the straight-up photography that we do*  ends up so strikingly similar – the sun at a certain angle, a piece of bark which must have looked spectacular at the time but looking somewhat nondescript on screen. I think there are some recurring images and patterns that we just like.

Anyway, I digress.  On Quasimondo I found a fantastic and reasonably lightweight face detection library.  I’ve been hankering after one of these for years.  I tried it, and it works reasonably well – better than I would expect in flash, certainly. This must be the lib that oaxoa used in his Rorshach mask – Mr. Doob too.  They both applied a large opaque decal on top of the face region, which looks great.  I wanted to try something different though, so I started to think about what you could use this face data for.    It might be possible to get some Johnny Lee stuff happening – I’ll need to play around with it a little more to decide if it can hold up to that – but what I ended up with is a 3d variant of Worm or Chopper or whatever you want to call it.  Here’s how to play:

Navigate through the space and collect as many of the tokens as you can – They were going to be carrots, and I started going down that road before realizing it was something of a Maxi-min, so they’re stuck as orangey-red triangular pyramids.  Here goes!

It’s not the smoothest of interfaces, but I’m sure it can be improved upon, even if I have to drop Flash for something more robust.  I recently noticed that the NeHe openGL resources are still being maintained, which is extremely tempting – especially since working in FlashDevelop has made me much more comfortable  with Visual Studio and “Real Programming”, although Ian has tempted me greatly with the promise of a genuine visual programming environment in Quartz Composer. We’ll have to see once I get some real downtime.

What do you think?  What would you do with this new face-detecting superpower?  I’d love to know!

* I consider myself part of this fraternity of flash dabblers, or would at least like to join them in due course.  I must learn their secret handshake!

Remember that if your camera isn’t showing up, you can open the settings panel to make sure it’s enabled and that it’s the right camera. On Macs especially, there are a number of cameras installed by default and it might not be auto-selecting the right one.

Also, only one program is allowed to have the webcam at a time, so you’ll have to make sure that nothing else is using it.

A little explanation:  The top left is the raw video feed, the top right is the difference between the current frame and the last one.

the bottom left is an accumulation of those differences over the past ~30 frames, and the bottom right is the actual effect – try moving around to see how it works.  The button in the middle lets you toggle between using the difference or the accumulated difference as the displacer.

Enjoy!

I began thinking about how to write an optics engine in about September 2008.  At the time, I thinking about more minigame scenarios for Casebook – specifically, to find something do with microscopy more that was more interesting than just pulling the focus, taking a stab at the correct zoom level or panning over an endless  expanse of dust specks.  I became intrigued by the complexity present in microscopy – beams of light reflected, focused, dispersed and focused again.

I started writing a 2D ray-casting system which could do the basic laserbeam-like  stuff. Intersecting with linear mirrors and bouncing off if they were reflective.  From there it was a simple step to add in partial reflectivity – (a white beam hitting a red mirror would reflect red, a blue beam wouldn’t reflect at all).   After that, it’s not a far step from that to implementing solid polygonal objects.  From there, in theory, it’s just a short jump to including a 2d physics (mechanics) engine like Box2D. From there it looks worthwhile to include image textures on said polygons, as well as applying forces on them at the point of ray intersections.

You may be able to see where this is going.  It’s a hobby project, so there’s no harm in it continuing indefinitely, though it helps to have an idea to work toward.  Since I’m in China, I thought it would be interesting to draw on some of the culture around me – my first idea*  was “There was a medieval order of monks in China whose daily lives revolved around doing interesting things with beams of light”. This is the picture I came up with to express that.

With a slightly more concrete direction to move toward, I was able to avoid considering the detail of what the game would be about or how the player would engage with it, adding the necessary engine features that would be required irrespective of how those decisions panned out.

So far, so good.  When I found myself with nothing to do but ponder what the game would actually involve, though,I was at a bit of a loss.  What does the player control?  How would a game progress?  It seems that no matter where a game is supposedly rooted, be it feudal Japan, post-apocalyptic Mars or Victorian England, the game always finds a way of shoehorning in the same mechanics.  I’m something of an activist when it comes to how the and how the interaction in a game relates to its premise, so if possible I’d like to go against that trend.

I’ve got here a bundle of (very) novel mechanics here, so I started by trying to extrapolate from the basic functions, what kind of play experience might to possible.

The first thing that springs to mind is the optics stuff.  As in the image above, having to get a goal object to be lit up, or for a beam to pass from one room into another without interruption would be a reasonable game task, and it could be explained in the context of the Monastery by saying that the place runs on light, and intermittent blockages, dusty mirrors or wild animals can come and interfere with the operation of the place.  Great! You could start out as a janitor!

Next, given what a mechanics engine is typically able to perform, I knew we could have the mechanics stuff like shapes falling, turning, connected by pivots and whatnot.  If you add in to that the ability to use lasers to cut those shapes, I figured we could develop some kind of object deformation, and that could allow for levels where the player is required to destroy an object or a machine. It would be a solid mechanic, but very similar to Nitrome’s Icebreaker or Eugene Karataev’s two Splitter games.   There would be differences – timing would become a factor, as a laser doesn’t have to cut through a block instantaneously, but it would be much the same mechanic. I anticipate daydream that it would look something like this:

Channeling blue light to cut up a red stone, but with Drama! (Drama = lens flares)

Then I remembered you could use this constructively, too – by chipping away at an object, or cutting out pieces of it carefully, you could fashion replacement pieces for existing machinery – a new cam, piston casing or something.  You could be the Order’s handyman too!

From there, I started to think about how the player could rise through the ranks of the place, and what other roles there might be to play.  Living in the Monastery, you may need to defend it, or attack it in order to oust invaders who have already infiltrated the place.

... Turning on the outside light?

Acting as an impromptu mirror during an inconvenient flood of god-rays.

Also, since the life of the people in the Order is defined by this light, they’d probably use it as the basis of technology.  I’ll write more about this later, but I’d like to see what I call “Brown-box” technology.  It’s not black box because you’re allowed to see inside it, but it’s not white box either, because you don’t need to (and indeed, unless you do, the action of the box is simplified down to being that component.   It’s something I’ve been pondering over for a long time, and a post by Colin Northway of  Fantastic Contraption got me thinking about how to have my cake and eat it too. Anyway, the brown boxes:

A mess of componentry in no particular order

More junk. I have some idea what it could be, but at this point, all of this is just some idea.

Next are some images that just help set the scene – I imagine that the monastery complex will have some very tall buildings, though the tallest classical structures in China (other than the walls and gatehouses) are these heavy stone pagodas. This one is fairly squat, but they can be quite dizzyingly high.

One of the shorter pagodas on a misty morning.

Finally, Some pictures that have more to do with just feeling out what the world will be like.

A precious stone protected by a cage of light beams. The beams just happen to look very dramatic too.

Dangerous fire-light could be used as a defensive mechanism, protecting valuable things and stopping animals from wandering into places.  Special stones and crystals could be used to convert light from one colour to another, to store energy, or to change properties (density, velocity etc.) upon charging.

A monument to the first guy who figured out how to play with light. May or may not be based on the Buddha.

Like the standard representation of magic, preparation or the special treatment of substances to reveal their particular powers could be quite fun.

Collecting... something?

All in all, while the scope of the idea is probably a little impossibly large, it means there is something to work towards, which I’m looking forward to continuing.

* Actually, the second idea.  Apparently “you’re an undergraduate physics student, experimenting at an optics workbench” doesn’t doesn’t set fire to the imagination as much as I had initially hoped.