I tried this new version on my phone first and my desktop browser just now, a little feedback

- I like it

- May our Visual Designer is working on an information overlay for use in the commons mobile apps, I'd like for the visual design to sync up with that work, which should be done in a few days

- Animation! I think this is a perfect opportunity to use some animation, we still want this to be quick, but having the overlays animate in(very fast), and out(less fast) would be ideal.

Jared Zimmerman  \\  Director of User Experience \\ Wikimedia Foundation               

M : +1 415 609 4043 |   :  @JaredZimmerman

On Thu, Jun 13, 2013 at 9:02 PM, bawolff <bawolff+wn@gmail.com> wrote:

> I like the overall look, couple notes:
> * Think about tablet and mobile views -- galleries are even awfuller on
> mobile right now than on desktop. This means a) consider touchscreens and b)
> consider small screens.
> * I'm not sold on "show title on hover". Touchscreens don't do hover...
> * Ragged edges can be fixed by adjusting spacing or aspect ratio a little,
> like justifying text. This would look awesome. :)
> * We need to fix what happens when clicking the items -- should get a nice
> zoomed lightbox or something. This should be shared with non-gallery media
> however, so can be outside this present scope.
>
> Another related thing to consider is Category page gallery displays...
> having a gallery-style display for contained media is relatively easy, but
> how can we show subcategories nicely? What about non-visual media? Can we
> display them better than we do now?
>
> -- brion

So I've tweaked the demo a little bit in response to feedback:
*If you're on a touchscreen, it will always show the caption instead
of hover. Screen readers should also always see the caption, and if an
image receives focus, its caption becomes visible.
**Nonetheless, hover seems to be a sticking point, so I have a bunch
of non-hover variations at
http://tools.wmflabs.org/bawolff/gallery/index.php?title=Main_Page
(May have to scroll)
*Javascript now justifies the images. (The page is loaded with 1.5x
the normal resolution images, and the <img> tag is manipulated to try
and fill everything up, up to a maximum of 1.5x the original size. The
last row is left as is, since its often a single image [Although as I
write this, I think it should be manipulated too, might as well make
it 1.5x]). As an aside, I found out that if I do text-align: justify,
the browser will adjust the whitespace between images to justify it.
However I think it looks better with the last row centred and
typically adjusting the image size is enough; the whitespace doesn't
have to be touched.
**If you resize the browser window, js doesn't re-adjust stuff
currently, so ragged edges re-appear. I suppose it could. Would make
things a bit more complex

> Another related thing to consider is Category page gallery displays...
> having a gallery-style display for contained media is relatively easy, but
> how can we show subcategories nicely?

There was a thread a while back on the commons village pump which I
thought was an interesting idea, where some users wanted a magic word
that would enable a gallery view for subcategories, where each
subcategory has a representative image specified via some means (I
imagine parser func on subcategory page), or if unspecified defaults
to the first entry in the subcategory.

Thanks everyone for the feedback :D

--bawolff

_______________________________________________
Design mailing list
Design@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/design