HTML5 CANVAS: understanding how AI creates images
CODE: https://www.santiago.bz/canvas/canvas_anim.html
HTML 5 CANVAS ILLUSTRATIONS EXAMPLES:
GOOGLE GEMINI: NANO BANANA
How to build with Nano Banana: Complete Developer Tutorial
Patrick Loeber for Google AI
https://dev.to/googleai/how-to-build-with-nano-banana-complete-developer-tutorial-646
https://robdewinter.gumroad.com/l/nano-banana-flux-photoshop
https://ai.google.dev/gemini-api/docs/image-generation
import { GoogleGenAI, Modality } from "@google/genai";
import * as fs from "node:fs";
async function main() {
const ai = new GoogleGenAI({});
const prompt =
"Create a picture of a nano banana dish in a fancy restaurant with a Gemini theme";
const response = await ai.models.generateContent({
model: "gemini-2.5-flash-image-preview",
contents: prompt,
});
for (const part of response.candidates[0].content.parts) {
if (part.text) {
console.log(part.text);
} else if (part.inlineData) {
const imageData = part.inlineData.data;
const buffer = Buffer.from(imageData, "base64");
fs.writeFileSync("gemini-native-image.png", buffer);
console.log("Image saved as gemini-native-image.png");
}
}
}
main();NANO BANANA is a state-of-the-art native image generation and editing model in Gemini 2.5 Flash, now available in preview through the Gemini API. Your can try the model free of charge in Google AI Studio.
You can now build interactive, multimodal applications with powerful creative control that goes far beyond simple text-to-image.
Maintain character consistency >> Preserve a subject’s appearance across multiple generated images and scenes.
Perform intelligent editing >> Enable precise, prompt-based edits like inpainting (adding/changing objects), outpainting, and targeted transformations within an image.
Compose and merge images >> Intelligently combine elements from multiple images into a single, photorealistic composite.
Leverage multimodal reasoning >> Build features that understand visual context, such as following complex instructions on a hand-drawn diagram.
DREAMINA
Adobe Firefly
Firefly Bulk: 10K images batch processed in 3 mins
https://www.theverge.com/2025/1/13/24342622/adobe-firefly-bulk-create-api-announcement-availability
PHOTOSHOP Generative AI
MAGNIFIC.AI https://magnific.ai/
The most advanced AI upscaler & enhancer. Magnific can hallucinate and reimagine as many details, guided by prompts and parameters.
NEBIUS: https://nebius.com/services/studio-text-to-image
ASSIGNMENT
5 • Take a selfie using a neutral background. You will use this selfie as the reference for your prompt. Using Firefly, you will write 5 different prompts where you will ask the AI tool to create an image of yourselves based on the selfie. This is an observation exercise where you will practice precise description of a person. the goal is to present the 5 different iterations of the process and to achieve the best AI generated image of yourselves. DO NOT CHEAT: this is all about the correct prompt method, not about the existing Avatar generators available in the market.
6 • Using Firefly and Photoshop, create a precise prompt that will produce a monster that visually represents your worst fear.
6A • using the same selfie, or another one (that you will upload as a reference), crop a segment of the face, and use the generative expand in photoshop to create a new human based on just a fragment of your face
6B • using the Neural Filters in Photoshop, explore at least 3 different filters that would allow you to change your age, colorize, apply a painting style, etc.
6C • Take a GOOD selfie (you can choose the setting and the outfit, as well as the props) to look as if you were in a photo taken in the past. Using Photoshop, turn it into B/W, and then use the Coloring Neural Filter to apply the color palette of your choice.
6D • choose a closeup selfie as a Composition Reference and using Firefly, apply at least 5 different Style References to it. Document the entire process, upload the screen grabs to Dropbox. You can use Anime, Drag, WWF, David Bowie, Kiss, Fashion, etc. I want you to play as much as you can withe the parameters in Firefly.
Export all images as JPG / 75% compression, upload the PSD files and the optimized images to Dropbox.