iTunes Music Store-esq Demo

Here we aim to replicate the new gallery in iTunes 9.

Screenshot we are going to replicate:

itms_banner

Sizing:
The size of the main image in the banner is about 470px x 300px. The size of the thumbnails is about 200px x 100px.

Positioning:
The positions of the thumbnails are (obviously) on the right.

Timing:
The timing is about 4 seconds.

Effect:
The effect Apple uses is a simple Fade effect.


Step 1:
Shrink images in Preview.app. I shrunk each image proportionaly down to 400px x 300px, converted each to JPEG, and compressed the images to about 60KB each. I set weaverPix to use the SAME size as I exported this!

zoom


Step 2:
Thumbnails. The current version of weaverPix only supports thumbnails up to 128px x 128px -- this will probably double in the next release now! So I set it to 128px wide by 100px tall.

Step 3:
Add the photos!

Step 4:
Publish!
IMG_1366.JPG IMG_1377.JPG IMG_1394.JPG IMG_1395.JPG IMG_1401.JPG