How to migrate and activate the New UI for the Visual Product Customizer

Zakeke Support

Updated May 26, 2025 10:23

Overview of the New UI

The new Visual Product Customizer UI is designed to offer a significantly improved user experience, focusing on both desktop and mobile devices. For desktop, we've streamlined the interface for quicker and easier customizations, while for mobile, we've created a completely new, mobile-first UI, optimized specifically for smaller screens and touch interactions. This dedicated mobile design ensures that your customers can have a seamless and engaging experience, no matter the device they're using.

Beyond the visual and interaction improvements, the new UI is built on a much more powerful and flexible technological architecture. This foundation allows for faster performance, easier maintenance, and continuous improvement over time. We’ve ensured that the UI is not only easier to use but also simpler to update, allowing us to release new features and enhancements more efficiently.

How to switch to the New UI

To switch to the new UI from the back-office, follow these steps:

Go to Settings
Navigate to User Interface Settings
In the banner at the top of the page, click on Continue with New UI

Once switched, you will have access to the new Interface Editor, where you can customize the UI before enabling it on your live store. You can personalize various aspects of the interface and save your changes as drafts before publishing.

What Happens to Your Existing Settings?

Some settings from the old UI will be automatically carried over, while others will need to be manually reconfigured.

Settings You Need to Manually Configure:

Custom Tool Names, Icons, and Positions: These will need to be set up again in the new UI.
Colors: Any custom colors you used in the old UI will need to be reconfigured.

For a guide on how to use the editor, please refer to our User Interface Settings guide.

Reminder: Saving and Enabling the New UI

While working in the new UI, you can save your progress as a draft before making it live. Here’s how the different actions affect your UI:

If you close the editor without saving, you will remain on the old UI, and any changes made in the editor will be lost.
If you click "Save Draft", the old UI will remain live on the site, but your customizations in the editor will be saved for future use.
Only by clicking "Enable" will the new UI be activated on your site, making all the customizations live for your customers.

Important timeline

Until June 29, 2025, you can switch between the new and the old UI as many times as you want. You are free to toggle back and forth, testing and comparing both versions.
Starting June 30, 2025, the old UI will be deprecated and no longer updated. If you’re using the new UI by that date, you will not be able to switch back. However, users still on the old UI can switch to the new one without being able to return to the old UI.
Starting September 15, 2025, the old UI will be completely discontinued. Users still on the old UI will be automatically migrated to the new UI.

Things to Watch Out For When Switching

Font Size Calculation
We have changed how font size is determined to ensure greater accuracy and consistency across products. In the new UI, 1pt always equals 1/72 of an inch relative to the actual product size, whereas in the old UI, font size depended on the pixel dimensions of the product image, leading to discrepancies across different products.

You need to take action only if:
- You have set custom min/max text sizes or a default text size. If you notice that text appears too large or too small on the front end, adjust the font size settings within the Printing Method section or, in case of template, inside your text item constraints.
- You see misaligned text in your templates. In this case, we recommend manually resizing the text within the template and saving it again.
TextArt Positioning in Pre-Designed Templates
In some cases, the position of a TextArt element in a pre-designed template might appear incorrect in the new UI. See image below:

However, this is not a bug in the new UI — it actually fixes a misalignment issue that was present in the old version.
If you notice a misaligned TextArt:
- Open the template in the Template Editor.
- Remove the TextArt, then create a new TextArt and style it to match your intended layout.
- Save the template again.
Third-party Design Elements Sources
If you have enabled the option to let customers add/transform design elements from third-party sources (as explained in this guide), please note that access to third-party image tools, previously available also through specific icons in the vertical toolbar, is now consolidated under the “Upload image” tool.
“Sync Elements on all Product Sides” Not Available
The "Sync Elements on all Product Sides" option for pre-designed templates is not supported in the new UI. Templates using this feature will still load and work correctly, but the synchronization of elements across product sides will no longer be applied.
Our team will work on a new and improved version of this functionality for a future release.
Legacy 3D Preview
If you are a long-time Zakeke customer, you might still be using a deprecated version of the 3D preview. Over the years, the 3D experience has been significantly updated to be more powerful and efficient. The original version is not supported in the new UI. If you don’t see the 3D preview after switching to the new UI, it's likely because you’re using this old setup. To resolve this, you’ll need to reconfigure your 3D preview in the back office. Feel free to contact us at help@zakeke.com and we’ll guide you through it.
General Testing and Optimization
We strongly recommend thoroughly testing the new UI before fully enabling it. If necessary, adjust settings in the back office to optimize your setup.

If you encounter any unexpected behavior, UI issues, or usability concerns, please report them to us at help@zakeke.com so we can help you resolve them quickly.