--- title: Upload Step description: Spiff Knowledge Base --- [Skip to content](https://help.spiffcommerce.com/knowledge-base/content/workflows/step-types/upload-image#main-content) [![c306e0b841df22eb274a13eb284de3893a945dde-256x102](https://help.spiffcommerce.com/hubfs/c306e0b841df22eb274a13eb284de3893a945dde-256x102.svg)](https://www.spiffcommerce.com/) - [Home](https://help.spiffcommerce.com/knowledge-base/) - Support Show submenu for Support - [Getting Started](https://help.spiffcommerce.com/knowledge-base/getting-started) - [Content](https://help.spiffcommerce.com/knowledge-base/content) - [Configurations](https://help.spiffcommerce.com/knowledge-base/configuration) - [Add-Ons](https://help.spiffcommerce.com/knowledge-base/additional-features) - [Troubleshooting](https://help.spiffcommerce.com/knowledge-base/troubleshooting) - [Developer Docs](https://developer.spiffcommerce.com/) - [Product Page](https://www.spiffcommerce.com/) Open main navigation Close main navigation - [Home](https://help.spiffcommerce.com/knowledge-base/) - Support Show submenu for Support - [Getting Started](https://help.spiffcommerce.com/knowledge-base/getting-started) - [Content](https://help.spiffcommerce.com/knowledge-base/content) - [Configurations](https://help.spiffcommerce.com/knowledge-base/configuration) - [Add-Ons](https://help.spiffcommerce.com/knowledge-base/additional-features) - [Troubleshooting](https://help.spiffcommerce.com/knowledge-base/troubleshooting) - [Developer Docs](https://developer.spiffcommerce.com/) - [Product Page](https://www.spiffcommerce.com/) - [Contact us](mailto:support@spiff.com.au) [Contact us](mailto:support@spiff.com.au) How can we help you? - There are no suggestions because the search field is empty. 1. [Spiff Knowledge Base](https://help.spiffcommerce.com/knowledge-base?hsLang=en) 2. [Content](https://help.spiffcommerce.com/knowledge-base/content?hsLang=en) 3. [Workflow Steps](https://help.spiffcommerce.com/knowledge-base/content?hsLang=en#workflow-steps) # Upload Step ## Understanding and Configuring the Upload Step for Personalized Product Design The Upload Step, otherwise known as the ["Frame"](https://support.spiffcommerce.com/docs/content/assets/frames/) step, allows you to define areas anywhere on your products in which your customers can upload their own [images](https://support.spiffcommerce.com/docs/content/assets/images/) or SVG [assets](https://support.spiffcommerce.com/docs/content/assets/). Adding logos, photos of friends or family, or anything else, the Upload Step adds a valuable and powerful layer of personalisation to your customer's overall design experience. ![Screen Shot 2022 11 18 at 11.17.37 am](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-11-18-at-11_17_37-am-1.png) ## Adding the Upload Step. Let's start by adding our new step. Navigate to your [workflow](https://support.spiffcommerce.com/docs/content/workflows/) and add the "Upload Step", via the +ADDSTEP button within one of your workflow's [scenes.](https://support.spiffcommerce.com/docs/content/workflows/scenes/) See below. Once you have added your [step](https://support.spiffcommerce.com/docs/content/workflows/step-types/), fill in all relevant information such as your [step name](https://support.spiffcommerce.com/docs/content/workflows/step-settings/general-settings/) and [help text](https://support.spiffcommerce.com/docs/content/workflows/step-settings/general-settings/) in the ["General"](https://support.spiffcommerce.com/docs/content/workflows/step-settings/general-settings/)tab. ![Screen Shot 2022 12 13 at 4.46.01 pm](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-13-at-4_46_01-pm-1024x239-1.png) The Upload Step, otherwise known as the ["Frame"](https://support.spiffcommerce.com/docs/content/assets/frames/) step, allows you to define areas anywhere on your products in which your customers can upload their own [images](https://support.spiffcommerce.com/docs/content/assets/images/) or SVG [assets](https://support.spiffcommerce.com/docs/content/assets/). Adding logos, photos of friends or family, or anything else, the Upload Step adds a valuable and powerful layer of personalisation to your customer's overall design experience. ## Upload Step Config Aside from the universal config settings outlined in the [Step Config](https://support.spiffcommerce.com/docs/content/workflows/step-settings/config/) documentation, there are a few specialty configurations within your Upload Step that we'll cover here. ![Screen Shot 2022 12 14 at 11.50.14 am](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-14-at-11_50_14-am-1024x191-1.png) ### Force Image Cover With the "Force Image Cover" checkbox selected, any [images](https://support.spiffcommerce.com/docs/content/assets/images/) that the customer uploads, regardless of adjustment, will always cover the entire upload area or [frame](https://support.spiffcommerce.com/docs/content/assets/frames/) area. This is great for logos and other square [images](https://support.spiffcommerce.com/docs/content/assets/images/), though this may not be ideal for rectangular [images](https://support.spiffcommerce.com/docs/content/assets/images/) such as landscape or portrait [images](https://support.spiffcommerce.com/docs/content/assets/images/) that may need to be zoomed in/out (Unless your regions are set up for it). Without this setting enabled, customers can adjust their uploaded [assets](https://support.spiffcommerce.com/docs/content/assets/) smaller than the [region](https://support.spiffcommerce.com/docs/content/workflows/step-settings/regions/)/[frame](https://support.spiffcommerce.com/docs/content/assets/frames/), which may be ideal or unwanted depending on what personalised designs you offer. ![Screen Shot 2022 12 14 at 12.06.14 pm](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-14-at-12_06_14-pm-1024x599-1.png) ### Enable Color Picker With Focal Blur enabled, a radial blur effect will be applied to any [images](https://support.spiffcommerce.com/docs/content/assets/images/) that the customer uploads to this step. Anchored to the centre of your [step's region](https://support.spiffcommerce.com/docs/content/workflows/step-settings/regions/) and [frame](https://support.spiffcommerce.com/docs/content/assets/frames/), the strength of the blur, as well as the size of the radius can both be configured. ![Screen Shot 2022 12 14 at 11.59.11 am](https://help.spiffcommerce.com/hs-fs/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-14-at-11_59_11-am-1.png?width=260&height=226&name=Screen-Shot-2022-12-14-at-11_59_11-am-1.png) ### Disable Placeholder The default [image](https://support.spiffcommerce.com/docs/content/assets/images/), or the 'placeholder' in any Upload Step, the standard "UPLOAD [IMAGE](https://support.spiffcommerce.com/docs/content/assets/images/)" [asset](https://support.spiffcommerce.com/docs/content/assets/), can be disabled with the Disable Placeholder checkbox, so rather than displaying this default [asset](https://support.spiffcommerce.com/docs/content/assets/) over the entire Upload Step [region](https://support.spiffcommerce.com/docs/content/workflows/step-settings/regions/)/[frame](https://support.spiffcommerce.com/docs/content/assets/frames/), it will be left blank. For products that don't necessarily need an uploaded [asset](https://support.spiffcommerce.com/docs/content/assets/), this may be ideal, so if the step is unused, nothing will appear. Functionally this does not change the Upload Step, only how it initially displays. See the two [images](https://support.spiffcommerce.com/docs/content/assets/images/) below. ![Screen Shot 2022 12 14 at 12.07.59 pm](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-14-at-12_07_59-pm-1024x451-1.png) ![Screen Shot 2022 12 14 at 12.10.30 pm](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-14-at-12_10_30-pm-1024x361-1.png) ### Overlay Overlays can be added simply to the Upload Step. Whether it's your company logo or anything else. Use the Overlay upload section to choose from one of your uploaded [Image](https://support.spiffcommerce.com/docs/content/assets/images/) or [Illustration assets](https://support.spiffcommerce.com/docs/content/assets/illustrations/) from the [Spiff Asset Manager](https://hub.spiff.com.au/#/assets). This [asset](https://support.spiffcommerce.com/docs/content/assets/) will only appear within the rendered [step](https://support.spiffcommerce.com/docs/content/workflows/step-types/) itself on the sidebar/side panel, rather than within the 3D or 2D view of the product - this [asset](https://support.spiffcommerce.com/docs/content/assets/) will not appear directly on the design etc. ![Screen Shot 2022 12 14 at 12.14.13 pm](https://help.spiffcommerce.com/hs-fs/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-14-at-12_14_13-pm-882x1024-1.png?width=265&height=308&name=Screen-Shot-2022-12-14-at-12_14_13-pm-882x1024-1.png) ### Custom Placeholder Rather than the default "Upload [Image](https://support.spiffcommerce.com/docs/content/assets/images/)" placeholder [asset](https://support.spiffcommerce.com/docs/content/assets/), described in the disable placeholder section above, you can choose your own default [image](https://support.spiffcommerce.com/docs/content/assets/images/). Oftentimes you may want use your own logo [asset](https://support.spiffcommerce.com/docs/content/assets/) or a more visual default [asset](https://support.spiffcommerce.com/docs/content/assets/) that matches your own designs more adequately. Simply use the Custom Placeholder upload area to choose from one of your uploaded [Image](https://support.spiffcommerce.com/docs/content/assets/images/) or [Illustration](https://support.spiffcommerce.com/docs/content/assets/illustrations/) [assets](https://support.spiffcommerce.com/docs/content/assets/) within your [Spiff Asset Manager](https://hub.spiff.com.au/#/assets). ![Screen Shot 2022 12 16 at 10.21.41 am](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-16-at-10_21_41-am-1024x201-1.png) ![Screen Shot 2022 12 14 at 12.18.00 pm](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-14-at-12_18_00-pm-1024x371-1.png)   ## Upload Step Options [Options](https://support.spiffcommerce.com/docs/content/workflows/step-settings/options/) for the Upload Step, found in the ['Options'](https://support.spiffcommerce.com/docs/content/workflows/step-settings/options/) tab on the left, behave exactly the same as other [option](https://support.spiffcommerce.com/docs/content/workflows/step-settings/options/)-capable steps and likewise can use [shared options](https://support.spiffcommerce.com/docs/content/options/). The Upload Step uses "[Frame](https://support.spiffcommerce.com/docs/content/assets/frames/)" [assets](https://support.spiffcommerce.com/docs/content/assets/)/variants - an SVG file that will determine the shape and area for uploaded [images](https://support.spiffcommerce.com/docs/content/assets/images/). Read more about [options](https://support.spiffcommerce.com/docs/content/workflows/step-settings/options/) [here.](https://support.spiffcommerce.com/docs/content/workflows/step-settings/options/) Although upload steps don't require you to use a [Frame](https://support.spiffcommerce.com/docs/content/assets/frames/), they can add a lot of impact to a design. If you want a certain upload shape you can choose from our public [Asset](https://support.spiffcommerce.com/docs/content/assets/) Gallery or you can create your own. If you only want your upload area to be a square or rectangle shape, you don't need to use a Frame. The uploaded [assets](https://support.spiffcommerce.com/docs/content/assets/) will be cropped/bound to these frames and will be applied to the product in the same way in the final design/output files. ![Screen Shot 2022 11 18 at 11.31.46 am](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-11-18-at-11_31_46-am-1.png) ![Screen Shot 2022 11 23 at 9.53.14 am 1](https://help.spiffcommerce.com/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-11-23-at-9_53_14-am-1-1.png) ## Regions for the Upload Step As explained in the [Regions](https://support.spiffcommerce.com/docs/content/workflows/step-settings/regions/) and [Panels](https://support.spiffcommerce.com/docs/content/workflows/experience-configurator/panels/) documentation, your region will determine where your [Step](https://support.spiffcommerce.com/docs/content/workflows/step-types/) [Assets](https://support.spiffcommerce.com/docs/content/assets/)and how large they will appear - In this case, how large your upload area will be. Access this via your step's ["Regions"](https://support.spiffcommerce.com/docs/content/workflows/step-settings/regions/) tab. ![Screen Shot 2022 12 02 at 10.34.20 am](https://help.spiffcommerce.com/hs-fs/hubfs/Knowledge%20Base%20Import/Screen-Shot-2022-12-02-at-10_34_20-am-1024x167-Aug-06-2025-03-31-01-2583-AM.png?width=823&height=134&name=Screen-Shot-2022-12-02-at-10_34_20-am-1024x167-Aug-06-2025-03-31-01-2583-AM.png) - [Getting started](https://help.spiffcommerce.com/knowledge-base/getting-started?hsLang=en#main-content) - [Ecommerce Plugins](https://help.spiffcommerce.com/knowledge-base/getting-started?hsLang=en#ecommerce-plugins) - [3D Models](https://help.spiffcommerce.com/knowledge-base/getting-started?hsLang=en#3d-models) - [Printer Setup](https://help.spiffcommerce.com/knowledge-base/getting-started?hsLang=en#printer-setup) - [Content](https://help.spiffcommerce.com/knowledge-base/content?hsLang=en#main-content) - [Workflows](https://help.spiffcommerce.com/knowledge-base/content?hsLang=en#workflows) - [Themes](https://help.spiffcommerce.com/knowledge-base/content?hsLang=en#themes) - [Workflow Steps](https://help.spiffcommerce.com/knowledge-base/content?hsLang=en#workflow-steps) - [Assets](https://help.spiffcommerce.com/knowledge-base/content?hsLang=en#assets) - [Configuration](https://help.spiffcommerce.com/knowledge-base/configuration?hsLang=en#main-content) - [Orders](https://help.spiffcommerce.com/knowledge-base/configuration?hsLang=en#orders) - [Products](https://help.spiffcommerce.com/knowledge-base/configuration?hsLang=en#products) - [Additional Features](https://help.spiffcommerce.com/knowledge-base/additional-features?hsLang=en#main-content) - [Order Management](https://help.spiffcommerce.com/knowledge-base/additional-features?hsLang=en#order-management) - [Engagement Optimisation](https://help.spiffcommerce.com/knowledge-base/additional-features?hsLang=en#engagement-optimisation) - [Additional Customisation](https://help.spiffcommerce.com/knowledge-base/additional-features?hsLang=en#additional-customisation) - [Dynamic Pricing](https://help.spiffcommerce.com/knowledge-base/additional-features?hsLang=en#dynamic-pricing) - [Troubleshooting](https://help.spiffcommerce.com/knowledge-base/troubleshooting?hsLang=en) - [Developer Docs](https://help.spiffcommerce.com/knowledge-base/developer-docs?hsLang=en) [![880d1d95153037f5b68501da7ef50994ebc548b0-256x102](https://help.spiffcommerce.com/hubfs/880d1d95153037f5b68501da7ef50994ebc548b0-256x102.svg "880d1d95153037f5b68501da7ef50994ebc548b0-256x102")](http://spiffcommerce.com)              www.spiffcommerce.com **Contact Us**                 ✉️  support@spiff.com.au              [Privacy Policy](https://www.spiffcommerce.com/privacy)            [Terms of Service](https://www.spiffcommerce.com/terms)         © 2025 SpiffCommerce. All rights reserved.