PREVIEW: New Gallery Cover Photo and Gallery Header

leftquark · January 12, 2016

DGrinners,
We always want your photos to look their best and one way that your photos look even better is with a beautiful Cover Photo, adorning the top of your gallery in beautiful full-width glory. We've been hard at work designing the best possible upper portion of your Gallery and we'd like to share with you our thoughts on how this will look and feel.

This is an exclusive sneak-peak for those of you here on DGrin. I'd love to get your thoughts, things you like, things you hate, if we're missing anything, or if we've nailed it. There's still more work to do, so we're not quite ready to release it, but I did want to get your feedback while we still have time to incorporate it.

New Gallery "Header"
The Gallery Header is everything in the top of your gallery. Currently it's the Breadcrumb, the Gallery Description, and the Buy / Download / Slideshow buttons. With the addition of Cover Photo, it now also includes the Gallery Title and the Cover Photo.

The New Gallery Header replaces the Breadcrumb, Gallery Description, and Buy/Download/Slideshow buttons.

New Gallery Cover Photo

It adds in a beautiful new, full width Cover Photo. The Cover Photo is selected from your Feature Photo (in Gallery Settings). Also new to the Header is the addition of the Gallery Title, as well as a new "Cover Photo Breadcrumb", which integrates the Breadcrumb on top of the Cover Photo, something that's not possible today with the Breadcrumb Content Block.

The Cover Photo and the Cover Photo Breadcrumb can be turned ON or OFF in the Customizer and can be turned on or off for each gallery style* (only certain gallery styles can have Cover Photo on).

The following gallery styles will get the Cover Photo:
- Thumbnail
- Collage Landscape
- Collage Portrait

For SM and Journal, we felt the Cover Photo distracted from the photos and they will not be able to have a Cover Photo.

What are the other big changes?
Some things that will impact all SmugMug galleries:
- The Gallery Title is now always shown, on its own line, below the breadcrumb.
- For Gallery Descriptions longer than 3 lines, we add a "Read More" button. Clicking read more opens a window overlay, with the full description. The overlay can be closed by clicking the "x".

When pushed live, this new header will replace the old header, with the following exceptions:
- Cover Photo will be turned OFF by default.
- Cover Photo Breadcrumb will be turned OFF by default.
- The Breadcrumb Content Block will remain.

You will need to enable these specifically to take advantage (we don't want you waking up and finding your galleries completely changed overnight, though you will find the Gallery Title and new Gallery Buttons replace the old ones). The Breadcrumb Content Block can be removed and the new Cover Photo Breadcrumb used instead.

Questions for you that will help me out:
1) What do you think? Do our galleries look better with the Cover Photo and redesigned Gallery Header?
2) What do you think of the way the Gallery Title is shown below the breadcrumb? Is that OK?
3) What do you think of the "Read More" overlay for Descriptions >3 lines?

Take-Aways:
- Collage and Thumbnail galleries look a lot nicer with the Cover Photo on.
- The integrated breadcrumb looks pretty elegant.
- Shrinking long descriptions down to 3 lines makes the gallery look a lot cleaner, but it does hide some of the gallery description behind a "Read More", which may be problematic for some of you. I'm curious on your thoughts.
- While moving the Gallery Title onto its own line takes additional height, it focuses more attention on the name of the gallery, and separates the navigational elements of the breadcrumb.
- The Buy Buttons become more prominent.
- In SmugMug Style, the Title and Captions get just a bit more room, for the most part.

Future Work:
1) One thing that is quite clear is that you need the ability to set the vertical position of the Cover Photo. It's full width, so you'll want to move the photo up and down until its positioned properly. This is crucial before we can release it to you all and we're still figuring out how this look/work. There's more to come on this.

2) Roll-out plan. We need to figure out how to push this live, since we may need to make some changes to your breadcrumb. The Gallery Title will show up automatically and may conflict with the Breadcrumb Content Block, when set to "Show Current Page" is ON. Most likely we'll force that setting to OFF for everyone so you don't have duplicate Gallery Titles. Thoughts?

Screenshots:
Without further ado! The new Cover Photo and Gallery Header (click to open larger):

Long gallery descriptions open into this, when "Read More" is clicked.

To see how it looks in other gallery styles, please see the link at the bottom of this post.

On each screenshot:
- from Left to Right: Currently live, New Header (Cover Photo OFF), New Header (Cover Photo ON)
- top to bottom: Long Description, Normal Description, No Description

Collage Landscape Comparison:

Thumbnail Comparison:

SmugMug Comparison:

Journal Comparison:

For more screenshots, feel free to visit the gallery here:
https://www.smugmug.com/gallery/n-q9LrVv/

If you'd like me to post any additional screenshots, feel free to ask.

Sorry for the super long post. Did you make it to the end?

Allen · January 12, 2016

This new gallery header, is this below the current page header that includes our
top logo/banner and menu or the middle page content?

sm-page-header << logo/banner and menu
sm-page-content
-- sm-page-layout-region-header << replaces the header of this part?
-- sm-page-layout-region-body
---- breadcrumb << moves out of here to new header region?
---- gallery description << moves out of here to new header region?
---- photos
-- sm-page-layout-region-footer
sm-page-powered-by (footer)

leftquark · January 12, 2016

Allen wrote: »

This new gallery header, is this below the current page header that includes our
top logo/banner and menu or the middle page content?

sm-page-header << logo/banner and menu
sm-page-content
-- sm-page-layout-region-header << replaces the header of this part?
-- sm-page-layout-region-body
---- breadcrumb << moves out of here to new header region?
---- gallery description << moves out of here to new header region?
---- photos
-- sm-page-layout-region-footer
sm-page-powered-by (footer)

It'll be within .sm-page-layout-region-body -> .sm-page-layout-region-center -> .sm-page-layout-region-body.

It's part of .sm-gallery and is directly above .sm-gallery-images. It'll be called .sm-gallery-header.

Allen · January 12, 2016

I have a bunch of galleries that have a one or two more lines in descriptions. How about being
able to set the number of lines? Without doing that it would destroy my description.

Almost all my galleries are Smugmug style so I don't care about a cover photo, only my banner,
top menu and description. Will any of these be affected?
example:
http://www.photosbyat.com/Birds/2013-Birding/Birding-2013-January/2013-01-13-Louisiana

Notice that there is lots of html in the description, typical of ~1000 of galleries in this top folder tree.
How will the new description handle html?

sarasphotos · January 12, 2016

Well Aaron, that's a really lovely idea and it will be nice to have as an option but it certainly won't be for me, at least for now.

First of all, most computer screens today are 16x9 widescreen which means that the vertical space is limited. Added to that most people use their browsers in normal and not full-screen mode so you've got tabs and maybe even menus taking up space at the top of the screen, making the viewport not very tall. When you put a picture across the top of that page you are pushing the real content down so that people have to start scrolling almost after the first row.

With a site like mine where the menu runs horizontally across the top and the pictures run the entire width of the screen any "cover photo" would then push the content down so far as to be nearly invisible at first glance. I'm not sure that I want that.

Another question regarding the cover photo - you said it was being selected from the gallery feature photo. Well most of the time I choose a feature photo because it works in that little square thumbnail. That same picture might not be the same one that I would pick to work in a wide horizontal crop.

Always glad to see new things coming - thanks for letting us know and soliciting feedback!

Cheers, Sara

Allen · January 12, 2016

What if the whole gallery is portraits, how do you stretch it across the page? Then still get subject that
probably is 80% of photo height to look okay?

Can a special photo, stored elsewhere then gallery be used just like the feature photo can now?

David_S85 · January 12, 2016

sarasphotos wrote: »

Another question regarding the cover photo - you said it was being selected from the gallery feature photo. Well most of the time I choose a feature photo because it works in that little square thumbnail. That same picture might not be the same one that I would pick to work in a wide horizontal crop.
Cheers, Sara

^ This. Sara brings up a very important point. I choose Feature Photo with the same goal in mind. Now, if there is another type of category called Gallery Cover Photo that we can pull it from, then we could have the best of both worlds, assuming one uses both a Feature Photo AND a Cover Photo.

denisegoldberg · January 12, 2016

I like the looks of the new gallery header although I'm not sure that I will use the cover photo. I have the same concerns that Sara has - given the shape of the header, I believe that most of my photos won't play well in the space. I also prefer not to force vertical scrolling to see the photos in the gallery.

I plan to try both with and without the photo.

Thanks for the preview.

--- Denise

Jtring · January 12, 2016

I may write more as I continue to think about this, but here are a few initial responses / concerns / questions.

I think getting the title on a line separate from the breadcrumb is a very good idea.

Is something similar coming for folders?

The cover photo idea is good but it seems it's one of those things where the devil is in the details. I probably will have to work with it when all goes live to develop a final opinion. Still, I see some issues coming.

First, consider allowing the feature image, which appears in gallery block thumbnails used to navigate to a gallery, to be different from the cover photo, which will appear at the top of the gallery itself. The way these images will be displayed is very different, and as a result, the constraints on their selection will be different. What works well for one function may not work the other. The cover image will have to look good cropped to a very uneven aspect ratio. The feature image will be viewed at 1:1 or 4:3 or something like that. The cover image will have to be relatively simple at the bottom so as to not interfere text legibility, but can be just about anything above. In fact, because of its size, the cover photo can be a place to show off something interestingly complex. The feature image, because it will be viewed at small size, really needs to be fairly simple everywhere. Yes, both will want to show off the gallery and somehow provide a one-image representation of its contents, but they will have to do so in quite different situations.

Second, I hope the choice whether to use a cover photo or not will be available on a gallery-by-gallery basis, rather than being something that gets applied to all galleries of a given style. I can imagine wanting a cover photo most of the time but wanting to turn them off for some of my shortest galleries. A big cover image on top of an eight image gallery is unbalanced. On top of eighty images, it’s perfect. Moreover, in some of those shorter galleries, it may be hard to find a cover picture that works well given the issues I discussed above.

Third, how are you going to handle text colors for the description overlay? From your examples, it appears you are not planning to insert a mask (with perhaps a little residual transparency) under the text. Thus the right text color depends wholly on the image: white text will look good for a dark photo (as in your example) while black text may be just right for a lighter one. There may be situations that call for something more colorful. So maybe you'll need to have a way to select text color on a gallery-by-gallery basis ... or insert a mask under the text so a uniform text color choice works across a wider range of cover images ... or provide an option to put the description below the cover image. But text on top of images with no masking and no controls looks to me like a path to unreadability.

Fourth, when the cover photo is off, I don't much like the idea of limiting the description to 3 lines. Many of my descriptions will fit within that, but If I'm going to write a tome, it's there for a reason, and I'd like it to show. I guess I don't view SmugMug as just a place to show pictures. For me, it's a place to use pictures to tell stories. That needs words, sometimes few, occasionally many. With a cover photo, I agree you’ve got to cut things off.

Fifth, I sincerely hope gallery description will still continue accept HTML anchor tags. That's been my way to cross-reference related galleries.

leftquark · January 12, 2016

Allen wrote: »

I have a bunch of galleries that have a one or two more lines in descriptions. How about being able to set the number of lines? Without doing that it would destroy my description.

This runs a slippery slope - we're trying not to overwhelm with options and we've seen that >90% of our customers have gallery descriptions that fit on 1 line; we set the cut-off at 3 to give it some buffer but we don't want to add options that most customers won't use. If we made it 5 lines, someone will write in and say they need 6. If we make it 6, someone will ask for 7, so we're doing what we think satisfies most SmugMug customers. We should be able to come up with a CSS option for you, to add more lines, though!

Allen wrote: »

Almost all my galleries are Smugmug style so I don't care about a cover photo, only my banner,
top menu and description. Will any of these be affected? example:
http://www.photosbyat.com/Birds/2013-Birding/Birding-2013-January/2013-01-13-Louisiana

Notice that there is lots of html in the description, typical of ~1000 of galleries in this top folder tree.
How will the new description handle html?

I took your Description from the gallery you linked and tried it, and it sort of works and sort of doesn't. Most of it ends up in the "Read More", which obviously isn't what you want ... but it does load fine in there! You're going to have to take all of that out and put it into a HTML content block, or remove the HTML. You provide so much help to other SmugMug customers, and I know this is going to make you quite upset, so please let us know if there's anything we can do to help you once this goes live.

sarasphotos wrote: »

Well Aaron, that's a really lovely idea and it will be nice to have as an option but it certainly won't be for me, at least for now.

We knew this would be for some and not for others, and thus we added the ability to turn it on and off

sarasphotos wrote: »

Another question regarding the cover photo - you said it was being selected from the gallery feature photo. Well most of the time I choose a feature photo because it works in that little square thumbnail. That same picture might not be the same one that I would pick to work in a wide horizontal crop.

I hear you. I spent a lot of time looking into whether we should use the same Feature Photo or have it be a separate Cover Photo. Ultimately, from the many galleries we looked at, and from the discussions we had internally and externally with customers, we felt that the majority of people were going to use the same photo for the Gallery icon (on a folder), and for the Cover Photo. When this goes live you'll be able to control the vertical position of the Cover Photo, and in the future, we'll also start letting you reposition where your square (or not-square) Gallery thumbnail feature image is positioned, so hopefully that will alleviate some of those concerns.

Allen wrote: »

What if the whole gallery is portraits, how do you stretch it across the page? Then still get subject that probably is 80% of photo height to look okay?

This is a very good question -- you're quite astute! I was actually hoping one of you would bring this up. We're currently contemplating not allowing you to use a Portrait Orientation image as the Cover Photo -- so we'd pick the first landscape image. If there's no landscape images, we wouldn't show a Cover Photo at all. The only problem is if you want a Portrait Photo as your gallery thumbnail on the photo, you wouldn't want to have to set it to a landscape one just for Cover Photo, so most likely in this case you'd set the Gallery to Custom and turn Cover Photo OFF.

Allen wrote: »

Can a special photo, stored elsewhere then gallery be used just like the feature photo can now?

Yes. It's pulling from your Feature Photo, which can be picked from anywhere.

Jtring wrote: »

Is something similar coming for folders?

You betcha! Once we have the Gallery Cover all settled, we'll add it to Folders and Pages. We felt that Galleries had the biggest impact from a Cover Photo and we wanted to release that first, get your feedback, incorporate it, and then add it to Folders and Pages at some point in the future, using the same design.

Jtring wrote: »

Second, I hope the choice whether to use a cover photo or not will be available on a gallery-by-gallery basis, rather than being something that gets applied to all galleries of a given style. I can imagine wanting a cover photo most of the time but wanting to turn them off for some of my shortest galleries. A big cover image on top of an eight image gallery is unbalanced. On top of eighty images, it’s perfect. Moreover, in some of those shorter galleries, it may be hard to find a cover picture that works well given the issues I discussed above.

Yes - you can always set the gallery to "Just this Gallery" and disable the Cover Photo. I hate having to make you set a gallery to be custom, just to turn off the cover photo, but it was better than the alternative, which was to put it in Gallery Settings. Without the ability to edit Gallery Settings across your entire site, there was no way to turn this on for all your galleries, or even most of your galleries. Having to go folder-by-folder would be tedious.

Jtring wrote: »

Third, how are you going to handle text colors for the description overlay? From your examples, it appears you are not planning to insert a mask (with perhaps a little residual transparency) under the text.

It's probably hard to see from the screenshots but we are using a slight mask. Any time we display text on top of an image we're using a mask (or what we call a "scrim") to help with readability. Text color will always be white, though the buttons will use your themes colors.

Jtring wrote: »

Fourth, when the cover photo is off, I don't much like the idea of limiting the description to 3 lines. Many of my descriptions will fit within that, but If I'm going to write a tome, it's there for a reason, and I'd like it to show. I guess I don't view SmugMug as just a place to show pictures. For me, it's a place to use pictures to tell stories. That needs words, sometimes few, occasionally many. With a cover photo, I agree you’ve got to cut things off.

Thanks for the feedback! This is one of the biggest reasons why I'm sharing the preview with you guys ahead of time. This is a pretty big change and I want to make sure we won't be upsetting all of our customers with it. I do think my galleries look much much better when the Description doesn't push my images off the screen (especially based on Sara's comments about widescreen monitors). It's most prevalent on SmugMug style, where you can see the main photo gets clipped and no title or caption is displayed when the Description is long; compare that to the new style with 3 lines showing -- the gallery looks much better. But it is a balance between looks and function. I've debated adding one more setting for "Show Full Description" which would allow you to have it shrunk to 3 lines, or display the full thing.

Jtring wrote: »

Fifth, I sincerely hope gallery description will still continue accept HTML anchor tags. That's been my way to cross-reference related galleries.

Yep - we're still allowing a specific set of HTML tags, which are the same that are currently live today.

Allen · January 12, 2016

Looking at your Smugmug style you're taken a one line breadcrumb and converted it to two lines by separating
the gallery title. I see no reason to take up more valuable vertical space, makes no sense. Then, without a
cover photo, placed a very limited description under it. I see no difference between this and the current page
other then you've stolen our valuable customizable gallery description. Makes no sense again.

leftquark · January 12, 2016

Allen wrote: »

Looking at your Smugmug style you're taken a one line breadcrumb and converted it to two lines by separating the gallery title. I see no reason to take up more valuable vertical space, makes no sense. Then, without a cover photo, placed a very limited description under it. I see no difference between this and the current page other then you've stolen our valuable customizable gallery description. Makes no sense again.

It actually makes a lot of sense, and you'll see other comments above from other DGrinners who concur: Moving the Gallery Title to its own line pulls attention to the title, which is what you want. The folder structure for a gallery is less important (note I didn't say NOT important, but it is less important) than "what galley am I viewing."

Additionally, from the screenshots, you'll notice that the Gallery Header in SmugMug style actually takes up less space than it did before (with the exception of long descriptions). The vertical alignment of the buttons and other elements has been cleaned up, which leaves more room for things like the Title and Description.

Lastly, you'll also notice that the SmugMug gallery looks MUCH better when there's a long description by having it shrunk into the 3 lines w/read more. In the SmugMug comparison, you can see, on Currently Live Production, that half of my photo is hidden due to the long description, you can't read the title, nor the caption, and the navigation buttons are also hidden. Using the new Header, the photo fits, as well as the title, navigation, and captions. A big improvement, especially since I've heard so many of you complain that titles get pushed below the fold on SmugMug style.

With all of that said, I'm still looking to get feedback on what to do with the long descriptions. Its entirely possible that an option could exist, when Cover Photo is OFF, to allow the Description to flow down instead of be stuck at 3 lines.

Allen · January 12, 2016

leftquark wrote: »

This runs a slippery slope - we're trying not to overwhelm with options and we've seen that >90% of our customers have gallery descriptions that fit on 1 line; we set the cut-off at 3 to give it some buffer but we don't want to add options that most customers won't use. If we made it 5 lines, someone will write in and say they need 6. If we make it 6, someone will ask for 7, so we're doing what we think satisfies most SmugMug customers. We should be able to come up with a CSS option for you, to add more lines, though!

A CSS option would not work because there are many galleries that have two but many with more.
There's no way to sense which is which to apply the CSS. And I would want each at the minimum
number of lines.

leftquark wrote: »

I took your Description from the gallery you linked and tried it, and it sort of works and sort of doesn't. Most of it ends up in the "Read More", which obviously isn't what you want ... but it does load fine in there! You're going to have to take all of that out and put it into a HTML content block, or remove the HTML. You provide so much help to other SmugMug customers, and I know this is going to make you quite upset, so please let us know if there's anything we can do to help you once this goes live.

What do you mean by "most of it"? There's only four lines. Am I losing parts the first three?

OK, imagine this, creating html boxes for about 1000 galleries. You're kidding, right?

I just spent months going through every gallery adding links to next and previous gallery.

BTW, I've done exactly that here with an html box. But this is a special case.
http://www.photosbyat.com/Birds/Missouri-Bird-Photos-A-G

Jtring · January 12, 2016

Jtring wrote: »

Second, I hope the choice whether to use a cover photo or not will be available on a gallery-by-gallery basis, rather than being something that gets applied to all galleries of a given style. I can imagine wanting a cover photo most of the time but wanting to turn them off for some of my shortest galleries. A big cover image on top of an eight image gallery is unbalanced. On top of eighty images, it’s perfect. Moreover, in some of those shorter galleries, it may be hard to find a cover picture that works well given the issues I discussed above.

leftquark wrote: »

Yes - you can always set the gallery to "Just this Gallery" and disable the Cover Photo. I hate having to make you set a gallery to be custom, just to turn off the cover photo, but it was better than the alternative, which was to put it in Gallery Settings. Without the ability to edit Gallery Settings across your entire site, there was no way to turn this on for all your galleries, or even most of your galleries. Having to go folder-by-folder would be tedious.

Could you not do something like you do for gallery style? In Customize, the default style can be set in the gallery template but in the Organizer each individual gallery has an option to change from the default to a different style. I'll admit I really do not like the answer you gave above. Templates are wonderful and this really has the potential to break them.

Allen · January 12, 2016

leftquark wrote: »

... I've debated adding one more setting for "Show Full Description" which would allow you to have it shrunk to 3 lines, or display the full thing....

This is the best idea I've heard yet.

Jtring · January 12, 2016

sarasphotos wrote: »

Another question regarding the cover photo - you said it was being selected from the gallery feature photo. Well most of the time I choose a feature photo because it works in that little square thumbnail. That same picture might not be the same one that I would pick to work in a wide horizontal crop.thumbnail feature image is positioned, so hopefully that will alleviate some of those concerns.

leftquark wrote: »

I hear you. I spent a lot of time looking into whether we should use the same Feature Photo or have it be a separate Cover Photo. Ultimately, from the many galleries we looked at, and from the discussions we had internally and externally with customers, we felt that the majority of people were going to use the same photo for the Gallery icon (on a folder), and for the Cover Photo. When this goes live you'll be able to control the vertical position of the Cover Photo, and in the future, we'll also start letting you reposition where your square (or not-square) Gallery thumbnail feature image is positioned, so hopefully that will alleviate some of those concerns.

I have real doubts this is going to work. My doubts are based on a related experience. My site uses splash photos on the first page. Splash images are big and need to show well at 16 x 9 or 16 x 10. Of the 10 splash photos, only 3 are featured images. I've found the considerations are just different. And the aspect ratio for cover photos is even more extreme. Yes, it sounds simple to use one image. But please, don't just discuss it internally. Have a fair number of folks go through the exercise of picking what cover photo/featured photo they would use and try putting the result up on a prototype. If my related experience is any guide, the process may reveal some uncomfortable compromises, ones that may reduce the value of this basically neat new idea.

Jtring wrote: »

Fourth, when the cover photo is off, I don't much like the idea of limiting the description to 3 lines. Many of my descriptions will fit within that, but If I'm going to write a tome, it's there for a reason, and I'd like it to show. I guess I don't view SmugMug as just a place to show pictures. For me, it's a place to use pictures to tell stories. That needs words, sometimes few, occasionally many. With a cover photo, I agree you’ve got to cut things off.

leftquark wrote: »

Thanks for the feedback! This is one of the biggest reasons why I'm sharing the preview with you guys ahead of time. This is a pretty big change and I want to make sure we won't be upsetting all of our customers with it. I do think my galleries look much much better when the Description doesn't push my images off the screen (especially based on Sara's comments about widescreen monitors). It's most prevalent on SmugMug style, where you can see the main photo gets clipped and no title or caption is displayed when the Description is long; compare that to the new style with 3 lines showing -- the gallery looks much better. But it is a balance between looks and function. I've debated adding one more setting for "Show Full Description" which would allow you to have it shrunk to 3 lines, or display the full thing.

The "Show Full Description" setting option (anytime when not using a cover photo, in SM style or in one of the others) sounds like a great option. The site owner can then decide what works best for the situation at hand. Since most of my galleries are in collage landscape, longer descriptions don't strike me to be that much of a layout problem. The user is going to scroll anyway.

Thanks again for letting us all comment now, early in the development process.

leftquark · January 12, 2016

Jtring wrote: »

Could you not do something like you do for gallery style? In Customize, the default style can be set in the gallery template but in the Organizer each individual gallery has an option to change from the default to a different style. I'll admit I really do not like the answer you gave above. Templates are wonderful and this really has the potential to break them.

I'm not sure I completely follow, but let me respond and if I didn't get it right, feel free to rephrase and I'll respond again! In the Customizer, you can go "All Galleries" and turn the breadcrumb and cover photo ON or OFF for each gallery style. For example, in SM style I could turn the Cover Photo Breadcrumb OFF and for every instance of a SM Style gallery that's part of "All Galleries" it would be OFF. But I could also go into a particular gallery, mark it as "Just this Gallery" and then turn the SM Style Breadcrumb back ON.

Our hypothesis is that most people set their defaults in All Galleries, and most of their galleries follow this. If they wanted Cover Photo ON or OFF, they'd set that in "All Galleries" and that would cover them. For the few exceptions where they might want to flip this setting, they could make the gallery custom, and flip it. Part of the reason for wanting to preview this, and I'd really like to get it in your hands to start playing with it, is to find out if those hypothesis are correct. If that's not the case, then obviously we'll have to rethink, though I really do think most people will turn it ON or turn it OFF, and they'll fit most of their needs.

Jtring wrote: »

But please, don't just discuss it internally. Have a fair number of folks go through the exercise of picking what cover photo/featured photo they would use and try putting the result up on a prototype. If my related experience is any guide, the process may reveal some uncomfortable compromises, ones that may reduce the value of this basically neat new idea.

That's part of the reason of sharing it with you guys. We're also running focus groups and reaching out to a number of Pro's to get their inputs and see how they would use it.

leftquark · January 12, 2016

Allen wrote: »

A CSS option would not work because there are many galleries that have two but many with more. There's no way to sense which is which to apply the CSS. And I would want each at the minimum number of lines.

With how we wrote this it'd be very easy to increase the # of lines, while still keeping it the min # of lines possible. This code would change it from 3 to 5 lines, for example:

.sm-gallery-cover-info .sm-gallery-cover-description {
    -webkit-line-clamp: 5 !important;
    max-height: calc(1.6em * 5) !important;
}

Allen wrote: »

What do you mean by "most of it"? There's only four lines. Am I losing parts the first three?

Here's how it looks when I paste in your Description:

Allen wrote: »

OK, imagine this, creating html boxes for about 1000 galleries. You're kidding, right?
I just spent months going through every gallery adding links to next and previous gallery.

Unfortunately that's the risk you take any time you go in and do extremely advanced customizations like this. In some sense you can blame us for allowing you to do that, and it's really hard because we want to give you the tools to make your site personal. At the same time, we can't live in a space where we're afraid to innovate because it might break someone's unique customization. When we look to improve SmugMug we think about how it'll impact all of our users, but we also know that we have to think about how most users are using our site; most users aren't doing the kind of HTML additions you're doing. You're coming up with very creative solutions to solve your needs, but at the end of the day they're risky solutions that could break any time we improve SmugMug. All CSS customizations run this risk, including the ones I list on my site (which i why I try to keep them up-to-date as much as possible). When we built New SmugMug, one of our objectives was, and still is, to make sure we can continue innovating and improving SmugMug without the limitations we had before with all the javascript customizations some of our customers had built.

Although I don't have a clear solution right now, please know that I want to explore any possible options to help you. You have been amazing with our customers for many years and we really appreciate you as a customer and member of the SmugMug family.

I see that your DIV's have class names, but then you wrote the CSS style as inline code (div class="someClass" style="somecode") and copied that style into each of your galleries. Had you just used the class name and put the CSS in your theme, it could be as simple as just updating the theme CSS. With the way you added the CSS inline, this may be a much bigger task.

Allen · January 12, 2016

leftquark wrote: »

....
I see that your DIV's have class names, but then you wrote the CSS style as inline code (div class="someClass" style="somecode") and copied that style into each of your galleries. Had you just used the class name and put the CSS in your theme, it could be as simple as just updating the theme CSS. With the way you added the CSS inline, this may be a much bigger task.

Every gallery (except two "just this") are the Smug default and the CSS is in "all galleries".
The reason for specific style in div's is so each div can, if needed, be adjusted for width and font size. Can't do that in theme CSS or "all galleries" CSS.

Allen · January 12, 2016

leftquark wrote: »
With how we wrote this it'd be very easy to increase the # of lines, while
still keeping it the min # of lines possible. This code would change it from 3 to 5 lines, for example:
.sm-gallery-cover-info .sm-gallery-cover-description {
    -webkit-line-clamp: 5 !important;
    max-height: calc(1.6em * 5) !important;
}

Thanks, will come in handy. But would this have apply specifically for every gallery with more lines and their line count?

leftquark wrote: »

Here's how it looks when I paste in your Description:

Looks like it lost two of the three div's. Completely destroys discription.

leftquark wrote: »

Unfortunately that's the risk you take any time you go in and do extremely advanced customizations like this. In some sense you can blame us for allowing you to do that, and it's really hard because we want to give you the tools to make your site personal. At the same time, we can't live in a space where we're afraid to innovate because it might break someone's unique customization. ...

Holy cow, this is one of the basic customization's since day one. Can't believe you said that.

Jtring · January 12, 2016

leftquark wrote: »

I'm not sure I completely follow, but let me respond and if I didn't get it right, feel free to rephrase and I'll respond again! In the Customizer, you can go "All Galleries" and turn the breadcrumb and cover photo ON or OFF for each gallery style. For example, in SM style I could turn the Cover Photo Breadcrumb OFF and for every instance of a SM Style gallery that's part of "All Galleries" it would be OFF. But I could also go into a particular gallery, mark it as "Just this Gallery" and then turn the SM Style Breadcrumb back ON.

OK, let's try again. I'm suggesting "Cover Photo on/off" selection be handled in a way similar to the way SmugMug handles gallery style selection. The default gallery style is set in the Customizer under the gallery template. But for an individual gallery still attached to the template I can go to the Organizer and change the gallery style:

There is no need to mark the gallery as "Just this Gallery" and detach it from the template. I'm suggesting the default choice of cover photo on/off be in the Customizer but a cover photo on/off flag also live in the Appearance tab of the Organizer so one can change that default for an individual stray gallery.

(Added note: While I really like to galleries to stay attached to the template because it's a big plus for maintainability, this is more a nice-to-have than a need-to-have. I'm tossing this out as a suggestion since I think it solves problems all around and improves the SM product. However, I really expect, as you suggest, that most of my galleries will end up either with or without the cover image. This one's not a deal breaker. I'm much more worried that forcing the feature image and the cover image to be the same could turn into one.)

pbandj · January 13, 2016

Jtring wrote: »

I have real doubts this is going to work. My doubts are based on a related experience. My site uses splash photos on the first page. Splash images are big and need to show well at 16 x 9 or 16 x 10. Of the 10 splash photos, only 3 are featured images. I've found the considerations are just different. And the aspect ratio for cover photos is even more extreme. Yes, it sounds simple to use one image. But please, don't just discuss it internally. Have a fair number of folks go through the exercise of picking what cover photo/featured photo they would use and try putting the result up on a prototype. If my related experience is any guide, the process may reveal some uncomfortable compromises, ones that may reduce the value of this basically neat new idea.

I concur here. I worked pretty hard to find photos that would work well in full screen with text overlays on my home page, and those photos are not the same ones I would choose for Feature photos. You asked for feedback, and almost all of the initial posters expressed the desire to choose a specific Cover photo different from the Feature Photo. It sounds like you've blown off this particular feedback in spite of it being pretty universally requested. Please reconsider this...

leftquark · January 13, 2016

Allen wrote: »

Thanks, will come in handy. But would this have apply specifically for every gallery with more lines and their line count?

That code handles the maximum # of lines that can be displayed. You could set it to 100, if you really wanted, and if it only needed 3, it'd only take up 3.

Allen wrote: »

Holy cow, this is one of the basic customization's since day one. Can't believe you said that.

Putting advanced HTML into a Gallery Description has never been a basic customization (for New SmugMug). Up until you shared your Description today, the only time I've seen HTML used in a Gallery Description was to add text formatting or add a link. The Gallery Description was never intended to be used for adding divisions and other layout altering elements, you have just been amazingly creative and took advantage of the fact that we used the same HTML whitelist in the Description as we did in the HTML block. Perhaps we should fix that so only links and formatting is allowed, as intended?

Yes, people built entire pages in Legacy SmugMug doing this, but that was an awful experience and is one of the reasons why we added HTML content blocks and Pages to New SmugMug, to get away from HTML in the Description.

Jtring wrote: »

OK, let's try again. I'm suggesting "Cover Photo on/off" selection be handled in a way similar to the way SmugMug handles gallery style selection. The default gallery style is set in the Customizer under the gallery template. But for an individual gallery still attached to the template I can go to the Organizer [GALLERY SETTINGS] and change the gallery style:

(Added "[Gallery Settings]" to your quote just for further clarification).
That's actually a pretty creative idea. It's not an overly complex technical problem to have 2 places to check to see if the Cover Photo should be on, though my biggest hesitation comes from the User Experience side of whether or not most users will realize there's 2 places this is set. For example, I go into the Customizer and turn on Cover Photo, but it doesn't show up. After some amount of frustration I finally realize that there's a second setting in the Gallery Settings, that had been set to OFF. I finally find that, switch it ON, and now I have a cover photo. That's 1 con, but on the pro's side, it means you don't have to make a gallery custom just to flip its cover photo. I'll noodle this with the Design/User Experience team.

pbandj wrote: »

You asked for feedback, and almost all of the initial posters expressed the desire to choose a specific Cover photo different from the Feature Photo. It sounds like you've blown off this particular feedback in spite of it being pretty universally requested. Please reconsider this...

Not at all! This is great feedback! These are exactly the kinds of responses I'm looking for. However, we also need to realize that the SmugMug community is much larger than the small subset of vocal users here on dgrin. Only 6 of you have chimed in, so the request isn't "universally requested" quite yet but it does help me shape the questions that we ask as we hold focus groups, share the preview with Pro Photographers and get additional feedback. I did not mean to make my justification for why we built it how we built it mean that I am dismissing the feedback, so my apologies if it came off that way. I'm certainly not ignoring it and have already brought it back to the team to discuss.

BigRed · January 13, 2016

Count another vote in favor of the "Show Full Description" option (gallery setting). It may be true that most long descriptions are narratives, and the first few lines might work as teasers. However, sometimes their purposes could be to deliver other types of content (such as instructional material or requests for action) that require presentation in entirety. The concept of allowing visitors to choose whether or not to see the overflow isn't compatible; in fact, truncation could potentially mislead the reader or fail to convey what's really important. Today, a publisher realizes that length pushes down the images because WYSIWYG, so we would only do it for a good reason. And personally, I'd say that a "more" overlay that actually obscures the images is even less attractive.

About the Cover Photo... I also have to question the assumption that most people will be fine with using their feature photo, and with going custom for individual gallery exceptions to their style choices. Personally, I wouldn't.

I really like the look of the new breadcrumb & gallery title alignment for Smugmug galleries. But why make the buttons bigger?

leftquark · January 13, 2016

BigRed wrote: »

Count another vote in favor of the "Show Full Description" option (gallery setting).

Noted - got your vote in the tally! Thanks!

BigRed wrote: »

I really like the look of the new breadcrumb & gallery title alignment for Smugmug galleries. But why make the buttons bigger?

You'd be surprised how many times we get the question "How do I buy or download the photos at this site?" because the visitor didn't notice the Buy, Download and Slideshow buttons.

Richard · January 13, 2016

You can add me to the tally of people wanting separate choices for the current feature photo and the new cover photo, especially in the absence of the ability to customize the crop of the feature. The cover is a panoramic aspect while the feature is square. I think very, very few of my pics would look good in both. Maybe when we can adjust the feature crop--which is something many of us want anyway, quite apart from the cover...

On the positive side, I think the cover photo will work great for landscape shooters. I'm glad to hear that HTML will continue to work in the description, which I rely on in several galleries. Kudos for the heads up and soliciting feedback before it's a done deal.

photoclick · January 13, 2016

+1 for separating Featured and Cover photos selection
+1 for keeping html in the description/caption fields.
The description overlay looks ugly.. sorry

Maybe it is a transparency issue or, perhaps, the box proportions.

Lille Ulven · January 13, 2016

I am trying to get my mind around how it is going to look like in the future...
Currently the Breadcrumb is build by using Gallery/Folder titles and not the Links.
In the NEW edition if the Breadcrumb is placed above the Gallery/Folder title you would duplicate information, wouldn't you?
Say my current breadcrumb looks like "HOME > Galleries > Europe > Norway" my gallery title is (surprise, surprise): "Norway".
So in the new edition I would get one line with the breadcrumb "HOME > Galleries > Europe > Norway" and below that a line with the title "Norway"...

Or would the new edition get the breadcrumb entries from somewhere else but the title fields of the gallery / folder?

And yes I would like to separate the feature and cover photo as well. I haven't used html in the description/caption fields, but please please keep that alive I already have an idea of what to do with it (I just don't know right now when I am going to realize it for all galleries

)

Best of luck

Lille Ulven

Jtring · January 13, 2016

Jtring wrote: »

OK, let's try again. I'm suggesting "Cover Photo on/off" selection be handled in a way similar to the way SmugMug handles gallery style selection...

leftquark wrote: »

(Added "[Gallery Settings]" to your quote just for further clarification).
That's actually a pretty creative idea. It's not an overly complex technical problem to have 2 places to check to see if the Cover Photo should be on, though my biggest hesitation comes from the User Experience side of whether or not most users will realize there's 2 places this is set. For example, I go into the Customizer and turn on Cover Photo, but it doesn't show up. After some amount of frustration I finally realize that there's a second setting in the Gallery Settings, that had been set to OFF. I finally find that, switch it ON, and now I have a cover photo. That's 1 con, but on the pro's side, it means you don't have to make a gallery custom just to flip its cover photo. I'll noodle this with the Design/User Experience team.

Want an even wilder idea? Use the existing gallery selection tools but have two Collage Landscape styles, two Collage Portrait styles, and two Thumbnail styles, one with the cover photo and one without. Slightly different names, of course. That makes the overall user complexity about the same as it is today. It also makes it easy to turn the cover image feature on and off one gallery at a time, as would my earlier suggestion.

When I implement the cover photo option on my sites, I think I'll want to work through the galleries one at a time to work the details (cover photo selection and cropping) before going live with a cover photo display. The whole process may take weeks. I'd probably not want to turn everything on all at once and live with some awkward default cover photo displays until I got around to them. Hence the desire to make one-at-a-time turn-on as easy as possible. Still, any of the ideas, including detaching from the template, can be made to work. I think the process there would be to keep the default cover photo off in the template, one-at-at-time detach galleries from the template and enable the cover photo (doing whatever cover photo selection and cropping seems appropriate), and then, at the end, change the template to turn the cover photo on and reattach the galleries (again, one-by-one) to the template. That works. It's just a longer workflow.

Lille Ulven · January 13, 2016

Jtring in my opinion that is not a wild but a very good idea!

leftquark · January 13, 2016

Lille Ulven wrote: »

I am trying to get my mind around how it is going to look like in the future...
So in the new edition I would get one line with the breadcrumb "HOME > Galleries > Europe > Norway" and below that a line with the title "Norway"...

The Breadcrumb Content Block has a setting for "Show Current Page", which can be turned off. That would get rid of the duplicate "Norway" titles.

Jtring wrote: »

Want an even wilder idea? Use the existing gallery selection tools but have two Collage Landscape styles, two Collage Portrait styles, and two Thumbnail styles, one with the cover photo and one without.

It's certainly an idea. We have some bigger plans with Gallery Styles, so I don't want to start cluttering the number of styles that we have with some very small variations, but it's certainly worth something to consider. The Design Picker, for example, suffers from the problem of having too many Designs that are almost all identical with only small variations and end up confusing many users.

PREVIEW: New Gallery Cover Photo and Gallery Header

Comments