OneDrive/File Explorer Integration [Updated Mar. 4: Drag and Drop]

Hi!

I have been taking some time to design a new OneDrive/File explorer application. In order for Windows 8/9 to become a completely unified OS. It is necessary that the two interfaces become completely integrated. Therefore, there can be no more distinction between the two. Below I have come up with come concepts that work to combine the two interfaces as best as possible. Post your ideas for improvement!

(Click image to enlarge)
Navigation pane buttons ("favorites, OneDrive, Homegroup, etc.) will be pin-able (so will the complete navigation pane as seen below).

  • I designed the concept keeping the current SkyDrive app in mind for touch because this is the future of computing; however, I then attempted to add much of the functionality that you can find in the current File Explorer application.
  • I have made the concept with the link bar on the left just so people can quickly get around to different file areas in their computer/cloud.
  • Also, I thought it was an important touch to keep the view button and properties pane button available like in the OneDrive site online.
  • Also I like how the app and online client keep files and folders separated by a little more space. I personally think that it makes it look much cleaner.

(Click to enlarge)
This image shows the menus expanded when you right click or swipe down from the top.
Navigation pane and address bar are pin-able via the view button below.

  • I found that to completely combine the two interfaces into one some things had to be moved around.
  • A lot of the same functionality is still available as in File Explorer through right clicking/pressing and holding on the files or folders themselves
  • I moved some of the menus to the bottom so to save space at the top for the address bar.
  • Again, you would be able to pin the navigation pane to the left side (as you currently can do in File Explorer) which would be great because I find that I use it the most out of all the menus/navigation buttons.
  • Also, I found that it was important to keep the back, forward, and up buttons because of their iconic functionality.
  • It does look a little cluttered with both menus open on top and bottom, but remember that this is only when your right click.

Important Questions:

  1. What would you need/miss if the two interfaces were combined?
  2. If you were making the design, what would you like to add or remove to make it cleaner/more complex?
  3. What other important features would you add?

Here are some more photos of some improved ideas from the feedback I got: (update: Mar. 4)

I inserted a radial menu design and I also decreased the icon size and moved the icon on the folder tile to the upper left. Moving the icon away from the title definitely cleared up the tile and made the name easier to read.
(Click images to enlarge)

  • I think it's a good idea to keep the background a greyish color just to white previews of documents look OK.
  • I really liked the radial menu idea for the File explorer and I think Microsoft should take it further throughout the OS and other apps. Actually I almost think that they should try to get it to replace the current right click menu.
  • This new radial menu signifies everything that metro is about: simple functionality and touch. I really love how you can just do swipe gestures on the dot instead of having to open it and I'd like to see them take it further.

  • Upon right-clicking you get the address bar on top and the navigation bar on the bottom.

  • You can then click on the arrow to get more options, including access to the folders within, frequent folders, and recent files within that particular area.
  • I think that it is important to have something with more flexibility for navigating through folders. I included this because if the navigation pane is removed by default with respect to touch devices, I think it would be a good idea to have another method for navigating to your folders.

  • Here sows the settings charm open with the "file, home, share, and view" menus.
  • Some of these settings I don't think are going to play nicely with the settings charm (i.e. File including cut and paste) as some of them aren't really settings, but rather they more so belong as a right click menu. Overall, I agree that it's best to put them here.

  • Lastly, this shows the view setting open, which plays nicely with the metro interface.
  • As can be seen, I included options to pin the Navigation pane and Address bar for those who want it. Also, I included a way to change the default scroll direction to accommodate for traditional desktop users.
  • Some of the accommodations are a bit awkward and don't quite flow with metro completely, but I think that they are necessary inclusions.

DRAG AND DROP

  • Here I've added some ideas for drag and drop.
  • Clicking and dragging a file will cause the navigation bar below to pop up half way. You can drop the file on a folder, the folder locations at the bottom, on another file (to create a folder with both files inside), and on the new folder button (to create a new folder with the single file inside).
  • (You can also drag the file to different folder locations in the address bar to get the same effect as in the current File Explorer.)

  • If you hover with a file over one of the buttons in the navigation pane it pops up with the folders inside.

I think it would be cool to have an "radial menu" like in the OneNote app for OneDrive (as mentioned in the comments below). I'm not sure how this would work, but I think it would work well and look good too! If some of the common commands were to be put on the bottom menu bar, I think that it would be a good idea for them to pop out automatically simply because it's really annoying and tedious to have to select the files and then swipe up from the bottom and then pick the command. It would be much faster if the buttons appeared automatically.

Let me know what you think about these additions! Does anybody else have any ideas for the other settings sections?