Image Preview: Show images in full browser-viewport

[tbsbdr]

Userstory:

• As a user I want that big images are shown as big as possible in the browser so that I get the best impression of the image.

Acceptance Criteria

• images bigger than the viewport get resized to cover 100% of the browser viewport
• The controls (incl. image title) overlay the image
• The controls have a fixed position while next/prev so that you don't have to reposition your mouspointer
• Image-title gets a background color
• controls + image title appear:
  • on mouse hover of the viewport
  • on single tap (touch device)
  • focus via keyboard
• controls + image title disappear:
  • after 5 seconds without mouse-movement within the viewport
• a transparent lightbox-background is placed "behind" the image
• gesture: swipe left/right changes to next/prev picture

Current status

Image with in full browser viewport

with controls + image visible

Image with in full browser viewport

with controls + image NOT visible after "inactivity"

[dschmidt]

It might be a good idea to have a border around the control box, try the current design with a dark blue image :-)

The current controls are pretty "jumpy", so you need to reposition your mouse pointer all the time while browsing through your photos, which annoys me a lot. I would also like to propose that the next/previous buttons are at stable positions, that implies the controls box should be properly centered (or at least somehow fixed to a certain position) and should have a fixed size and not become wider or narrower based on the filename or the image size. :)

[tbsbdr]

thx, updated ACs:

• The controls have a fixed position while next/prev so that you don't have to reposition your mouspointer

[kulmann]

Hijacking this issue... I don't agree with the full viewport. We should stay in the content frame of the app, i.e. below the app top bar and inside the app frame. That plus your proposal of making the controls an overlay to the image makes sense to me. Hiding the controls after inactivity will probably be an accessibility violation regarding keyboard-only-usage of the preview app. For mouse usage it's easy to digest that the controls re-appear on mouse movement. For the keyboard we need another mechanism. Showing them again on navigation is a low brainer, but if that's the only way of showing the controls again, I'd not be happy.

[dschmidt]

Regarding full viewport:

Why not both? I agree with @kulmann that we should stay in the frame of the app for a regular browser window - but I would also like a fullscreen view and that doesn't need the app frame imho.

[kulmann]

Regarding full viewport:

Why not both? I agree with @kulmann that we should stay in the frame of the app for a regular browser window - but I would also like a fullscreen view and that doesn't need the app frame imho.

Yes, a kind of lightbox-style presentation for a "full screen" or "slideshow" view should be allowed to break out of the app frame.