Posted by Joe Oldak on

Hi Kev,

There are a few hidden settings for the Photo Album app that I can tweak for your site (at some point I could make these available to all site admins to access). I can set:

  • Whether users can access the original uploaded photo (which is done by clicking on the photo which then loads full size) - off by default.
  • The Viewer Size of the photo - currently max 1200x900
  • The Thumbnail Size - currently max 400x300
  • Number of columns in thumbnail view - currently 4
  • Number of thumbnails per page - currently 24

I've turned on the access to the original photo for your site (click the thumbnail to see the it at 'viewer' size, then click it again to see the original). This could be handy for you - let me know what you think. Perhaps more useful would be if viewing the original loaded the image full screen or something?

I do think we could do something much better with the way photos are viewed in the Photo Album app. The thumbnail view is OK but the individual photo view seems a bit clunky to me. Perhaps it should use popups with previous/next navigation? (like the Photo Album includelet demoed here). Or a 'full screen mode'? If you have any ideas for how to improve it that'd be great.

Thanks

Joe

Posted by Kev Cannings on

Hi Joe - that's great, thanks! It works well and having the full size image will really help me engage with our club members as I can now use it as a way for them to upload their competition images.

The includelet demo you shared looks very promising! The pop out viewer is really nice. I'd perhaps like to be able to drag it around and resize? But maybe all it needs is to expand to an embeded page, with an option to expand to full screen? I really like the design with clear next/ back/ close buttons and title visible but not invading the image.

In terms of the thumbnail grid view, there's a lot of white space on the row/ columns page - could the images be more of a "collage" so that there is less of a border between images? For example, "Minnie Meets Travis" forces a big gap between "Kittens" and "Thirsty" because it is the largest in it's row. Could you arrange them so it's not a grid, but just a 1 x 1 square where all images fill the space? Here's an example of what I mean: https://pixabay.com/ note that on the grid view of pixabay, the title is more like a "hover over" text which is a nice touch so that the images can all butt up nicely together.


If you are looking at developing albums/ images, here's some other things (sorry!) that would make my life easier for managing images (from a photography club perspective) if that gives you ideas or helps in any way:

When a member uploads a pic to an album, it would be amazing if the user was asked to review the jpeg meta data fields for Title, Author, Copyright, Comments, Tags, then and asked the user to update (or anonomise). I use this meta data in other applications. The EXIF data is nice to have too. In fact if the right meta was stored that would potentially negate the need for albums and folders as my image repository would be fully organised and searchable in one massive "album". Just need users to complete a drop down list with the album title that ends up in a field like "tags" or "subject" when they upload.

....If the site stored the JPEG meta data, then it would be awesome if the includelet allowed me to sort, filter and pick specific images from an album. For example, on my site, I have the Album "2022/23 Open Colour PDI" but I'd like to display the three winners on the home page without having to upload new assets, or duplicate images in a new album for the includelet.

 

If members upload their own images, then I'd love to be able to bulk download images from an album so that I can import into my desktop based apps for competitions. If it would download including the user updated image meta data (Title, Author, Copyright, Comments, Tags) then that would be the icing on the cake for me.

Not album related, but when I post a link on Facebook or Twitter, the page is scanned for an appropriate image to display in my post (I think twitter call this cards - https://cards-dev.twitter.com/validator?) Currently both FB and Twitter only finds and displays my site logo image which makes less interesting posts when I share e-voice pages on social networks. Would be good for includelet images and page images to appear on social media posts.

I'll stop here or I'll bore you!

But thanks again Joe, really great job and I'm excited to see the next enhancements! :)

Posted by Joe Oldak on

Hi again Kev,

Photo Grids

Some kinds of image grids are easier to implement than others - as a general rule, having even height rows is hard, but having even width columns is easy (with some caveats).

Pixabay is clever because they have even height rows and resize the images dynamically so that they are always shown in full without affecting the order, and keeping a neat right hand edge to the rows.

A much easier approach is something like this, where images are in even columns, but the disadvantage is that the photos can display out of order (as you'll see in the demo). So I suppose it'd depend on how important it was to exactly preserve the order of photos within an album!

Another option is to display each thumbnail as a square so that they fit together easily in a grid - though I'm less inclined to go this route as many groups might not want their pictures squarifying!

Metadata

These are interesting ideas, though perhaps beyond the scope of the majority of Voice site users - probably only really of interest to photography clubs like yours. It could be that you'd be better served using a third party photo management/upload tool (like flickr?) and embedding albums on your site by theme/tag?

Other groups have experimented with using the Survey tool to create a survey where members can submit photos for competitions - using a file attachment and questions for description/title etc. You can then download a summary of all survey responses as a CSV file with links to download the images. (though you do then have to manually add them to a photo album or the assets library if you want to display them all on your site!)

Social Sharing

When you share a page to Twitter/etc Voice tries to offer a suitable image to use in the post. See some details here.

Cheers

Joe

 

 

Posted by Stephen_DSmith on

Hi,

I look after www.hexhamphotographic.org, I have made use of the includlet for to present the photo’s within albums into pages structured within the site.

The grid you get when placing the includlet is fine in most cases - alignment options such as catered / top / bottom of the image would be nice and if only I had an option for 5 images across… If the “lightbox” view had an obvious link to view full screen that would be nice too as I don’t think most users would think of right clicking and opening in a new tab to do that.

What I would find useful in some cases is an option to place an “image viewer” rather than a grid on a page so it presents a single image with a caption and a next / previous option. This should allow me to run a simple competition jugged by members using a simple google survey form embedded into a page. (It’s nothing fancy just a list of image names allowing members to vote for a 1st 2nd and 3rd placed image.)

Where we have required meta data in the past is just for competition submissions we have worked around with a simple naming convention e.g. B_M_The reaper_87.jpeg – this is a beginner mono, the image title is the reaper and it is from member number 87.

We are looking in future to use survey forms or maybe the files application so members submit images. Files have the advantage of bulk download, but other members would be able to see submissions – surveys have an anonymity advantage but I think attached images would need to be downloaded on a one-at-a-time basis unless I have missed something.

Regards,

Stephen Smith.

 

Posted by Joe Oldak on

The image viewer you talk about sounds a bit like the Slider includelet - this already allows you to show image and text together and move through a set of pictures. Maybe all this needs is the ability to specify a photo album (or a folder in the assets library?) as the source for the images, rather than having to manually add each one?

Is there anything else that the Slider doesn't do that you think would make it more useful? I imagine the automatic sliding might be annoying if you're trying to appreciate a photo and it keeps changing! So adding a config option to set the delay time perhaps?

You could also try the Polls app/includelet for voting for favourite picture - you can restrict polls to only logged in users if you want to prevent cheating!

 

From the surveys app you can download a CSV of all responses which will contain links to each attached file - you still need to get each one individually of course, but at least you have the reference all in once place. (I only recently added the attachment links in the CSV so if you already tried this then try it again! :-))

Cheers

Joe - Voice Admin

Posted by Stephen_DSmith on

Hi Joe,

Yes, the slider includelet would work, but yes images changing automatically would be a touch annoying. If a fully manual option is not possible a long delay would sort that I guess. In terms of useability, is it possible to add a next/previous button to the interface? Only on a touchscreen device, you can't swipe through images you have to use the dots which is actually harder on a larger touch screen than a mobile...

I will have a look at the polls app, it may be useful but we are also trying to encourage members to supply feedback (without much success) so it may be more of a survey than a poll.

I had not noticed the change to the survey image csv files but that will be most useful for competition use so thanks!

Stephen

Posted by Kev Cannings on

Love your site Stephen - really clean and tidy! Your news items are really well laid out, and you can filter them 😮 Is that to do with the theme you are using or your superior technical ability? I'd love to know how you added the filter and got your news items to display as a 3 column grid with nice headings and summary text :)

Posted by Stephen_DSmith on

Hi Kev,

Thanks, the site is still a bit of a work in progress, although it is something you never really finish.

The news layout is nothing super technical, all the news and results are just done with the "filtered item list" includelet using a grid layout. I have used keywords on the pages/news item and the summary I think is just the subtitle.

The "Filtered item list keywords" does the filtering, it was just placed on the page above the filtered item list.

Regards,

Stephen.

Posted by Kev Cannings on

Thanks Stephen - I wondered if the filtered list might be the case so I've played with that in the past and again today - I can't seem to get it working though, and even if I managed to get some items appearing (pages rather than news items), they don't look even half as nice as yours. I think I'm probably going off topic with this thread so I've opened a more relevant one in the general support forum here: Voice Online Communities | General Support: Help building a news(?) page (e-voice.org.uk)

Much appreciated, and thanks for taking the time :)

Posted by Kev Cannings on

Hey Joe - great tips, thank you!

Yes - I really like the grid displayed in columns per the example you gave. In an album, the order isn't that important - My albums are currently sorted by time/ date uploaded - would be nice if users could sort and filter them by file name or author, but not a big deal. I can see that meta data is a bit niche for most e-voice users as you say.

 

The survey tool is a great workaround. I like that too. Shame that the upload isn't then available to be used elsewhere in the site, that would be awesome! Surveys work though and is a really good solution-thatnks for that. Question: Is there a way to get a link to a survey if I don't add the surveys page to the navigation pane? Looks like sending a test email might be the solution but wondered if the link was displayed on the survey admin page somewhere?

 

I'll check out flickr - i've not used before, but could work if it's simple. The technical ability of a large portion of our members is quite low, so I'd like to do this with as few clicks for members as I can.

 

I tried the social sharing - I added a couple of pages to your tweet :) but the site logo is always chosen as the heading image. What would I need to change to make that work better?

Thanks again, Kev