The latest articles on DEV Community by Saurabh Jain (@saurabhj9). https://dev.to/saurabhj9 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3495666%2Ff6b77b01-8a69-42ea-abc8-b3f9a95ed939.jpg https://dev.to/saurabhj9 en Saurabh Jain Fri, 12 Sep 2025 12:58:29 +0000 https://dev.to/saurabhj9/jigsaw-photo-cc9 https://dev.to/saurabhj9/jigsaw-photo-cc9 <p><em>This is a submission for the <a href="https://dev.to/challenges/google-ai-studio-2025-09-03">Google AI Studio Multimodal Challenge</a></em></p> <h2> What I Built </h2> <p>Jigsaw Photo converts any uploaded photo into a jigsaw puzzle. </p> <ol> <li>Upload Photo and Select your style</li> <li>Solve jigsaw puzzle</li> <li>Get your modified Stylized photo as reward to download </li> </ol> <h2> Demo </h2> <p>App Link: <a href="https://jigsaw-photo-44367070410.us-west1.run.app" rel="noopener noreferrer">https://jigsaw-photo-44367070410.us-west1.run.app</a></p> <ol> <li><p>Upload Photo<br> <a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkev9tlg1wayx6294uhyv.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkev9tlg1wayx6294uhyv.png" alt="Upload page to upload a photo from your computer"></a></p></li> <li><p>Select Style </p></li> </ol> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F01ph8gnjblumqdd65wjz.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F01ph8gnjblumqdd65wjz.png" alt="Style selector to convert your image"></a></p> <ol> <li>Solve Jigsaw</li> </ol> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fla2jwtu6xbra1xdlsa9z.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fla2jwtu6xbra1xdlsa9z.png" alt="Jigsaw Puzzle area"></a></p> <ol> <li>Get your Stylized photo as reward to download</li> </ol> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkn8wwrc5talgpc7bdxve.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkn8wwrc5talgpc7bdxve.png" alt="Final reward - download image"></a></p> <h2> How I Used Google AI Studio </h2> <p>Entire Applet was created in AI Studio. I used gemini 2.5pro to brainstorm the idea and the structure of the app and then code the app as well. I use Nonobanana to modify the image for different styles. </p> <h2> Multimodal Features </h2> <p>Instead of simple converting an image I used nanobanana to first convert the image and then gemini helped me divide the image into tiles that can be arranged as a jigsaw. This adds a fun gaming element to a simple image convertor. </p> devchallenge googleaichallenge ai gemini