UI/UX: Keyboards


The Challenge

The traditional computer / typewriter keyboard is said to have multiple problems when translated to a phone, tablet, TV, gaming system, or watch. Among the top two problems: (1) the keys become too small (or too large in some cases), and (2) the distribution of letters is not conducive to a single finger or to one or two thumbs.

Even Samsung appears to have agreed with these problems, as in their first Gear S1 watch, they introduced a traditional QWERTY keyboard, but in the Gear S2 switched over to T9 (as in the old flip-phone system).

Apple Watch, on the other hand, bypassed keyboards altogether, having no keyboard at all in the first and second watches, but then finally conceding and allowing for “Scribble” (handwriting recognition) in Watch OS3.

Joyful Machines believes there is better than both Scribble – which is often inaccurate – and T9 – which everyone hated in the first place.

But what should those solutions be? THAT is the challenge.


Solution 1, Modality

The concept of Modality is to use the potential power of typing by letter groups, but such that the groupings are limited enough to work “very big” and “very small” – from TV to watch.

I laid out hundreds of letter arrangements and numbers of groupings. In the end, we settled on keeping the vowels together so that the user would have some familiarity.


At one point, we had an animated pool game for typing!

A last move was to go to the gaming style D-pad, which worked well both for phones and watches.

Modality has a growing group of faithful supporters… but the problem is that Modality requires the user to identify the first letter before going on, which may seem confusing at first. To solve this, we got to Solution 3, Simple Mode.


Solution 2, Magic Shadow

Magic Shadow was a more straight-forward solution: rather than typing letters by groups, we use the standard concept that as the user taps one letter, that exact letter shows up on the screen.

The innovation is that the letters are more logically distributed and easier to reach for one or two thumbs. Specifically, the most commonly used keys (Space, E, T, A, O, I, N, S) are central, and a 7×4 grid is used for larger keys and ease of access.

This keyboard also used hundreds of letter layouts to get just the right one. The idea here was that, similar to a Rubik’s Cube, there is only ONE correct solution for how to lay out the letters in a most optimal form on a grid.

I completely programmed this keyboard, and in this case I made full use of auto constraints to present a different version of the keyboard for portrait and landscape layouts (the landscape has “extra buttons” – the “magic shadow” area – making the view 10 buttons across rather than the 7 in portrait).

I also laid out table views for the emoji / symbols screen.


Magic Shadow is likely the most logical letter-by-letter system for on-screen typing – especially for phones and tablets – ever developed.


Solution 3, Simple Mode (Modality II)

Modality II, better known as Simple Mode, takes the simple concept of group typing in only four buttons and pretty much perfects it.

In this case, though the layout was relatively straightforward, I solved ALL of the problems of this application, including the letter layout and the coding, to get to a solution that operates smoothly as well as solves the original problem at hand of typing for on-screen devices.

The interesting thing for this UI / UX is that people tend to look on as I use this to type, and sometimes ask me about it, because the layout has large buttons that sort of look like a child’s wooden blocks.

The other issues, such as corrections, single-letter mode, symbols, and emoji had already been solved in Modality and Magic Shadow.

Simple Mode truly works with only four buttons to build words.


Jobs done. Time to go home and start something new in the morning.