Making the clipboard usable

When I was a kid, I didn’t know what the icon with the scissors did. I didn’t know what the icon with the two papers did. Even after I learned what copying and pasting is, even after I knew the common “Ctrl+C”, “Ctrl+X”, and “Ctrl+V” shortcuts, I still didn’t know what those scissor and paper icons did. I once mistook the scissor icon for the “Crop” button and was surprised when the whole image disappeared.

I wonder if anyone out there ever found the two clipboard icons intuitive. What do scissors have to do with the clipboard, anyway?

Being a stickler for consistency and clarity, I set out to make a more usable set of clipboard icons. My goal was to connect the clipboard icons visually, so that anyone could quickly tell that the icons belong together. I also wanted to make the functionality obvious: I used the standard “move” and “copy” symbols, as cutting is simply moving to the clipboard and copying is copying to the clipboard.

Can you tell which one is Cut and which one is Copy?

Notice Google Docs’ New Style Management?

I’ve just noticed a revamped style drop-down in Google Docs. Apparently, it’s been there since February 7th. It makes customizing styles simple, plus it gives a preview of the style (font, bold, italic, underline, and size up to a certain limit).

It’s probably the best style gallery that’s out there to date. If only it weren’t so limited…

Go check it out. 🙂

Looking for an icon designer

The LibreOffice design team is looking for an experienced icon designer to oversee an effort to create a flat icon set for LibreOffice. The designer wouldn’t have to create any icons (although he would be more than welcome to), he would simply help craft guidelines and act as a mentor and a guide for inexperienced icon designers wanting to contribute.

Would anyone be interested in taking on this role?

There’s no pay, although if a designer wanted some monetary compensation, we could start a Kickstarter project.

Making styling easy as π

When talking about UI reform, the thing I hear most is that hard formatting needs to die and everyone needs to be forced to use styles. While I don’t think hard formatting should be abandoned completely, I do think that styles are an underused feature. And it’s underused because it’s a hassle to use. Creating styles is hard, editing styles is hard, and even applying styles takes a considerable while longer than simply hitting that “bold” button up at the top.

So here’s my attempt at making styles simpler. It’s a series of mockups for the tablet, but it would work the same way on the desktop.

The style list is drastically slimmed down. Only the first member of ordered groups of styles (like Headings) is shown until that member is used in the document — e.g. once you use “Heading 1”, the list will also show “Heading 2”, and once you use “Heading 2”, the list will also show “Heading 3”, etc. The list is also shorter because paragraph and character styles have separate drop-down menus.

Adding styles and editing them is done right within the menu — there’s a toolbar up at the top. Pushing edit shows all the included styles:

Within the style editing dialog, there’s a “Pin” button and a text box for a textual icon. When pinned, this icon ends up in the style bar, a toolbar for pinned styles that floats above a selection. It makes getting to commonly-used styles easy, easier than to Bold or Italic with a mouse, because a mouse has to cover less distance to reach these style buttons:

Looking forward to feedback. :~)

Why we still need Wave

Observing how people have been slowly abandoning e-mail and moving to closed communication systems that merge the features of chat and e-mail — Facebook’s Messages, Apple’s iMessage, and even social network posts (though these were designed for a different purpose).

I really hope that an open-source alternative that seeks to define a single message standard arises soon — something like Google’s Wave, only less complex and with a better UI.

Anyone in the FLOSS community interested in reviving the project?

Rulers

You might have noticed that my tablet UI proposal is missing rulers. That’s because I wanted to make rulers contextual: if a user inserts a tab or taps within the empty space where a tab is, a tab handle and a horizontal ruler should appear, allowing the user to adjust the tab width. Or if the user inserts a floating object (image, table, shape, …), rulers should appear. Or if the user selects a page, he should be able to adjust the margins.

I also thought that maybe there could be a single “ruler mode”, where the user is able to adjust all the lengths and widths within the page (margins, column widths, indents, tabs). I’m wondering: should this mode be triggered by selecting the page? Then the user could get to this mode much faster.

Possible page selection modes

 or 

With the ruler shown, the user would able to edit the units it uses. With an object selected, the user would also have the ability to type in the object’s distance from the margins. Here’s a mockup of what it could look like for a selected tab:

What do you think?