Interface design can be improved

Looks very nice, I will wait for the other views and see how this is going.

Can you do also a mockup with the thumbnail panel ?

I've made some other mockups.

For the thumbnail panel view i've made two:

1- http://fav.me/d5iroee (http://fav.me/d5irply this one is a bit less transparent)

2- http://fav.me/d5irnxw

The contractor sharing menu: http://fav.me/d5irolj

and for the album view: http://fav.me/d5irp7t

 I hope you like some of the ideas.
Suggestions are welcome.

An icon suggestion

Some experiments arround your first mockup

updated the icon mockup. think it now looks better.

Yes, it's a lot better.

I think you would improve it by adding some glass effect in the big sized version of the icon instead the gradient, and changing the angle of the "album page" that is over the other ones. Also, is possible to do some changes to make it look a bit more "tango-style" as elementary icons do?

Look now, i've fixed some things

and this is with the overlapping: http://screencloud.net/v/eL0Y

let me know what you think.

I just saw the picture you attached experimenting with my mockup, it looks a lot better...(in my eyes) i just find a bit odd the zoom slide there.

http://fav.me/d5ityao

New version looks better hehe :D

Check now the slider. I think you was right about it was "odd", and it was (in my opinion) because the slider size. Also, I added 2 icons, that improve consistency. These are from Shotwell.
I have ruled out the possibility of holding + / - buttons , because it would be inconsistent with the rest of applications available for the Gnome desktop.

It looks a lot better with those two icons. But will be the zoom slider also visible from the album view, or is it possible to zoom in the album view?

By the way I checked the elementary HIGS for the icons and I think the icon follows the Tango style. these are two examples i came across:
for the shape: http://screencloud.net/v/j1tj
and the overlapping: http://screencloud.net/v/m7Cr

Let me know what you think.

In the attached image i was playing with a textured background for the Album view.

another option.
sorry for have spammed this tread so much tonight.

yet...another one

(reposting this cause i get messed up with the another one)

I was thinking about the Home button/Album view switch, and that made me think: if you are seeing an image there should be another button to take you to the Album from where the image is from, and therefore to see all the rest of images inside of that same album. While the Home button would take you to the main album page with all the other albums.

So I made another mockup with this in mind. I hope it explains itself.

And also about the zoom slider, I think it's pretty intuitive to zoom in or out using the mouse scroll wheel , or the gestures in case of a laptop. If there's no way to use none of them, then using an option from the gear menu, as Foto does now. And when the zoom action is activated, then show the zoom slider. Just some ideas.
Let me know what you think.

Hey Camilo, you should create a branch called "foto-icons" and another called "foto-mockups" or something like that, so, if you change something, you don't have to upload the changes here.

I liked a lot the last icon you uploaded, I think it would be included in foto as default icon :D!! but I still have to research how to do it.

I have been working on a new widget called "GroupButton", because there is not a widget like this in Granite Api, and I'm very happy with the result. The slider would require some work, because it's difficult to overlap widgets in gtk, so, I think, the solution is to create a popup, maybe, using Granite.WIdgets.CompositedWindow.

I have decided to hide buttons that are not being used instead of setting their state as inactive. Also, the nav buttons, should be always at center of the bottom toolbar, that is what I believe.

Now i'm going to push the code.

What I have now (see attachment):

Just compiled it and it looks great. Just two issues:
1- The gear menu popup should be heading upwards, instead of downwards . it looks odd and in full screen you can't see the menu options.

2- There should be a "go back" button on the album view if you went to it from an image, so this way you can go back to the image.

Not sure if I should fill a bug report for this issues.
Let me know

1.- It's a granite bug. I have already submitted a fix for it, so, i'm waiting for my code to be approved :)

https://bugs.launchpad.net/granite/+bug/1070180

if you compile my version of granite with the fix, and then uncomment line 49 in MainWindow and compile, you will see that the problem is fixed.

2.- Maybe, it's something I have no decided yet how to do it.

Also, I have though about a "slideshow" or "presentation" icon in the middle of forward and backward icons.

About the icon, I have been testing it on plank and I still think that it needs some work with border. Maybe a darker and less rounded border. See terminal icon from elementary icon set for reference. Also , it need fit to the elementary icons margin, and different size versions.

We should use a chat or something like that for interface design talk. google+?

I'm still trying to figure out how to create a branch.
Meanwhile I want to show you two more mockups:

1- http://screencloud.net/v/gwu9

This one just to show the idea of adding an image from the image viewer to a new album or to a existing one. Also the ability to select images (as Files does) and add them too to an album.

2-http://screencloud.net/v/b5ys

A mockup for the inside of an album. Also, this shows you what I meant in my last comment about a "go back" button, to return to the image if you went to the album view from it.

I've made some variations to the icon. I tried to make it stand up more with a darker background gradient (1), but i don't quite liked it. So I made a few with a brown background. Take a lot and let me know which one you like better.

My google+ account: https://plus.google.com/u/0/104908072417273204416/posts

take a look* sorry, my bad

That's a lot of icons, sorry for the spam. This is the one with the dark background

https://code.launchpad.net/~kxmylo/

there are all the mockups and all the icons i've worked on.

I've made a new mockup for the thumbnail panel and the basic image enchantments (basic ones like rotating, cropping and color balance, and also Image filters) . I based on the sidebar of Audience. I attached a png preview. Let me know what you think.

Also I've made this other two mockups.

1- An idea for the face recognition feature. A new Faces view:

http://i.imgur.com/93uza.png

2-And a mock up of the toolbars. I think it looks weird and inconsistent to have to maximize icons which do different things, so I used the view-list-coverflow for the fullscreen/slideshow function instead of the view-fullscreen-symbolic:

http://i.imgur.com/dPo52.png

Let me know what you think.

attachment for tread #26

A faces view is a good idea, but I have been thinking about using a sidebar, like Noise, Pantheon-Files, etc...

Maybe it's a better option, considering that we will have a lot of views and stuff:

-Tags
-Albums
-Pictures
-Faces
-Folders (maybe?)

Well.. we have time to think about it. First I need to figure out how to implement this faces thing. Maybe, OpenCV is a good option, but it will needs some custom vapis.

I take this opportunity to mention that I have been playing with css, and it occurred to me to add a radial gradient to album view. I'd like to get your opinion. See attachment.

it looks nice but yet, it feels weird on the album view cause it concentrates the view in the center of the gradient cause of its circular shape, i felt it distracting. Have you tried with some noise effect?

http://www.mightymeta.co.uk/demos/css-noise/
Blog post with downloadable code here: http://www.mightymeta.co.uk/css-noise/

These css noise effects uses images as background. Currently, there is not possible to do this in gtk, because repeat-x and repeat-y properties are not supported. It would require some hack, and I don't want to do something like this.

Apparently it will be possible with gtk 3.6???

http://www.youtube.com/watch?v=gTYUn72Wjyk

on gnome-boxes 3.6: http://blogs.gnome.org/mclasen/files/2012/09/boxes-customize.png

I thought it was possible cause of the noise background of gnome-boxes on ubuntu 12.04: http://foro.ubuntu-guia.com/file/n3714572/00.png

but it seems really messed up now that i see it again.

"Since my last post on the topic, GTK 3.4 brought in a lot of improvements, including among the others, support for most of the properties of the CSS3 backgrounds and borders family, linear gradients and the long requested inactive windows theming feature, which is showcased in GNOME 3.4"

previous posts links to this page: http://www.w3.org/TR/css3-background/

see there these:

3. Backgrounds
3.1. Layering Multiple Background Images
3.2. Base Color: the ‘background-color’ property
3.3. Image Sources: the ‘background-image’ property
3.4. Tiling Images: the ‘background-repeat’ property

 i don't know if this might be helpful or just spam .

Yes, I have tried this, but this does not work :(

You can experiment with css now, just edit the css files stored in : /usr/share/foto/style/default.css

I tried it and this is what i got:

1-http://screencloud.net/v/nSwU and http://screencloud.net/v/CLuG

i made a new noise image a lot bigger than the one you pushed

this is with the noise.jpg in the /data/icons folder:
http://screencloud.net/v/FFym

I don't think that using a bigger image is a good solution.
For now, I will remove the radial gradient, because it load very slow, and cause some visual glitches.

Next commit comes with "image draging" feature, so, we can add pics into an album.

I've updated the mock up for the slideshow(presentation)/fullscreen function for foto.

There should be a difference between fullscreen and a Slideshow view. As a slideshow i picture a presentation of your images with transitions effects, e.g coverflow, while fullscreen would be the same window fitting the whole screen space.

In case there won't be such slideshow type of view, I think would be much more nicer to use the window maximize button to fullscreen the app, as audience does right now.

With this in mind I made this mock up:

What happens when the user does press the fullscreen button, from window mode?

Would just normally maximize. Given that the button "Slideshow view" would do pretty much the same as a "fullscreen" when you pause the Slideshow transitions.

If there weren't a Slideshow type of view, then the maximize button from the window would fullscren the app.

I've updated the mock ups for a sidebar in the home view.

1- The Image Viewer: https://dl.dropbox.com/u/39261980/0-image-viewer.png

  The toolbar buttons in order: Go to Home View - Go to Album Grid View - Go to Slideshow View ----- Previous image- Next Image-------- Contractor Share Button-Floating Bar (to edit the image with filters or basic option like cropping, rotating...)

2- The Slideshow/Fullscreen View: https://dl.dropbox.com/u/39261980/1-fullscreen-slideshow.png

  Button in middle of previous/next to pause-start the slideshow and one next to View Album Grid to restore the window.

3- Home View: https://dl.dropbox.com/u/39261980/2-homeview-sidebar.png

     The toolbar buttons in order: Add/Import images (to create a new album or to add it to an existing one)- Fullscreen View--------------------contractor share button-floating bar (insensible unless you can edit a full selected album)- The Search Bar.
 And in the side bar some filters for tags, rates, tagged faces, dates, imports etc...

4-Album Grid View: https://dl.dropbox.com/u/39261980/3-AlbumInside2.png
  The toolbar buttons in order: Go to Home View - Add/Import images (to add it to the existing one)- Start Slideshow/Fullscreen View (with all the images inside of the album)------------ zoom slider for the previews of the images----------Contractor Share button- Floating bar (to edit the selected image or various if possible) - the search bar.

Let me know what you think.

Just an idea for albums view, it's not a mockup, is a fast prototype I did.

What do you think?

It looks really nice, but i think it should be optional to have that header.
It could even have more info, like people/faces tagged on the album, album creation date... and that kind of information.
btw, in this prototype were you using the granite thinpaned?
  Again, it looks really nice, to me.

Also, I notice that in the Home view, the option to create a new album should be on top first and not at the end, cause when you have a lot of albums you have to scroll down to be able to access to the option and it's hard to discover, i believe i'd be easy if it were on the top, like the tabs work on midori, pantheon-terminal, the option to add a new tab is the first one.

Agree with you that this header should have more information, but I don't have idea how to organize this information in a easy way. It would be perfect to see what do you have in mind in a mockup.

Also, yes, that is thinpaned. At left, sourcelist, and at right, the view container

About the position of the "add button", I'm going to see how other apps solves this problem first. I am aware of the problem, but not sure of the solution

I updated the mock up with the header information, i couldn't think of something else to add, although there could be more useful information if you come up with it.

Also about the add button, in facebook they do the same as i wrote before, putting the add button first: http://screencloud.net/v/eQT1

What happen if there are too many tags or people? should the header be scrollable? or only the right side? or not?

only the tags box in right side, and clicking one face tag or just a simple tag should filter the images inside of the album.

I have added the noise effect, I realized that the workspace view plugin in Gala is using a noise texture as background, so I took the code from there, it's not so "hackish" as I though.

Also, a Drop Area widget has been added, and the multiple files import is now "working". The next step in this direction is to add a folder import option.

Other important thing is that I have received a lot of commentaries of people that dislikes the bottom toolbar. I have been thinking in removing the toolbar from the albums view, because of this:

1.- In the albums view, you don't need any buttons.
2.- In the image grid view, you only need one button, and this button can be placed in other place.

 I have been thinking about putting the "back" button in the album info (the gray bar at top), maybe in the right corner, like the Android 4 apps button. Also, if is needed, multiple buttons can be added following a vertical layout (ie: Gwibber).