A generated product image can look convincing while quietly changing the product. The background looks better, but the handle is wider, the label has different lettering, or the material has become glossy. For a launch page or product listing, those details matter more than whether the scene looks impressive.
I’m Drew, the maker of the Nano Banana 2.1 web app at nanobanana-21.app. Codex wrote the project’s codebase. The workflow I want to explain here is useful beyond that app: write an image-editing request as a small specification, then review the result against it.
Model updates don’t replace a clear brief
If you’re following a Nano Banana tutorial, first check which model and interface it describes. Google’s image-generation documentation lists Nano Banana 2, Nano Banana Pro, and Nano Banana 2.1 as distinct models within the Google Gemini image family. It describes 2.1 as an update to Nano Banana 2.
That matters when you reuse an older prompt or compare screenshots from different tools. The model, reference images, output size, and application settings all provide context for a result. A version number alone doesn’t tell you whether your product’s label will survive an edit.
For a useful comparison, start by defining the job: change the setting while preserving the product details that make the image usable.
Write the acceptance criteria before the prompt
Consider a simple task: turn a photo of a ceramic mug on a desk into a wide image for a product page, with room for a heading on the right.
Separate the brief into three parts:
- Keep: the mug’s silhouette, handle shape, glaze color, and visible surface details.
- Change: the background, supporting surface, and lighting.
- Deliver: a landscape composition with empty space for website copy.
This makes “better” inspectable. An attractive image with the wrong handle fails the brief.
Here’s an example prompt to adapt to your own photo. It’s an illustrative brief, not a reported test result:
Use the uploaded mug photo as the product reference.
Create a landscape product image with the mug on the left
and uncluttered space on the right for a website heading.
Preserve the mug's silhouette, handle geometry, glaze color,
and visible surface details. Keep one mug in the scene.
Replace the desk and background with a pale stone surface
and a neutral wall. Use soft daylight from the left and
a natural contact shadow beneath the mug.
Do not add text, logos, extra cups, or decorative objects.
Use the output controls to select the aspect ratio as well. Describing a wide scene in the prompt isn’t a substitute for choosing the intended layout.
These instructions are requests, not locks. The model can still alter a detail you explicitly asked it to preserve.
Running the brief in Nano Banana 2.1
For a browser-based version of this exercise, the Nano Banana 2.1 editor provides the interface I built. Choose Image to Image, upload your reference, enter the brief, and select the output settings. Generation requires signing in; you don’t need a personal API key.
The interface supports up to 14 reference images for this model, but start with the clearest image that shows the product details you care about. Add another reference when it answers a specific question, such as what the handle looks like from the side.
Explain each reference’s role. For example:
Image 1 defines the product's appearance.
Image 2 is a reference for the background and lighting only.
That gives the model more specific guidance than uploading two images and asking it to “combine these.”
The available output sizes are 1K, 2K, and 4K, with JPG or PNG selected before generation. Check the displayed credit cost before submitting. For an initial composition check, consider 1K, then choose a larger output when your intended placement needs it.
Generating again at 4K can produce a different result; inspect that output too. More pixels don’t guarantee correct lettering or preserved geometry.
Review the result like a small visual test
Compare the reference and output side by side. Check the downloaded image at full size, then at the size it will appear on your page.
| Check | What would fail the brief? |
|---|---|
| Product identity | Changed handle, silhouette, label, or surface pattern |
| Composition | No usable room for the heading or an awkward crop |
| Scene | Extra objects, implausible shadows, or inconsistent perspective |
| Publication | Incorrect lettering or details that misrepresent the actual item |
When revising the prompt, keep the original reference and change one instruction at a time. If the mug fills too much of the frame, adjust its placement or relative size before rewriting the lighting and background as well.
This won’t make generation deterministic. It will make your next result easier to evaluate because you’ll know which part of the brief you changed.
There’s also a useful boundary between image generation and frontend work: keep website headings and buttons as HTML rather than baking them into the image. That preserves responsive text, editing, and accessibility.
If the product itself must remain pixel-exact, use masking or compositing with the original photo. Reference-based generation can help explore a scene, but it can’t promise that constraint.
Compare versions against the same job
To compare Nano Banana 2.1 with Nano Banana 2 or Nano Banana Pro, reuse the same reference, prompt, aspect ratio, and output size wherever supported. Record the model and settings alongside each download, then apply the same review checklist.
Track how many attempts it takes to get an acceptable result and what those attempts cost. One attractive sample doesn’t establish a general winner, and site credits shouldn’t be confused with Google API prices.
For a product page, the relevant question is whether the image preserves the item, fits the layout, and takes an acceptable amount of effort to produce.
With Nano Banana 2.1, a practical starting point is one clear reference, one focused change, and a short list of details that must survive. The same method transfers to other image tools. When adapting it to an API workflow, use the current Gemini image-generation guide to verify model identifiers and supported settings.
Writing disclosure: This article was drafted with AI assistance.
Top comments (0)