I’m building an experience for an upcoming exhibition on Japanese prints that allows you to make your own print using stickers and backgrounds, see the image attached for reference.
I have two questions that I’ve been trying to wrap my head around and would love your input:
How do you constrain the movement of image assets to within a predetermined area? In this case, that would mean once users pull an image from a scroll collection on the right and drop it in the canvas area (the white square in the middle of the screen), they are not able to move it outside the canvas.
How do you limit the screenshot size/area to a certain part of the screen? I want users to be able to save their finished prints and send it to themselves over email. The built-in screenshot functionality seems like a good candidate for this but I’m not sure how to limit the screenshot to just the predetermined canvas area. Right now it just takes a screenshot of the whole screen.
Any help would be much appreciated! Also, I just started building experiences and I’m super excited to be part of the Intuiface community!
Regarding your first question, there could be handful of ways to do this and would depend on how you are populating the elements on the right side. I would suggest you reach out to us via our Support Channel and we can best help you there. We will ask you to share the experience you have created so far with xp-for-support@intuiface.com.
Regarding the second question you could have create a snapshot of a particular collection and it will only capture what is in that collection. It would look something like this:
@ramzyl, for the white square you can use the pinboard asset, that will constrain the image dropped into this to the size of the pinboard, not allowing it to move outside the canvas.
For the screenshot of the final view, you can use the steps Ryan outlined above with only the change being you take a screen shot of of only the pinboard collection.
