iOS Dvorak Layout Design

We at DVzine.org are, naturally, big fans of elegant design. So it should surprise no one that Frunch, Alec, and GCB are all moderate-to-extreme Apple enthusiasts.

As we discuss in the zine, Mac OS X has come with a built-in Dvorak option since it was released, and it has by far the easiest and most comprehensible keyboard-switching interface for those who share a computer with non-Dvorak typists.

Much to our collective chagrin, iOS devices (iPhone, iPod Touch, and iPad) are not so Dvorak-friendly. You can configure an external keyboard to work with these devices using the Dvorak layout, but the on-screen language selection has never included a Dvorak option. To get Dvorak on iOS, you either have to jailbreak your phone to use Cydia, or install dkdigital's app which allows you to type in Dvorak and then copy/paste your text into other apps. Neither option is perfect.

At first I was flabbergasted at this seemingly simple omission in iOS, but upon further review it makes sense: the on-screen keyboard for the iPhone and iPad are both custom layouts, not direct translations of Qwerty. Observe, for example, the relation between the home row and the lower row of keys on an iPhone:

Click any image in this blog post to enlarge it!

Why have the keys on the bottom row been shifted a half-step right so that they are in columns instead of offset at their usual angle? It's because the punctuation keys that normally fill space on the lower right side have been moved to an entirely different screen (with the rest of the punctuation and number keys). This leaves room to put a shift key on the left and a delete key on the right end of the third row.

It's counter-intuitive to have the delete key on the third row, rather than its usual home on top-right, but it had to be done. This is because the letters on Qwerty are weighted to the top row: 10 letters top, 9 letters on the home row, and the final 7 on the third row. Apple clearly put some thought into this design: the changes are not so significant as to flummox a user's intuition, but it's enough to get all the necessary keys onto the screen cleanly. 

Apple solved this Delete button strangeness on the iPad by taking advantage of the extra screen width to add a column of keys, making room for the Delete key on the top row, for the Return key at its natural place on the home row, and for two punctuation keys and an extra shift key on the lower row:

While visiting Alec in the Bay Area this week, we got to talking about this puzzle, and our sadness about not being able to use Dvorak on iOS. Guess what we decided to do?

That's right, we designed a Dvorak layout for iOS! To make it more likely that Apple would consider implementing our design, we set some rules for ourselves:
1. We need to use the same keys provided in the Apple layouts, so that no secondary screens (punctuation, numbers, etc.) would need to be altered.
2. We are only allowed to compromise design decisions in the same way that Apple did (ie. changing the size of keys, shifting row alignment, etc.)

Let's start with the iPhone standard horizontal keyboard. Dvorak's home row has ten keys, one more than Qwerty. To account for this, we shift the row left and add a key on the right, which uses up the blank space on either side in the Qwerty layout. Dvorak's top row has three punctuation keys, which we remove, leaving only seven letters and plenty of space for the Delete key in its natural position.

We still have extra space on the top row, so we move the 123 key to the top left, shifting the letter keys on the top row into a more natural alignment with the home row. (This alignment isn't perfect: it's a half-step off of a physical keyboard -- exactly as far as Apple was willing to shift their third row.)

We widened the language button at the bottom, since we are likely to use it more than Qwerty typists (like when those archaic Qwerty typists borrow our phones!)

Have a look at the difference between the Qwerty iPhone layout & the iPhone Dvorak design suggested by DVzine.org:

Here they are in vertical mode:

We think it looks pretty good! The size of the backspace key is probably the biggest concern, and it could be repaired if we compromised on our alignment, but this pretty clearly demonstrates that an iOS Dvorak layout is feasible.

Apple made some sacrifices to make their keyboard work, too: their backspace is unnaturally located, and the alignment of the center row with the bottom row goes against the traditional Qwerty offset. Dvorak lets us play by the same rules, but create a little more space by having the full ten keys on that home row. Qwerty only has nine, so it end ups wasting space to the right and left on that row. I think a smaller Delete key in a more natural location is a pretty fair compromise.

So what about the iPad?

The extra space provided by the iPad's bigger screen means the iPad version requires less compromise. Due to our half-step limit on key re-alignment, we end up shrinking the right-side shift key and compressing the Return key to get that tenth key onto the home row. We also noted that the key widths on the iPad aren't exactly uniform: you can observe this yourself by comparing key sizes: the letter keys on each row are different widths, with slightly wider keys at the top.

We take advantage of this same compression trick to make our home row work without shrinking Return too much. Dvorak's modestly populated top row has plenty of room to incorporate the Comma and Period keys that the iPad fits in, and still allows for a generously sized Delete key. The rest of it falls out pretty cleanly on the iPad. Have a look:

It was fun to imagine how these keyboards might look: it would be more fun to use them! DVzine.org would love to be credited if you re-use these images, but if anyone out there at Apple is reading, you have our full permission to use these designs, either as-is or as drafts, to get a Dvorak keyboard into iOS. No credits requested, no copyrights suggested, no questions asked!

And if any of our regular Dvorak enthusiasts have connections in Cupertino... don't be shy!