Microsoft Surface Pro

Feb 10 2013

Send to Kindle

Background

A few years back I was invited to Microsoft for a day with a small group of other bloggers to be briefed on what MS had going on and to speak with Bill Gates himself for a full hour. One of the things they showed us was the early prototype of the Microsoft Surface. At the time, it was basically a touch screen table. And it was amazing. This was before anyone had seen an iPhone or an iPad, so seeing and touching a real time interactive multitouch device left us all in awe. They also said that the future of the Surface probably included a more portable device – something you could carry from room to room, and maybe hang on the wall to watch movies,s play games, etc.

Well, time went by, people started creating other touch screen devices, the iPad came out and blew everyone away and the Surface became a rumored, yeti-like creature.

Then, some time last year, this video was released:

This video definitely captured my attention. And as more and more info on the Surface came out, I kept getting more interested. My weapon of choice has been a Lenovo T520 laptop. I love it to death, but it’s rather large. I’ve been eyeing various ultra-book type devices for a while now, but nothing out there really did it for me. And that upcoming Surface was still in the back of my mind.

Last fall, the Surface RT was released. This, unfortunately, did not interest me at all. RT only runs RT apps. It wouldn’t work for what I wanted it for. I wanted something I could use to do actual work, a full featured pc. So I’ve been holding out to see what the Surface Pro looked like.

So last week I ventured into the Microsoft Store at the Prudential Center Mall in Boston and checked out the prerelease demo models. I liked it. You couldn’t buy them or preorder them, but they would let you reserve one. I didn’t really expect they’d sell out early on release day (Saturday, February 9), but I figured it couldn’t hurt to put in a reservation.

Well, the day before release, New England had a massive blizzard, which shut down the area. In fact, a state of emergency was declared, the subway system was shut down and a travel ban on public roads was enacted. So it didn’t look like I’d be picking up my Surface on Saturday.

By late Saturday morning, the on-line store had sold out of Surface Pro 128 GB models, and there were reports of stores with long “Apple-like” lines selling out of the devices as well. I honestly didn’t expect that. So in the afternoon, when it became nice and sunny out and I had the car all dug out, I actually considered going in. I called the store to ensure they were open. I found out later that Microsoft had put all the employees up at a local hotel so they could get into the store in the morning for launch day. They were open, but informed me before I even asked that they had no more Surface Pros left. I said I had a reservation card and after a few minutes on hold, they said if I could make it in, they’d take care of me.

I made it in and got a 128 GB Surface Pro with a touch cover. All went smoothly. The best thing that happened in the store though, was overhearing this conversation between a woman who walked into the store and an employee:

Woman: “Do you have any iPhones in stock?”
MS Guy: “… um, no, this is the Microsoft Store. If you want an iPhone, you need to go to the Apple Store.”
Woman: “Oh… hmm… OK. … So you don’t have ANY???”

First Impressions

Thanks for putting up with all that, when what you really want to know is how the device itself is.

Short story: I like it a lot. Not sure if I love it yet or not. Much like Windows 8 itself, it’s so different than anything else that I think it’s going to take a while to figure out how it fits into my technological life.

The Surface is kind of like a tablet, but a bit heavy to walk around with and use one-handed like an iPad. It also doesn’t have the extended battery life that your usual tablet does. Average reports of around 5 hours.

But that extra weight brings you a lot. This is a very full featured computer with a core i5 processor running full Windows 8. I can install any program on here that I can install on a regular laptop or desktop Windows pc. And it runs those programs well.

The type cover is great. It snaps in solidly with a very strong magnet and is extremely usable. The screen is beautiful. It’s a bit small. I’m not sure how well I can use the screen itself for an everyday work pc. But it will connect to an external display.

The keyboard also has a track pad which, while not the best track pad I’ve ever used, is far from the worst. I actually find myself using it fairly often. When in desktop apps, the UI elements can be fairly small and hard to hit with a fat finger, so the track pad comes in handy.

The surface also come with a pen. This uses licensed Wacom technology, so the experience of using the pen as a drawing tool is outstanding. To be honest, the pen feels a bit cheap and plasticy compared to the beautifully solid build quality of the device itself. But it works, and is another option I sometimes use for hitting small ui elements in desktop apps.

Overall, the experience of using the device is very good. It’s small enough that when you are typing, your fingers are close enough to the screen that it’s quite natural to use the touch screen as needed.

There was a big media frenzy in the last couple of weeks about the available storage on the Surface devices being “less than advertised”. A real bunch of FUD, in my opinion. Yes, the OS and essential programs are going to take up space. Windows 8 is a full operating system, not a mobile OS, so it’s rather large. But this post really made my day, showing that a 128 GB Surface has just barely less usable storage than a 128 GB Mac Book Air. In fact, if you move the recovery partition off, it has more.

surfacemacbookzdnetcompare

Anyway, like I said, still getting used to this device and feeling out where it fits and what I’m going to use it for. I’ll report more as that becomes more clear.

Send to Kindle

2 responses so far

Winding Rules in HTML’s Canvas

Feb 01 2013

Send to Kindle

This is another one that a lot of people should already know, but I’m still betting that a few will find useful. Winding refers to the direction a path is drawn in – clockwise or counterclockwise. In many cases, this makes no difference at all, but there are cases where this is very important and can become a very useful tool.

Just realized that most of the examples I’m showing here could have been done just using a fat stroke instead of fills. My fault for poor examples. I was just trying to show simple shapes. This is still a very valid technique and useful for more complex shapes, such as the last example.

The most common use for this is drawing a shape with a hole in it. Let’s say we wanted to draw a black triangle with an empty hole in the center. We can simply draw a black triangle with a smaller white triangle on top of it.

  context.beginPath();
  context.moveTo(300, 100);
  context.lineTo(500, 400);
  context.lineTo(100, 400);
  context.lineTo(300, 100);
  context.fill();
  
  context.fillStyle = "white";
  context.beginPath();
  context.moveTo(300, 150);
  context.lineTo(450, 370);
  context.lineTo(150, 370);
  context.lineTo(300, 150);
  context.fill();

If the background is also white, this looks just fine.

wind_01

But what if we first draw something in the background, like this red bar?

  context.fillStyle = "red";
  context.fillRect(10, 200, 580, 100);
  context.fillStyle = "black";
  
  context.beginPath();
  context.moveTo(300, 100);
  context.lineTo(500, 400);
  context.lineTo(100, 400);
  context.lineTo(300, 100);
  context.fill();
  
  context.fillStyle = "white";
  context.beginPath();
  context.moveTo(300, 150);
  context.lineTo(450, 370);
  context.lineTo(150, 370);
  context.lineTo(300, 150);
  context.fill();

wind_02

The illusion is shattered. I once tried to change the second fill style from “white” to fully transparent with “rgba(255, 255, 255, 0)” thinking that it would overlay the black with transparency, but no, that does not work. Even if it did, it would also wipe out the red underneath it, so forget that.

The trick is to draw the second triangle within the same beginPath() / fill() section, and draw it in the opposite winding direction. Like so:

  context.fillStyle = "red";
  context.fillRect(10, 200, 580, 100);
  context.fillStyle = "black";
  
  context.beginPath();
  
  // first triangle (clockwise)
  context.moveTo(300, 100);
  context.lineTo(500, 400);
  context.lineTo(100, 400);
  context.lineTo(300, 100);

  // second, smaller triangle (counterclockwise)
  context.moveTo(300, 150);
  context.lineTo(150, 370);
  context.lineTo(450, 370);
  context.lineTo(300, 150);

  context.fill();

Notice that in the second triangle I swapped the first two lineTo statements, so it draws the triangle from the top, to bottom left, bottom right, back to top. This is counterclockwise, while the first triangle is drawn in the opposite direction. Because of this, the second triangle cuts out or subtracts from the first. This gives you the following:

wind_03

This works well for drawing lines with shapes. What about rectangles? Well, it won’t work with fillRect, as fillRect does it’s own internal beginPath() and fill() as part of its operations, so each call to it will draw completely separately, as in the first example. So you have to use the rect method. By default, all rects are drawn with the same winding, but there is a way to reverse the winding – just reverse either the width or height. An example will help:

  context.fillStyle = "red";
  context.fillRect(10, 100, 580, 100);
  context.fillStyle = "black";

  context.beginPath();
  context.rect(50, 50, 200, 200);
  context.rect(75, 225, 150, -150);
  context.fill();

Normally, you’d draw the second rect at an x, y of 75, 75, with a width and height of 150. But this would have the same winding as the first. Reversing either the width or height to become a negative value reverses the winding. Reversing both will send it back to the original. Note that you have to change the position on the axis you reversed the size on. So a position of 75, 75 becomes 75, 225, with a size of 150, -150. This gives you the following:

wind_04

Of course, you might be able to use clearRect, but that would wipe out any background as well.

How about arcs? If you’ve used these, you’ve seen that last boolean parameter and probably just ignore it or use whatever value you’ve gotten used to. I always use false. But if you want to punch a circle from another circle, to make a ring, for example, just draw them with opposite values for that last param:

  context.fillStyle = "red";
  context.fillRect(10, 100, 580, 100);
  context.fillStyle = "black";

  context.beginPath();
  context.arc(150, 150, 100, 0, Math.PI * 2, true);
  context.arc(150, 150, 70, 0, Math.PI * 2, false);
  context.fill();

wind_05

And of course you can mix and match these different shapes, though it might take some trial and error to get the different windings going in the right directions. Here’s a triangle with a punched out circle:

  context.fillStyle = "red";
  context.fillRect(10, 200, 580, 100);
  context.fillStyle = "black";
  
  context.beginPath();
  
  context.moveTo(300, 100);
  context.lineTo(500, 400);
  context.lineTo(100, 400);
  context.lineTo(300, 100);

  context.arc(300, 300, 70, 0, Math.PI * 2, true);

  context.fill(); 

wind_06

Well, that’s the basics on winding. Once you get it down, it can be a pretty powerful way of composing complex shapes.

Send to Kindle

One response so far

Scaling in HTML’s Canvas

Jan 31 2013

Send to Kindle

I’m probably not dropping any huge knowledge bombs here on many of you, but there are a few neat things about scaling when drawing to an HTML5 Canvas that I didn’t realize until a few months ago. So there are probably one or two of you who might find the info handy too.

Let’s say we’re drawing a circle in a canvas. We do this:

  context.beginPath();
  context.arc(100, 100, 50, 0, Math.PI * 2, false);
  context.stroke();

And we get this:

scale_01

(I’m assuming in all of these examples that you have an HTML document with a canvas element, and you’ve grabbed a reference to its 2d context, stored in a variable named “context”. You laugh, but someone’s bound to paste the above code into a text editor somewhere and complain to me that it doesn’t work.)

You probably also know that you can scale the circle like so:

  context.save();
  context.scale(2, 2);
  context.beginPath();
  context.arc(100, 100, 50, 0, Math.PI * 2, false);
  context.stroke();
  context.restore();

This scales everything by a factor of 2, so we get a circle that’s twice as large:

scale_02

But what might not be immediately obvious is the fact that the size of the shape, and the size of the stroke can be scaled separately. In this case because we set the scale before doing anything and restored the transformation matrix after all was done, everything was doubled, the size, the position, the stroke’s width.

But let’s try moving the restore line up before the stroke:

  context.save();
  context.scale(2, 2);
  context.beginPath();
  context.arc(100, 100, 50, 0, Math.PI * 2, false);
  context.restore();
  context.stroke();

This set up gives us a double sized circle, but because we cancelled the transform before applying the stroke, it stays one pixel thick, the default:

scale_03

We can even do the opposite and draw the circle the normal size, then scale up, stroke it, and restore:

  context.beginPath();
  context.arc(100, 100, 50, 0, Math.PI * 2, false);
  context.save();
  context.scale(4, 4);
  context.stroke();
  context.restore();

scale_04

So how is this useful? At least one great way: drawing ellipses. There is no native way to draw an ellipse in canvas. You can of course use some trig and draw a bunch of line segments, but that can be problematic. How many segments to draw? Too few for a large ellipse and it looks choppy. As the size goes down, you need less segments, and drawing too many is a waste of resources. Another complex and inexact solution involves using bezier curves. The easiest way is to just draw a circle scaled differently on one axis than the other. Of course, if you’re using a stroke on the arc, you can wind up with something weird like this:

  context.save();
  context.scale(10, 2);
  context.beginPath();
  context.arc(20, 20, 10, 0, Math.PI * 2, false);
  context.stroke();
  context.restore();

scale_05

See how the stroke was also scaled more on the x axis than on the y, making it look more like an Oakley logo than anything else. To fix it, just do what we did in the second example, moving the restore to before the stroke:

  context.save();
  context.scale(10, 2);
  context.beginPath();
  context.arc(20, 20, 10, 0, Math.PI * 2, false);
  context.restore();
  context.stroke();

scale_06

With this, we can even make a neat little ellipse function like so:

  function ellipse(x, y, w, h) {
    context.save();
    context.translate(x + w / 2, y + h / 2);
    context.scale(w / 2, h / 2);
    context.beginPath();
    context.arc(0, 0, 1, 0, Math.PI * 2, false);
    context.restore();
    context.stroke();
  }
  
  ellipse(100, 100, 200, 80);

I’ll leave you to work through that on your own. Here’s what calling it gives you:

scale_07

Finally, you can go really funky on it, scaling the shape one way and the stroke the other way, like so:

  context.save();
  context.scale(1, 2);
  context.beginPath();
  context.arc(100, 100, 60, 0, Math.PI * 2, false);
  context.restore();
  
  context.save();
  context.scale(20, 1);
  context.stroke();
  context.restore();

With a bit of experimentation, you can wind up with something that’s a half decent fake perspective:

scale_08

Anyway, old news to some of you, new news to others (I hope). More stuff to play with.

Send to Kindle

Comments are off for this post

Circle Layering

Jan 28 2013

Send to Kindle

If you were wondering where my last post was heading…

growth

growth2

growth3

growth4

Oops, gotta turn off the “capture cursor” on that screenshot program. :)

Anyway, this was an idea I first explored several years ago on my art from code site, but has been in the back of my mind as something I wanted to play with more. (see: http://www.artfromcode.com/?s=cells) In the end I ditched the whole idea of perfection I was going for in the last post, as the fact of the outer circles having some space at the end gives it a more organic feel. In fact, you can see that I even exaggerated the space in some of the examples. Well, just a quick follow up. Carry on.

Send to Kindle

4 responses so far

Working out a Math Problem

Jan 25 2013

Send to Kindle

So I had this idea the other day for a graphic effect. I thought it might be interesting to walk through how it went from concept to functional code. So here it is. The effect involved placing smaller circles around a larger circle. Here’s about what I was looking to do:

circle

Note that all the outer circles exactly touch the inner circle and all the outer circles exactly touch each other. There are no spaces and no overlapping. When I went about coding it and found there were a few different ways to do such a thing and it wasn’t as straightforward as I thought it’d be.

I first tried specifying the size of the inner circle and the size of the outer circles. You can then go around the perimeter of the inner circle placing as many outer circles as will fit. Rarely will you get an exact fit this way, which means that if you don’t overlap, you’ll have some space. You can either have one big space at the end, or try to precalculate how many circles will fit and space them out evenly. Not what I wanted.

Another option is to specify the size and number of the outer circles. You can then arrange them so they just touch each other, figure out how far from the center they are, which then lets you calculate the size of the inner circle. This was fairly easy, but not my use case. I wanted to draw circles around an existing circle of known size.

The final option was to specify the size of the inner circle and how many outer circles you want. You then just have to figure out how big to make those outer circles so they sit on the edge of the inner circle and just touch each other. This would work, but I didn’t know how to figure out how big to make the outer circles. Time for some math! And some sketchy sketches.

math01

 

I made the above sketches to get a clear idea of what I wanted to do. On the bottom left is the inner circle with a couple of the outer circles shown. I know the angle between them, as it’s just 2 * PI / number of circles. And I know the radius of the inner circle. All I need is the radius of the outer circles.

The drawing on the top right is a close up of the top triangle in the first one. Angle A is one half of the angle between each circle, or PI / number of circles. R is the radius of the inner circle and N is the radius of the outer circle. From this, I could come up with the equation shown:

sin A * (R + N) = N

In other words, the sine of angle, times the radius (R + N) equals the opposite side (N). Basic trig.

Now I just needed to solve for N. My algebra was a bit rusty, but after a few false starts I got it down:

math02

 

Bottom line: N = (sin A * R) / (1 – sin A)

So I put it down in code and amazingly, it worked. Here’s what I came up with. Be it known that this code has been worked over quite a bit. It was originally just the onload function with one long linear mess of statements and vars. Once I saw that it worked, I refactored it into some halfway decent functions and cleaned it up a bit. It could still use work to make it more reusable, but at least it’s readable enough to post now:

window.onload = function() {
  var canvas = document.getElementById("canvas"),
      context = canvas.getContext("2d"),
      width = canvas.width,
      height = canvas.height,
      circles,
      inner,
      count = 20;
  
  // create inner circle and draw it:
  inner = {
    x: width / 2,
    y: height / 2,
    radius: 100
  };
  drawCircle(inner);
  
  // get outer circles and draw them:
  circles = getOuterCircles(inner, count);
  for(var i = 0; i < circles.length; i += 1) {
    drawCircle(circles[i]);
  }
    
  
  
  function getOuterCircles(inner, count) {
    var circles = [],
        angle = Math.PI * 2 / count, // angle between circles
        outerRadius = getOuterRadius(count, inner.radius),
        r = inner.radius + outerRadius,
        currentAngle;
  
    for(var i = 0; i < count; i += 1) {
      currentAngle = i * angle;
      circles.push({
        x: inner.x + Math.cos(currentAngle) * r,
        y: inner.y + Math.sin(currentAngle) * r,
        radius: outerRadius
      });
    }
    return circles;
  }
  
  function getOuterRadius(count, innerRadius) {
    var s = Math.sin(Math.PI / count);
    return (s * innerRadius) / (1 - s);
  }
  
  function drawCircle(c) {
    context.beginPath();
    context.arc(c.x, c.y, c.radius, 0, Math.PI * 2, false);
    context.stroke();
  }
};

As you can see, a circle is just an object with x, y, and radius properties. Create the inner circle and draw it.

The getOuterCircles function creates an array of circle objects that are placed around the inner one. It needs the inner circle and the count of outer circles to create. This function uses the getOuterRadius function to get the size of the smaller circles. The var s represents sin A in the original equation. And (s * innerRadius) / (1 – s) is basically the (sin A * R) / (1 – sin A) that I originally came up with.

The rest should hopefully be pretty obvious.

To see it in action, check it out here: http://jsbin.com/icahul/1/edit

Send to Kindle

12 responses so far

Windows 8: Pinning Documents to the Start Page #2

Jan 10 2013

Send to Kindle

In a post last week, I gave a kind of convoluted solution to pinning a document to the Windows 8 Start Page. Jesse Freeman just pointed me to a Windows 8 app that does the same thing in a bit more of an elegant way: Tile A File. You simply start the app, browse to a file you want to pin, and tell it to create a Start Page tile. You can opt to use the default icon it picks, or choose a custom tile image. Nice solution.

Send to Kindle

One response so far

Windows 8: Pinning Documents to the Start Page

Jan 06 2013

Send to Kindle

Before diving into all the stuff below (which still might be useful in some cases) you might want to look at this post: http://www.bit-101.com/blog/?p=3657

If you’ve read past the post title and into this text, I’m going to assume you have some experience or at least some interest in Windows 8. Therefore you know that there’s a Start page with tiles of various applications installed on your system. You can rearrange these, remove and re-add them, and in some cases resize them. A lesser known fact is the ability to pin folders to the Start page – just right click the folder in Explorer and you’ll see a “Pin to Start” menu item.

What seemed to be missing for me though, was the ability to add documents to the Start page. For example, I have an Excel spreadsheet where I log all my running, with various charts, weekly and monthly tallies and other analysis all baked into it. I use it almost every day, so I thought it’d be nice to have it pinned to the Start page to bring it up as fast as possible. There doesn’t seem to be any automatic way to do this, but I did figure out a little trick. It’s not quite a single-click solution, but for those few documents you use all the time, it’s worth the minute or less that it takes to set up the one time. You could also probably create some kind of script or utility to do this, but not sure it’s worth the extra effort. Anyway, here’s what you do:

1. From Explorer, right click on the document you want to pin and choose “Create Shortcut”. This will create a new file next to the original, which is an alias pointing to the document.

2. Now you want to copy this shortcut into the following folder:

C:\ProgramData\Microsoft\Windows\Start Menu\Programs

It’s probably going to tell you that you need administrator privileges to paste it there. You can just click continue to acknowledge this, assuming you do have such privileges.

3. You may want to rename the file. By default it will be something like “Keith Running Log.xls – Shortcut”. This is what will show up on your Start page under the tile, so if  you want, change it to something like “Keith Running Log”.

4. Now go to the Start page. You won’t see the tile there, but start typing the name of the file and it should quickly filter it out. Now right click it and choose “Pin to Start” from the App Bar. Bingo! A pinned document. (You’ll see I got lazy and didn’t even rename it.)

Note that this is not limited to MS Office docs. As far as I can tell, any document with a registered extension that will open in some application can have this method applied.

I’d love to see a Windows update that makes this a bit more straightforward, but at least it’s possible.

 

Send to Kindle

8 responses so far

Game in Progress: Infiltration

Jan 04 2013

Send to Kindle

I just wanted to share a little bit about the game I’m currently in the process of creating. It will be a Windows 8 game, called “Infiltration”. The game play, as well as the visual style, is very much a homage to the arcade classic Gravitar, but it is far from an exact copy. The concept is that you have to infiltrate this alien world, fly through various barriers and tunnels and capture one or more targets. I guess I’ll make up a story of what these targets represent – information, energy crystals, or whatever. Anyway, once you grab all the targets, while avoiding being shot, taking out the guns that are shooting you, and keeping track of your fuel, the exit will appear and you fly into it to complete the level. Here are a few screenshots of some of the levels:

  

The controls are basically what you would find in Gravitar or Asteroids: turn left/right, thrust, shoot, with some friction so if you are drifting left or right you will come to a stop fairly soon. The world of the game has basic one dimensional gravity, i.e. your ship is pulled down so you need to regularly use some upward thrust to keep from crashing. Thrusting of course uses fuel and when you run out of fuel, you’re gonna crash. Most of the levels have fuel pods you can pick up to replenish your reserves.

A Word about Gravitar

Gravitar is one of my favorite old school video games. This is not to say that it was my favorite back in the day. I remember it in the arcades, but I never played it that much. Why? Because it was freaking HARD! Now I play it on MAME, which doesn’t waste my hard-earned quarters (worth a lot more back in the early 80′s), but I’m still not even close to beating all the worlds in the first universe. If you want to see for yourself how tough it is, try the online version here: http://my.ign.com/atari/gravitar.

Beyond the visual style and basic game play (fly, shoot, fuel, get out), I did want to capture a bit of that difficulty in Infiltration. So most of the levels are pretty damn hard. I imagine some casual users might consider a few of them impossible. But 1. I will have completed every level personally, and 2. I still don’t think it’s as hard as Gravitar.

If you are interested in Gravitar, you need to check out Dan Coogan’s Gravitar site. Seriously, this is virtual shrine to the game. There you can find screenshots and walkthroughs of every level, interviews with the creators, scans of the original manuals, flyers, ads, etc. There is even 350+ scanned pages of the original Gravitar design binder – original sketches, plans, meeting minutes, office correspondence about the game, cabinet specs, etc. An amazing resource to see what went into making a game like that back in the day.

Designing Levels

It became obvious to me very early on that if I was going to be designing a bunch of levels, doing it by plugging numerical coordinates into some kind of text document, loading the level, seeing what it looked like, tweaking the values and checking again, etc. was going to be very painful. So I set about making a graphical level editor for the game. This was also done as a Windows 8 app and became a major side project for a few weeks. I can now draw out a full level, place, move, and delete any game items, all with a full undo/redo stack, and load and save levels as JSON. It’s got a grid you can toggle on/off as well at toggle snap-to-grid, and inputting of level metadata. I’m pretty proud of it. Here’s what it looks like in action:

The next pain point was after creating a level, I had to add that level to the game project and compile the game. And then recompile the game every time I made a change. So I added a feature in the game itself to be able to load custom external (not compiled in) levels from the file system. At this point, I don’t even need to have Visual Studio open anymore. I create the levels in the editor and test them in the live game. Tweak the level, save, reload the level in the game.

This has worked out so well that I’ve decided to leave the external level feature in the game itself, and release the editor as a public app as well. So, when this is finally all completed, people will be able to create their own levels, play them, share them with friends, etc. Maybe I could even get some kind of best level contest going.

Current Progress

As of this writing, I have 23 levels done. I plan to have 30 in total. The first few are pretty easy tutorial-type levels. It gets tough pretty quickly after that though. I think I’m going to check out the try/buy functionality for this game, releasing a trial version with a selection of levels, and a full version with all levels plus the ability to load custom levels. The editor would be free, but only useful if you have the full version of the game. The trial may have ads as well. Not looking to get rich here, but I never signed my vow of poverty either.

I’ve been working on this since the beginning of October. So it’s been a couple of months and I’m itching to be done with it. I think there is little, if any, coding left to be done, just level creation, which I hope to wrap up by this weekend. Then I’ll probably need to tweak and rearrange the levels a bit to make them flow. Hopefully you’ll see this in the store by the middle of the month, if all goes right.

Send to Kindle

4 responses so far

2012 in Review

Dec 31 2012

Send to Kindle

Following a tradition several years in the running, I bring you my personal retrospective into 2012 and a glimpse into the new year.

In fact, 2012 followed much the same pattern as 2011 – some interesting stuff in the start of the year, a long period of just kind of being bored with everything, and then finding something to be excited about as the year drew to a close.

As 2011 ended, I was starting to get more seriously into JavaScript and web development. In early 2012 I posted a few opinionated opinions on object creation in JavaScript, which sparked some good conversation. I followed these up with a couple of articles on the same subject on the Adobe Developer Center.

In April I went to Beyond Tellerand – Play, a creative/development conference in Cologne, Germany. I revived one of my most popular talks, Playing With Chaos, for this conference, redoing all the examples in JavaScript. It went over amazingly well. The talk is always really well received. After that, I had the idea to turn the talk into a self published book and got a good start on it. But that kind of fizzled out after a couple of months. Perhaps I’ll revive it some time in the new year. You can actually watch the whole talk at the BT Play site, along with the other sessions.

It turned out that BT Play was the only speaking gig I did all year – the least amount of speaking I’ve done since I’ve started. I did have a couple of other opportunities to speak, but have not been super interested in doing so, to be honest. There are few if any “Flash conferences” around anymore, and even if there were, I’m not really doing any Flash these days. I don’t feel expert enough to try to get into the JavaScript conference speaking circuit. I probably could do more stuff like the chaos talk, which would go over well in any kind of creative type situation, but the impetus just wasn’t there for some reason. I guess another part of it is that the Flash conferences had a certain group of people you knew were going to show up. A large part of the pull to speak at these was the hooking up with friends from around the world and hanging out with them. I do miss that.

In June, my coworker and friend, Todd Anderson, and I went down to Austin for the TXJS conference, as attendees. It was very odd not knowing anyone else at the conference, and I’ll admit it, not having people coming up to me saying they read my books, blog, used my components, etc. It was also around this time that I started to get a bit bored with JavaScript. This statement needs a lot of clarification. I don’t have any problem with the language itself or what it can do. And at first, I was pretty excited about all the stuff happening in the community – so many new libraries and frameworks coming out all the time. But this latter part is what eventually got me bored with it. Too many frameworks, too many opinions. and everyone in your face telling you the RIGHT way to do things. I guess I was a bit guilty of this myself earlier in the year with my object creation posts. But I just kind of got tired of all the king-of-the-hill playing that’s going on in web development this last year or so. I got too caught up in the “how to” part and wasn’t really MAKING anything.

So you might have noticed that from June to August of this year I went pretty dark. Honestly I wasn’t even doing anything blogworthy. A bit of a technology sabbatical, covered well enough in this post. Also mentioned in that post is that Windows 8 programming is what pulled me back into activity. I now have two apps in the Windows 8 Store and am very close to having my next one ready for submission.

If it’s not obvious already, I LOVE Windows 8 programming. Everything I’ve done so far has been with HTML/JavaScript, which is the one thing that has most excited me over the last couple of years. But there’s very little of the community chaos that you get in web development. You are essentially developing for IE 10. So all the self-righteous, holier-than-thou web dev hipsters aren’t going to talk to you anyway. :) I’m not a standards guru, but from what I know, IE 10 is pretty good. And even if it’s not 100% standards compliant, since you are only developing for the one platform for desktop Win8 apps, it’s kind of a standard itself.  There’s none of the cross-browser / cross-platform stuff to worry about. Basically, you can just ignore all the noise and MAKE stuff. And that’s what I’m doing. And loving it.

On the job front, I’m still at Infrared5 and that’s all going pretty well. Although nothing jumps out as being hugely exciting there for me in the last year, there were no huge problems either. I did one project in ActionScript / Flex / Desktop AIR, which was pretty unique in that it embeds a Red5 server in the app itself to do local recording of video. I have Paul Gregoire to thank for the Red5 help and in hacking together a stripped down version of the Red5 server that could be run on the low end hardware we were targeting. It was quite a technical challenge and worked out pretty well. Most of the rest of the year I’ve been doing iOS stuff for a client of the company that keeps hiring me back. Earlier in the year I helped build out a custom iOS library for the client, and in the latter half, I’ve been helping to build an app based on that library – truly eating my own dog food! It’s an interesting situation to be working with the black box of a closed library that you helped build but no longer have access to the source of. A bit frustrating at times, but quite an eye opener as well.

So what’s in store for 2013? More of the same. Specifically, my plan for the moment is to participate in this: http://onegameamonth.com/ The One Game A Month… er… project? It’s not a game jam, it’s not a contest, it’s just a couple thousand people who say they are going to try to make a game each month for 2013. Fantastic idea. I’ve spent way too long on the game I’m currently working on. That’s a common problem with any personal programming project. There’s no deadline, so you fiddle with it forever, trying to make it perfect, eventually get bored with it and start something else. This boxes out your time. One month. Get it done. Ship it. The game I’m working on now will wind up being my January game, and I have a great concept for February. I’m excited about this.

I also really do plan to do more blogging. I’m going to try to put something up 2-3 times a week. Probably a lot of it will be about the game I’m working on at that particular time. Any tricks or tips, problems or insight.

Also, as many of you know from my tweets, G+ posts, other comments, and occasional mentions on this blog, I’ve been heavily into running in the last few years. This past year I ran my first two marathons and am now in training for my first ultramarathon, a 50K (31 mile) trail race in April. I don’t like to put too much of that info on this blog, but if you are interested to hear more about that, here’s another year in review post from that viewpoint, on my personal blog.

Send to Kindle

2 responses so far

Falling Balls Update

Dec 05 2012

Send to Kindle

At the end of October this year, Falling Balls was released into the Windows 8 Store. After just over a month, I thought it would be interesting to discuss how it is doing, and to answer the question, “should I build games or apps for Windows 8?”

Hard statistics.

Here you can see the download stats. It’s averaging roughly 900 downloads a day, with a best day of just over 1500, and generally trending up. The weekends usually see more downloads than the weekdays. You can also see the demographics of who is downloading the app.

As of this writing, the game has been downloaded about 25,000 times.

The dev center also gives you some pretty cool status such as average app usage per day. Amazingly, in mid-November, people were playing Falling Balls for an average of 17 minutes per day! Average! That’s insane. It’s now around 6-7 minutes per day, which to be honest, still amazes me.

Money.

So what about profit? I decided to follow the successful pattern of releasing the app for free and using advertising. I used Bing ads which integrate well in Windows 8 apps, but you can easily implement any other HTML-based ads in a Windows 8 HTML/JS application.

Here you can see daily ad revenue. There was a bug in my own code in the first release that was preventing the ads from showing up. Obviously, that got fixed on the 8th and has been generally uptrending since then, again with peaks on the weekends. Averages are in the range of around $5 on weekdays and $7-8 on weekend days. (The dropoff for the last day is just because the reports lag a day behind, so there is no data for today’s revenue yet.) In the three or four weeks that the ads have actually been appearing, I’ve made around $120-130. But I suspect that will increase a bit, especially since I’m planning a few upgrades to the game.

Summary.

So far, I can’t say that the game has been the runaway, oh-my-god-what-happened success that it was on iOS, but I’m sure there are a number of factors that play into that, such as the fact that iOS devices were broadly available for a year or so before the app store was open to developers. There was a huge base of people wanting new apps and games from day one. There is also a big difference between the mobile app store market and a mostly desktop / somewhat tablet based app store.

I’m hopeful that the trends will continue upwards as Windows 8 gains traction and more people get Win8 devices over the holidays and in general. But even so I’m not complaining. Already, I’m looking at a couple hundred dollars in passive income. Nothing to quit the day job over, but certainly welcome.

If the situation changes markedly in the future, I will be sure to report on it.

Send to Kindle

One response so far

« Newer posts Older posts »