You can make practical and fun apps using Gemini 3 on Google AI Studio for free. In this post, you will create a fun app fast. The app lets you change a person’s hairstyle on any human picture you upload. It will work for both male and female photos. Let\u2019s get started!<\/p>\n
![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/01gemini-3-ai.jpg\" "\\"Hair")
<\/p>\n
Table of contents #<\/a><\/h2>\nPrerequisites #<\/a><\/h2>\nBefore you generate the hair style changer app on Google AI Studio using the latest Gemini model, Gemini 3, you will need the following:<\/p>\n
\n- A Google Account to access Google AI Studio<\/li>\n
- Understanding of how prompting for LLMs like Gemini works would be helpful. Reading this guide on prompt engineering<\/a> would help you get some critical pointers<\/li>\n
- Knowing how frontend apps are built with React.js would be beneficial, but not needed<\/li>\n<\/ol>\n
Given that, we can get our hands dirty with some code generated by Gemini 3 on Google AI Studio’s Build<\/code> feature next.<\/p>\nSteps to generate a hair style changer app #<\/a><\/h2>\nTo build a virtual try new hair style app using Gemin 3 on Google AI Studio, you will first need to go to the Google AI Studio app:<\/p>\n
Navigate to Google AI Studio #<\/a><\/h3>\nYou can go to the Google AI Studio app by visiting https:\/\/aistudio.google.com\/<\/a> on your favourite browser. I am using Chrome and signed into my Google account. You should see something like the below:<\/p>\n![\"Google](\"https:\/\/geshan.com.np\/images\/google-ai-studio-build\/02google-ai-studio-home.jpg\" "\\"Google")
<\/p>\n
Go to Build #<\/a><\/h3>\nThen click on Build<\/code> to build\/generate your AI virtual hair style try on app. And you will land on the build page \u2013 Start<\/code> section as follows:<\/p>\n![\"Google](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/02google-ai-studio.jpg\" "\\"Google")
<\/p>\n
To build your app, you will paste the prompt as shown in the next section.<\/p>\n
Paste the prompt on AI Studio #<\/a><\/h3>\nAfter that, you can paste the following prompt in the Describe your idea<\/code> text box:<\/p>\nPrompt:<\/p>\n
Create an app that lets users either upload their own photo or take a \npicture with the camera, then select a hairstyle. After that, a new \nimage of the user will be generated with the chosen hairstyle. \nThis app should work for both male and female users.\n\nPlease ensure there are at least 40 hairstyles, categorized into \nmale, female, and creative styles. Figure out the photo is of a \nmale or female and select the right category automatically.\nAlso, please provide the output that includes both the uploaded \nphoto and the generated photo with the chosen hairstyle. The user \nshould be able to upload an image up to 5 MB. You can show some \nhair grooming and styling tips while the chosen hairstyle \nphoto is being generated.\n<\/code><\/pre>\nWhich will look like the below:<\/p>\n
![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/03hair-style-changer-prompt-on-gais.jpg\" "\\"Hair")
<\/p>\n
After that, click the Build<\/code> button and it will start building the app.<\/p>\n\nAt the time of writing (Nov 2025) it selects the Gemini 3 Pro preview<\/code> model by default which is the latest version<\/a> of the Gemini model.<\/p>\n<\/blockquote>\nWait for the generation to finish #<\/a><\/h3>\nThe generation of the Hair Style change app will take some time to complete. You can have a look at the Code<\/code> section to see the code Gemini is generating (or vibing):<\/p>\n![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/04gais-generting-code.jpg\" "\\"Hair")
<\/p>\n
In my case, it took 123 seconds to generate the whole app and then I clicked the Preview<\/code> button to see how the app works.<\/p>\nUse the hair style changer app in preview mode #<\/a><\/h3>\nI had to click Allow<\/code> for the app to use the camera but I uploaded AI generated photos to test the app which looked like:<\/p>\n![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/05hair-style-changer-app-preview.jpg\" "\\"Hair")
<\/p>\n
I made the app go FullScreen<\/code> \u2013 the option is besides the Code<\/code> button`. After uploading the photo of a male<\/a> (AI Generated photo with Google ImageFX<\/a> for free), this is what the app showed me:<\/p>\n![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/06list-of-male-hair-styles.jpg\" "\\"Hair")
<\/p>\n
Notice, that it auto selected Male<\/code> as instructed in the prompt. You can select any style, I selected Man Bun<\/code> and then it showed me the loading screen for some seconds:<\/p>\n![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/07hair-care-tips.jpg\" "\\"Hair")
<\/p>\n
Adhering to the prompt it showed the hair care tips.<\/p>\n
\nGemini 3 is much better at doing what it is instructed to do than older version. It has a very good adherence to the provided prompt, as seen above.<\/p>\n<\/blockquote>\n
Once the image generation was done this is what I saw on the screen:<\/p>\n
![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/08spiked-to-man-bun.jpg\" "\\"Hair")
<\/p>\n
You can see the original image with a spiked hair style and the generated photo with the selected Man bun<\/code> hair style. Wasn\u2019t it fun to build and this test app \ud83d\ude42 . Next, you will try a female photo and see how the app works.<\/p>\nTry a female hairstyle upgrade #<\/a><\/h4>\nTo try out a female subject, I have generaetd a photo using Google Image FX, To try a new photo, I click the logo<\/code> of the app on the top left corner to reset<\/code> the app. Then I uploaded this<\/a> image and it took me to the Choose a Style<\/code> screen:<\/p>\n![\"List](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/09list-of-female-hair-styles.jpg\" "\\"List")
<\/p>\n
Again, adhering to the prompt it auto selected Female<\/code> styles and you can select a style like Pixie Cut<\/code>, then it will show the Loading..<\/code> screen with the hair care tips again and when it is done it will show something like the below:<\/p>\n![\"Hair](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/10hair-style-changer-working.jpg\" "\\"Hair")
<\/p>\n
You can also try some creative hairstyles with funky colors. I tried Rainbow Hair<\/code> and it was funny.<\/p>\nThere you have it your own hair style changer app generated by AI and powered by AI too. You can deploy it on Google Cloud Run and share it with your friends too. You can read on how to do that in my previous blog post<\/a>.<\/p>\nAdd another feature #<\/a><\/h3>\nYou can also add other feature like a side by side slider. Google AI Studio also recomemnds some other feature you can add to your app:<\/p>\n
![\"Google](\"https:\/\/geshan.com.np\/images\/gemini-3-ai\/11gias-suggestions.jpg\" "\\"Google")
<\/p>\n
Before you generate the hair style changer app on Google AI Studio using the latest Gemini model, Gemini 3, you will need the following:<\/p>\n
- \n
- A Google Account to access Google AI Studio<\/li>\n
- Understanding of how prompting for LLMs like Gemini works would be helpful. Reading this guide on prompt engineering<\/a> would help you get some critical pointers<\/li>\n
- Knowing how frontend apps are built with React.js would be beneficial, but not needed<\/li>\n<\/ol>\n
Given that, we can get our hands dirty with some code generated by Gemini 3 on Google AI Studio’s
Build<\/code> feature next.<\/p>\nSteps to generate a hair style changer app #<\/a><\/h2>\n
To build a virtual try new hair style app using Gemin 3 on Google AI Studio, you will first need to go to the Google AI Studio app:<\/p>\n
Navigate to Google AI Studio #<\/a><\/h3>\n
You can go to the Google AI Studio app by visiting https:\/\/aistudio.google.com\/<\/a> on your favourite browser. I am using Chrome and signed into my Google account. You should see something like the below:<\/p>\n
<\/p>\nGo to Build #<\/a><\/h3>\n
Then click on
Build<\/code> to build\/generate your AI virtual hair style try on app. And you will land on the build page \u2013Start<\/code> section as follows:<\/p>\n<\/p>\nTo build your app, you will paste the prompt as shown in the next section.<\/p>\n
Paste the prompt on AI Studio #<\/a><\/h3>\n
After that, you can paste the following prompt in the
Describe your idea<\/code> text box:<\/p>\nPrompt:<\/p>\n
Create an app that lets users either upload their own photo or take a \npicture with the camera, then select a hairstyle. After that, a new \nimage of the user will be generated with the chosen hairstyle. \nThis app should work for both male and female users.\n\nPlease ensure there are at least 40 hairstyles, categorized into \nmale, female, and creative styles. Figure out the photo is of a \nmale or female and select the right category automatically.\nAlso, please provide the output that includes both the uploaded \nphoto and the generated photo with the chosen hairstyle. The user \nshould be able to upload an image up to 5 MB. You can show some \nhair grooming and styling tips while the chosen hairstyle \nphoto is being generated.\n<\/code><\/pre>\nWhich will look like the below:<\/p>\n
<\/p>\nAfter that, click the
Build<\/code> button and it will start building the app.<\/p>\n\n
At the time of writing (Nov 2025) it selects the
Gemini 3 Pro preview<\/code> model by default which is the latest version<\/a> of the Gemini model.<\/p>\n<\/blockquote>\nWait for the generation to finish #<\/a><\/h3>\n
The generation of the Hair Style change app will take some time to complete. You can have a look at the
Code<\/code> section to see the code Gemini is generating (or vibing):<\/p>\n<\/p>\nIn my case, it took 123 seconds to generate the whole app and then I clicked the
Preview<\/code> button to see how the app works.<\/p>\nUse the hair style changer app in preview mode #<\/a><\/h3>\n
I had to click
Allow<\/code> for the app to use the camera but I uploaded AI generated photos to test the app which looked like:<\/p>\n<\/p>\nI made the app go
FullScreen<\/code> \u2013 the option is besides theCode<\/code> button`. After uploading the photo of a male<\/a> (AI Generated photo with Google ImageFX<\/a> for free), this is what the app showed me:<\/p>\n<\/p>\nNotice, that it auto selected
Male<\/code> as instructed in the prompt. You can select any style, I selectedMan Bun<\/code> and then it showed me the loading screen for some seconds:<\/p>\n<\/p>\nAdhering to the prompt it showed the hair care tips.<\/p>\n
\n
Gemini 3 is much better at doing what it is instructed to do than older version. It has a very good adherence to the provided prompt, as seen above.<\/p>\n<\/blockquote>\n
Once the image generation was done this is what I saw on the screen:<\/p>\n
<\/p>\nYou can see the original image with a spiked hair style and the generated photo with the selected
Man bun<\/code> hair style. Wasn\u2019t it fun to build and this test app \ud83d\ude42 . Next, you will try a female photo and see how the app works.<\/p>\nTry a female hairstyle upgrade #<\/a><\/h4>\n
To try out a female subject, I have generaetd a photo using Google Image FX, To try a new photo, I click the
logo<\/code> of the app on the top left corner toreset<\/code> the app. Then I uploaded this<\/a> image and it took me to theChoose a Style<\/code> screen:<\/p>\n<\/p>\nAgain, adhering to the prompt it auto selected
Female<\/code> styles and you can select a style likePixie Cut<\/code>, then it will show theLoading..<\/code> screen with the hair care tips again and when it is done it will show something like the below:<\/p>\n<\/p>\nYou can also try some creative hairstyles with funky colors. I tried
Rainbow Hair<\/code> and it was funny.<\/p>\nThere you have it your own hair style changer app generated by AI and powered by AI too. You can deploy it on Google Cloud Run and share it with your friends too. You can read on how to do that in my previous blog post<\/a>.<\/p>\n
Add another feature #<\/a><\/h3>\n
You can also add other feature like a side by side slider. Google AI Studio also recomemnds some other feature you can add to your app:<\/p>\n
<\/p>\n - Knowing how frontend apps are built with React.js would be beneficial, but not needed<\/li>\n<\/ol>\n