File Dialogs

IMHO, File Dialogs are a poor user interface for power users, and they are dreadful for users at the opposite end of the spectrum.

Regular Users

I've met so many people who get confused by the difference between a File Manager, a File Dialog and a Folder.

Here's a sensible mental model :

Files (such as a text document) live somewhere.

1. To open a file, we go to that place, and double-click.
2. To rename a file, we go to that place, right-click -> "Rename".

These two simple use-cases show the flaw.

Use-case #1 uses a File Dialog (from File->Open). Use-case #2 CANNOT be done from a File Dialog.

The mental model fails, because the assumption that files exist somewhere isn't true.

There are two different places that files live, (File Dialogs and the File Manager). And the actions you can take in these two places are different.

IMHO, that's a major design flaw!

Power Users

Look at any IDE, and notice that opening files are drastically different from every other application. Instead of File->Open, we use shortcuts, or a tree structure in a dock.

A Better Solution

Remove all File Dialogs. Remove File->Open.

That's an excellent start. To open a file, go to a File manager and double click it.

Now the obvious issue : But my text editor is maximised, and regular users don't want to juggle overlapping windows.

True, so dock the file manager to the left of the screen (just like in an IDE). But instead of being part of the application, make it part of the Window Manager / Desktop, so that it is accessible no matter which application you are using.

Start simple - only have one dock. But as users become more competent, add more; one for each "project" they are working on. e.g. One for the books/letters/leaflets they are writing. Another for the music they are listening to...

Save With Options

Have you ever saved a music file? There are lots of options, such as file-type, bit-rate, sample-per-second etc.

Imagine you've never seen a computer before, and you instead you write a note to your secretary to do this for you. Here's what I expect that not to look like :

Save this song :

Name it : The Greatest Love Song
Put it in the same place as the other songs I created this week.
Make it quite small (it's just a demo, not a final release)

IMHO, this handwritten note is how we should start thinking about a Save UI :

Name        _____________
Folder      _____________ ...
Bit Rate    ________

                   Cancel  OK

Note this is NOT what a traditional Save Dialog looks like. A traditional save dialog is almost entirely filled with a list of files and folder.

My solution have just 1 line for the folder. It's just a text field, with super-powers :

• Default to something sensible (such as the last place you saved a song).
• Shortcut (UP ARROW) to remove the last part of the path (i.e. change to the parent folder)
• Shortcut (DOWN ARROW) to show sub-folders
• Drag to select a folder.
  • Drag a folder from the File Manager to the Folder field. My internal monolog is saying "I want to use THIS folder", where "THIS" is the folder I'm dragging.
  • Drag in the opposite director (drag the Folder or Name field to the File Manager). My internal monolog is saying "I want to save the song HERE", where "HERE" is the folder I'm dragging to.
• The "..." at the end is a button which lets the user pick a folder using a GUI, in case they don't like using the shortcuts. This gui is a Folder Dialog. It only lists folder by default, not files.

So there are 4 ways to select the folder.

1. Typing, and using shortcuts
2. Dragging from a File Manager
3. Dragging to a File Manage
4. Using a Folder Dialog (IMHO, the worst, and most confusing option)

Power users will use #1 all the time. Noobs will use #2 or #3 (assuming there is a file manager permanently docked to the left of the screen) #4 is solely there as a half way house for those brought up using the traditional, "broken" user interface.

Save Without Options

For simpler file types, there are no options, but the same logic applies. i.e. To save a file, the dialog should look like this :

Name        _____________
Folder      _____________ ...

                   Cancel  OK

FYI, this user interface is OLD. RiscOS's save dialogs looked like this (1987) :

            ┌────┐
            │ICON│
            └────┘        
      /myFolder/myFile.txt____
     
                            OK

• It has an icon (meh, I don't care if it's there or not)
• The name and folder fields are combined into one.
• No "..." button.
• Dragging only worked in 1 direction (to the File Manager).
• No shortcuts to navigate through the folder hierarchy.
• The input field was far too narrow.

Featureful's UI

You will find this UI throughout my Components :

File      __________________ ...

or :

Folder    __________________ ...

I never use the "..." to pick a file/folder, it's there as legacy / "bad" UI. I only type or drag file/folders.

Open files from a File Manager. There is no File->Open.

Rename/Copy by right-clicking a file/folder. (Anywhere that there's a file/folder, not just the file manager).

No File->Save As.

Back