Interface expert and technology explainer
British Columbia, Canada
I’m on a one-man mission to make a better browser window. Too much vertical space is wasted with bookmarks, fat tabs, and empty title bars. I want to browse!
I’ve updated my original Safari mockup to now have a shorter status bar at the bottom, expanding only to show relevant information (in this case, a tick mark to show the page is loaded).
Come on developers, use the vertical space better!
Bookmarking in the latest beta of Google Chrome is confusing. Here’s why, and how to fix it.
Here’s what happens when you click the ‘Star’ button in Google Chrome. You get the following ‘dialog’ (or panel or whatever):
As you can see, the bookmark is already created, and we’re given the chance to edit the bookmark’s name and the folder it goes in.
The problem here is that the completed step of creating a bookmark with default information (“step 1″), and the incomplete step of editing that bookmark (“step 2″), are being merged together, and a single dialog is being used to cover both. It feels like a nod to how bookmarking has always been done, without understanding the effect of the changes to the task flow.
Dialogs are designed to give the user control over one clearly defined step. “You’d like to save something… okay, give me the details in this dialog, and then click ‘Save’ to complete the saving process.” The buttons across the bottom of a dialog almost always perform some action based on the fields and options in that dialog.
Safari takes a similar approach to bookmarking. “You’d like to bookmark this page, because you’ve chosen ‘Add Bookmark…’. Okay, confirm the bookmark name, then click ‘Add’ to complete the bookmarking process.” It effectively reverses and combines the steps of Chrome: rather than editing the bookmark after creating it, you make sure the details you use to create it are correct. Whatever the merit of this approach to the task (i.e. asking you to confirm the bookmark creation), it’s incredibly intuitive in how it’s executed.
Chrome still gives you a single dialog box, but uses it to give options affecting one completed step and one incomplete step: mistake one. The buttons on the bottom of the dialog affect different stages, with one button (Remove) having nothing to do with the fields and options in the dialog. (As an aside, there is also no button to cancel unwanted edits made in Stage 2.)
The purest solution to mistake one is to use a UI element or approach that could separate the following:
1. I have automatically created a bookmark based on your click of the star, but you can delete it if you want.
2. You can optionally choose to edit the details of that bookmark I’ve created.
Chrome also uses some inaccurate button names: mistake two. ‘Remove’ is actually an undo for Step 1. ‘Close’ is actually a save/apply/whatever for Step 2. ‘Edit…’ is… just plain weird.
Firefox’s approach is a half way fix. It uses slightly better buttons and wording to avoid being as confusing as Chrome, so it avoids most of mistake two. However, parts of mistake one are there too: it proudly says “Page Bookmarked”, with options in that dialog to then edit the details. “Cancel”, however, should really cancel any changes to the edits (the focus of the dialog), not delete the bookmark. They kinda get away with it.
And the ideal? It depends on how people bookmark, which I can’t judge other than my own habits. I don’t think confirming the creation of a bookmark is a huge deal. It’s not like we’re doing it excessively on the critical path of using our computers.
I’m sure an elegant solution can be found: it’s just not Chrome’s current one.
Some (techy) audiences have been clamouring for the iPad to support multitasking: more than one app running at the same time.
Despite the naysayers, it’s hard to argue with the ability to listen to your favourite internet radio (Pandora) when using iWork, or continuously chatting with your friend (Beejive) whilst web browsing.
Here’s how Apple could implement it.
A ready-made, mostly-permanent ‘dock’ for indicating and accessing background apps is already available: the status bar.
Background apps would need to have:
When the user is in a background-supported app and clicks the in-app button (say ‘minimize’), the app could minimize itself into an icon in the status bar, returning the user to the springboard. The app continues to run, but can be recalled at any point by touching its icon in the status bar or in the springboard.
As in the screenshot below, the focus on the recalled app could be enhanced by dimming the foreground app. Some form of front panel would be ideal.
(Used Beejive as an example app)
I have used red/yellow buttons for closing/re-minimising the app; however this is an OS X Desktop concept, used by me only to show ’something’ is feasible here. iPhone OS-style named buttons could equally be used (with agreed terminology).
So with this approach to background apps:
I don’t think Apple will be doing free-for-all multitasking any time soon. However, it won’t be because it’s hard to implement.
Browsing movies in iTunes needs to be much more interactive and visual, like it is in a video store. Here’s just one concept of how you could do this, using Cover Flow in a really appropriate way.
This is how I’d like to see Safari on the Mac… or indeed, how I’d like to see every web browser. Maximise the vertical space, use all the space on the left and right on our widescreen monitors.
