My Experience with the Surface Pro 2 as a Software Developer

The recently released surface pro 2 has been on my mind for a while. It addresses the biggest issues with the original surface; most importantly, the battery life is now comparable to laptops in the same class – even if still poor. The type cover has also been slightly improved and I found that I can touch type on it just as fast as I do on my desktop.

I was hoping that I could replace my laptop with the surface for a super mobile setup that can move between work and home. The surface pro 2 certainly has enough horsepower and ram to get serious work done, and with a full size keyboard and dual screens at work and home, I shouldn’t have to deal with the tiny keyboard and onboard screen too much. In return I’d get a bonus tablet and a full fledged core i5 pc in a tiny form factor, a pretty sweet deal.

After spending a week with the surface, I have to say that it didn’t work as well as I hoped. The following are the highlights of my experience.

The type cover is not good enough
The increased key travel on the type cover 2 is a welcome improvement, but it comes with a step backwards on the track-pad which used to have physical clickable buttons and a rubbery surface. These have been replaced with capacitive buttons and a felt finish, which is starting to fade in high traffic areas after a mere week of use. The bottom line is that despite the improvements, it’s still just too small a keyboard to do serious work with. I got the full fledged pc experience I wanted at home and work, but without a keyboard attached the usefulness of the surface is severely crippled.

The biggest redeeming factor here is the active digitizer pen, which is amazing. While it doesn’t replace a mouse, its a great supplement and feels very natural to use. The touch screen is just no comparison to the fine control you get with the pen, and the active digitizer means you can do things equivalent to mouse movements without clicking by hovering the pen over the screen. I actually miss having the pen when using other computers now, I hope to see a laptop come with this feature in the future.

The pixel density on the screen is too high, kinda
The show-stopping problem to me stemmed from the small screen, but not for the obvious reason. I was quite aware that a 10″ screen isn’t much to do real work on, and prepared to supplement it with dual monitors. What I wasn’t prepared for is how terrible DPI scaling is on windows.

Here’s the problem: the screen is a full hd 1920×1080 panel packed into a mere 10 inches. Applications not specifically designed to deal with high dpi displays render tiny text and tiny buttons which are very difficult to read and impossible to click on with your finger. Windows alleviates this with a dpi scaling option which forces applications to increase the size of what they’re rendering. Unfortunately unless applications were written to deal with this, it looks like they just get upscaled with what looks to be a bilinear filter. The result is that everything is blurry! This affects just about every application I’ve used except for internet explorer and visual studio. Even chrome and firefox don’t support dpi scaling and can at best be hacked by being run in compatibility mode to prevent scaling, followed by increasing page zoom or default font size. This tends to mess up some site layouts and still leaves you with tiny unreadable tabs and other native UI components.

Here’s IE vs what you get with chrome out of the box:

IE and chrome with dpi scaling

IE and chrome with dpi scaling

And here’s opera hacked to work sort-of okay vs chrome out of the box. Note the tiny tabs and broken visuals on opera.

Opera with dpi scaling disabled + font tweaks vs chrome with dpi scaling

Opera with dpi scaling disabled + font tweaks vs chrome with dpi scaling

I was also surprised to find that .net winforms applications that I’m developing have the same scaling problems. I assumed that Microsoft would definitely make sure that apps built with visual studio are ready to run on the surface out of the box. As a developer, I had no idea about this being a problem until I was on the receiving end, and I suspect that that’s the case with a lot of applications out there.

The problem is made even worse by the fact that the dpi scaling setting is global across all monitors in a multi-monitor setup. This means that when I plug the surface in at work, I either get giant scaled graphics on the large screens, or tiny unreadable graphics on the surface. On top of that, the hacky application setups to prevent blurring that I described above, are also carried over to the large screens. This just doesn’t work at all.

It’s not a replacement for the iPad
After a week of use its pretty clear to me that the surface pro is not really a tablet. I own an iPad and I continued to prefer it as my tablet both hardware and software wise. The aspect ratio on the surface doesn’t lend itself very well to the tablet experience. The browser is worse than on the iPad, and IE is the only browser that works ok in a tablet fashion. I found that I actually preferred IE over chrome which is pretty depressing.

I also encountered a pretty serious issue where the surface would randomly refuse to wake from sleep sometimes and reboot instead. Basically every time I closed the lid, I risked losing all my unsaved work. Microsoft’s tech support walked me through all the scripts that covered anything related to this issue, including a full factory reset, but nothing helped. I do know that other users have reported the same problem and suspect it’s caused by some application that I installed. Sadly I only installed the bare basics for work such as visual studio, vmware, sublime text, and office, so it looks like another show stopping problem.

You can forget about using any desktop applications in portrait orientation or without the type cover, the experience is just painful. Also, every time you go to portrait mode, your desktop icons are rearranged to fit horizontally and don’t go back when you return to landscape.

Last but not least, its just too thick and heavy to comfortably hold as a tablet. This is excusable if you account for the fact that you’re actually holding a high end laptop worth of horsepower but doesn’t change the fact that it’s a poor tablet experience.

Wrapping it up
All in all, the surface pro is an incredible piece of hardware at a really good price point, and I really want to like it, but in the end it can’t replace my laptop and it can’t replace my iPad. I would love to own one in addition to a laptop+tablet, but I just can’t justify 1500 dollars on a device that doesn’t have a clear purpose. I might reconsider in the future when high dpi screens become prevalent and application developers are forced to support them.

Despite the issues I’ve had, I’m going to be sad to part with the surface. It looks and feels amazing and I imagine it’s a great device for lighter work. I was also surprised that despite my strong dislike for windows 8 based on previous experience, after a week I’m not only used to it but actually prefer it in many ways. I thought the first thing I’ll be doing is reverting the start menu back to 7, but you know what? The windows 8 start is actually really good if you give it a chance, and doubles as a solid replacement for Launchy.

Follow-up
After a few more days of taking it to work, I ended up returning my surface for a refund. My general experience was that the small screen and the type cover simply weren’t good enough for prolonged serious work. In particular, there wasn’t enough screen real-estate to have a decent Visual Studio workspace and I found myself constantly trying to find balance between making the text too small or not being able to see enough code at once.
This was compounded by the fact that the dual screen experience was terrible and, my original notion of coming to work/home and docking the surface for serious work was simply not viable due to the hidpi scaling issues mentioned above. This was the selling point of the surface for me, and it simply didn’t deliver.

Instead, I picked up the Lenovo Yoga 2 Pro and couldn’t be happier
Despite being larger, I think this laptop is on equal footing in terms of mobility; I feel that it’s actually better because you can comfortably plop it in your lap – which is rather difficult with the surface + type cover, and you can stand it up on any angle rather than the surface’s 2 predefined kickstand modes.

In exchange for the higher price tag and larger form factor, you get a real keyboard, a good trackpad, 2 USB ports, and a screen that’s large enough to comfortably use busy tools like VS for extended periods of time. The dual screen experience is just as bad as with the surface, but at least the Yoga 2 is a perfectly usable development machine on its own.

Since the time of the original post, hidpi software adoption has also made great progress, and you can now expect a lot of tools to work out of the box. Two notable exceptions are Adobe Photoshop which is completely unusable, and Remote Desktop which doesn’t support scaling of the remote display. An alternative to the latter is Remote Desktop Connection Manager which is free and supports scaling.

Making matplotlib look like ggplot

When I first started using matplotlib, the output looked very crisp and polished compared to excel, however after seeing ggplot2, I realized that matplotlib’s default presentation settings leave a lot to be desired. I have put together a quick script that will restyle an axes to look more or less like ggplot2′s.

def rstyle(ax):
    """Styles an axes to appear like ggplot2
    Must be called after all plot and axis manipulation operations have been carried out (needs to know final tick spacing)
    """

    #set the style of the major and minor grid lines, filled blocks
    ax.grid(True, 'major', color='w', linestyle='-', linewidth=1.4)
    ax.grid(True, 'minor', color='0.92', linestyle='-', linewidth=0.7)
    ax.patch.set_facecolor('0.85')
    ax.set_axisbelow(True)
   
    #set minor tick spacing to 1/2 of the major ticks
    ax.xaxis.set_minor_locator(MultipleLocator( (plt.xticks()[0][1]-plt.xticks()[0][0]) / 2.0 ))
    ax.yaxis.set_minor_locator(MultipleLocator( (plt.yticks()[0][1]-plt.yticks()[0][0]) / 2.0 ))
   
    #remove axis border
    for child in ax.get_children():
        if isinstance(child, matplotlib.spines.Spine):
            child.set_alpha(0)
       
    #restyle the tick lines
    for line in ax.get_xticklines() + ax.get_yticklines():
        line.set_markersize(5)
        line.set_color("gray")
        line.set_markeredgewidth(1.4)
   
    #remove the minor tick lines    
    for line in ax.xaxis.get_ticklines(minor=True) + ax.yaxis.get_ticklines(minor=True):
        line.set_markersize(0)
   
    #only show bottom left ticks, pointing out of axis
    rcParams['xtick.direction'] = 'out'
    rcParams['ytick.direction'] = 'out'
    ax.xaxis.set_ticks_position('bottom')
    ax.yaxis.set_ticks_position('left')
   
   
    if ax.legend_ <> None:
        lg = ax.legend_
        lg.get_frame().set_linewidth(0)
        lg.get_frame().set_alpha(0.5)
       
       
def rhist(ax, data, **keywords):
    """Creates a histogram with default style parameters to look like ggplot2
    Is equivalent to calling ax.hist and accepts the same keyword parameters.
    If style parameters are explicitly defined, they will not be overwritten
    """

   
    defaults = {
                'facecolor' : '0.3',
                'edgecolor' : '0.28',
                'linewidth' : '1',
                'bins' : 100
                }
   
    for k, v in defaults.items():
        if k not in keywords: keywords[k] = v
   
    return ax.hist(data, **keywords)


def rbox(ax, data, **keywords):
    """Creates a ggplot2 style boxplot, is eqivalent to calling ax.boxplot with the following additions:
   
    Keyword arguments:
    colors -- array-like collection of colours for box fills
    names -- array-like collection of box names which are passed on as tick labels

    """


    hasColors = 'colors' in keywords
    if hasColors:
        colors = keywords['colors']
        keywords.pop('colors')
       
    if 'names' in keywords:
        ax.tickNames = plt.setp(ax, xticklabels=keywords['names'] )
        keywords.pop('names')
   
    bp = ax.boxplot(data, **keywords)
    pylab.setp(bp['boxes'], color='black')
    pylab.setp(bp['whiskers'], color='black', linestyle = 'solid')
    pylab.setp(bp['fliers'], color='black', alpha = 0.9, marker= 'o', markersize = 3)
    pylab.setp(bp['medians'], color='black')
   
    numBoxes = len(data)
    for i in range(numBoxes):
        box = bp['boxes'][i]
        boxX = []
        boxY = []
        for j in range(5):
          boxX.append(box.get_xdata()[j])
          boxY.append(box.get_ydata()[j])
        boxCoords = zip(boxX,boxY)
       
        if hasColors:
            boxPolygon = Polygon(boxCoords, facecolor = colors[i % len(colors)])
        else:
            boxPolygon = Polygon(boxCoords, facecolor = '0.95')
           
        ax.add_patch(boxPolygon)
    return bp

Usage is very simple, call rstyle(axes) just before showing or saving your figure. It is key to call it after all drawing and axis manipulation has been done, because it will be reading the major tick positions to work out where to put the minors.

from pylab import *
import scipy.stats

t = arange(0.0, 100.0, 0.1)
s = sin(0.1*pi*t)*exp(-t*0.01)
fig = plt.figure()
ax = fig.add_subplot(111)

plot(t,s, label = "Original")
plot(t,s*2, label = "Doubled")

ax.legend()
rstyle(ax)
plt.show()

I have also included a function that creates a ggplot style histogram for you. This is nothing more than setting some default parameters to the hist function.

from pylab import *
import scipy.stats

t = arange(0.0, 100.0, 0.1)
s = sin(0.1*pi*t)*exp(-t*0.01)

fig = plt.figure()
ax = fig.add_subplot(111)

data = scipy.stats.norm.rvs(size = 1000)
rhist(ax, data, label = "Histogram")
ax.legend()
rstyle(ax)
plt.show()

There is also a slightly more involved boxplot function which handles fill colours and names for you.

from pylab import *
import scipy.stats
data = [scipy.stats.norm.rvs(size = 100), scipy.stats.norm.rvs(size = 100), scipy.stats.norm.rvs(size = 100)]
fig = plt.figure()
ax = fig.add_subplot(111)
ax.legend()
rbox(ax, data, names = ("One", "Two", "Three"), colors = ('white', 'cyan'))
rstyle(ax)

Finally, with a bit of help from Justin Peel over at StackOverflow, you can get some really nice graphics going that you won’t be ashamed to put in your published material or presentation.

I have only used these scripts in my fairly limited scenario and there are several obvious things such as the requirement to pass an axes, the enforcement of minor ticks at 1/2 majors, and the fact that I haven’t really done much with the legend, but it should be enough to get you started in your projects. Happy visualizating!

Why you should use Sublime Text 2

Sublime Text 2View Post

Haven’t heard of Sublime Text 2? Well, I guess you’ve been living under a rock. Oh… you have? Well, in that case – why aren’t you using it yet?

Somewhere between a text editor and a IDE, Sublime Text 2 has been somewhat of an eye-opener into what text editors can really be.

Really, it can make a little nerd’s heart race just seeing this program in action. More than being pretty, it’s been a huge increase in productivity for me, and every day I find something new that I can either download as a plugin, or it’ll be released by the developers at a rather intense pace.

 

Not convinced? Well, this is why I use it. Hopefully I can make you use it too. First of all, it’s extremely fast. It’s extremely flexible. It’s also sort of free… well, more like an unlimited trial with a ‘buy me now’ nag every 10 or so saves. It’s also cross-platform!

I recommend buying it for the paltry $59 though, and this is why:

It’s fast:

Loading the program itself is practically immediate, depending on your system. It’ll open up your last project in little more than a heartbeat. Clicking open files shows the source code immediately (even for large amounts of text), and allows you to quickly glance over large amounts of code.

Not only is it fast in the most literal of sense… getting places is really quick too. Seriously, check these keyboard shortcuts out:

CTRL + P: Quickly select files from your open project using a very quick fuzzy match searching algorithm. You can type the filename or start writing the file path… it’ll find it and immediately preview the selected file as you scroll through your search.

CTRL + Shift + P: Run different commands from your installed addons, change themes, insert snippets… this is your go to command for this sort of thing.

CTRL + Shift + F: Quick find, search all open documents and list the files and an excerpt almost instantly. Double click the excerpt or the filename and you’ve found your chosen piece of code.

 CTRL + G: Goto line number.

It’s flexible:

More to the point, you’ll want to install the Sublime Package Control plugin. With this, you can search and install plugins from a rather large list, often coming straight from the github/bitbucket repositories. The addon system alone is a reason you’ll want Sublime Text 2. From installing new themes, to adding missing or useful features, to just making the development process that little bit nicer: you want this.

As a django/python developer, I recommend a few apps:

Djaneiro: Your one stop for django syntax and code highlighting for django templates. If you’re a django developer, get this.

SublimeRope: Code completion – and a nifty ‘go to definition’ feature… though not without some initial setup. I’ll briefly tell you how to set rope up to actually work… because it doesn’t unless you do the following:

Press CTRL + Shift + P and type “rope”, and find “New Project”. At the bottom it will ask you for project details. Press enter for the first one, and you may have success with the next if you use a virtualenv (I always get errors). If you do too, continue on:

Go to your new .ropeproject folder in your project and edit the config.py. Find the section that looks like this:

# You can extend python path for looking up modules
#prefs.add('python_path', '~/python/')

Here you can add the sources to your site-packages and your current open project, e.g.:

prefs.add('python_path', '/path/to/site-packages')
prefs.add('python_path', '/path/to/your/project')

SideBarEnhancements: Extra stuff for your side bar on right click. Don’t have a sidebar? Go to view->Side bar. Easy.

BufferScroll: Remember and restore all open files, bookmarks, folds, etc. when you open the editor.

These are at least the basics, there are so many more plugins that you could use that will make your life easier.

At least go out and try it, you can find the editor at http://www.sublimetext.com/2