Monday, January 21, 2013

On Resolution and Fonts

I wanted to talk a bit about screen resolution and fonts today. A larger resolution and font has been one of the most requested features in NEO Scavenger, and it has come time to do something about it.

Where We Are Now

NEO Scavenger currently runs at 800x600 resolution. Back when I was first making the decision on resolution, I chose 1280x800, half my monitor resolution, so I could see full-screen with 2x scaled pixel art. Shortly after that, I switched to 1280x720 (720p), to better align with standard HD.

However, since NEO Scavenger was originally intended as a portal-sponsored title, I decided to scale it down to 800x600, using 1x scaled pixel art. It was a tough decision (I liked the 2x scaled look), but it made better business sense at the time. (Portals typically have an upper limit of 800 pixels for game width.)

Outside of the portals, though, 800x600 is a pretty restrictive resolution. And while NEO Scavenger can be played in resizable windows, the nearest-neighbor scaling can make things pretty ugly. So if players want to see NEO Scavenger in a larger format, what resolution makes the most sense?

User Statistics

Before deciding on a new resolution, I thought it would be helpful to see what most users have. Unfortunately, that's one statistic the in-game NEO Scavenger metrics don't track.

However, one benefit of running one's own storefront, and hosting one's own game, is that I have website logs to turn to. It's not as good as tracking that info from within the game, but it's pretty close. So I opened up Google Analytics to take a look:

Figure 1: Total Visits Sorted by Screen Resolution
Hm, that's not as clear-cut as I had hoped. The top 10 resolutions only cover about 57% of all users. Worse still, look at the lower right hand corner. That's right, there are 1336 different screen resolutions used to view! (Also, damn! Missed it by one!)

Ok, so it looks like we'll need to do some data-slicing and bucketing.

Aspect Ratio

What about aspect ratio? Overall screen size may vary quite a bit, but surely most are either standard (e.g. 4:3) or widescreen (e.g. 16:9), right?

As it turns out, between the various device types (LCD monitors, laptops, netbooks, tablets, phones, index spiders) and display configurations (portrait vs. landscape, single vs. multiple displays), there are ~400 aspect ratios in the logs.

Fortunately, this is their distribution:

Figure 2: Histogram of Aspect Ratios
In other words, only a handful of aspect ratios are in significant quantity. And if one looks closely at the values along the x-axis, many of these aspect ratios are only marginally different. So I ran some algorithms on the data to group things further.

First, I grouped identical displays with different orientations, so portrait and landscape orientations were combined (with the largest dimension reported as width). I realize this may not be perfect, since users who prefer their monitors in portrait mode may not be willing to rotate their screen to fit a wide game screen.

However, since NEO Scavenger is a landscape-oriented game, accommodating portrait mode on most monitors would restrict the game screen considerably. It's current width of 800 pixels would already break the limits on many monitors. Besides, I suspect most gamers will have a landscape orientation, as that's how most games are designed.

Second, I grouped similar aspect ratios such that there was a +/- 8% tolerance in the final aspect ratio value. For example, 1.7708 and 1.7778 would be in the same group, but 1.6 would not. Doing so reduced the spread considerably:

Figure 3: Histogram of Aspect Ratios, 8% Tolerance
Now we're starting to see some familiar faces. 16:9 is the HDTV ratio, used with displays that are meant for 720p (1280x720) and 1080p/1080i (1920x1080), as well as many widescreen computers and tablets (e.g. WXGA). 4:3 is the SDTV ratio, which was common in older televisions and desktop computers, such as 1024x768 (XGA), 800x600, 640x480, etc.

16:10 is also quite common in desktop displays, as well as many tablets. And 5:4 is a common ratio found in many non-widescreen LCD displays.

Five buckets is a much easier dataset to digest. And fortunately, the answer seems pretty clear: the vast majority of users (~80%) are on a widescreen aspect ratio.

Screen Size

So what about the actual screen sizes? Assuming I decided on a widescreen format, what size would fit the largest number of users' screens?

To answer this, I took the most common 16:9, 16:10, and 4:3 resolutions, plus a handful of other common resolutions from the top of the web logs, and calculated what percentage of users could display each size without cropping. Here's what I found:

Figure 4: % Users Supported at Various Game Resolutions
Again, it looks like we're pretty fortunate. There are 5 screen sizes that would each support 90% or more of my site's visitors.

480x320 is there because it was one of the top 15 screen sizes, but it's a bit deceptive. It's actually a common smartphone screen size (e.g. iPhone, BlackBerry, etc.), so it's not likely players of the game as much as web surfers. Furthermore, the number of users in this screen size only account for about 1% of all users. They just have a tightly-grouped bucket. Like I said, deceptive.

That leaves us with 800x600, 1024x768, 1280x720, and 1280x768. I'd really like to do a widescreen format, since the data shows that most users have that aspect ratio. However, both the 1280x720 and 1280x768 formats would leave ~10% of the site visitors with a squashed or cropped screen.

However, as I'm mulling over these values, a thought occurs to me.

Steam User Data

Each year, Steam does a hardware survey of its users, and publishes the results. And with over 6 million concurrent gamers at peak, that's a lot of useful data.

So I grabbed their screen size data, did some number crunching, and applied the same filters and sorting as above. Here's what I found:

Figure 5: Histogram of Aspect Ratios, 8% Tolerance (with Steam)

Figure 6: % Users Supported at Various Game Resolutions (with Steam)
First of all, it's good to see similar numbers. I can't say for sure if my calculations are accurate, but at least they're precise :)

Once again, we see that widescreen is a big winner. And in fact, the gap between 16:9 and 16:10 is more pronounced. Perhaps even more heartening is that the top two widescreen resolutions are more widely available to Steam users. Just about 95% for 1280x720, and 94% for 1280x768.

The "Right" Resolution

So what's the "right" resolution for NEO Scavenger? I'm leaning towards 1280x720. Knowing that widescreen is more widely supported than not, I'd prefer to chose a widescreen format. The question is, which one?

Of the widescreen formats, it seems 1280x720 (720p) and 1280x768 (WXGA) are the two most viable. 720p is slightly more widely supported than WXGA in both my and Steam's users, so that's one reason to prefer that format. 720p also seems like a more standardized format, since it is the HDTV standard, and many devices are designed to support it for that reason (tablets, consoles, projectors, etc.).

The main reason to go with 1280x768 would be to get the extra vertical real-estate. However, when looking up screen sizes, it occurred to me that many 16:10 devices are computers, and this extra vertical height might be a design response to the OS taskbar. It's possible that designing software for 16:9 still fits a 16:10 monitor better, since it leaves room for tabs or other OS UI.

I can also see that 16:9 outstrips 16:10 considerably, in pure aspect ratio terms. It would seem that no matter the reasoning behind 16:10, 16:9 simply has more reasons to choose it.

So, 720p it is.

What About the 10%?

Unfortunately, choosing 720p still makes life difficult for 10% of my users (or 5% if you judge by Steam's numbers). What about them?

And what about the Flash portals? I'm always saying how I'd like to publish NEO Scavenger's demo on portals for broader awareness. Won't this screw that up?

It does. And to the question prior: I'd like to support them too, if possible. So my current plan is to see if there's some way I can setup the UI to work in both 800x600 and 1280x720 modes. It's a daunting task, since the available real-estate is quite different. And it means storing either two different sets of coordinates and zoom, or else some sort of UI-scaling rules.

Neither are going to be trivial. But I think it's at least worth trying.

And What About Fonts?

Right, I mentioned fonts too, didn't I?

Fonts are another area that needs improvement in NEO Scavenger. More than a few users have complained of eye strain trying to read the tiny pixel font in NEO Scavenger.

I'd like to just bump up the font size, and be done with it. However, the font I'm using is actually a custom made one. So simply scaling it up won't make it clearer. It'll still be pixelated, because that's how it was designed.

I briefly started toying with 3rd party fonts, like Arial, Verdana, etc., but then the question of licensing popped into my head. I did some research, and for a moment, thought I was in the clear. Then I saw a comment that gave me pause.

So I did some more research, and then it seemed like I was in the clear again (search for the string "SWF" in that last link). Unfortunately, after an hour-and-a-half of this ping-pong, I was only learning one thing: font licensing is in a state of hell, and I want to have nothing to do with it.

My current leaning is to just eat the time cost and make my own font again, just for a larger size this time. The only thing that bothers me is that I don't want to "guess and check" a bunch of times if each time means designing a font. They don't take too long to make if you know what you're doing, but I can't afford to make 15 different fonts just to find out each doesn't look right.

So what I may do is use well-known fonts to gauge the size and style I want, then go make my own in the same style and size.


Lastly, a note about scaling. Whatever screen size I choose, it won't fit everyone's screen. So when the game goes to full screen, it won't always be a perfect fit. So I have some choices to make.

The first one is whether or not to scale at all. I think this one's a given. Some folks just want to zoom in, and see things bigger. So I plan to make the game scale up to fit the full screen, but maintain the aspect ratio, using black to pad the extra space. I'll probably also add an option to just leave it at 1x zoom with black bars at full screen, for those who want it (should be trivial to add).

The second is what type of filtering to use. Up until now, it used the default flixel nearest-neighbor filtering. This type of filtering produces clean, crisp images when zooming in whole increments (e.g. 2x, 3x, 4x). However, fractional zooms (e.g. 1.5, 2.1) produce horrendous artifacts. This is likely the source of many font complaints so far.

I could switch it to use bicubic (or similar) filtering. This would make things look smoother when scaled, but would also introduce blurring. I opted not to do this originally because it's usually better used on photos than pixel art.

However, it may be an improvement over nearest-neighbor if I am to allow non-integer scaling of the game (which is likely, given the wide array of screen sizes in use). I think other games, even pixel art games, are doing this nowadays, too.

And then there's the question of whether to change fonts when scaling. This might be overkill, but it might look better if graphics use one filter, and fonts another. I haven't tested it out yet, though.

For now, I'm getting things setup for alternate screen sizes in the code, so I can start testing these ideas. I welcome any advice or experience on the matter!

Monday, January 7, 2013

2012 Retrospective

With the ringing of the new year, I thought it might make sense to look over the previous one, to get a sense of where I've been, and what that might imply about where I should go next.

January 2012

Twelve months ago, I was just becoming a Canadian permanent resident. After months of sitting on my hands, it was time to start making things official. I still had a lot left to do before launch, but I could finally submit paperwork and other requests, and start on the process of making my dream business a reality.

NEO Scavenger already looked pretty much like how it does today:
January 2012 vs. January 2013
January 2012 vs. January 2013
However, despite the shared map and item graphics, quite a lot changed under the hood. These changes are only hinted at by some of the UI differences shown above.

NEO Scavenger finally got its logo:

And it also received an overhaul to its scavenging mechanic. Prior to 2012, scavenging involved visiting a hex, opening the inventory screen, and hoping there were items on the ground. Not exactly the most engaging mechanic, especially considering it was the namesake for the game.

Skill selection was finally becoming more like what we see now, instead of this:

Nominated for most intuitive UI of 2011.
The inventory screen was changed to rely less on ctrl and shift clicking, instead using "modes" triggered by visible buttons. The UI also got hotkeys for the various screens and modes.

I implemented Playtomic for metrics, which was a partial success. The basic stats are still useful, though the more complex stats I setup are not very usable. A preloader was added, which is still used today. SecureSWF is likewise still pulling its weight as a code obfuscator. And save/load was in its infancy.

January was also the month when I decided on NEO Scavenger's final business model. Until this point, I was expecting it to be launched under the sponsorship model. I also decided on feature voting, as a means to gather measured user feedback.

The game switched from 1280x800 (arbitrarily chosen as half my monitor's screen resolution) to a more universal 800x600 (palatable for game portals). Finally, I added site-locking as I prepared to put NEO Scavenger out there for people to test.

February 2012

In February, I began piecing together all the necessary components for launching a business on the web. Quite a bit of time was spent on everything from creating a website to setting up a payment provider. It was a month filled with more business work than game, though I still managed to cobble together some new in-game items, new artwork, and a spate of newspaper loot with back-story snippets to read.

March 2012

March marked the public launch of both NEO Scavenger and my company, Blue Bottle Games. 9 months after starting development, NEO Scavenger was available for all to try and pre-purchase.

And with that launch came the stresses of running a public-facing service company. I had to quickly adapt my schedule to balance development with PR, and adapt my psyche to the ups and downs of public opinion. Fortunately, most of that opinion was positive. But it was still a bracing experience.

March also marked my first taste of revenue. It started small, then surged wildly with some press coverage, then settled back down to a stream. Fortunately, that stream continues to this day, and even had a few additional, albeit smaller, spikes along the way.

April 2012

In April, sales settled into their steady state, which was (and continues to be) a little less than cost of living. This shrinking of a major launch spike caused some existential concern. As it turns out, this question of "when is it 'done'?" never goes away. It just changes circumstances and specifics over time.

I was also faced with my first major public game design decision: permadeath and save games. I ultimately decided to keep the game more rogue-like in that permadeath means save games are deleted. Months later, I'm glad I did. It was a decision which could have drastically altered NEO Scavenger, and I'm glad that it was altered in a way that keeps it challenging, unique, and with some later tweaking, fun.

I also started to formalize my PR policy by the time April came around. Fortunately, I wasn't faced with too much internet hate, but the hate I did receive forced me to grapple with my rules of engagement. Put succinctly, ignore attacks, and focus on being constructive and responsive to those that are constructive.

In development of the game itself, the camping and night/lighting features were big items. They were the first major features, in fact. Lots of loading/saving fixes were required as well. And the website and order process had some growing pains to resolve.

May 2012

During the month of May, blog posts focused on more meta-topics such as tracking data and money-saving tips, to keep overhead costs minimized.

Development of the game, on the other hand, was in full force. As I would soon discover, plot is hard to do. For nearly a month, all that readers saw coming down the wire was "did more plot work today." I don't enjoy phases where there's little to share with fans, but I also don't want to spoil the fun by revealing the story out of order.

Encounter Editor

Fortunately, there were a few updates sprinkled in to keep folks entertained. One such change was the chase, which opened up various new gameplay tools for tracking and hiding AI. The oft-requested pockets were also added.

And May is also when I started working with my first collaborator: Cameron Harris. His input to both design and plot has been a real asset, and I believe NEO Scavenger is a better game for it.

June 2012

I was on the road for part of June, so activity was a bit limited. It did give me a chance to try out developing on the road, and to see how poorly I was prepared.

Still, a lot got done on NEO Scavenger in June. In particular, I made my second major decision: to work on improving combat ahead of schedule. Combat was pretty poor in early versions of NEO Scavenger. Its dependence on luck made it more frustrating than fun.

New Combat UI
By the end of June, combat had a new face, and it was far more tactical and engaging. It also included some improvements to AI.

July 2012

In July, I started lamenting my poor work and exercise habits. While I feel my workaholism has improved (I took 2 weeks off at Christmas, despite the temptation to only take 1), I'm still short on exercise. I made my second, and more serious, dip into the world of business accounting. And I was approached by Desura for inclusion in their service!

With the new combat system launched, I began work on a wounding system that would integrate with the extant player conditions, and offer opportunities for resourcefulness and strategy in dealing with wounds. I would argue that this suite of combat and wounding systems was one of the more important changes to NEO Scavenger so far, as it greatly enhanced the game's uniqueness, depth, and fun factor.

July is also the month where I began working with my second collaborator, Josh Culler. Josh's music has added a wonderful sense of atmosphere to the game, and has been very effective in promotional trailers as well.

August 2012

August was the month of getting ready to launch NEO Scavenger on Desura. For the first time since March, the demo gets an update to reflect the new features and content. NEO Scavenger also got its first trailer. A lot of research goes into making NEO Scavenger downloadable.

With those fulfilments complete, I began the Desura application process. Coincidentally, Steam Greenlight launched that same month, and within 24 hours, NEO Scavenger was added to Greenlight!

NEO Scavenger also had combat fleshed out with new moves, terrain resources (e.g. water, wood), and a new encounter to allow players to return to the cryo facility and make a permanent base.

September 2012

With the Desura and Greenlight launches done, I decided to do a mini retrospective. In it, I look over some of the sales stats to-date, and how both launching on Desura and Greenlight affected them.

I also officially enter the Mac and Linux realm with my first Mac hardware. $500 netted me hardware I could create Mac binaries with, as well as dual-boot Linux for that version.

I also had a few hardware failures, which cost some time and money to isolate and fix, but were thankfully minimal in impact otherwise.

NEO Scavenger gets the ability to delete items, a new thank you postcard design, and work begins on random encounters. Josh's first batch of in-game music is also added.

October 2012

NEO Scavenger is featured in its first bundle. While a success by most standards, I decide that I'll probably wait until after v1.0 is done to do another, and turn down subsequent bundle offers accordingly.

Player frustration mounts, and the question of game design and permadeath resurfaces. I decide to take a long look at the game's design, to see where it might be failing. I still want to keep permadeath and NEO Scavenger's rogue-like qualities, but I also want to offer players the tools they need to overcome adversity. It is likely to be an ongoing balancing act.

The process of plot work remains slow and grueling, with little to show while in progress. However, I finally finish entering data for the random encounters. The Desura website gets the ability to connect owners there to accounts at

Work begins on one of the most deceptively difficult bugs in history: item stacking.

November 2012

With random encounters increasing the encounter node count above 750, the encounter editor fails to start anymore. I begin rebuilding the editor in Haxe NME, partially as a solution to the above performance issue, and partially as a test to see if NEO Scavenger is worth porting to NME. The results are pretty good, but there are a few stumbling blocks. I decide that NME holds promise, but I might wait a while before porting NEO Scavenger.

The stacking change continues to ripple bugs into mid-November, but finally works. The mouse is upgraded to take advantage of new Flash plugin features: hardware mouse and right clicking. Plot work resumes in the new editor.

DMC City Map v1
I also needed to take a step back to revise overall plot and mythology. And once course-corrections were in place, it was time to start work on opening the DMC to players. A lot of the work revolves around the map used to represent the city to players.

December 2012

As work continues on the DMC content, I focus the blog on more business related musings. I take some time to discuss my policy for customer relations, and how to avoid stressing out over release schedules.

Work on the DMC map continues, adding both detail and animated VFX for interest. Rather than releasing a full screenshot of it, I decide to do a teaser with one of Josh's new music pieces for the city.

I briefly start thinking about currency, then exercise some discipline and decide to focus on higher priorities: city encounters. Finally comfortable admitting the DMC will not be ready for Christmas, I decide to take a player's suggestion to release some wallpapers instead.

Desktop Wallpaper of DMC

Looking Back, and Looking Forward

It was a good year, overall. I had some good successes, made some mistakes, and learned some big lessons. NEO Scavenger earned more than I expected, but less than I hoped. It's poised for success, though, as long as I keep working hard.

The biggest issue I see, moving forward, is determining when to consider NEO Scavenger finished, and to move on to the next project. I'm resolved to release it this year, and have been telling myself and others that spring is the timeframe. Spanning that last stretch, and finishing with the right suite of features will be a big decision.

But as I go into 2013, I am more seasoned and confident, and I have optimism for the year to come. I'll no doubt make new mistakes, but also surmount new obstacles and claim new victories. Here's to acknowledging the past, and looking forward with hope!