Preserve multiple AI transformations
Hello,
I have a NextJS application and I use the CldUploadWidget to upload images and the CldImage component to apply transformations.
What I'm trying to do is the following:
1. The user uploads an image with a guy with black shirt and black hat.
2. Applies transformation to recolor the shirt to be white with the recolor AI transformation and gets a new transformed image with a white shirt and black hat.
3. The user wants to recolor the hat to be white as well so he applies a new transformation and here is the problem. Cloudinary will apply the second transformation on the original image, not the previously tranformed image and the result will be black shirt (from the original image) and white hat.
My question is - is it possible to apply AI transformations on already transformed images, so the users can make chain of AI transformations on the same image without the need to re-upload it? I tried to pass the preserveTransformations={true} property on the CldImage but that didn't help and it was still using the original image, not the transformed one.
Any help will be highly appreciated!
Best regards,
Answers
-
Hi there,
Generally speaking, you can apply transformations to already transformed assets in two ways. First by uploading the already transformed version as an original either as a separate asset or by using incoming transformations. Second, by separating each transformation in order with "/".
For example, we can make this shirt pink and belt blue:
https://res.cloudinary.com/generative-ai-demos/image/upload//e_gen_recolor:prompt_shirt;to-color_pink;multiple_false/e_gen_recolor:prompt_belt;to-color_blue;multiple_false/f_auto/q_auto/v1/website_assets/samples/recolor/recolor_8.jpg
As this library is community built and not officially supported by Cloudinary I would also recommend reaching out to their team.
Happy Coding!0
