I think you've made some valid points and I'm still not certain about file actions being shown on hover. Adjusting to screen sizes would be good and I believe we should be doing it in a similar method as this: <a href="http://webdesignerwall.com/tutorials/adaptive-mobile-design-with-css3-media-queries">http://webdesignerwall.com/tutorials/adaptive-mobile-design-with-css3-media-queries</a> I still think there is a need for mobile apps because it will allow for better navigation, offline usage, and at least with Android we can use intent filters to easily upload items to ownCloud. <div>
<br></div><div>Michael<br><br><div class="gmail_quote">On Mon, Jul 25, 2011 at 4:18 AM, François K. <span dir="ltr"><<a href="mailto:daitheflu@free.fr">daitheflu@free.fr</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex;">
Hi guys,<br>
<br>
It's been quite a long time since I last participate to ownCloud. But I'm still keeping an eye on it, although I don't really understand some choices that were made.<br>
Allright, since I'm really digging UI design, I'll try to provide my thoughts about that mockup, in a constructive manner.<br>
<div class="im"><br>
> 1) The file list seems to float around in space. We need to give<br>
> ownCloud<br>
> a stable look.<br>
<br>
</div>I can agree with that. What's currently existing is mostly based on my work, which was a WIP when someone decided to integrate it. So yep, it wasn't finished at all and was clearly needing improvements.<br>

<div class="im"><br>
<br>
> 2) I used ownCloud on a netbook last week.<br>
<br>
</div>What I understand behind this is that the current CSS doesn't fit small screen sizes. Well, we have mediaqueries to handle this, there is no need to change everything.<br>
We could apply the same strategy for smartphones : imho, there's no need for an Android app or a WebOs app. We just need to work out a CSS.<br>
<div class="im"><br>
<br>
> 4) I did some usability testing over the last weeks.<br>
<br>
</div>What kind of tests ? How ? What did you test ? What are the results ?<br>
<div class="im"><br>
<br>
> The changes, I’ll start from the top:<br>
><br>
> Header<br>
> The bar does not really need to be that big. It’s reduced to fit the<br>
> height of an input field (the search bar). Logo changed to text next<br>
> to<br>
> icon. Everything else stays the same.<br>
> I’m undecided yet if it’s a good idea to put the music player controls<br>
> there. But we might as well try it out.<br>
<br>
</div>The top bar sets ownCloud identity. I never thought about it as a "controls" place.<br>
I never understood why the search bar is here. Never understood why the buttons have no text either.<br>
<div class="im"><br>
<br>
> Files control bar (breadcrumbs etc.)<br>
> Since the current home symbol does the same as clicking on "Files", it<br>
> makes sense to just connect the two. Files will always be the top app.<br>
> The<br>
> buttons for Upload and New Folder are placed right next to the current<br>
> folder - that which you would upload to or create a new folder in. For<br>
> smaller windows, the breadcrumb entries will just vanish to the left.<br>
> The<br>
> last ~3 should always show, if it gets narrower then that the labels<br>
> of<br>
> everything but the current folder will abbreviate: Doc… > Kittens ><br>
<br>
</div>This would be an error, IMHO. You are putting navigation and controls in the same zone.<br>
<div class="im"><br>
<br>
> File list<br>
> Fills the whole width of the window, no floating around freely in<br>
> space.<br>
<br>
</div>I agree.<br>
<div class="im"><br>
<br>
> The modified date will be displayed relatively (last week, yesterday,<br>
> 2<br>
> hours ago) and in similar brightness as the file size - the older, the<br>
> lighter.<br>
<br>
</div>I think date format should be an option. I personnaly hate to deal with relative dates.<br>
I don't understand that brightness thing. I should probably give the latest version a try to see what it is about.<br>
<div class="im"><br>
<br>
> Currently the check box column is useless unless you multiselect. It<br>
> will<br>
> be combined with the icon column to show a checkbox on top of the icon<br>
> when you hover. That will also make the heading "Name" start flush<br>
> with<br>
> the actual filename.<br>
> Except for the checkbox, when you hover a file, there will be inline<br>
> options to rename, download, share (see the icons) and delete on the<br>
> far<br>
> right (because it’s a dangerous action, especially atm). No dropdown<br>
> anymore. (For tablets, the icon can be clicked to select, then the<br>
> options<br>
> will appear as well.)<br>
<br>
</div>I don't think relying on "hovering things" is a good idea. As you said it, everything tactile doesn't provide hover facilities.<br>
I also think the dropdown thing isn't that great and should be replaced. But it clearly needs to be more efficient. What do others projects provide ?<br>
<div class="im"><br>
<br>
> Rename will convert the file name into a text field and enable inline<br>
> editing.<br>
<br>
</div>That seems to be a good idea.<br>
<div class="im"><br>
<br>
> Clicking "Share" will open up a lightbox/popup of some sort<br>
> with<br>
> sharing options, not sure yet.<br>
<br>
</div>Seems to be a good idea too.<br>
<div class="im"><br>
<br>
> And I finally solved how to properly do multiselect (no mockup for<br>
> that):<br>
> As soon as more than one file is checked, the actions that show on<br>
> hover<br>
> for each file (except for rename) will be shown in the table header<br>
> bar,<br>
> between "Name" and "Size".<br>
> Also, "Name" will change to "1 folder, 3 files" or whatever you<br>
> selected.<br>
> "Size" will change to the actual added up size of those files. I don’t<br>
> have an idea for "Modified" yet but it might as well vanish.<br>
<br>
</div>To me, it doesn't seem to be a good idea. We could just add a little zone to display that. We shouldn't change the table headers.<br>
<br>
<br>
Well, again, these are just my thoughts about it.<br>
<br>
Cheers,<br>
<br>
--<br>
<font color="#888888">François<br>
</font><div><div></div><div class="h5">_______________________________________________<br>
Owncloud mailing list<br>
<a href="mailto:Owncloud@kde.org">Owncloud@kde.org</a><br>
<a href="https://mail.kde.org/mailman/listinfo/owncloud" target="_blank">https://mail.kde.org/mailman/listinfo/owncloud</a><br>
</div></div></blockquote></div><br></div>