Hyper Zoom is SmartFrame’s unique approach to zooming into images. When enabled, the viewer will be able to load the image in an increasingly higher resolution with each tap. Thanks to SmartFrame’s technology, the quality of the zoomed image will increase with each zoom level.

In the Admin Panel, you can to adjust the zoom level, or deactivate Hyper Zoom completely if you wish. SmartFrame allows up to three levels of zooming: 200%, 300% and 400%. What this means in practice is that, if the 400% zoom option is enabled, with each click the user will see the images zoomed:

  • 1st click: 200% zoom
  • 2nd click: 300% zoom
  • 3rd click: 400% zoom
  • 4th click: back to the original size

Note: In order for the Hyper Zoom to work, the original image needs to be high enough in resolution. In order to preserve the quality of the image, Hyper Zoom will never upscale it, so if the original image is only twice as big as the SmartFrame, only one level of Hyper Zoom will be available. Keep in mind that the Hyper Zoom feature is disabled if you are using the SmartFrame Web Component with the –sf-image-size: contain or –sf-image-size: cover styling option.

Click on the image below to experience how Hyper Zoom works on SmartFrames:

Please note: The user experience when zooming into SmartFrames on mobile devices is different to what’s described above. You can read more about zooming SmartFrame on mobile here.

In order to preview the Hyper Zoom functionality with an actual SmartFrame, you can click on the Preview button at the bottom of the page. This will open a full preview of the Theme, including the changes you’ve just made, even before you save them. Once you’re happy with the results, you can save the changes by clicking on the Save button.