There is a simple photo gallery:
Clicking on image opens a dialog with larger version of it:
We can do this in two ways:
- User clicks on a thumbnail
- We show loading indicator over the clicked thumbnail (but do not display dialog yet).
- After large image is loaded - we open the dialog and show the image.
- User clicks on a thumbnail.
- We open the dialog right away with stretched thumbnail that matches size of the large image.
- After large image is loaded, we add it on top of the stretched thumbnail.
Image loading might take anywhere between 0.1 second and 10 seconds, the gallery might be used on desktop and mobile device.
Which method do you think is better? Or maybe there is another way?