UNDER CONSTRUCTION

File Manager designs

Last week I decided to try and create some Illustrator based designs for a file manager widget.
I had some early ideas like making the widget as small as possible without losing important information.
But I also had to fit a bunch of user actions inside the small space that I had set myself.
First of all I decided to drop the entire folder structure, so the only thing the user sees is the current folder he is in.
But I had to provide the user a way to quickly navigate between the hierarchal map structure so I used the well known "breadcrumb" navigation system.

Things that I thought are needed in a FileManager.

• File management
  • All your courses and projects visible on one screen.
  • Remove the entire folder structure.
  • A way to quickly add multiple files.
  • A way to quickly delete multiple files.
  • Adding multiple folders in one go.
  • Deleting multiple folders in one go.
  • Drag files from site to site.
  • Drag files from folder to folder.
  • Provide sorting on all the fields.
  • Provide sorting on 'kind'
  • A way to select all files/folders in a folder.
• Personal Collection management
  • Drag one or multiple files to a collection.
  • Delete('unchain') one or multiple files in a collection.
  • Adding new sub collection folders.
  • Create new collections
  • Delete entire collections, but when doing so not to delete the files.
  • Sorting collection content.
  • A way to select all files/subcollections in a collection.
  • Drag files from collection to collection.
  • Drag sub collections from collection to collection.

• Information on a file I provided in the design.
  • Icon + link to resource
  • File name + link to resource
  • Size of the file
  • The last changed date

• Information on a folder I provided in the design.
  • Icon + link to the folder content
  • Folder name + link to the folder content
  • Number of items present in the folder
  • The last changed date

Screenshots

This screenshot shows you files in a folder plus the 'my collections' overview.

This screenshot shows you files in a folder, but hides the 'my collections' section.
When this happens the option to drag files/folders into collections is disabled.

This shows the collection viewer, which contain a mini file viewer in order to allow the user to drag files/folders in a collection.

Workflow