One of the major pain points we had in EHQ Admin was the navigation. Adding/editing a tool or a widget was a pain. As more and more features were built into the app, it just became harder to get to certain common tasks.
I’m a huge fan of Quicksilver and Alfred on OSX. The power it gives the user is unparalleled.
I love github’s find files interface (which incorporated the programmer-intuitive ⌘+T onto its web interface). Made popular by Textmate, the Command/Control + T Go-To-File has been in use by programmers since years. Here’s a screenshot from Sublime Text’s ⌘+T interface:
Another awesome feature which caught my eye was Atlassian Jira’s Dot ‘.’ and Comma ‘,’ Shortcuts which pops out a search box and common tasks which lets you type a task.
Observation and Interview
First thing we did was study user patterns. What are the tools they use in EHQ, How they navigate to a tool/widget and add them. We set up a demo site and asked people to create a website from scratch. Most of them said if there was a shortcut to get to where they wanted to, it would’ve reduced their time to almost half. Having shortcuts listed in the site itself would become a long, un-trackable list of links. Searchable list seemed like a good idea but placing it near a widget would make it just another widget. We wanted something which would be accessible site-wide.
Brainstorming and Prototyping
We did brainstorming on the idea and came up with tons of features to be incorporated. It had the capability for switching between projects, adding, editing deleting stuff, manage settings etc.
One of the first prototype paper sketches:
We proposed a couple of UI options.
Then, we came up with this:
See it in action in the video below: