Interface Concept: ViRR Image Size

From MPDLMediaWiki
Revision as of 12:03, 19 August 2013 by Grossmann (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Source Images Properties[edit]

Examples from source images

dt9bg18q+bd2_d0001:

Resolution: 72px Width: 3072 Pixel Height: 3840 Pixel

Ratio: 1.25

dt9bg20q+bd5-6_druck2_d0001:


Resolution: 72px Width: 3072 Pixel Height: 3840 Pixel

Ratio: 1.25

Preparation of images for web usage[edit]

The following prerequisites need to be considered:

Aspect ratio[edit]

Needs to be considered in any case. This can be achieved if

  • only a percentage is handed over for resize
  • only the horizontal width is handed over for resize

Resolution[edit]

The resolution should be at 72px for screen display. This means one pixel of the image is mapped to exactly one pixel of the target resolution of the client.

Dimensions[edit]

To avoid running in problems with the aspect ratio dimensions refer to the image width only.

The maximum of available space defined in the prototype for R3 is 431px horizontal width in 2 column view. As images for next ingest will be used in GUI V2 this table needs to be considered:

GUI V1 (ViRR<R3) DIV width in GUI Image format GUI V2 (ViRR>R3) DIV width in GUI Image format Needed image formats
Small View (Thumbnail) Auto 144px Thumbnail for lists 63px 126px 126px
2 Column View 445px (50%) 544px 2 Column View 431px 862px via browser resize
1 Column View 857px (100%) 544px 1 Column View (?) 862px 862px 862px
Windowed View Full 3840px Windowed View Full 3840px no change

We agreed to have a compression of 80% Quality for large images and 100% for the small ones.

Examples (processed by Gimp)[edit]

ViRR image in 862 (Source: 862)

ViRR Example862.jpg

ViRR image in 431 (Source: 862)

ViRR Example862.jpg

ViRR image in 126 (Source: 126)

ViRR Example126.jpg

ViRR image in 32 (Source: 126)

ViRR Example126.jpg

Ingest canidates (processed by java.imageio alias Willi)[edit]

ViRR image in 862 (Source: 862)

ViRR imageio 862.jpg

ViRR image in 431 (Source: 862)

ViRR imageio 862.jpg

ViRR image in 126 (Source: 126)

ViRR imageio 126.jpg

ViRR image in 32 (Source: 126)

ViRR imageio 126.jpg