Hot Keys and UX of Web Applications

Hot Keys and UX of Web Applications

When at the beginning of my professional career I meet first true professionals, one thing that I'd noticed was how effective they were with the tools they used. They extensively used hotkeys and different sorts of keyboard shortcuts to quickly craft things they want. Opposite, as a novice user from the mostly windows environment, I simply used menus and popup tips to achieve what I want. I was amazed at how quickly you can manipulate things with accurate keystrokes. I'd started to use hotkeys and with every new application that appears in my toolset, I'm starting with key combinations.

But I have different feelings when I use a tool that is a web application. I've got used to that anything in a web browser is a page and web browser itself is an application. A web application is kind of a Matreshka: a UI inside a UI (browser) inside a UI (operational system). That's why it's unusual to use hotkeys in a web application: are you interacting with OS, browser or a web application?

But things are changing with time, as more and more originally desktop applications are moving into the cloud. One of the great tools I enjoy working with is Trello. I create a card, then assign myself to it (spacebar). Quickly peek at my cards around the board with "q". It feels natural, effective and true real application way. What is also important, it frees hands.

One of the nice cool chrome extensions that I use is Vimium. It makes possible to control browser in vim-style. H, J, K, L for moving around a page, f to navigate lings etc. This is a way to go for browsing in a laptop when it comfortably sits on top of your knees or pillow. Even great touchpad as MacBooks have can't compete with comfort of moving aroung with just a few keys. But there is a problem. Vimium extension isn't working on every page. Some pages have their own key combinations and that's where "a UI inside UI inside UI" conception turns into a problem. You have to be aware of an OS, browser and application keys not confusing one with another.

The annoying part is that there is no obvious solution to that. You either have to go native or find a compromise. There is no app-mode for a web page, that prevents a user from accidentally closing a tab. You can't alt-tab to another application. A web page is a web page besides anything. But as more and more native features are added to Web API, I hope we probably see some kind of hybrid applications in the near feature.

When designing an effective tool that will be used by professionals, you shouldn't avoid adding hotkeys to it.  When building SQL Suite, we're trying to preserve natural feeling of working with a desktop application by implementing familiar key combinations that user expects to exist. For example, running a query with "Ctrl-Enter" or navigating documents with "Alt-Left" or "Alt-Right". Another use-case that I find relevant when checking how professional developers that I know enjoy doing stuff, is hacking on the go or in relaxed positions.  Sitting on the couch in a kitchen, taking bath (I don't know if it safe anyway, don't do that), commuting etc, coding stuff whenever they stop by. So our goal here is to make application's user experience as much smooth as possible without leaving hands from the laptop's keyboard.

When looking into the future, I definitely see the web as a mature platform for applications. Internet giants who rule the contemporary web (think Google) and consumer devices markets (Microsoft and Apple) should make some decisions and direct development of the web platform for better UX not only from surfing and content consuming point of view but as an application platform too. Making web applications feel more native is better than building another platform for native application development using a web stack.