DEV Community: Jen Looper

Calavera Cabina: a tribute app for Día de Muertos

Jen Looper — Mon, 26 Oct 2026 21:22:25 +0000

This is a submission for the Hacktoberfest Open-Source AI Challenge Week 4: Ghost in the Machine

The booth that didn't happen

Picture this: it's spooky season, late October, and you are building a booth for a conference. People are getting creative: on the left, someone has a tarot card activity with a crystal ball and are saging your codebases against bugs. On the right, folks are handing out Halloween candy with the phrase, "You're worth a mint to us".

I wanted to build a seasonal experience that would lean into Cloudinary's new image generation tooling: people walk up, take a selfie, and leave with a generated sticker. The catch: I only have a thermal printer on hand, but what about creating something in black and white, like a tatoo? What about printing a stylized selfie that reflects an interesting seasonal image?

What about Día de Muertos? Mexico's famous holiday full of rich symbolism and imagery such as colorful, fashionable skeletons, cut paper garlands, brilliant florals, and more.

Because of some logistic snafus, the seasonal booth experience for conference didn't materialize. The app is built, however, so I wanted to share it, taking you along with me down the rabbit hole into scary stories and legends.

A colorful prototype

Why Día de Muertos

If you're on "spookytok" - TikTok's Halloween stream, you'll soon hear a beautiful song, "La Llorona" - the weeping woman. Depending on the interpretation, she is a woman who cries for her lost children or her lost love, wandering by waterways (something like the Irish Banshee), wailing. Often the song is paired with images of the "Calavera Catrina", a stylish skeleton lady (more below). Could we create a transformation of a selfie into La Llorona?

An authentic image of the Wailing Lady is more like a tragic figure than a saucy skeleton:

Me as La Llorona, not a cheerful image

I hesitated. Is it too sad an image? We want people to view themselves as taking part in a festive event, not a funeral! And moreover, for the men coming to the booth, how would we visualize them? Is there a wailing banshee equivalent?

This took me down quite a journey away from Mexico and into Venezuela, where we encounter El Silbón, "The Whistler", a lost soul carrying a bag on his back, whistling a warning of imminent doom to passersby. It's a really scary story, far too much for the unwary folks who would wander to our booth!

My long-suffering husband as El Silbon

It was time to return to the brighter aesthetic of Día de Muertos. The imagery that works best is the true Catrina or Catrin - the familiar fashionable skeleton celebrated with face painting and costumes. Catrina was popularized in the early 1900s by Mexican artist Jose Guadalupe Posada:

La Calavera Catrina, c. 1910, lithograph

She and her dandy skeleton counterpart, El Catrín, poke sly fun at the Europeanized gentry of the time, while also drawing on a the much older traditions of the Aztec queen of the underworld, Mictēcacihuātl, mixed with Catholic imagery around All Saint's Day. source

On TikTok, we have ladies dressed in their finest Catrina garb paired with the haunting Llorona song...an interestingly mixed metaphor.

It took me a little while to get the aesthetic where I wanted it: spooky, but not scary.

Now, for the prompt!

With AI, it's trivially easy to scaffold an app that will take your selfie and use Cloudinary's Image Generation tooling to generate something that would work for my little thermal printer. The trick is to get the prompt right. I experimented several times to find something that would print well, produce a recognizable portrait, and be true to the aesthetic of the Catrina:

  "Restyle the person in [1] as a Día de Muertos-inspired fine-line tattoo portrait. " +
  "Preserve their identity, facial features, hairstyle, proportions, and recognizable expression. " +
  "Use crisp black ink on a pure white background with delicate tattoo-flash linework, " +
  "clean contours, restrained stippling, strong negative space, and clear details that print well at small size. " +
  "Use dignified ceremonial clothing inspired by traditional Mexican portraiture: an elegant embroidered blouse, " +
  "dress, rebozo, lace-trimmed neckline, or formal charro-inspired garment. " +
  "Avoid modern casual clothing, business attire, exposed cleavage, costume-like clothing, or generic fantasy garments. " +
  "Keep the face human and recognizable rather than replacing it with a skull. " +
  "No color, grayscale, gradients, painterly shading, beige texture, photorealism, text, or watermark.";

Then, in this very simple Astro app, send that prompt along with the image to the Image Generation API:

body: JSON.stringify({
                prompt: stylePrompts[style as keyof typeof stylePrompts],
                reference_images: [{ source_type: 'managed_asset', asset_id: upload.asset_id }],
                model: { mode: 'auto', preference: 'quality' },
                image_size: { aspect_ratio: '3:4', resolution: '1K' },
                target: {
                    target_type: 'managed_asset',
                    public_id: `calavera-cabina/portraits/${crypto.randomUUID()}`,
                },
            }),

The use of 'mode: 'auto' asks Cloudinary to choose thea model that will work best for your prompt. Depending on your model, you might get a different result, so it's important to have a good prompt (AI can help with crafting one):

One model kept building interesting frames and using spiderweb images for some reason, so I had to rework the prompt

Pick your model

You can specify that you want to use open weight models with this system as well, including flux-2-klein-9b-edit and qwen-image-3-edit. Just change the model from 'auto' to a given model: model: { id: 'an-open-weight-model' }. Flux gives the following image, which labeled as more photorealistic (so aligns less with your prompt):

More stylized and more dramatic

or Qwen:

This took longer to draw but is arguably the nicest representation!

Building the Calavera Cabina

I can't take credit for the clever pun (thanks, Lovable!) - but the Calavera Cabina (Skeleton Camera, as opposed to the Calavera Catrina), was starting to take shape.

Home screen of the Cabina

I decided to give users a choice. Let them take a selfie and choose a style, leaning on imagery of the Catrin/Catrina, or a floral motif style, or a darker, mystical night style reflecting the Llorona mood. They all turned out beautifully!

The final result

Why Does Open Innovation Matter?

We are dealing with layers of cultural context in this app experience: the pre-Colombian, pre-Christian experience of early Central America, the Colonial era's interpretation of these images, and modern layering of cultural context to create a true Catrina. While the weight files for models like flux-2-klein-9b and qwen-image-3 are publicly downloadable, their creators (Black Forest Labs and Alibaba Qwen) do not publish the specific training datasets used to train them from scratch. Still, we can get some insight into high-level summaries of their sources, and perhaps feel a little reassured that some aspets of the deep cultural human context has been respected when building image generation tooling. World culture deserves context open to world learners.

An invitation

I want to be extremely respectful of cultural norms and local holidays, and I know I'm approaching this as an outsider. From a self-education standpoint, I was really happy that my meanderings with this app concept led me into new sources of knowledge. It's fascinating to me to find parallels between the stories of Celtic water-wanderers I grew up with and the crying lady of Mexico. But the Día de Muerto's particular aesthetic seems to stand out as a delightfully spooky, deliciously fun celebration of deep culture.

I invite you to check out the codebase and fork it to try the app yourself. You'll need an API Key and Secret alongside your Cloud Name, an upload preset for your images, and the Image Generation Add-On: https://github.com/cloudinary-devs/photo-booth. Print yourself a tatoo-style sticker! And Happy Halloween, Día de Muertos, and All Saint's Day!

The printed sticker result

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account

Shout-out to the folks I consulted with on this article: Diego from Colombia 🇨🇴 and Anthar from Mexico 🇲🇽 💕

"I think that I shall never see a poem lovely as a tree": A Fall Foliage App Build

Jen Looper — Thu, 22 Oct 2026 16:42:59 +0000

Sometimes you need to touch grass. Other times, you want to commemorate the beautiful Fall foliage that you peep outside your window and create a crowdsourced way for other folks to share their trees too! This app celebrates the second kind of day.

Local Leaf is an Astro app that ranks neighborhood tree photos by fall color. It uses Cloudinary for moderated uploads, tags, and predominant-color detection, and this post shows how to build it. The source code is on GitHub.

In the tradition of creating somewhat pointless - but highly aesthetic - software, you too can build an app to celebrate nature.

What you'll build

How to add the Cloudinary upload widget to an Astro app
How to set up an upload preset that sends photos to a moderation queue
How to store simple data as Cloudinary tags and context metadata instead of a database
How to read Cloudinary’s predominant-color data for each photo
How to turn that color data into leaderboard scores for yellow, orange, and crimson trees

Leaf Peeping Needs a Leaderboard

Everywhere in New England there are leaf-peeping forays at this time of year. People drive for hours to surround themselves in forest colors, driving to Western Massachusetts, Vermont, and New Hampshire to look at the deciduous trees as they change colors in the Fall. Depending on the summer and fall weather patterns, colors can vary dramatically from fire-engine red, to soft oranges, bright yellows, or simple browns.

Leaf peeping is a real thing, and a big tourist draw. Check out these live web cams showing realtime foliage.

Maybe leaf peeping could become a bit more competitive. What if you could rank locally-sourced trees by color, classifying them according to how close they are to a pure yellow, crimson, or orange hex color? Because Cloudinary gives you a way to quickly upload and moderate UGC (user-generated content) via its upload widget, analyzing color and gathering tags for each uploaded image, it seemed like a good way to signal that your neighborhood fall foliage is at its peak, right now, so come and peep!

Easy Moderated Uploading with a Widget

This app is built using Astro, and includes a handy upload widget, which you include by adding it to your index.astro file. This widget allows you to quickly upload batches of photos, great when you're walking and snapping pics.

    <script src="https://upload-widget.cloudinary.com/latest/global/all.js" is:inline></script>

Add a few data points in your form, and upload your photos using an upload preset that's set to send photos to moderation queues. Admins can approve the pics to keep the data clean.

function openUploadWidget(treeType, neighborhood) {
        return window.cloudinary.createUploadWidget(
        ...

      form?.addEventListener('submit', (event) => {
        event.preventDefault();
        if (!form || !submitButton || !status || !treeTypeInput || !neighborhoodInput) return;
        if (!form.reportValidity()) return;
        if (!cloudName || !uploadPreset) {
          status.textContent = 'Image uploads are not configured yet.';
          return;
        }

        uploadedCount = 0;
        failedCount = 0;
        pendingFinalizations = [];
        submitButton.disabled = true;
        submitButton.textContent = 'Opening photo picker…';
        status.textContent = '';

        const widget = openUploadWidget(treeTypeInput.value.trim(), neighborhoodInput.value.trim());
        widget.open();
      });

The upload widget looks like this:

Those photos are fed to your upload preset, a prerequisite for an app built for image uploading. Set your upload preset, which functions as a 'landing slot' for your images in your account, to support moderation:

Then you can quickly set your images to go live by approving them in the moderation workflow:

Tags as Metadata

The images are uploaded via an upload preset that dumps all images into a /foliage folder with their tags. Leveraging tags in Cloudinary allows you to bypass the creation of a custom database, for simple data - a great technique when you want to add some context to your images for simple apps.

Color Us Beautiful: Scoring Trees with Cloudinary Predominant Color Detection

Cloudinary's predominant-color detection system is meant to power e-commerce apps so that your catalogue can be represented truthfully. But we can also use it to power our custom foliage scoring algorithm.

Each photo's palette comes back from Cloudinary as a list of hex colors found in a photo.

Rubric.mjs turns Cloudinary's predominant-color data into leaderboard scores. It has four parts.

TARGETS defines the three leaderboards:

Each has a label, a display hex, and a list of Cloudinary color buckets it counts.

The serializePredominant(predominant) function in finalize-upload.ts is used at upload time, turning Cloudinary's [['red', 50], ['pink', 9.8], ...] into a compact string like red:50.0,pink:9.8, which is stored in the asset's context metadata.
The parsePredominant(value) function in rubric.mjs is used when the gallery loads, in foliage.ts. It reverses the serialization and returns [] for missing or malformed values.
The scorePredominant(predominant, targetKey) function in rubric.mjs does the scoring.

Try Local Leaf and Upload Your Own Foliage

In a short time, you've built a nature-friendly app that allows all of us to admire your local foliage. I invite you to visit https://local-leaf.netlify.app/ and upload your foliage! Can you beat the glorious sugar maple from Commonwealth Avenue in Newton, MA? Let's see!

This app was inspired both by the glorious colors outside my window in October in New England, but also by this simple poem by Joyce Kilmer from 1913:

I think that I shall never see
A poem lovely as a tree.

A tree whose hungry mouth is prest
Against the earth's sweet flowing breast;

A tree that looks at God all day,
And lifts her leafy arms to pray;

A tree that may in Summer wear
A nest of robins in her hair;

Upon whose bosom snow has lain;
Who intimately lives with rain.

Poems are made by fools like me,
But only God can make a tree.

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account

Build a Tiny Virtual Pet on Arduino in 60 Minutes 🐾

Jen Looper — Tue, 06 Oct 2026 00:47:44 +0000

What if your first hardware project wasn't another blinking LED, but a tiny pet that gets hungry, plays with you, falls asleep, and reacts to what you type?

Meet Kiku. 🌸

Kiku is the mascot and in-house pet of Her AI Studio, a community program helping the next generation of women learn and build with AI.

In this mini workshop, we're shrinking Kiku down until the entire pet can live on an Arduino Uno Q.

Full tutorial is available in the Her AI Studio curriculum

What you need:

an Arduino Uno Q
a USB cable
your laptop
Arduino App Lab
about 60 minutes

Tip! To celebrate Hacktoberfest 2026, swag packs from Major League Hacking are shipping with these Arduinos, so use this workshop for your Hack Day as an introduction to hardware hacking.

Shhh, Kiku is sleeping

By the end, you'll have a tiny Tamagotchi-style pet whose face lives on the board's LED matrix. You'll be able to feed it, play with it, and put it to sleep from your keyboard. More importantly, you'll see how a surprisingly small amount of code can produce behavior that feels alive.

What you'll learn

This project brings together several useful embedded-programming concepts:

flashing code onto physical hardware
communicating with a microcontroller over Serial
drawing graphics on an LED matrix
tracking application state
responding to user input
creating simple animations
building a tiny state machine

If you've mostly written software that stays inside your laptop, there's something especially satisfying about seeing your code suddenly appear on physical hardware.

Part 1: Make sure the board is alive

Before building a virtual pet, start with the embedded developer's version of "Hello, world!": Blink an LED.

Connect your Uno Q to your laptop over USB and open Arduino App Lab which you've downloaded. Login to your board.

Create a new app, and take a look at the scaffolded code. Open sketch.ino, and write a basic blink sketch:

void setup() {
  pinMode(LED_BUILTIN, OUTPUT);
}

void loop() {
  digitalWrite(LED_BUILTIN, LOW);
  delay(1000);

  digitalWrite(LED_BUILTIN, HIGH);
  delay(1000);
}

Press run in App Lab.

If the built-in LED turns on and off every second, it's aliiiiive!

If the board isn't detected, check your USB cable. Some USB cables provide power but don't carry data.

Part 2: Give your Arduino a way to listen

Now we need Kiku to hear us. We could add buttons or sensors (and we do, in our full workshop with our full AI Kit), but there's a much simpler interface already available: Serial communication.

The same USB connection used to upload your program can carry messages between your laptop and your Arduino while the program is running. In App Lab, it looks like this:

Start Serial communication in setup():

void setup() {
  Serial.begin(9600);
}

Then check for incoming characters:

void loop() {
  if (Serial.available() > 0) {
    char typed = Serial.read();

    if (typed == 'f') {
      // feed Kiku
    }

    if (typed == 'p') {
      // play with Kiku
    }

    if (typed == 's') {
      // sleep or wake up
    }
  }
}

Your keyboard has effectively become the controller for a physical device.

To interact with Kiku, we'll use 3 keystrokes:

f → feed
p → play
s → sleep / wake

Part 3: Give Kiku some feelings

A virtual pet needs more than commands. It needs state. Kiku tracks three simple stats:

int hunger = 3;
int joy = 6;
int energy = 8;

bool asleep = false;

We'll treat each stat as a value from 0 to 10. Now actions can change the pet by incrementing or decrementing these values. Feeding Kiku, for example, reduces hunger (but don't overfeed!):

hunger = max(0, hunger - 3);
joy = min(10, joy + 1);

Playing might make Kiku happier while consuming energy:

joy = min(10, joy + 3);
energy = max(0, energy - 2);
hunger = min(10, hunger + 1);

Make time matter

If Kiku's stats only changed when we typed something, the pet wouldn't feel particularly alive.

So we introduce time! Every few seconds, a tick() function updates Kiku's state, like this:

void tick() {
  if (asleep) {
    // regain energy
  } else {
    // lose energy
    // gradually lose joy
  }

  // gradually become hungry
}

In your code, use a short interval so changes are easy to observe (and change this later when you want your pet to chill out):

const unsigned long TICK_MS = 10000;

That's one update every ten seconds. Walk away from Kiku and come back later, and its state will definitely be different - they can get cranky when left alone!

Give the state a face

Kiku turns its internal state into facial expressions on the Uno Q's LED matrix. We can define its eyes:

enum Eyes {
  EYES_OPEN,
  EYES_CLOSED,
  EYES_HAPPY,
  EYES_PEEK
};

And mouth poses:

enum Mouth {
  MOUTH_FLAT,
  MOUTH_SMILE,
  MOUTH_FROWN,
  MOUTH_OPEN,
  MOUTH_DOT
};

Now our program can translate state into emotion:

Mouth moodMouth() {
  if (hunger >= 7 || joy <= 3)
    return MOUTH_FROWN;

  if (joy >= 7)
    return MOUTH_SMILE;

  return MOUTH_FLAT;
}

Kiku isn't actually experiencing happiness or hunger, of course, but a handful of variables and conditionals suddenly starts to look like personality.

Connect actions to behavior

Now the pieces come together. Your main loop has three jobs:

Listen for commands.
Update Kiku's state over time.
Draw the appropriate expression.

In simplified form:

void loop() {
  if (Serial.available() > 0) {
    char typed = Serial.read();

    if (typed == 'f') feed();
    if (typed == 'p') play();
    if (typed == 's') toggleSleep();
  }

  // update stats when enough time has passed

  // calculate blinking

  // redraw Kiku
}

That's the core architecture of your Kiku. Try it with your own device!

Open the Serial Monitor in App Lab and type:

Kiku eats.

Then:

Kiku plays.

And:

Kiku goes to sleep.

What's next?

Try to make some changes that alters Kiku's personality.

1. Change time

Modify TICK_MS.

2. Invent an expression

Make Kiku wink, act surprised, or act sad.

3. Add another command

Maybe:

c → clean

What did we actually build?

On the surface, we built a cute virtual pet. Underneath, we explored several concepts that appear in much larger systems:

Input handling: Serial commands become events.

State management: Variables remember what's happening between iterations of the loop.

State transitions: Actions modify that state.

Time-based behavior: The system changes even without direct input.

Rendering: Internal state becomes visible through the LED matrix.

Human-computer interaction: Animation and timing make simple logic feel expressive.

If you build your own Kiku for Hacktoberfest, we'd love to see what personality you give it.🌸

This article is presented as a gift to Hacktoberfest hackers by Her AI Studio, a community program for the next generation of women in AI.

The complete Kiku workshop, including the full Arduino sketch, exercises, knowledge checks, and additional resources, is available in the Her AI Studio curriculum.

Building an Offline Arduino UNO Q Cyberdeck That Identifies Birdsong and Draws Vintage Field Notes

Jen Looper — Wed, 30 Sep 2026 19:36:21 +0000

In this post, I walk through B.L.O.O.M. (Bridging Local Observations, Openly Mapped), an offline cyberdeck built on the Arduino UNO Q that helps naturalists capture field notes, identify birdsong with Edge Impulse, and generate vintage field sketches with Cloudinary's image generation API. It stores everything locally and syncs to a community site only when you choose.

This is a submission for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass

What you'll learn

How to wire an Arduino UNO Q cyberdeck with a USB hub, camera, mic and HDMI screen
How to run a local Gemma LLM and an audio classifier with Arduino App Lab bricks
How to retrain an Edge Impulse birdsong model with balanced data
How to sync SQLite entries to GitHub pull requests from a Netlify Function
How to generate style-matched images with Cloudinary's image_to_image API with reference images

Cyberdecks are back. The 80s sci-fi dream of a portable, hackable computer rig has been picked back up, especially by nature-loving corners of the internet that want tech that works offline, respects privacy, and looks cool doing it. The one I built for this project lives in a $10 vintage makeup train case and creates Grinnell style field notes as you tiptoe through the tulips.

This post covers the hardware-to-cloud pipeline, with the most detail on the part where Cloudinary comes in. The full build (wiring, enclosure, every step) is on Hackster.

The architecture at a glance

┌──────────── In the field (offline) ────────────┐        ┌────────────── Back online ──────────────┐
│                                                │        │                                          │
│  Mic ─► Edge Impulse birdsong model            │        │  Netlify Function                        │
│  Camera ─► photo                               │  POST  │   ├─► Cloudinary image_to_image          │
│  Keyboard/mouse ─► sketch + notes    ─► SQLite ├───────►│   │     (Nano Banana → field sketch)      │
│  Gemma LLM ─► AI note                          │        │   └─► Octokit: open PR on GitHub         │
│                                                │        │          │                               │
│  Arduino UNO Q (App Lab, Chromium kiosk)       │        │   merge ─► Astro rebuild ─► live site    │
└────────────────────────────────────────────────┘        └──────────────────────────────────────────┘

Nothing leaves the device unless you press Sync to Cloud. That was a hard requirement, as this project is affiliated as well with the nonprofit I founded, Her AI Studio, where we talk a lot about data governance, security, and privacy, working primarily with local AI on device.

Here's the full schematic:

The core of the cloud side is a single POST to Cloudinary:

{
  "prompt": "Create a field sketch illustration in the style of the reference image [1]...",
  "reference_images": [{ "source_type": "url", "url": "<your reference sketch>" }],
  "model": { "family": "nano-banana", "tier": "premium" },
  "target": { "target_type": "managed_asset", "public_id": "field-notes/<slug>-ai" }
}

The full function is below.

Hardware: the Arduino UNO Q parts list

Arduino UNO Q (4 GB)
5" HDMI screen + 6" HDMI cable
USB 5-in-1 hub
USB camera
USB microphone
Power bank + USB-A to Micro-USB cable
Bluetooth keyboard with built-in mouse pad
Vintage train case (or the enclosure you like best! This is the fun part)

The Arduino UNO Q runs everything. The 4 GB variant can run a small language model and an audio classifier fully offline, which is what makes the device useful on a forest trail with no signal...and to explore offline, local AI models on hardware!

Because it's a cyberdeck, there are peripherals, and those are all connected to the USB hub: screen, mic, camera and power go into the hub, and the hub's USB-C plug goes into the UNO Q. Pair the keyboard and mouse over Bluetooth in Debian and you get those USB ports back.

At Her AI Studio, students will get access to this AI Kit.

Running Gemma and birdsong detection on the UNO Q with App Lab

The app is built in Arduino App Lab from three "bricks", which are modular code available pre-built for the Arduino Uno Q:

Web UI for the interface with camera and sketching interface
LLM brick running Gemma, downloaded locally to the board
Audio Classification brick for birdsong

The Web UI brick helps you build a tidy interface with a little JS and HTML that runs on your local board via Arduino App Lab. This is how you write your field notes. The LLM brick creates a little space to chat with an LLM and learn more about the flora and fauna photos that you take with the build-in camera.

Side Quest: Fixing Chromium popups on Debian with a kiosk brick
On Debian, the stock Web UI brick opened Chromium popups behind other windows. It worked fine on desktop but not on the device. I fixed it with a small custom brick that waits for the local server and then launches Chromium in kiosk mode:

def build_kiosk_command(url: str):
    if system == "Linux":
        return ["chromium-browser", "--kiosk", "--noerrdialogs",
                "--disable-infobars", f"--app={url}"]

def launch_kiosk(url: str, ready_timeout: float = 15.0):
    if not wait_for_server(url, timeout=ready_timeout):
        logger.error(f"Server never became reachable at {url}")
        return None
    cmd = build_kiosk_command(url)
    logger.info(f"Launching: {' '.join(cmd)}")
    return subprocess.Popen(cmd)

The interface is presented full-screen without desktop chrome, so the screen is just the field notebook, like this:

Listening for birds

I wanted to give my cyberdeck some "ears", so I turned to a platform that works well to add local, custom-trained models to Arduino via App Lab: Edge Impulse.

I started from a birdsong classifier in the Edge Impulse community gallery. It had class imbalance and too few samples, so I:

Duplicated the project and removed unusable clips
Pulled at least 20 recordings each of Blue Jay, Mourning Dove and Northern Cardinal from xeno-canto, a birdsong database
Converted everything to WAV, labeled it, and uploaded it
Rebalanced the train/test split and retrained
Dropped the new model into the App Lab project

When your USB microphone picks up a bird singing, you tap a button, the model classifies the audio, and the result is saved into a field note. The model is public and cloneable if you want to add your local species.

Syncing: from SQLite to a pull request

Every observation is stored in a local SQLite database, but maybe you want to showcase your field notes to our public repository. When you choose to share, the device posts the entry to a Netlify Function. Photos and sketches are base64-encoded so the whole entry travels as one JSON payload:

def sync_entry(entry_id):
    with _db_lock:
        conn = sqlite3.connect(DB_PATH)
        row = conn.execute(
            "SELECT id, timestamp, photo, sketch, ai_note, locality, weather, habitat "
            "FROM entries WHERE id = ?",
            (entry_id,)
        ).fetchone()
        conn.close()

    eid, timestamp, photo, sketch, ai_note, locality, weather, habitat = row
    payload = {
        "id": eid,
        "catalog_no": catalog_number(eid),
        "timestamp": timestamp,
        "note": ai_note or "",
        "locality": locality or "",
        "weather": weather or "",
        "habitat": habitat or "",
        "photo": base64.b64encode(photo).decode("utf-8") if photo else None,
        "sketch": base64.b64encode(sketch).decode("utf-8") if sketch else None,
    }

    response = requests.post(CLOUD_SYNC_URL, json=payload, timeout=CLOUD_SYNC_TIMEOUT)

The function does not write to a database. It opens a pull request against the field-notes repo with Octokit:

const { data: pr } = await octokit.pulls.create({
  owner: OWNER,
  repo: REPO,
  title: `New field note: ${catalog_no}`,
  head: branchName,
  base: BASE_BRANCH,
  body: [
    "Submitted automatically from a Bloom device.",
    "",
    `**Locality:** ${locality || "—"}`,
    `**Weather:** ${weather || "—"}`,
    `**Habitat:** ${habitat || "—"}`,
    aiSketchPath ? "\n_AI-generated sketch included._" : null,
  ].filter((line) => line !== null).join("\n"),
  labels: ["device-submission"],
});

This process makes it easier for the community site to get human moderation: a maintainer reviews the PR, merges it, and Netlify rebuilds the Astro site. You can see the results at community-field-notes.netlify.app.

Generating AI field sketches with Cloudinary's image_to_image API
Naturalists in the Grinnell tradition paired written notes with drawings. I wanted every synced note to come with an illustration in that vintage style, even if the person who wrote it can't draw.

Before the PR is opened, the Netlify Function sends the note text to Cloudinary's image generation API using the image_to_image endpoint and the Nano Banana model. I also pass a reference image, an old-style field sketch already stored in my Cloudinary account, so every output matches the same look:

async function generateAiSketch(noteText, slug) {
  const prompt = [
    "Create a field sketch illustration in the style of the reference image [1].",
    "The sketch should depict:",
    noteText || "A natural world observation",
    "Use a vintage field journal aesthetic with earthy tones, hand-drawn quality, and scientific illustration style.",
  ].join(" ");

  const auth = Buffer.from(
    `${CLOUDINARY_API_KEY}:${CLOUDINARY_API_SECRET}`
  ).toString("base64");

  const response = await fetch(
    `https://api.cloudinary.com/v2/generate/${CLOUDINARY_CLOUD_NAME}/image_to_image`,
    {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        Authorization: `Basic ${auth}`,
      },
      body: JSON.stringify({
        prompt,
        reference_images: [
          { source_type: "url", url: REFERENCE_IMAGE_URL },
        ],
        model: { family: "nano-banana", tier: "premium" },
        target: {
          target_type: "managed_asset",
          public_id: `field-notes/${slug}-ai`,
        },
      }),
    }
  );

  // ...handle response, return the asset path for the PR
}

A few things I like about this setup:

The use of the reference image keeps the style consistent, and you can either choose the model, or keep it set to 'auto' - so that the model is chosen for you based on your use case.
The prompt describes what to draw, and the reference image sets how it should look. Swap the reference and every future note gets a new visual identity. The target_type: "managed_asset" saves the output straight into my Cloudinary media library under a predictable public_id (field-notes/-ai). I don't have to download and re-upload anything, and the image is ready for delivery to my community field notes app.
After that it's a normal Cloudinary asset, so the site can deliver it with the usual transformations: f_auto,q_auto, resizing for cards and thumbnails, and so on.
It's one fetch call. No SDK and no extra infrastructure, which suits a serverless function.

Setup tips

Keep CLOUDINARY_CLOUD_NAME, CLOUDINARY_API_KEY and CLOUDINARY_API_SECRET in Netlify environment variables. Never put them on the device.
Upload your reference sketch to Cloudinary first and use its delivery URL as REFERENCE_IMAGE_URL.
The Image Generation API has a free monthly allowance, which covers a community project like this. If you don't have an account yet, sign up for free.

The enclosure: no 3D printer needed

Instead of printing a case, I reused one (preferable for cyberdecks!): a vintage Lancôme makeup train case, costing about $10 on eBay. Here's what I did to fit everything in the case:

Cut a small hole in the side for the camera lens
Build shelves from recycled foam and fabric
Zip-tie the USB hub in place
Made a cardboard backing for the screen, with room for cables
Gave the UNO Q its own spot, with airflow in mind (foam and fabric trap heat, so watch temperatures or use an open weave like rattan - I've even used a sushi rolling mat for this type of shelf)

The tall case also leaves room for a magnifier, pressed flowers, a small watercolor set, or a leaf guide.

the author enjoying a Fall day of field notes

Go touch grass: using B.L.O.O.M. in the field

Power it on, head outside, and record what you find: birdsong, photos, sketches, questions for the LLM, locality, weather and habitat. When you're back on Wi-Fi, press sync to send the note to GitHub, get a Cloudinary-generated sketch, and add it to a shared natural-history record.

Discover new fauna

Resources

📖 Full build on Hackster: B.L.O.O.M.: A Community Cyberdeck for your Field Notes

💻 Device code:

Her-AI-Studio / BLOOM-code

This is the codebase for use in Arduino App Lab, for the Arduino Uno Q in a cyberdeck

B.L.O.O.M — an offline field journal

Bridging Local Observations, Openly Mapped

B.L.O.O.M turns an Arduino® UNO Q into a self-powered, offline field-journal cyberdeck: point it at a plant, an animal, or anything worth noticing on a hike, capture a photo, sketch on top of it, and talk through what you're observing with a fully local AI model. Every entry — photo, sketch, and note — is saved to the board itself and stays there unless you deliberately choose to sync it to a companion website. No connectivity is required to use it in the field.

Built for Her AI Studio's curriculum and submitted for hackathons including the Invent the Future with Arduino UNO Q and App Lab contest, Best Social Impact category — the pitch is a countermeasure to phone-and-camera culture: a single-purpose device that makes you stop, point, and wait for a note instead of snapping and swiping past.

…

View on GitHub

🌐 Community web app (Astro + Netlify)

Her-AI-Studio / field-notes

This is the core code of the offline, locally-powered cyberdeck for use when hiking

Field Notes

A digital field journal — a collection of natural history observations, surveys, and records from the field.

Built with Astro and Markdown content collections.

Project Structure

/
├── public/
│   └── favicon.svg
├── src/
│   ├── content/
│   │   ├── config.ts
│   │   └── notes/
│   │       ├── observation-of-the-red-shouldered-hawk.md
│   │       ├── botanical-survey-of-coastal-dune-ecology.md
│   │       ├── geological-observations-along-the-appalachian-trail.md
│   │       └── nocturnal-insect-survey-june.md
│   ├── layouts/
│   │   └── Layout.astro
│   ├── pages/
│   │   ├── index.astro
│   │   └── notes/
│   │       └── [...slug].astro
│   └── styles/
│       └── global.css
└── package.json

Adding a New Note

Create a new .md file in src/content/notes/ with frontmatter:

---
title: "Your Note Title"
date: 2026-07-21
location: "Location, State"
excerpt: "A brief summary of the observation."
image: "/images/your-image.jpg"
tags: ["tag1", "tag2"]
---

The note will automatically appear on the…

View on GitHub

🐦 Edge Impulse birdsong model

Prize Categories

Overall, Arduino

Why Does Open Innovation Matter?

Did you know the Arduino Uno Q runs Linux when it's a single-board computer? Without open source, we'd be locked into a proprietary sandbox. Instead, we can build in the open, and enhance the tools and models that others have generously open-sourced.

If you build a nature-loving cyberdeck like this, contribute a note to the website, or retrain the model for birds near you, share it in the comments. I'd like to see what other people's field notes look like and what you're looking at in your region. 🌿

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account

Is AI Cheugy?

Jen Looper — Mon, 21 Sep 2026 04:00:00 +0000

cheu·gy ˈchü-gē - cheugier; cheugiest. slang: uncool, unfashionable

It's happened enough times that I'm starting to call it a trend: I talk about something - anything - AI-related, and my listener screws their face into a scowl, gives me a robust side eye glare, and beats a hasty retreat. It's as if, when I mention AI, people suddenly are accosted by a bad smell...the stench of the dangerous and icky.

The AI-pilled amongst us, of course, don't really see this. So caught up in their bubble, so sure of the rightness of their course, so excited by the newness of the tech and so enthused by its promise, they are often blind to the legitimate concerns that many (many!) so-called "normies" have about AI. Anyway, they don't talk to normies.

So let's talk about it.

At Her AI Studio, for which this is an interesting inaugural blogpost, our mission is to empower high school aged girls to learn about AI in a safe space - a space for women, coached by female mentors near their age, using physical AI to build cyberdecks. By using locally-run hardware on which we can run small local AI models, we create a "walled garden" where students can safely experiment with local AI. In doing so, we can also discuss weighty topics of privacy, security, data governance, and the ethical questions surrounding AI.

A cyberdeck built with our kit, including an Arduino Uno Q board, small keyboard and monitor, microphone, camera, and USB Hub. Every student can create their own, this is just my fluffy iteration.

That doesn't make AI any less cheugy (and, increasingly, political, although that's a topic for another day). There are serious question about:

From where the training data that has fed the models is sourced
What this technology means for the environment, from training, sourcing materials for hardware, water use, pollution, land use, and more
How AI is really screwing up education (my own particular hot take) and is being actively banned in some districts
How deepfakes are ruining lives
How powerful algorithms are feeding propaganda machines and influencing political outcomes
How copyright rules and ethical concerns about plagiarism are caught up in this new technology
How skills are decaying due to being replaced by a technology that can outsource work in a flash

...and more

Headwinds

It's really important to acknowledge these important headwinds and concerns and understand them. Rather than brush anything aside, I propose to address these head on in our cohorts with full transparency and with the understanding that there are many unsavory aspects of this tech. Reactions such as this from Gen Z commenters crystalize the moment. When seeking applicants for our Youth Board, here's a reaction:

Ouch. But point well taken, and gone are the AI images from the site. We are listening.

It's a fine line we're threading, and the gulf is enormous. At one end, we have folks insisting that AI will be so powerful that in a few years it will end us all. At the other end we have folks who advocate banning it entirely.

There has to be some kind of middle ground. The companies making foundational models aren't doing us any favors by promoting the idea that somehow they have created something that will imminently cause a world cataclysm. By not sufficiently creating robust guardrails to protect users from abuse, they are creating a hostile environment for large swaths of the population.

This is precisely why we founded Her AI Studio. We want to ensure that women will have a role to play in the creation of AI, in the design of its guardrails, in the ethics around the kind of data on which it is trained. Without radical inclusion of these voices, we risk creating an "intelligence" that is stunted, that does not resemble our reality, and that cannot meet the needs of 50% of the world's population.

A new approach

We do not approach the topic from a place of weakness or fear. We are not evangelizing AI, or really any particular product. Instead, we use open models, run locally, on hardware that we own, and talk about what this means. We study how data is used, from where it's sourced, what ethical concerns are raised by both building and using AI, and more.

Because if we stay on our current path, we are going to build an AI that is not only unrecognizable, it's not going to be built to serve the best interests of a lot of people. And we find that unacceptable. Unacceptable and truly cheugy.

Visit HerAIStudio.org to learn more.

Kitchen-Sune: A Community Cookbook

Jen Looper — Sun, 16 Aug 2026 03:35:03 +0000

This is a submission for Frontend Challenge - Comfort Food Edition, Perfect Landing

What I Built

This is a blast from the past, but it's so lovely I couldn't resist submitting it for this challenge.

Kitchen-Sune is a community-driven international recipe book built in collaboration with Front-End Foxes members when we pivoted our nonprofit's efforts from in-person workshops to an international online boot camp during the pandemic. It brings together comfort food recipes from around the globe into a sleek, accessible, and user-friendly Vuepress (later refactored to Vitepress) web application where food lovers and developers alike can discover new dishes.

We were happy to host recipes from Ukraine, Kenya, Nigeria, and everywhere in between. Between Jalebi Babies, Moin-Moin, Puff Puff, and Strawberry Mush, we've got you covered for comfort food!

Demo

Live Demo: Kitchen-Sune App
GitHub Repo: https://github.com/FrontEndFoxes/kitchen-sune

Check out a preview of the recipe book (this recipe for maple syrup candy came with a video):

Journey

Revisiting and showcasing this project was a nostalgic process. Working on a community recipe project taught me the importance of building inclusive, easy-to-navigate web interfaces for diverse content as an educatioal tool. We used to use this repo as a way to train boot camp enrollees in how to use GitHub and make a PR to a repo.

What I Learned: No matter where we are in our journey, food brings us together.

What I'm Proud Of: How timeless and clean the aesthetic remains, making it easy for anyone to find a warm, cozy meal to cook or a snack to throw together (Pandemic Cookies, anyone?).

What's Next: Let's keep going! Add your recipe via a PR to the GitHub repo. And I'd love to have more photos to show off your work.

Resize One Image into 6 Social Media Formats Automatically Using Cloudinary Claimable Clouds

Jen Looper — Wed, 05 Aug 2026 21:30:34 +0000

Claimable Clouds are temporary Cloudinary environments for AI workflows that let AI Agents safely manage media with no signup required.

Imagine you're a busy designer, with many satisfied clients who depend on you to take their images and make them look great across social media. All that manual cropping and scaling, it's enough to make a body cry.

On top of that, you know that AI can give you a hand here, but managing the handoff between your AI, your own skilled hands and artistic taste and style, and your always-in-a-hurry client list is another big pain.

Enter the concept of the Cloudinary Claimable Cloud, just released today.

Take a look at the docs about these new temporary instances available now

What we built and why

Provision a disposable Cloudinary cloud with no signup, using npx @cloudinary/cloud
Auto-detect a dropped image and upload it to that temporary cloud
Auto-crop it into 6+ social formats (Instagram, LinkedIn, X, Facebook, Stories) using AI-based smart cropping
Generate a side-by-side gallery of results automatically
Hand off a Claim URL so a client can make the cloud permanent

Now, you can hand off the main pain points to AI - the resizing and reshaping of your images for the various social media platforms, while giving your clients a clean handoff via a temporary Cloud environment that they can use to create a Cloudinary account and start using these assets.

One side effect: this also nudges your whole client base toward the same toolset - Cloudinary. The bigger deal is working with an AI agent that makes your life easier but ALSO allows you to keep control of the output.

Let's walk through how this works! It all boils down to a new command:

npx @cloudinary/cloud

Type that into your terminal to kick off the process.

I built a small app around this concept to provide this AI agent with a simple harness, so let me show how that looks. The user experience is to drop any image you want resized into the /drop folder. Under the cover, there are a few more processes at work:

Provisioning: Spin Up a Temporary Cloudinary Cloud

On the first run, the app spins up a disposable Cloudinary "Claimable Cloud" via npx @cloudinary/cloud with temporary credentials, so no signup is required. The generated credentials are saved temporarily in a .env file locally. This gives the tool a live upload/delivery endpoint without any manual account setup. These credentials are refreshed when you start the app: npm i && npm start.

Watch & Transform: Auto-Crop for Each Social Platform

The app watches the drop folder for new images. When a high-resolution master image lands there, it's uploaded to this temporary Cloudinary instance.

The image we want to resize

Then it's run through a set of predefined social-media format specs (Instagram Square, Portrait, Story/Reels/TikTok, LinkedIn, X/Twitter, Facebook) using dynamic transformations like c_fill,g_auto for smart auto-cropping to each platform's exact aspect ratio and dimensions, focusing on the most important element. Control these formats and transformations in the src/formats.js file:

export const FORMATS = [
  {
    key: 'instagram-square',
    label: 'Instagram Square Post',
    ratio: '1:1',
    width: 1080,
    height: 1080,
    buildTransformation: subjectFill(1080, 1080),
  },
  {
    key: 'instagram-portrait',
    label: 'Instagram Feed Portrait',
    ratio: '4:5',
    width: 1080,
    height: 1350,
    buildTransformation: subjectFill(1080, 1350),
  },
  {
    key: 'instagram-story',
    label: 'Instagram Story / Reels / TikTok',
    ratio: '9:16',
    width: 1080,
    height: 1920,
    buildTransformation: padWithBlurredBackground(1080, 1920),
  },
  ...
];

Render Results & Send to Client: Share a Claim URL

The temporary Claimable Cloud is provisioned using the temporary credentials stored in .env:

// Ensures a usable CLOUDINARY_URL is in process.env, provisioning a disposable
// cloud on demand. Returns { claimUrl } (claimUrl is undefined when a cloud
// was already configured before this run).
export function ensureCloud() {
  loadEnv();

  if (process.env.CLOUDINARY_URL) {
    return { claimUrl: process.env.CLOUDINARY_CLOUD_CLAIM_URL, provisioned: false };
  }

  console.log('No Cloudinary cloud configured yet — provisioning a disposable one (no signup needed)...');

  let raw;
  try {
    raw = execFileSync(
      'npx',
      ['-y', '@cloudinary/cloud', 'create', '--no-agent-metadata'],
      { encoding: 'utf8' },
    );
  } catch (err) {
    const combined = `${err.stdout || ''}\n${err.stderr || ''}`.trim();
    throw new Error(redact(combined) || err.message);
  }

  const values = parseKeyValues(raw);
  loadEnv();

  if (!process.env.CLOUDINARY_URL) {
    throw new Error('Cloud provisioning did not produce a CLOUDINARY_URL.');
  }

  return { claimUrl: values.CLAIM_URL, provisioned: true };
}

Generated variant URLs are written to manifest.json and rendered into an auto-generated side-by-side HTML gallery, which opens automatically. The output also includes a Claim URL, letting the disposable cloud be handed off (e.g., to a client) and made permanent at any time.

The temporary link and generated gallery of images to pick from. Note the fancy Instagram one!

Now you can pass that Claim URL right on to your client and start the process of allowing them to claim the results and start working with them.

This is an early feature, with more agent-based tools coming from Cloudinary soon. Watch for more interesting work around AI agents in the near future!

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account

Cloudinary's New Image Generation API: One API, Multiple AI Models, and Built-in Asset Management

Jen Looper — Wed, 08 Jul 2026 13:02:03 +0000

At conference booths, developers often ask whether we support image generation at Cloudinary, given our emphasis on media management. As of now, I can say "YES! yes, we do" - here's how!

Cloudinary's Image Generation API lets developers generate images from text prompts using multiple AI model families, then store the result as a managed Cloudinary asset for delivery, optimization, resizing, and transformation.

Original image copyright © REUTERS/ABC Affiliate WABC

In this tutorial, we'll use Python to call the API, generate an image, and save the final result to Cloudinary.

What you'll build

A Python script that can:

Generate an image from a text prompt
Choose a model family like flux, recraft, gpt-image, ideogram, or nano-banana
Save generated output as a managed Cloudinary asset
Print the final image URL, public ID, size, and file size

Prerequisites

First, follow the instructions on Cloudinary docs to install the image generation add-on to your account. While you're in the Cloudinary console, make note of your API key, secret and the cloud name where you want assets to be stored.

Install the Python dependency:

pip install requests

Export your Cloudinary credentials:

export CLOUDINARY_API_KEY="your-api-key"
export CLOUDINARY_API_SECRET="your-api-secret"
export CLOUDINARY_CLOUD_NAME="your-cloud-name"

Here's your script. Save it as 'generate.py'.

Generate your first AI image

Run the script with a prompt:

python3 generate.py "A medieval monk"

This image was generated with the default Flux model

The script sends a request to Cloudinary's Image Generation API:

payload = {
    "prompt": prompt,
    "model": {
        "family": model_family,
        "tier": tier
    },
    "target": {
        "target_type": "managed_asset",
        "public_id": public_id
    }
}

Then it calls the API using HTTP Basic Auth:

resp = requests.post(
    f"{IMAGE_GEN_BASE}/generate/{cloud_name}/text_to_image",
    auth=(
        os.environ["CLOUDINARY_API_KEY"],
        os.environ["CLOUDINARY_API_SECRET"]
    ),
    json=payload,
    timeout=90,
)

Choose an AI image model

This is the fun part. You can pick the image generation model that best suits your use case. For example, I find that nano-banana works well with images that include text.

You can switch model families without changing the rest of your application code:

python3 generate.py \
  "A futuristic Tokyo skyline at sunset" \
  --model flux \
  --tier premium

Supported model families include:

flux
gpt-image
ideogram
recraft
nano-banana

This was the same prompt, done with Ideogram model

That makes it easier to test different visual styles while keeping one integration path.

Save generated images as Cloudinary assets

The important part of the request is this:

"target": {
    "target_type": "managed_asset",
    "public_id": public_id
}

This tells Cloudinary to save the generated image as a managed asset on your account, instead of returning only a temporary output.

After generation, the script prints something like:

Image ready!
Public ID: generated/fox-hiking
URL: https://res.cloudinary.com/...
Size: 1024×1024 px
File size: 840 KB

Once the image is in Cloudinary, you can resize it, optimize it, crop it, transform it, and deliver it through Cloudinary's CDN. Wicked fast and easy!

Full usage examples

Generate a new image:

python3 generate.py "Marie de France playing pool"

I love this image! Marie de France was a 12th century author of some famous french literature that I particularly like. I don't think she ever played pool, though. Also this pool table is awesomely 'AI-pilled"

Use a premium model:

python3 generate.py \
  "A cinematic product photo of a sneaker floating over water" \
  --model flux \
  --tier premium

Why this is useful

Most image generation APIs return an output.

Cloudinary's Image Generation API returns an output that can immediately become part of your media pipeline.

That means developers can generate an image and then use the same platform to:

Store it
Transform it
Optimize it
Resize it
Deliver it
Reuse it across applications

For apps that already manage media with Cloudinary, AI image generation becomes part of the existing workflow instead of a separate one-off process. The pipeline just got way simplified for you!

Final thoughts

This Python script is small, but it covers the core production workflow:

Authenticate with Cloudinary
Send a prompt to the Image Generation API
Choose a model family and tier
Save the result as a managed asset
Return a usable image URL

If you're building developer tools, e-commerce workflows, campaign generators, or AI-powered creative apps, this approach gives you both image generation and image delivery in the same pipeline.

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account

Magnificent Humanity, Building Cities, and a Special Announcement!

Jen Looper — Fri, 05 Jun 2026 19:37:39 +0000

I'm back from a great vacation and side-quest experience in Asia, where one can always find brilliant human interactions even with imperfect linguistic competence. For example, having a haircut at a random salon in Taipei where the little nephew of the stylist offered fashion advice on the spot, gravely shaking his head at short haircuts for ladies, and anyway why didn't I dye it purple? Or a photoshoot on a bamboo raft on the Li river in the Zhuang autonomous region, with full-on Chinese style makeup in local costume for a solid two hours in the boiling sun with a patient photog.

While I was on vacation, Pope Leo published something important. It turns out, the "Woke Pope" is participating in an ever-more-woke religious discourse straight outta the Vatican, and as a borderline agnostic Protestant, I found it incredibly empowering. His "Magnifica Humanitas" encyclical is the thought leadership core document that many of us have looked for - a work that doesn't land on either the AI-hater or the All-In-AI extreme, but, in the best devout tradition, looks to religious texts for guidance to discover narratives that can guide our steps as we try to build with AI while not wrecking the world. Let's talk about it.

The Encyclical

This document is long and wide-ranging. It's broken into five chapters; the first two discuss the Catholic Church's evolving concept of Social Doctrine, the third talks about how AI is being built and dives into the narratives surrounding this building effort, the fourth discusses concepts of human dignity and freedom within this evolving ecosystem, and the final chapter offers a critique of the current ever-more ferocious culture of war and the aggressive exercise of raw power, citing the need to "disarm" these systems to build a "civilization of love". It's a beautiful vision, and a multimedia experience; there are videos and infographics - this is a Pope who well-understands the internet and the power of imagery.

Risks vs Humane AI

I didn't have it in my 2026 Bingo card to have the Pope exhorting software engineers: "Developers ... bear a particular ethical and spiritual responsibility, for every design choice reflects a vision of humanity. Just as the creator of an artistic or literary work must consider the values it conveys, so developers are called to embed values in their projects with due seriousness: with transparency, responsibility toward affected communities and careful attention to ensuring that what is being cultivated is a genuine good."

Parables and Exemplars

One motif that stood out to me is the Pope's insistence that, as part of the magnificence of humanity, every person is of value. But how can that value be measured? Rather than valuing the human by their output, society is better served by valuing the dignity of work itself. Stemming from the crisis of work triggered by the industrial revolution, the Church's social doctrine is evolving to cover a similar crisis around ensuring that everyone is afforded the ability to contribute to the social good via their work. "The human person is an end, not a means" flies directly in the face of much of the toxic corporate culture prevailing today.

The focus on recentering human beings within this high-tech moment has led some folks to closely examine the narratives presented in the document. One thing that longstanding religious traditions do well is use stories and parables to teach underlying values. The Pope leans on the well-known story of the Tower of Babel and the less well-known story of Nehemiah's rebuilding of Jerusalem to show 'exemplars'. Rather than creating a grandiose, yet dehumanizing tower where communication breaks down, we are encouraged to look at the way Nehemiah organized the collaborative rebuilding of a city for the greater good. This is a model of building software - AI or other - that benefits the many, rather than just a few oligarchs.

Two Cities, Two Models

One interesting aspect of this encyclical is the use of inclusive language and the special attention paid to those left behind by technological advances. The Pope takes care to address "men and women of goodwill" - an improvement on similar writing of the past, and notes that "there is still a long way to go to ensure that the rights of a great many, namely women, are equally and genuinely guaranteed throughout the world." But there is little acknowledgement about the specific ways that women have backslid in recent years or what specifically we should do to ensure equity.

I'll be honest here. I'm really worried about how people who identify as women are showing up in this new world. Starting in the mid 2010s, we worked at the grass roots to build community, launch initiatives, press companies for diversity programming, and create inclusive education. Today I'm seeing women-focused grass-roots orgs shut down or sucked into a corporation completely divorced from their grass-roots origin (WWC, I'm looking at you). In today's climate of oligarchy, technocracy, bare-knuckled corporate competition, and the dominance of silicon valley in AI discourse, I'm hard pressed to name 20+ visible female leaders who are influencing how AI is being built from an engineering standpoint. We all saw that awful photo of the Trump/Xi summit, with ZERO women at the table. This image says 1000 words. It's time to muscle back in to make sure we have a seat at the table so that we can build the kind of AI reality the Pope is envisioning.

We are in fact entering a perfect storm of underrepresentation, gaps in perception, and disproportional impact of AI on women's careers. According to Forbes, Axios, and panels at Davos, growth is slow, gaps remain large, and women are especially hard-hit by AI disruption.

Women in AI engineering and research: slowly increasing but still underrepresented
Women in AI leadership: Increasing, but leadership gap remains large
Women using GenAI at work: Lower adoption than men
Women receiving recognition for AI use: Lower than men, even when usage is similar
Jobs most exposed to AI disruption: Disproportionately female-dominated occupations

So what are we going to do to close this gender gap?

A New City

Pope Leo leans on a comparison between two polar opposite models of building. But I propose that there's a third model that was described in the late Middle Ages by one of the first feminist writers in the West: Christine de Pizan, who wrote a rebuttal to the current fashionable narrative of her times, the Roman de la Rose. Rejecting this misogynistic (albeit wildly popular) book, she wrote her own vision of a new city: The City of Ladies.

Christine listens, learns, and builds

In Christine's vision, completed around 1405, the goddesses Reason, Rectitude and Justice all confer with the author to construct a new city populated by the virtuous women of history. Armed with the 'spade of intelligence' Christine sets to work to build the city, telling the stories of righteous women while building the walls, houses, and appointing a queen to rule them all.

These positive examplars of women of noble character continue the biblical tradition of providing instructive stories - and we can use this late medieval vision to provide a roadmap into something that I'm proud to launch as of today: a new nonprofit initiative that I'm calling Her AI Studio.

https://heraistudio.org

As an experienced nonprofit and educational founder (Wellesley Chinese Language School Co-Founder, Vue Vixens, Inc. Founder and CEO, Front-End Foxes School Founder and CEO, Beanpot Studio CEO) I know what it takes to launch nonprofits and keep them going through funding and mission challenges (hello COVID). So what will we build, exactly?

I'm inspired with a conversation with my daughter about the new interest in Cyber decks that's causing a renewed grass roots community to build hardware projects. I want this nonprofit organization to go global, opening cohorts for high-school aged students who identify as women mentored by college-aged students (and older) who will get girls building, fast. Staying on device, offline, and local, we will learn about protecting data, building ethically with locally-hosted models, and conserving our energy. We will focus on a four-beat cadence:

Beginners: Discover - learn about AI by discovering the women who influenced and built the field, while building your first locally powered AI app.
Intermediate: Create - build a local AI project bridging hardware and software focusing on image, text, and voice.
Advanced: Engineer - build your cyber deck with your own kit, learning to program with AI and using AI to program.
Capstone: Showcase your project in international celebrations - you're now ready to pay it forward!

What are we looking for?

Interest - do you want to mentor? would you like to join me in crafting curriculum? are you a teacher curious about the initiative, or a student who'd like to potentially join? Sign the interest form at heraistudio.org.
Funding - we can't go it alone. Each student kit is going to cost about $250 - we are looking for sponsors. Please reach out!
Expertise - I've been working with hardware for years but chatting with you helps me stay up to date. I'd love to chat and learn your perspective on building with this model.

Join our Discord: https://discord.gg/jRkR2t4UpC and let's chat.

Get in, losers, we're gonna build a nonprofit

Say It With Flowers: BouqAIs with the Tussie-Mussie Generator

Jen Looper — Sat, 09 May 2026 17:19:01 +0000

The Tussie-Mussie Generator is a web app for anyone who wants to send a meaningful floral e-card with an AI-generated "tussie mussie", a type of small nosegay. It uses the Victorian language of flowers to compose a bouquet, generates an image with Gemini, and sends it via Resend. This post covers
a Mother's Day relaunch: fixing a broken email integration and swapping the AI image model.

What changed in this relaunch

Migrated email sending from Mailgun to Resend, including a Cloudflare serverless function
Fixed DNS configuration across Porkbun, Netlify, and Resend for a custom subdomain
Replaced the previous image generator with Gemini for accurate tussie mussie generation
Refactored the UI with Astro + Vue and impeccable.style for AI-assisted critique

Have you ever wanted to build an e-card system that would allow you to send little ai-generated bouquets to your friends? No? Yes? Read on, gentle reader!

Last year, I onboarded to my new job by building this sample app that lets you use the Victorian language of flowers to compose a bouquet. An image-heavy app like this is a great candidate for hosting and optimizing via Cloudinary, so all the flower images are stored there. An image of the composed bouquet is generated by Gemini, and then sent via Resend to the recipient of your choice. The app looks like this:

and the generated e-card looks like this:

I launched this app a year ago, and it's had an interesting lifespan. I wanted to relaunch it for Mother's Day and realized there was some refactoring to do!

Here are a few of the gotchas I dealt with:

Keeping the core: The basis of this app is its dataset, which I created a while ago on Kaggle as a useful version of the Victorian "Language of Flowers", scraped from the Farmer's Almanac. Here's an example of what that looks like:

If your idea is centered around a solid dataset, you can't go wrong. Once I had the list, it took me a while to scrape images of the flowers in question and store them, optimized, on Cloudinary. But that work was done a year ago. So two things remained for the relaunch: refactoring the UI and fixing the bits that stopped working, namely the e-card generator.

Refactoring the UI

This app is built using my preferred stack, namely Astro + Vue. After a year, it was definitely time to upgrade, including fixing the tailwind integration which relied on an outdated package. Cursor made short work of that - it's one of the best uses of AI software agents.

Tip: periodically ask your AI to plan the removal of any redundant files or code while you complete refactors. There are usually vestiges that can be deleted.

I used a wildly useful AI skill to refactor my admittedly basic UI: impeccable.style. Install these skills on your machine and as you work with any AI generated UI suggestions, run /impeccable critique to reality-check your work for taste and style. I'm now using impeccable on all my UIs - it also helped me tidy my portfolio. The UI went from this:

...to the UI shown above. I like it a lot.

Fixing the E-Card functionality

This app caused me a horrible panic after launch last year, ruining an anniversary dinner, due to a kerfuffle with Mailgun, the original e-card sending mechanism. I was shocked by an enormous overage charge due to hacking of their systems, and I shut the entire thing down as fast as I could. To relaunch, I needed to find a new service to send email via API. Once again, Cursor to the rescue.

Enter Resend, a new email service that is much more solid than my previous choice. Let us hope that we have smooth sailing from now on! The integration includes a serverless function that you can host on Cloudflare, and works well as soon as you verify a domain. That last part took me the longest time - the gotcha is that since I bought the domain on Porkbun, I had to edit DNS records there to serve emails from a subdomain. The site is hosted on Netlify, so I had to build the subdomain there, and then the DNS verified on Resend. It's the kind of task that you don't do often, so it's easy to miss a step. But all is set now, and the emails are sending!

I also had to reconsider how to build the AI generated bouquets. I'm out of credits on the service I previously chose to generate the bouquets, and they were never quite right anyway (generated as standard bouquets rather than true tussie mussies which have a silver filigree holder). It's crazy to see how AI has evolved for this esoteric imagery over the past year - now Gemini can accurately compose a tussie mussie in its holder, given a specific prompt.

Enjoy these little bouquets! Send one to your Mom today!

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account

How to Win a Hackathon

Jen Looper — Sun, 03 May 2026 03:43:08 +0000

A sponsor’s perspective

This blogpost is written on the heels of a few amazing weekends spent knee-deep in students in Toronto and Los Angeles at Hack Canada and LA Hacks, engaging almost 2000 students in person in total. Managing a sponsor track, I have some thoughts on good ways to present yourselves when angling your project towards a sponsor prize.

For those not as familiar with how student hackathons work, they are usually comprised of an organized weekend populated by college undergrads (or older, or younger! high schoolers are increasingly getting into the mix). Over about 36 hours, students form teams and try to build software that meets a need, solves a problem, or proves a point. Some hackathons focus on themes around social good, like Hack Canada which challenged students to build something of special interest to Canada. Others have several themes and a full roster of sponsored options.

Hackathons are a bastion of the cozy web! It’s a delight to see students embracing the freedom to create weird, useless, and wildly creative apps like AeroMaxx, a way to gauge influencers’ aerodynamic-maxxing (Taylor Swift is more aerodynamic than Clavicular, did you know?). LA Hacks even had a track embracing the “most questionable” hack, won by “Yes? Or Yes!”, a hack that had literal goldfish helping make decisions and trigger AI agents to do things like break up with a girl friend, quit a job, and post to social media. Great projects. Please keep building this kind of weird stuff.

a cozy interface for roommates to manage their shopping lists: MagByte

It’s a great moment to let your creativity run wild:

Yes? Or Yes! LA Hacks most unhinged hack winner - goldfish help you make decisions and then trigger agentic workflows. Good luck!

I’ve been working the hackathon circuit as a developer advocate for at least ten years, including the mess during COVID, and the major difference nowadays between the earlier events is, unsurprisingly, the heavy use of AI tooling that both speeds up delivery, polishes the final product, and gets more software shipped, way faster. Instead of watching demo videos, judges can actively interact with an almost production-ready app, shockingly quickly.

Still, there are some tips and tricks that I’d like to share based on a few recent observations of these very fun events. Here are five things to keep in mind as you go for a win!

Who’s it for?

A lot of folks are attracted to social-good type projects, and that’s very laudable. I love them, personally, and tend to mark them highly in my judging rubric. I just want to caution hackathon participants against going after this vector with a “tech savior complex”. It’s easy to think that tech can solve all the things. And tech has made great strides on devices such as most smart phones to help people with various accessibility issues such as those who are blind, color blind, experience hearing loss, or are mobility-challenged.

But if you are going to create a project for a given sector of users, it’s critical to come at these projects with an open mindset and humility, and to work with people who have these actual challenges. Working on an app for older people? Call your Grandma or Grandpa before you start building. It’s likely they can guide you to refining your app to make it much more useful.

At Hack Canada, teams succeeded who spent time talking to local security guards as they built, to ensure that their safety-oriented hack would be useful. It’s all about finding your customer and/or user, and building backwards from that.

Power to the People

Sponsors and mentors are often available to help you all the way through the event, so make use of them! Take some time before you start working to talk to sponsors and see if they can help you start to ideate. Learn about the various sponsors and what they are looking for. Some are looking for product feedback, some are hiring, others may have another agenda.

Maybe you’ll find a product that you never heard of and will make a nice professional connection. Get your LinkedIn app ready to scan codes! This is a great moment to network.

At your service at the booth!

Skill Up

The use of AI tools has accelerated the build phase of a hackathon almost beyond recognition. When I was judging hackathons around 2016 or so, the projects produced were super shaky - often the hacker created a video at the moment that the app worked, and showed that to a judge as it was highly unlikely they could ever get it working again! This has all changed when AI has become such an important build partner.

The use of AI, however, shifts the focus of a hackathon away from the software engineering tasks that now can be offloaded to agents (with supervision, of course!). Now, you need to spend a good amount of time getting set up to make your AI as successful and efficient as you can. Many vendors have created tools to help; we at Cloudinary produced a Skills Pack for this purpose: https://github.com/cloudinary-devs/skills. Using tools such as these will effectively give official context to your app, preventing hallucinations and other wasting of time.

Sponsormaxxing and platformmaxxing

There’s a trend towards “sponsormaxxing” - LA Hacks even had a track for this. The term refers to the incorporation of as many sponsors’ platforms as possible in a given hack. I think it’s a fun challenge, but there’s a risk: if you want to win a sponsor track, you’ll likely be judged on deep integration with their platform.

In our case at Cloudinary, I’m looking for not just the use of the platform as a place to dump images and video, but a deep use of the APIs, for example optimizing and transforming images in an AI pipeline with the goal of constructing videos (as you can do with our winning hack from LA Hacks, StudyO!). Going for a sponsor track prize? Focus on deep integrations.

Going deep, however, can also be risky! There’s the risk of “platformmaxxing” - using every bell and whistle of a platform to try it out. You may need to be a bit strategic here, as you might max out your credits by piling on as many platform aspects as you can. Watch out for signs of maxing out your credits and plan accordingly.

Speaking of maxxing: AeroMaxx

Perfect the Pitch

Judges have only a few minutes per team so you need to make your best impression right away. Come ready to demo with your storytelling skills well in hand. Do some trial runs prior, and get feedback on your presentation skills. Lead with the use case, show the demo, and field questions. A good strategy for a 2-3 minute hackathon pitch is to focus on the problem you see, the solution you propose, and the impact you predict.

Hook (15 seconds): Introduce yourself, state the problem you are solving, and share a relatable scenario or story.
Demo (60-90 seconds): Walk the audience through your core feature
Tech (30 seconds): Briefly explain the most impressive technical hurdle you overcame or the tech stack that powers the hack.

Tip: Consider recording a video of your demo just in case there’s a horrible glitch, and practice getting over a glitchy demo. You can do it!

Pitching can be intense!

Winning a hackathon is a great goal, but don’t forget that being accepted into some of these selective hackathons, participating, and building a piece of software that you can be proud of is very laudable as well. Wishing you the best of luck! And maybe we will see you there.

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account

6 Free Cloudinary Courses That Teach You to Build Media-Optimized Apps

Jen Looper — Thu, 30 Apr 2026 18:33:51 +0000

The Cloud to Crowd (C2C) curriculum is Cloudinary's free 6-course learning suite for developers who want to build and ship applications with production-quality image and video handling. It covers everything from Cloudinary basics to AI-powered transformations paired with hands-on projects at every step and a free certificate when you complete each course.

Fun fact: community member Jerome Hardaway of Vets Who Code, one of our nonprofit partners in the Creators Community program, coined the "Cloud to Crowd" term!

What You'll Be Able to Build After This Curriculum

Upload, manage, and transform media assets using the Cloudinary API
Optimize images and video for performance in a Next.js app
Apply AI-powered features: background removal, generative fill, auto-tagging
Use the Python SDK to automate media workflows on the backend
Deliver video efficiently with format and quality auto-selection
Ship a real portfolio project that demonstrates all of the above
Earn a Cloudinary certificate and qualify for the Creators Community

Why We Built This

Getting images and video right in a production app is harder than most tutorials suggest. Resize, format, optimize, deliver — each step has tradeoffs, and most learning resources skip the messy middle. The C2C courses are designed to fill that gap: structured, project-driven, and free.

The 6 Free Courses

All courses are self-paced and free at https://training.cloudinary.com/pages/c2c.

Course 1: Media IQ for Developers

Enroll: https://training.cloudinary.com/learn/course/devrel-c2c-intro

The starting point for the first three courses in this suite. This course covers the core Cloudinary concepts: cloud name, API keys, the Media Library, and your first upload and transformation. No prior Cloudinary experience needed. By the end, you'll have a free account set up and understand how assets move through the Cloudinary pipeline.

You'll learn to:

Choose the right image formats for your use case, understanding when to use JPEG, PNG, WebP, AVIF, or SVG based on content type, browser support, and performance trade-offs
Apply strategic optimization techniques including responsive images with automatic format/quality selection and intelligent cropping with gravity detection

Course 2: Media IQ for Developers with Next.js

Enroll: https://training.cloudinary.com/learn/course/devrel-c2c-next

The flagship course of the C2C curriculum. You'll build a storefront application (the "CapZone" e-commerce store) using Next.js and the Cloudinary Next.js SDK, applying real-world image optimization patterns throughout.

You'll learn to:

Build an image-optimized web application using Cloudinary to upload, store, transform, and deliver images on-the-fly through URL-based transformations and CDN delivery
Apply strategic optimization techniques including responsive images with automatic format/quality selection and intelligent cropping with gravity detection
Create Next.js components that handle image uploading, display optimized images with overlays and watermarks, and serve different sizes for different contexts

The kind of component you'll be writing by the end of this course:

import { CldImage } from 'next-cloudinary';

export function ProductImage({ publicId, alt }: { publicId: string; alt: string }) {
  return (
    <CldImage
      src={publicId}
      width={600}
      height={400}
      crop="fill"
      gravity="auto"
      format="auto"
      quality="auto"
      alt={alt}
    />
  );
}

Course 3: Media IQ for Developers with AI

Enroll: https://training.cloudinary.com/learn/course/devrel-c2c-ai

Cloudinary's AI-powered transformation features are some of its most practical and useful. This course covers the tools that save the most time in real projects: background removal, generative fill, object-aware cropping, and auto-tagging. This course follows the Next.js course, building AI into the CapZone store by adding a color picker to colorize the hats.

You'll learn to:

Remove or replace backgrounds using e_background_removal
Use generative fill to extend or recompose images
Apply smart cropping with gravity: "auto" for face- and object-aware results
Auto-tag assets using AI analysis to make large libraries searchable

Course 4: Media IQ for Developers with Video

Enroll: https://training.cloudinary.com/learn/course/devrel-c2c-video

Video is a different beast from images; you manage larger files, adaptive bitrates, more delivery complexity. This course covers the Cloudinary video pipeline from upload to playback. It's the third and final part of the progressive enhancement of the CapZone e-commerce web app that you started prior. In this course you'll add a video to one of the products.

You'll learn to:

Upload and transcode video using the Cloudinary API
Apply video transformations: trim, resize, overlay, add subtitles
Build playlists and seekbars with subtitles

Course 5: Media IQ for Developers with Python

For less JavaScript-focused developers, this course covers Cloudinary's Python SDK: uploading, managing, and transforming assets from any Python environment.
Enroll: https://training.cloudinary.com/learn/course/devrel-c2c-python

You'll learn to:

Authenticate and configure the Python SDK
Upload and tag assets for organization
Build a small pet store app

Course 6: Building a Developer Portfolio with Cloudinary and Next.js

Enroll: https://training.cloudinary.com/learn/course/devrel-c2c-portfolio

The capstone course. You'll apply everything from the earlier modules: upload, transformation, optimization, and AI features — to build a complete portfolio site using React and TypeScript that demonstrates your Cloudinary skills to employers. Focus on your own skills and show them off to the world in a media-rich website.

You'll learn to:

Architect a media-rich portfolio app from scratch
Combine multiple Cloudinary transformations into a polished UI
Optimize for performance: lazy loading, responsive breakpoints, format auto-selection
Deploy a production-ready app you can link from your resume

Who's this for?

The C2C curriculum works for:

Early-career developers who want structured, project-based learning beyond "hello world" tutorials
Career changers building a portfolio they can point to during job interviews
Frontend developers who've used Cloudinary but want to understand the optimization and AI layers
Backend developers looking to add media handling to their Python projects
Bootcamp graduates who want to go from tutorial-follower to someone who can build production media pipelines

How to Enroll for Free

Go to training.cloudinary.com/pages/c2c
Create a free Cloudinary Academy account — you just need an email address
Start with Course 1 or jump to the course that matches your current skill level

All 6 courses are free. Each comes with a completion certificate. Finishing any course and passing its final assessment at 80%+ earns you a credential that qualifies you to apply to the Cloudinary Creators Community, a network with mentorship, Discord access, mini-hack events, and connections to developers worldwide.

About the Cloudinary Creators Community

The Cloudinary Creators Community (CCC) is a selective, cohort-based program for developers who've completed the C2C curriculum.

It includes:

Access to private Discord channels with Cloudinary's Developer Relations team
Monthly mini-hack challenges to apply and extend your skills
Peer review and mentorship from a global network of developers
Badges, certificates, and holopins with social media shout-outs

You can join the Discord server now and participate in community activities even while you're working through the curriculum.

Ready to start? → training.cloudinary.com/pages/c2c

This blogpost was crafted with the help of Claude. Banner image by Nano Banana.

Cloudinary ❤️ developers
Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today.
👉 Create your free account