Learn to Build with Gemini Nano-Banana (Gemini 2.5 Flash Image)

Category: AI Tutorial

Tags: AIDevelopmentGoogleImageEditingTutorial

Entities: AI StudioGemini 2.5Google CloudGoogle DeepMindJavaScriptNano BananaPatrickPillowPython

Transcript

00:00

Hi team, I'm Patrick and I work at Google DeepMind. And in this quick tutorial, I want to show you how you can start building with Gemini 2.5 flash image or better known as Nano Banana and how you can integrate this into your own apps.

So we cover prototyping in AI studio, project setup, then image

00:17

creation, image editing, working with multiple input images, and also how you can do turn-based image editing via chatting with the model. and I'll have Python and JavaScript examples for you that I also drop in the description.

So, let's jump right into it. So, the best

00:32

place to get started with Nano Banana as a developer is in Google AI Studio. This is our playground where you can experiment with all our models and then also move this into your apps later.

So, go to AI.studio and then you want to sign up with your

00:48

Google account and here you can try out all the models we have. So make sure to select nano banana here in the model picker and then you can either create images or you can also upload images and edit them.

So here I want to say restore

01:06

and colorize the image and then click on run and here we get our restored image and then we can download this. We can also keep chatting and doing multiple image editing steps.

So feel free to experiment here with nano banana. And

01:22

now is our next step. We want to bring this into our code.

To build with Nano Banana, we use the Gemini developer API and one of the official Google Chen AI SDKs. I'm using Python here, but I leave corresponding JavaScript examples in the link below.

So, we need to create an API

01:37

key. We also need to set up billing.

And then we need to install the SDK. So, let's do this.

On the left side in AI Studio, click on get API key. Then on the next page, click on create API key.

Then the first time you're doing this, it will create a Google Cloud project

01:53

for you. Here I can choose an existing one and then click on create API key.

Then this will take a few seconds. And now we have our key.

So copy this and make sure to store this somewhere securely. So I will head back to a

02:09

project folder and here I will create a env file and now call the variable Gemini API key and then equals and then paste in your key. Then head back to AI

02:28

studio. And now down here you need to set up billing.

So click here because nanobanana is not free in the API. So, it costs around 4 cents per image.

So, for $1, you can create roughly 25 images. Make sure to check the official

02:45

pricing page for up-to-date info. So, yeah, click on setup billing and then follow the steps to set up your account.

Now, let's install the SDK. So, in your project, type pip install-u to get the latest one and then Google Chen AI.

This

03:01

is the official SDK. Then we also use pillow for image manipulation and python.n to load the environment variables from this file here.

So type this and then install this. And now we're ready to use it and write some code.

Now I've created a new file

03:18

main.py and I'm using these two lines to load the environment variables with our API key. Then I've prepared some code here in an article that I will link also below and you can simply grab this and copy this.

So let's copy this and go

03:34

over this quickly together. We are importing the SDK.

We're importing pillow and we're importing bytes io. Then this is how you set up the client.

And you could hardcode the API key here like this. But a more secure way is to

03:50

remove this and then it will automatically pick up the Gemini API key if it's called like this as an environment variable. Then create your prompt.

And here we are saying create a photo realalistic image of an orange cat with green eyes sitting on a couch. And

04:06

now this is how to call nanobanana in the API. So we are calling client.mmodels.generate content.

And now make sure to use the correct model string. So right now it's called Gemini 2.5/image

04:23

preview. If you're finding this video in a couple of months, the preview for example might be uh might no longer be there.

Um to always get the correct upto-date key, you can use AI studio and when you pick the model here, you can

04:40

click on copy to clipboard. This is copying the model ID.

So now if we insert this, this is the upto-date model ID. We can also get uh rid of this prefix.

And then here we add our

04:56

prompts. And now uh we iterate over this.

So it's important or maybe interesting to note that uh nanobanana can also output text. So this here is a list of different parts.

And if we're finding text, we simply print this. And

05:13

if we find inline data, these are the bytes for the images. Then we convert this to a bytes io object and then to a pillow image object.

And then we simply save this. So this is all the code we need to run nanobanana.

So let's open

05:30

our terminal and then run python main.py. And then while this is loading, it might take a few seconds.

We can open our uh editor here, our file browser. And now here we have a cat sitting on a

05:45

green couch. Now let's learn how you can edit images with nanobanana in your code and it only takes a few code changes.

So we need a new prompt and we need to load an image. So for this I prepared a prompt here.

So let's replace the first

06:01

prompt with the new prompt using the image of the cat. Create a street level view of the cat walking in New York City and then some more details we want.

And then we need to load the image. So for this we can easily call image.open

06:17

with pillow and then we need to add this to our model call. So in the contents argument this can be a single string but it can also be a list of multiple elements and we can simply append our image here and this is all it takes.

So

06:35

now let's save this as cat 2png and then run python main.py pi again and then let's wait for this and here we get our second image cat our orange cat

06:51

walking in New York City as a street level view so yeah this is how to do image editing with nano banana now that you know how to edit images in your code it's also super easy to use multiple input images so here I have a new prompt make the girl wear this t-shirt leave

07:08

the background unchanged and then we load the first image with the girl and the second image with the t-shirt. And then we add all of this to our contents list.

And then again, we save it. So this is the t-shirt and this is the girl and this is the results.

And as you

07:25

might notice, it's really great at keeping everything else the same. So yeah, this is how to use multiple input images in your code with Nano Banana.

Another really cool use case that you can do with the model that I want to highlight is photo restoration and

07:40

colorization. So all it takes is a simple prompt restore and colorize this image and then of course you can provide additional context.

So here I'm saying that this is a photograph from 1932 and this is the original image and then we

07:56

use our simple image editing example and save this. And then this is the new image and to me this is super impressive how good it is at restoring old photos.

So try this for yourself and have some

08:11

fun with it. And now the last code example I want to show you is how you can do conversational image editing via a chat session.

So instead of these one off generations, we keep chatting with the model. And this kind of gives you the same experience that you have here

08:27

in AI studio where we can load an image, do some adjustments and then keep iterating. So for this we create a chats session via client.s chats.create and use the model ID here.

This is a

08:42

helper class in the SDK that he helps to keep track of the conversation history and then you can send messages. So call chat do send message and the first time we are also appending an image of an original cat and then we say change the

08:58

cat to a Bengal cat. Then you can display this to your user for example in the UI that you might have or save the image and then you can keep chatting.

So you can now send the second message. The cat should wear a funny party hat and so

09:14

on. And then again for example display this.

And here's an example of how this might look like. So the original cat and then the Bengal cat and then the cat with a party hat.

So yeah, also try out these chat sessions for very fast

09:29

conversational image editing in your apps. All right, this was all the code I wanted to show you.

And before we end the video, I want to give you some best practices to work with the model. So be very specific, provide context and intent.

Then of course, iterate and

09:45

refine. Use step-by-step instructions, especially for more complex tasks.

Use positive framing. For example, instead of no cars, you can say an empty deserted street and you can try to control the camera with certain terms like wide angle shot, macro shot and so

10:01

on. So more details are here in the blog post and then there is this awesome guide from my awesome colleagues.

Check this out. So here you'll find more prompting tips and more prompting examples and best practices.

The links

10:16

uh to this is in this guide. And then I also have the corresponding GitHub gist with the corresponding JavaScript code examples.

You'll find all of this in my blog post, How to Build with Nano Banana, the complete developer tutorial. The link is in the description below.

10:33

And then I hope you have some fun with the model. It's really, really cool.

And I'm looking forward to seeing what you build with it. And then I see you in the next video.

See you.