𝕄𝕚𝕔𝕙𝕒𝕖𝕝 𝕂𝕖𝕟𝕟𝕖𝕕𝕪
Software Developer
Experienced full-stack software developer with 10 years experience of windows and web programming techniques, including C#, MVC, SQL and Data Migration
Family is the most important thing in the world; we’ve been on the wrong side of heartbreak too many times, but it's that experience that gives us the strength and determination to strive to do better every day.
Michael Kennedy
    www  
Blog Experience
Navigating to the New World

Navigating to the New World

Posted on 01/09/2018

In fourteen hundred ninety-two, Columbus sailed the ocean blue.

In 1492 Columbus set out to “prove” that the world was round by sailing all the way around it, his navigation was a little off and he didn’t reach his intended destination, moreover he didn’t realise that there was a huge continent in his way.

In a way, this can be equated to navigation throughout an application – if your map isn’t complete, then who knows where you’ll end up.  If the process of navigating through an application hasn’t been fully realised, then who knows what will hinder us in our travels.  Perhaps, like Columbus, something will obstruct us and we won’t immediately realise that we’re in the wrong place.

In the world of software, the humble application drop-down menu has forever acted as our central point of navigation, a menu at the top of the screen with countless functions waiting to be found.  We’ve always known that the funny square options at the top of the screen are there for navigation, it’s easy to believe that this functionality was conceived by Microsoft when the early versions of Windows were released, but this behaviour existed long before that, in BIOS configuration screens, in old DOS applications, within the operating systems of the Atari ST personal computer.

This form of navigation menu has been embedded in our psyches’ since the earliest days of graphical user interfaces, they were in use before anyone had even considered the implication of UX and yet now it represents the quintessential application behaviour with which we’re all intimately familiar.

Conventional Navigation

Compared to those early days, never before have software developers had so much control over the way that users access an applications core functionality, such is the impact of transitioning to a web-based world where user acceptance testing is the norm and feedback is readily available at the press of a button or wave of a mouse.

The key to a successful user experience is to anticipate how user is going to use the application before it’s even been written.  Like the menu sat at the top of the window, conventions tend to be dictated by what has come before, the ability to provide consistency between different applications is crucial; it doesn’t matter if I’m typing this article in a word processing application, into a word processor, or even directly typing it into the database by hand – if I press Ctrl+N then I get a new window, Ctrl+S saves the document and if I get fed up then Alt+F4 will end it all.

The same process is true of navigation but with a wider choice of options, a plus icon generally represents creation, a cross represents a cancellation process, the floppy disk icon is now synonymous with a save operation – so much so that members of the younger generation have never seen a real floppy disk.

This is what the user expects, going against accepted standards needs to be done with extreme caution.  But, when the scope of your application grows beyond what was originally envisaged, a conventional menu system can’t walk the line between functionality and complexity while still remaining simple.

Breaking with Convention

The inadequacy of a conventional navigation system is an issue that Microsoft encountered within the office application suite.  It was in with the release of Office 2007 that the ribbon bar was born.

The ribbon bar merged the majority of menus and toolbars into a single set of menus and separated document specific options into a single menu.

Despite all of the research that was put into it, the ribbon bar was met with a mixed reaction from end users, who were happy with the way the old menu system operated, it took time to learn how to use and removed the existing customisation options, removing users ability to configure their own default options.

The initial reaction to the introduction of the ribbon bar demonstrates the dangers of making sweeping changes to commonly used applications, yet now, over ten years later, the ribbon bar is a staple of many modern applications.

Browser Based Applications

Windows-based applications will always have their place, but the push to move traditional business applications to the cloud has opened up the development world to new possibilities removing a reliance on a number of the underlying conventions.  Even with this in mind, it’s still very difficult not to cling to those older UX practices, in a number of cases, we should be clinging to those practices.

The push to move traditional windows based applications to the cloud while not disrupting the user work flow by completely redesigning the user experience (like with the ribbon bar) tends to lead us toward the “make it like it was before” mentality, pushing us to reproduce an exact experience within a browser interface.

Web-based applications push those of us who started our careers working in a purely windows environment outside of our comfort zones, but it has the same effect on our users.  It’s a tricky thing to get just right – giving the user something that they can use immediately and without thought while still taking advantage of the latest technology with the goal of improving the experience of those same users.

The internet browser provides us with a myriad of possibilities, removing the constraints with which we have previously been bound by.  If I wanted to, I could write a web app and put my application menu in the bottom right corner of the screen – this would hardly be worthwhile as conventional wisdom tells us that users pretty much never look at that corner of the screen, but I could do it if I wanted to.  This is why UX is so much more important in today’s world.

Menu based navigation

If we look at Amazon, where there’s a virtually unlimited list of product categories, the only viable way to navigate is by using a traditional drop-down menu, but the web environment lets us expand on that, we can move away from the simplistic menus of old, adding colour to differentiate product areas and fancy cursor tracking to make sure that users don’t accidentally change their category selection as they move the mouse over another menu option (see techie details here).

Sidebar navigation

Gmail looks to the past, reusing the standard format of all email applications, displaying its list of folders along the left of the screen, not unlike Microsoft Outlook.

Menu and sidebar navigation

Facebook is less concerned with providing a list of every single possible option, leaving core operations at the top of the screen and placing the more commonly used navigation options to the left of the screen, taking advantage of the screen height to automatically adjust the available options which are held in static areas of the screen.

Replicating windows functionality

Unsurprisingly, online incarnations of Microsoft office elect to reproduce their previously tried and tested approaches as closely as possible but still take advantage of the additional flexibility offered by an online environment.

Collapsible navigation

The likes of WordPress provide cut-down text editor options with collapsible navigation options to the right which hide away the full list of available operations so as not to overload novice users with too much information.

Context is King

In just a few examples we already have a handful of different ways of handling navigation and application operations within a web environment, we’re free of old limitations.

But, any good developer knows how we navigate our applications shouldn’t ever be driven by the available technology, nor should it be governed by the current fads in design trends.  The most import thing is the type of application we’re creating and the users we’re targeting.

If I’m writing an email application then I’d damn well better make sure that my application resembles an email app and makes use of the same sort of terminology that my intended users will expect.

If I’m writing a word processor then I’d do well to consider the conventions put in place in applications like Microsoft Word and Open Office because in 90% of cases, that’s what our target users will be familiar with.  If I’m writing a word processor for young kids then I’d be more likely to position options down the side of the screen, making them brighter and easier to interpret.

Universal law is for lackeys; Context is for kings.

There’s no denying that the future is coming, soon we’ll be catering for users who’ve never seen Microsoft Word without a ribbon bar (we’re probably there already), the technological world is fast-paced, prone to change and maybe even a bit fickle, if our applications don’t move with it then they’ll get left behind.

Microsoft are making sweeping changes to the ribbon interface (here) which will no doubt be mimicked elsewhere and are also bringing a form of AI into the mix

WordPress are expanding their editor options with their latest update – Gutenberg.

We’ve never been in a position where UX is as important as it is right now, our world is moving forward at an astonishing rate and it’s important not to get left behind.