Vercel + TensorFlow.js

Pixel-level urban-region segmentation, directly in your browser.

A compact U-Net analyzes a satellite-style RGB tile and produces a binary mask, probability map, and visual overlay. Inference runs locally with TensorFlow.js—your uploaded image is not sent to an application server.

Launch browser demo View model details

✓ Client-side inference ✓ No model training at startup ✓ 64×64 RGB input

U-Net Dice0.999849Synthetic test set

U-Net IoU0.999698Synthetic test set

Pixel accuracy0.999992Background-dominant metric

Privacy modeLocalImage stays in browser

Interactive segmentation

Upload a tile or choose a safe synthetic example

The model resizes the image to 64×64, normalizes RGB values, predicts a probability mask, and restores the visualization to the preview size.

Select an image

PNG, JPG, or WebP · up to 12 MB

Drop a satellite-style image here or click to browse

Safe sample tiles Generated locally—no coordinates

Adjust the decision threshold

Higher values create more selective masks.

0.50

Optional ground-truth mask

Upload a binary mask to calculate Dice, IoU, precision, recall, and F1 for this image.

Choose mask

Loading TensorFlow.js and model weights…

Input imageModel-resized preview

Select an image

Predicted maskBinary output

Prediction appears here

Mask overlayTarget region in coral

Overlay appears here

Probability mapBlue → yellow confidence

Probability appears here

Inference—Browser execution time

Segmented area—Pixels above threshold

Mean target confidence—Within predicted region

Dice / IoU—Add a ground-truth mask

Engineering details

From Keras training to browser inference

The original Keras model remains available for Python and Gradio. A browser export strips optimizer state and serves only the architecture and inference weights needed by TensorFlow.js.

Preprocess

Convert to RGB, resize with bilinear interpolation, cast to float32, and normalize pixel values to [0, 1].

U-Net inference

Encoder-decoder convolution blocks and skip connections produce a 64×64 sigmoid probability map.

Postprocess

Apply the selected threshold, resize the binary mask with nearest-neighbor interpolation, and generate visual overlays.

Deploy

Vercel serves the static interface and model files globally; TensorFlow.js performs computation on the visitor’s device.

Responsible use

Educational synthetic benchmark—not operational geospatial analysis

The model was trained on procedurally generated 64×64 tiles with simple rectangular targets. Near-perfect test metrics do not demonstrate generalization to real satellite imagery. Do not use predictions as the sole basis for emergency response, environmental enforcement, land ownership, military, legal, financial, agricultural, infrastructure, or public-policy decisions. Do not upload restricted or sensitive imagery.