Custom Image – Use The “Auto Size Behavior” Feature to Create Mockups

We recently added a new “Auto Size Behavior” feature to the Products Customizer’s Custom Image customization element.  The “Auto Size Behavior” feature allows you to tell the App how it should auto resize an image uploaded by your customers.

You can select one of the following 3 auto resize behaviors:

  1. Best Fit: App will resize the image only if the image is larger than the layer, to the largest size such that both its width and its height can fit inside the layer.
  2. Cover: App will resize image to cover the whole layer. Some parts of the image might not be visible.
  3. Contain: App will resize the image to the largest size such that both its width and its height can fit inside the layer.

Using this feature creatively you can give your customers an interactive preview of how their products will look like.  For example, we recently added a new Preset Template called “Wall Art Mockup”.

In the “Wall Art Mockup” we use a Custom Image customization element to allow customers to upload an image of their room wall.  We used a static Image customization element to show the wall art or sticker.  And we used another static Image element to show a scale marker with the size of the wall art. The Custom Image element is in the background and with the “Contain” auto-resize option selected.  So when customers upload a photo of their room wall, they will be able to preview how the wall sticker would look like on their walls.  Customers are able to scale and move their wall photo to match the scale marker.  You can see a preview of the “Wall Art Mockup” here: https://www.artistry.io/shopify/widget?client_id=95&product_id=32&preview-mode=1.

Please let us know if you have any comments or suggestions about this feature; we are always looking for creative ways to improve our tool.

Luis Morales

Luis Morales

Co-Founder and CTO at Artistry.io - E-commerce conversion rate optimization platform powered by Machine Learning. Born in Puerto Rico, Luis is a self-taught web developer, proud U.S. Army veteran, and former lawyer.

Add comment