HomeMachine Learning & Neural NetworksCycleGAN: Cycle-Consistency Loss Live

CycleGAN: Cycle-Consistency Loss Live

Watch a toy CycleGAN train live on a 2D canvas: two tiny generator networks and two discriminators learn an unpaired mapping between an X-pattern domain and an O-pattern domain, using real backpropagation, while a cycle-consistency loss keeps F(G(x)) close to x.

Machine Learning & Neural Networks2DAdvanced60 FPS📱 Mobile-adapted⇄ 3D version
2d-ai-topic-41 ↗ Open standalone

This simulator trains a genuine, tiny CycleGAN on a 2D canvas in your browser — two generator networks (G: A→B, F: B→A) and two discriminator networks — with real backpropagation running every animation frame, mapping between a 3×3-pixel "X" toy-image domain and a 3×3-pixel "O" toy-image domain that share no paired examples. A live cycle-consistency loss term (‖F(G(a))−a‖ + ‖G(F(b))−b‖) keeps the two generators acting as approximate inverses of each other; drop its weight to zero — or use the one-click ablation toggle — and watch the reconstructed images drift away from their originals and the loss curve stop decreasing, a direct, numerically verified demonstration of the failure mode cycle-consistency was invented to prevent in unpaired image-to-image translation models like CycleGAN.

⚙ Under the hood

Train a real tiny CycleGAN live in 2D: two generator networks and two discriminators learn an unpaired mapping between an X-pattern and O-pattern toy image domain while a cycle-consistency loss keeps F(G(x)) close to x.

gancyclegangenerative-modelsunsupervised-learningneural-networksbackpropagation

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)