#twoweeksofcode: Edgeview

This is part of the Two Weeks of Code.

Edgeview: A way to view a screenshot of your Ubuntu Touch app on an image of the Ubuntu Edge. Distorts the screenshot appropriately so that it appears to be on the screen. Designed not for shots looking directly vertically at a phone screen, but for “action” shots where someone’s holding the phone in their hand. Entirely client-side: no server processing involved.

[edgeview][]

This was an interesting little project, although I hit my maths knowledge limit fairly early on as regards doing vector affine transformations of a rectangle. Fortunately, Rich Wareham swooped in and saved me, because he’s good at this stuff.

This was deliberately built as a client-side tool, with no server required, so that it could be taken up at some point by Ubuntu and added to the Ubuntu developer site relatively easily. Chatting to Michael Hall about that, it could well still happen at some point. It would be nice to have a way to get “in-action” shots of apps without everyone having to work out the Gimp’s “cage transform” stuff themselves, perhaps integrated with the app upload process somehow (since that already includes screenshots).

Obviously as Ubuntu Touch phones come on the market, this should start including some good high-resolution “in-use” shots of them. I like using the Edge for this, even though it won’t be made, because it’s a good view of a “generic” phone; that is, assume that two big handset manufacturers come out with Ubuntu Touch phones, I don’t really want to specifically use one or the other in “action” shots of my app. There are also some decent high-resolution renders of an Edge, and a prototype, both of which are also potential image sources for edgeview.

On GitHub at: https://github.com/stuartlangridge/edgeview. Live demo with no styling at all at http://kryogenix.org/code/edgeview/edgeview.html.

[edgeview]: http://kryogenix.org/days/wp-content/uploads/2013/09/edgeview.png