Thread Locked This thread is locked - replies are not allowed.


This question is answered. Helpful answers available: 2. Correct answers available: 1.


Permlink Replies: 7 - Pages: 1 - Last Post: 3 Nov 23, 20:51 Last Post By: JeffTucker
JeffTucker

Posts: 8,048
Registered: 31-Jan-2006
Thumbnail border options
Posted: 2 Nov 23, 23:06
 
Attachment plainradius.png (98.5 KB)
First, there's a little CSS problem when choosing both small padding and a large border radius on the thumbnails. See screenshot. Been there. ;)

But beyond that, I would simplify the border options.

I'd use a 3px border-radius all the time. Subtle, but good. Larger radii just make the page look old-fashioned.

I'd make the border and padding options simple check boxes. Choose border, you get a 1px border. Choose border and padding, you get a 1px border with 3px of padding. As with large radii, anything larger just begins to look like a relic from 20 years ago.

The drop-shadows are almost invisible. I'd set them at box-shadow: 5px 5px 5px rgb(0 0 0 / 0.25) ( rbga is now consider "legacy"). Still fairly unobtrusive, but gives the page a little depth.

There's also an inherent problem with the default thumbnail image bounds. If you choose Fixed shape for the thumbnails, and don't change the bounds, you get pano's. I'm not sure why the justified layout wants bounds that are at least 2:1 - I would think that 3:2 would be OK, and that would work for fixed-shape without needing any tinkering. The default bounds are 3:1!

Why am I obsessing about these things? Because I think the default skin should be as simple as possible, something a new user can use to make good-looking albums right out of the box.

I've also learned that giving users lots of options usually just means that you're giving them ways to make albums ugly. There are times when I'd like to go back and yank out about a third of the ones in my own skins.

The Captions and Lightbox options, on the other hand, I think hit the "sweet spot" perfectly. A few tweakable things, but never enough to destroy the appearance.
JeffTucker

Posts: 8,048
Registered: 31-Jan-2006
Re: Thumbnail border options
Posted: 3 Nov 23, 03:01   in response to: JeffTucker in response to: JeffTucker
 
JeffTucker wrote:
I'm not sure why the justified layout wants bounds that are at least 2:1 - I would think that 3:2 would be OK, and that would work for fixed-shape without needing any tinkering. The default bounds are 3:1!

In fact, I tried an album with justified thumbs with thumbnail image bounds of 300x200, and original images that ranged from a 1:2 portrait to some wide landscapes, maxing out at over 4:1, and had no problems with the layout at all. Sure, the extreme landscapes are cropped, but that's not unexpected. People who want to feed pano's into a project should be using another skin, anyway.

And with those bounds, switching to fixed-shape thumbs was also just fine, since most digital images are already around 3:2.
Laza

Posts: 1,411
Registered: 6-Sep-2005
Re: Thumbnail border options
Posted: 3 Nov 23, 08:32   in response to: JeffTucker in response to: JeffTucker
 
The problem with justified layout is you have to make all thumbs the same height. This is why it requires a wide enough horizontal bound. If using 3:2, all images having a wider aspect ratio will be zoomed, e.g. a 2:1 image will be zoomed by 33%. (Using 1:1 AR distorts images even more.) Perhaps this is still the better choice for an easier switch between the styles. I was thinking of adjusting the thumbnail dimensions automatically. I don't know.

I believe using the 90's-style grid layout as a default choice is not something new users will hook onto - even though I see your point. We have to trigger some wow effect right on the first make.
JeffTucker

Posts: 8,048
Registered: 31-Jan-2006
Re: Thumbnail border options
Posted: 3 Nov 23, 08:59   in response to: Laza in response to: Laza
 
But they’re bounds, not final dimensions. If the original image is 6000x4000, and the bounds are 600x200, the thumbnail will be 300x200. But switching to fixed shape will produce 600x200 thumbnails, which is horrendous.

But if the bounds are 300x200, the images will still be 300x200 - exactly the same. But choosing fixed shape will produce 300x200 thumbnails, which is fine.

If you’re worried about the zooming that’s needed for a masonry layout, force HiDPI thumbnails.
Laza

Posts: 1,411
Registered: 6-Sep-2005
Re: Thumbnail border options
Posted: 3 Nov 23, 09:11   in response to: JeffTucker in response to: JeffTucker
 
In the case of justified layout no FixedShapeFilter is applied, so with 300x200 bounds, a 2:1 AR image will result in 300x150px, which will be displayed as 400x200px. Not as bad as if the bound were 200x200, where the thumb would be 200x100px - displayed with a 200% zoom.
JeffTucker

Posts: 8,048
Registered: 31-Jan-2006
Re: Thumbnail border options
Posted: 3 Nov 23, 14:36   in response to: Laza in response to: Laza
 
Ah, yes. Doubly-tricky since you're using a masonry layout in which all the rows are the same height (I'm using Justified Gallery, which allows the row height to vary, within limits, to accommodate some of the variation).

I'm not usually a fan of having the skin change bounds - "doing the user a favor" - but maybe in a simple skin, it's called for. If the bounds are 360x240 and the user selects "justified," change them to 720x240. If the bounds are 600x200 and the user selects "fixed shape," change them to 300x200. For fixed shape I'd go to 3:2 rather than 1:1, since most images are in a moderate landscape aspect ratio. If the user really wants square, he can easily do that, especially since the jAlbum presets for that field are all 1:1 choices.
Laza

Posts: 1,411
Registered: 6-Sep-2005
Re: Thumbnail border options
Posted: 3 Nov 23, 17:40   in response to: JeffTucker in response to: JeffTucker
 
It's not masonry either, the height varies between rows.

I made the thumb dimension helper so it makes the thumbs 1.333:1 if AR > 1.5 for fixed layout, and 2:1 if it was 1.5 or smaller for justified.
JeffTucker

Posts: 8,048
Registered: 31-Jan-2006
Re: Thumbnail border options
Posted: 3 Nov 23, 20:51   in response to: Laza in response to: Laza
 
The problem with border-radius, when combined with padding, has been taken care of. The differing image bounds that work best with justified vs. fixed shape thumbnails has been addressed in a reasonably clean fashion.

The box-shadow spec is still using a bit of deprecated code, but the old style will probably still work forever. I still think they could stand to be a tad deeper, but that's just IMO.

Everything else in this thread falls into the "just a suggestion" category.
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums