The essential role of shortcut keys in internet browsing
By Johnny Jao, UX Designer at KaiOS
Browsing the internet on a smartphone is easy with gesture control — think finger swiping to scroll and pinching to zoom in or out. But what about browsing on a smart feature phone?
Screens of smart feature phones are non-touch. You navigate using a physical keypad. That might seem counterintuitive or even inefficient, but, with a little help from design, feature phone users can accomplish the same things. The difference is that, on a smart feature phone, they use shortcut keys.
Shortcut keys enable scrolling and zooming in and out using the keypad. The keypad shortcuts for internet browsing are:
Zoom:
Press 1 or 3 to zoom out or in.Go to Top and End:
Press 2 or 0 to go to top or end of the site.Cursor Mode & Scroll Mode:
Press 5 to switch between cursor and scroll mode.Tips:
Press # to show shortcut tips.
The shortcuts above are essential for efficient browsing — but users need to know they exist in order to take advantage of them.
When brainstorming ways to educate our users about these hidden features, we asked ourselves the following questions:
• How to drive user attention in shortcut tips?
• How do we make it possible for users to view all shortcut features at once?
• How to provide immediate operation response in shortcut tips?
Getting Their Attention
Each time a feature phone user opens up a website, an animation designed to capture the user’s attention and teach them about shortcuts appears. The user can choose to hide this if they’re already familiar with shortcuts.
Slide 1: Overview
The first page of our animation features all the shortcut icons and briefly explains what each of them does.
The layout of the icons on the screen mimics their positions on the actual keypad to assist with memorization.
Slide 2: Go to Top / End
Here, we instruct users to “Press 2 & 0 now.” Doing that generates an immediate response: the interface literally scrolls to the top or bottom with each press.
The default scroll position is set to the middle to ensure that there’s enough space to show the scroll transition to top or bottom.
The ability to learn by doing helps users quickly understand how shortcuts work.
Slide 3: Zoom
The default sample scale on the zoom page is set to mid-level. This is so that the interface will show the result of zooming in or out regardless of whether users press 1 or 3.
Slide 4: Switch Mode
The sample page changes from cursor to scroll mode when users press 5. Users can choose to browse by using the cursor or by scrolling the page.
Options Menu
The keypad is occupied by shortcuts. What about other functions? How can users quickly find and use them?
Pressing “RSK” will bring up the Options Menu, which is a collection of actions that include Search, Refresh, and Settings.
As you can see below, the most common actions are indicated with icons. Icons provide users with a quick overview of the menu. When the user selects an icon, the header shows a text explanation of what it does.
Conclusion
Shortcuts provide a quick way for smart feature phone users to get things done in apps. They may not be as intuitive as touching the screen of a smartphone, but they make feature phones more efficient and capable.
*All of the suggesting shortcut keys may vary by different models, subject to the mobile manufacturers’ decision.*
Stay up to date on Kai’s journey by reading our blog or following us on Twitter, LinkedIn, and Facebook.