Axe

Axe was our first foray into tablet apps. There were a tons of great feedback tools on the Web, but there wasn’t anything for the tablets. And, at the time, we didn’t have much experience working with tablet apps. So we thought we’d kill two birds with one stone, and build an app that let people give feedback on a tablet.

But it wasn’t without its challenges. First, we had to overcome the sluggishness that can plague mobile apps. We also had to figure out how best to tap out a note in the application. In other words, we had to be mindful of different events, such as touch vs. click and hover states.

Sharpie Inspiration

The inspiration for Axe was the visceral act of taking a sharpie to paper and furiously blacking out the parts you don't like. We wanted to recreate that experience in a way that could easily be shared, and wouldn't dry up our Sharpie surplus.

At first, we tried to replicate that action with a mouse, but moving the mouse and getting the scribbles to match on screen didn't work out. Worse of all, it wasn't as much fun as using a Sharpie. We actually needed to touch the things we were removing. And thus a tablet-only application was born with your finger in lieu of a Sharpie.

We picked a fairly thick line, 40 canvas units, so a person could kill whole sections in a single swipe, which worked great. That is until we tried it out on someone who'd never used Axe before. After we handed over an iPad, the first thing the person did was doodle — arrows, smiley faces, sad faces, and even a few swear words.

We didn't want to clutter up Axe with a lot of options, but, heck, if people were going to draw we should at least make it easy. So we added the ability to toggle the thickness of the line — a fine line for freehand drawing and a broad line for axing.

Tapping Out A Note

A thin brush is swell if you want to be dramatic, but it's not really practical for adding detailed annotations. So what gesture should we use? Someone suggested a double tap. Another person suggested a spread (opposite of a pinch). And yet another person suggested a double tap and hold. That's when we all said, "whoa … a double tap and hold?" See we started with a double tap, but it didn't work so hot in Mobile Safari. The problem was that Mobile Safari only allows JavaScript to give something focus from a click handler, and since we were binding to touch events, our calls to focus were being ignored.

Binding to click handlers turned out to be a really pain in the ass with Mobile Safari. That's because the mobile web browser actually waited roughly 300 ms before firing. That's an eternity where the darn thing waited to see if you tapped twice before zooming in — after all, double tap equals zoom — even if the function was disabled. Ugh, this made it impossible to use a double-tap handler using click events, but we didn't want to give up auto-focus to do it. So we ditched double tap.

But we weren't giving up. We did some random experiments, finding that inserting a note after a double tap and keeping our fingers down for a moment, a click event was generated on the note we had inserted. Thus, the "double tap and hold" gesture was born. The beauty of "double tap and hold" was that the callback from the second touch event was fired before Mobile Safari detects the start of a click event.

However, we weren't out of the woods just yet. Once again, we handed an iPad to someone who hadn't seen the app. We told him to go ahead and do our marvelous "double tap and hold" gesture. "Ah, what?," he said. So we demonstrated it. After seeing it, he was able to execute it … oh, about 60% of the time. Others tried it, confirming that the gesture was difficult, unintuitive, and inconsistent with other gestures on the app. Yeah, we struck out with this one.

So we bit the bullet and made the decision to abandon auto-focus for a better "add note" gesture. Double tap seemed good, but the timing was tricky. Ultimately, we went with a tap and hold gesture because it was somewhat consistent with a similar gesture to bring up a secondary action. Mostly, it was dead simple to execute. Sweet!

We Made A Movie

Sorta. We actually made a video demo of Axe to entertain the folks who landed on axeapp.com from a desktop and not a tablet. Check it out:

Check out Axe

Axe isn't the only app we have that helps you get feedback. Check out our other free apps: Bounce, Chop, Clue, Reel, Spur, and Strike.