cds iiif redesign

[yulgit1]

see #53 as well

[yulgit1]

when cds2 is implemented remember to change ProcessHelper.getHeaders for image available/unavailable

[edgartdata]

@all: please add examples of records with lots of images and images of different kinds before the end of March.

[edgartdata]

https://collections.britishart.yale.edu/catalog/tms:722 has 16 images, many of them are conservation images.

[flapka]

From RBM:

• David Roberts record books (about 250 images): https://collections.britishart.yale.edu/catalog/orbis:3505631
• Helmingham Herbal and bestiary (27 images): https://collections.britishart.yale.edu/catalog/orbis:9452785

[edgartdata]

Update from @yulgit1 on 3/26 at 4:34PM:

Activity stream https://ycba-cds-iiif.s3.amazonaws.com/jsonpages/collection1.json

Manifest URL scheme https://manifests.collections.yale.edu/ycba/orb/13065833 https://manifests.collections.yale.edu/ycba/obj/3776

json query in java: json.getJSONArray("items").getJSONObject(0).getJSONArray("thumbnail").getJSONObject(0).getString("id");

or as a json path:

items[0].thumbnail[0].id

It might be worth asking Seong if he’s tracking all the objects and using that rather than traversing the activity stream to get all the objects. Getting a solr dump of all the objects is another viable alternative.

[edgartdata]

At the 3/26 CIA & Friends meeting @yulgit1 reported that he had deployed Mirador 3 and CDS2 on our DEV server:

All, @BaylaArietta @flapka @EdwardTown1 @peeblesc @robl @KraigBinkowski @rchatalbash @mxgold (Melissa, feel free to share with imaging colleagues) @yhwang813 please test http://10.5.96.187:3000/ (needs VPN) and enter your comments/suggestions/questions/concerns about the look&feel and functionality of the viewer in this issue 56 by April 9.

Some feedback on Mirador 3 from the 3/26 meeting to Eric:

• enable full screen viewing, the way OSD currently allows
• bringing several images into the Mirador 3 space is different from doing it into M2 and might necessitate a short video tutorial
• IIIF logo comes from Mirador 2 into Mirador 3 when dragging & dropping M2 manifests into M3 (bug for Eric to report)
• Move image functions to below the image

[edgartdata]

Some important dates:

• April 9: deadline to send Mirador 3 feedback
• APril 14: push Mirador 3 to production
• April 30: old CDS comes down (last possible date for it to come down is June 30, 2021)

[annabozz]

Distorted Image in Print Preview

example: http://10.5.96.187:3000/catalog/tms:34

This unframed, recto image is showing up as distorted during the print preview. Same problem happening to other images as well.

Showing up this way in Firefox, and in Google Chrome (testing via a Mac)

tms-34-firefox.pdf

[annabozz]

Image Keywords

example: http://10.5.96.187:3000/catalog/tms:8915

It appears that if there are NO image keywords assigned to an image in NetX, then the default text "Image from Yale University" appears for each image.

This also impacts the "Download/Print Selected Image" feature (image below).

Is it possible for the default to instead be blank? If it was blank would that mess up the usefullness of the drop down selection shown below- does every image need at least one keyword? (@mxgold to be looped in on final decision)

Showing up this way in Firefox, and in Google Chrome (testing via a Mac)

[yulgit1]

@clemgreen Could not recreate distorted print image (Mac/safari, chrome,FF)

The default image captions "Image from Yale University" seem to come from CDS2. If we agree to a change it should be requested here: https://git.yale.edu/cultural-heritage-dam/cds2-project/issues

[flapka]

RBM agrees with @clemgreen 's preference for the caption to appear as blank rather than "Image from Yale University" when the data is absent. We will in time fill in those blanks, but that won't happen overnight.

As for the source of the data, is it not the NetX "Image Caption" field, instead of the NetX "Image Keywords" field? This appears to be the case with RBM images at least.

[yulgit1]

@flapka yes imagecaption not imagekeywords appears to be what is pushed into the manifest label.

[bobhixon]

@yulgit1 The distorted print images happened for me and Melissa as well.

[flapka]

In general, RBM is thrilled with the new iiif implementation with RBM collections. The handful of recommendations that follow are suggested as incremental (sometimes subjective) improvements. It's possible that some of these "issues" are inflexibly baked in to the Mirador 3 viewer.

1. As noted in our previous meeting, the semi-transparent band at the bottom of the image area is undesirable, as it obscures a portion of the image. If there's a way to remove it, that'd be great.
2. The metadata area (opened via the hamburger menu at top left) is rather narrow. Could it be slightly wider? Or could the width respond to user adjustments?
3. Is it possible to adjust the typography for the metadata area. The fluctuations in point size seem mildly wonky, and at times I wish there was a clearer distinction (via typography) between field label and field data.
4. I wonder if it will be at all confusing to users that the default viewer in our object display differs (in mild ways) from the viewer that opens upon clicking the iiif icon.
5. Background color is a major difference between these two viewers. I prefer the black/dark gray in the latter. It seems calmer.
6. Once a user clicks on the "Window views & thumbnail display" (second from top right) there seems to be no way to exit the menu without selecting a change. It'd be nice if there was a way to simply escape, without selecting a change.

[flapka]

7. The thumbnail band at bottom at times does not stretch all the way across the view (prematurely and abruptly cut off). See screenshot.

[robl]

This is really getting close! As an addendum to Francis’s comments, with which I agree, three thoughts:

• FL6, “there seems to be no way to exit,” may be a browser-dependent behavior. When I tried to replicate it in my usual Firefox 87 in macOS, I could exit that menu (without selecting a change) in either of two ways: clicking on “Single” to keep the view the same and close the menu, or hitting Escape to close the menu without clicking anything. Francis, what browser and OS were you in when you observed the issue? I wonder if this might be a Mirador 3 cross-browser issue.

• Another little UX thing may be baked into Mirador but is worth noting since it may be confusing for people. Once someone is viewing an image in the full IIIF viewer, they have (in most browsers) two “X” close boxes in the upper right area: the standard one in Mirador for keeping the viewer open but removing the image, and the standard one in web browser to close that tab. People familiar with IIIF will not be fazed by this; newcomers may—especially since on hover, the Mirador “X” says “Close window,” which could really confuse people. I wonder if the on-hover text for that Mirador “X” could be overridden to be “Remove image from viewer”? That could help to mitigate this.

• One more UX thing we might consider, this one for the embedded viewer: for many people, the difference between the broken-square icon for full-screen view from the embedded viewer, and going to the non-embedded IIIF viewer (if they realize what that IIIF icon can do), may not be clear (both give them a bigger image). The full-screen icon has helpful “Full screen” text on hover, which gets us partway there. How about adding on-hover text for the IIIF icon, to say “View image in full IIIF viewer” or something like that? That could also be a clue for people who have no idea what that IIIF icon is or means or does. There could be a slippery slope here if we were also to try explaining how to drag that icon, but if we avoid that temptation, maybe just a tip about what happens if a person clicks on it could be helpful.

Of course the two “hover” ideas above would only work in some interaction contexts (e.g., not on touch), but may still help.

[yulgit1]

Answering above comments @flapka (1):

I think that is there so the controls resolve again the background. If you want to see the bottom of the image un-obscured you can always drag the image up. But submitted a ticket:

https://github.com/ProjectMirador/mirador/issues/3407

[yulgit1]

Answering above comments @flapka (2): Answering above comments @flapka (3):

Submitted a ticket:

https://github.com/ProjectMirador/mirador/issues/3408

[yulgit1]

Answering above comments @flapka (4):

I would hope the user understands. Why offer the embedded/standalone option if they were exactly the same. What could be done to make the difference more intuitive?

Answering above comments @flapka (5):

Light/dark is configurable. What do people prefer? FWIW I like light, seems cleaner.

[yulgit1]

Answering above comments @flapka (6) & @robl (bullet1)

Pressing escape seems to do the trick but that is counterintituive and you may expect to be able to do this by clicking on something. Submitted a ticket.

https://github.com/ProjectMirador/mirador/issues/3410

[yulgit1]

Answering above comments @flapka (7): This might have been something transient (could not recreate (on Mac: chrome, firefox, or safari)

[yulgit1]

Answering above comments @robl (bullet2)

Submitted a ticket: https://github.com/ProjectMirador/mirador/issues/3409

Answering above comments @robl (bullet3) "...How about adding on-hover text for the IIIF icon, to say “View image in full IIIF viewer” or something like that?" Will do.

[mxgold]

Observation: hi-res tiff downloads receive a generic filename: "source.tif"

[robl]

Important catch, @mxgold .

[yulgit1]

https://git.yale.edu/cultural-heritage-dam/cds2-project/issues/23

[edgartdata]

Meeting notes from 4/9: (@flapka @peeblesc @rchatalbash please be in touch/comment here if you have questions or concerns)

• New date for push to production for Mirador 3: Thursday April 15 (instead of the 14th)

• For the image keyword issue reported by Anna, the group discussed boilerplate text options to replace "Image from Yale University" and so far "Yale Center for British Art image" seems to be a viable option. The group will make their final decision on language on this by end of day on Monday. This change means updating media records and Imaging will reach out to Jeff Campbell's NetX team to explore bulk update options. If the update to the media caption is not in place before April 15, the group is okay with moving to production for Mirador 3 in this state. When the image does not have a caption "Image from Yale University" appears in the Select Image drop down and at the bottom of each image in the image ribbon in Mirador:

• Distorted Image in Print Preview issue: we will keep researching why this is happening but decided to go ahead with the push of Mirador 3

• In Mirador 3 the functionality bar (somewhat transparent) covers the bottom of the image: it will take some time to change this because Mirador 3 is an open source product. The group will reach out to various IIIF channels to explore this question. (@robl if you are going to contact the Mirador Slack channel, I wonder if we should 'bundle' our questions?) In the meantime, the functionality bar moves to below the image in the full screen viewing mode.

• background color for Mirador 3: we settled on gray (option 2 above) for the default color noting that individual users can customize their Mirador 3 space by changing the color scheme:

• It looks like @yulgit1 fixed the issue where the IIIF logo would come from Mirador 2 into Mirador 3 when dragging & dropping M2 manifests into M3

Other elements we did not have time to discuss:

• The metadata area (opened via the hamburger menu at top left) is rather narrow. Could it be slightly wider? Or could the width respond to user adjustments?
• Is it possible to adjust the typography for the metadata area. The fluctuations in point size seem mildly wonky, and at times I wish there was a clearer distinction (via typography) between field label and field data.
• I wonder if it will be at all confusing to users that the default viewer in our object display differs (in mild ways) from the viewer that opens upon clicking the iiif icon.
• FL6 Once a user clicks on the "Window views & thumbnail display" (second from top right) there seems to be no way to exit the menu without selecting a change. It'd be nice if there was a way to simply escape, without selecting a change.

I agree with @flapka on this last point. This goes back to the necessity to craft a short video tutorial I think. When I escape I get this error message in Chrome:

I found a way to add several IIIF manifests to Mirador 3 but not to see them in a gallery viewing mode...yet. Anyone?

• Also noting the 2 points @robl made earlier in this issue about UI issues for us to come back to but also noting that they might be artifacts of the different browsers and thus out of our control?

[robl]

@edgartdata , re: your idea that "@robl if you are going to contact the Mirador Slack channel, I wonder if we should 'bundle' our questions?" is intriguing. My first instinct was yes, but then I realized that each question might spawn its own focused comment thread; so I'm thinking separate may be best for clarity. I could plan to post the overlay question this afternoon and note that it may be the first of several from us, and then you might post more there, if that sounds good?

[edgartdata]

@robl that makes sense. Thanks Rob!

[robl]

Overlay question asked: https://iiif.slack.com/archives/C148SMLD7/p1618002220068500

[mxgold]

Please take a quick moment to vote for or suggest your preferred boilerplate text alternative for the null image captions using this Google form. Poll will close Monday at 2 pm-ish. thanks! https://docs.google.com/forms/d/e/1FAIpQLSfXMitbUw6tdlwoTTlM5dH13hkEJ0l272kvRyMOJ95A8Hd59A/viewform?usp=sf_link

[robl]

A reply via Slack regarding the navigation overlay:

Hello Mirador experts, The Yale Center for British Art has a new iteration of online collection search about to launch, and we are moving to Mirador 3 for it. A lingering design concern with our embedded viewer is the presence of the translucent overlay bar of image-navigation icons across the bottom of the image. Does anyone know of a way to relocate that nav bar to sit cleanly below the image instead? Thanks, and apologies if this is a naïve config question!

ggeisler 6:10 PM Hi @rob.lancefield. I don’t believe there is an easy configuration setting to relocate the bottom navbar, though I understand why you might want to. You might take a look at the customization the Art Institute of Chicago did for some ideas. I think they customized more details than simply relocating the navbar, but perhaps their plugin (which I believe was aimed at providing users with a more simplified UI) will give you some ideas: https://github.com/art-institute-of-chicago/aic-mirador-ui

PS: If useful, I (Rob) could provide an introduction to a software engineer at the AIC.

[robl]

And more, from Tina Shah at the AIC:

rob, yes, we created plugins to remove, move and replace the UI with our own graphics. not sure if you’ve already checked it out, but here are main plugin files we used for the nav:

1. Remove nav: https://github.com/art-institute-of-chicago/aic-mirador-ui/blob/master/src/plugins/aicRemoveNavPlugin.js
2. Change zoom button icons, styles, behavior and placement https://github.com/art-institute-of-chicago/aic-mirador-ui/blob/master/src/plugins/aicZoomButtonsPlugin.js
3. Same as above with nav buttons: https://github.com/art-institute-of-chicago/aic-mirador-ui/blob/master/src/plugins/aicNavigationButtonsPlugin.js

[mxgold]

boilerplate text alternative for the null image captions for the art collections will be "Image Courtesy YCBA" - this will replace the CDS2 boilerplate "Image from Yale University" @bobhixon & @mxgold will follow up on bulk update(s) in NetX.

[edgartdata]

Thanks for letting us know @mxgold

[yulgit1]

question to mirador slack channel:

"https://collections-test.britishart.yale.edu/catalog/tms:10034 https://collections.britishart.yale.edu/catalog/tms:10034 Hoping there a simple.answer. On collections-test above, the IIIF icon no longer drags in safari (FF, chrome OK), even with draggable attribute. Collections (the current) is OK. The only changes as adding the title and draggable attributes, and a different mirador viewer. But even with these the same between collections-test and collections, the icon won’t drag in safari anymore with collections-test."

[yulgit1]

Ticket to mirador:

https://github.com/ProjectMirador/mirador/issues/3425

[edgartdata]

Closing this issue since CDS2 and Mirador 3 have been deployed and opening #300 for Mirador 3 only related questions/issues.