Thumbnail Interaction and Behaviour

Intro

Thumbnails in Decapod are a little different from a typical thumbnail of a single image in a image manager for the desktop.

For each capture in Decapod, two images are produced: one from Camera 1, and one from Camera 2 (aka. the "stereo pair"). Each of these images will show the same page spread but from two different perspectives.

After Decapod's processing, these stereo pair are replaced by two images: one of the left page, and one of the right page.

This transformation from stereo pair to a single pair occurs while the user is doing their work. This wireframe captures this interaction as it would appear to the user.

Thumbnail Layout Behaviour

A detailed look at how the thumbnail is to be laid out:

• If there are any unprocessed images and the user saves a PDF, then all images are processed (dewarped and split) as part of the save process.

Thumbnail Interactions

• Only 1 selection is allowed at a time (in the future, we could allow for multiple selections).
• Only the selected thumbnail has a "Delete" button overlaid the image.
• Reordering is possible by drag and drop, or by keyboard interaction.
• Thumbnails will be a fixed size. But in the future we could accommodate a thumbnail size adjustment. The smallest thumbnail size will depend on the size of the delete buttons and length of text to displayed in the thumbnail header.
• There is a keyboard cut and paste interaction. See Thumbnail Cut and Paste wireframe.

Tooltips:

• Dwelling over the thumbnail image and empty space inside the thumbnail border will reveal a tooltip giving Decapod thumbnail metadata: page number(s), queued or processing, and other relevant information that may be useful for non-visual feedback.
• Dwelling over the Delete key will reveal: "Delete picture. (Keyboard: Delete key)"
• Dwelling over the Zoom key will reveal: "Show larger version of this picture. (Keyboard: Enter key)" (Zoom removed in v9 protoype).

Reordering Thumbnails

Mouse interaction:

• drag and drop using any space that is not the overlaid delete button. (For example of keyboard interaction, see Image Reorderer)
• Alternatively, the page can be moved by activating the page order inline edit (double-click the page number, or by pressing F2) and typing the new position.

Keyboard interaction:

• following Image Reorderer) keyboard interactions using CTRL+I,J,K,M. (to be tested with ORCA)
• Alternatively, the page can be moved by activating the page order inline edit (double-click the page number, or by pressing F2) and typing the new position.

Audio interaction (mouse):

• start move: "Moving page x."
• dragging: "<current page location>" i.e. "4... 5... "
• end move: "Moved page x to y."

Audio interaction (keyboard):

• start move: "Moving page x."
• while move modifier key is still activated: "<current page location>" i.e. "4... 5... "
• end move: "Moved page x to y."

Adding / Inserting Images

*Can be done by performing a capture and then cut/paste, reorder the new image.

• See: Thumbnail Cut and Paste

Deleting Thumbnails / Images

Mouse Keyboard interaction:

• Press Delete key or by selecting the Delete overlaid button with the mouse.
• Note: keyboard focusing the delete overlay button may cause some undesired interactions. To be tested.