{"$schema":"https://ejfox.com/schema/page-twin@1.json","kind":"project","url":"https://ejfox.com/projects/flipper-generative-art","json_url":"https://ejfox.com/projects/flipper-generative-art.json","generator":"ejfox.com/json-twin@1","data":{"cacheVersion":"2026-05-13-gear-cards","html":"<!-- TODO (EJ): tonight's desk take — footage of patterns running on-device\n     (real camera or phone), shoot flipper-space-calculators in the same\n     session. -->\n<p class=\"\">I often just leave the Flipper on my desk below my monitor, and my feeling was: why not have it show me little evolving art pieces instead of just the time? What would that look and feel like? Is generative art even possible within the constraints of the Flipper's screen and processor? What does 1-bit generative art <em class=\"\">feel</em> like? How can it evolve over the course of a day?</p>\n<p class=\"\">This is the answer: a Flipper Zero app that generates animated patterns in real time on the device's <strong class=\"\">128×64 monochrome screen</strong>. It runs ten gradient families — horizontal, vertical, radial, diagonal, sine waves, interference, checkerboard, noise, spiral — and converts each to crisp 1-bit graphics with <strong class=\"\">Floyd–Steinberg dithering</strong>, evolving the parameters every second at ~30fps.</p>\n<figure role=\"figure\" aria-label=\"More real-time generative patterns\" class=\"\">\n<img src=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-5.png\" alt=\"More real-time generative patterns\" loading=\"lazy\" decoding=\"async\" srcset=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_640/projects/flipper-generative-art/gallery-5.png 640w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_960/projects/flipper-generative-art/gallery-5.png 960w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-5.png 1280w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1920/projects/flipper-generative-art/gallery-5.png 1920w\" sizes=\"(max-width: 430px) 92vw, (max-width: 768px) 85vw, 900px\" title=\"More real-time generative patterns\" width=\"1024\" height=\"512\" style=\"--splay-rot:-0.6deg;\" data-dimensions=\"1024×512\" class=\"img-full my-8 rounded-sm img-splay w-full mx-auto py-4\" crossorigin=\"anonymous\">\n<figcaption class=\"\">More real-time generative patterns</figcaption>\n</figure>\n<figure role=\"figure\" aria-label=\"Dithered radial patterns generated on the Flipper Zero\" class=\"\">\n<img src=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-1.png\" alt=\"Dithered radial patterns generated on the Flipper Zero\" loading=\"lazy\" decoding=\"async\" srcset=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_640/projects/flipper-generative-art/gallery-1.png 640w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_960/projects/flipper-generative-art/gallery-1.png 960w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-1.png 1280w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1920/projects/flipper-generative-art/gallery-1.png 1920w\" sizes=\"(max-width: 430px) 92vw, (max-width: 768px) 85vw, 900px\" title=\"Dithered radial patterns generated on the Flipper Zero\" width=\"1024\" height=\"512\" style=\"--splay-rot:0.61deg;\" data-dimensions=\"1024×512\" class=\"img-full my-8 rounded-sm img-splay w-full mx-auto py-4\" crossorigin=\"anonymous\">\n<figcaption class=\"\">Dithered radial patterns generated on the Flipper Zero</figcaption>\n</figure>\n<figure role=\"figure\" aria-label=\"Checkerboard and noise fields\" class=\"\">\n<img src=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-2.png\" alt=\"Checkerboard and noise fields\" loading=\"lazy\" decoding=\"async\" srcset=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_640/projects/flipper-generative-art/gallery-2.png 640w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_960/projects/flipper-generative-art/gallery-2.png 960w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-2.png 1280w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1920/projects/flipper-generative-art/gallery-2.png 1920w\" sizes=\"(max-width: 430px) 92vw, (max-width: 768px) 85vw, 900px\" title=\"Checkerboard and noise fields\" width=\"1024\" height=\"512\" style=\"--splay-rot:1.55deg;\" data-dimensions=\"1024×512\" class=\"img-full my-8 rounded-sm img-splay w-full mx-auto py-4\" crossorigin=\"anonymous\">\n<figcaption class=\"\">Checkerboard and noise fields</figcaption>\n</figure>\n<figure role=\"figure\" aria-label=\"Interference and sine-wave fields, 1-bit dithered\" class=\"\">\n<img src=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-3.png\" alt=\"Interference and sine-wave fields, 1-bit dithered\" loading=\"lazy\" decoding=\"async\" srcset=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_640/projects/flipper-generative-art/gallery-3.png 640w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_960/projects/flipper-generative-art/gallery-3.png 960w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-3.png 1280w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1920/projects/flipper-generative-art/gallery-3.png 1920w\" sizes=\"(max-width: 430px) 92vw, (max-width: 768px) 85vw, 900px\" title=\"Interference and sine-wave fields, 1-bit dithered\" width=\"1024\" height=\"512\" style=\"--splay-rot:1.75deg;\" data-dimensions=\"1024×512\" class=\"img-full my-8 rounded-sm img-splay w-full mx-auto py-4\" crossorigin=\"anonymous\">\n<figcaption class=\"\">Interference and sine-wave fields, 1-bit dithered</figcaption>\n</figure>\n<figure role=\"figure\" aria-label=\"Diagonal gradients and spirals\" class=\"\">\n<img src=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-4.png\" alt=\"Diagonal gradients and spirals\" loading=\"lazy\" decoding=\"async\" srcset=\"https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_640/projects/flipper-generative-art/gallery-4.png 640w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_960/projects/flipper-generative-art/gallery-4.png 960w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1280/projects/flipper-generative-art/gallery-4.png 1280w, https://res.cloudinary.com/ejf/image/upload/c_scale,f_auto,q_auto:good,w_1920/projects/flipper-generative-art/gallery-4.png 1920w\" sizes=\"(max-width: 430px) 92vw, (max-width: 768px) 85vw, 900px\" title=\"Diagonal gradients and spirals\" width=\"1024\" height=\"512\" style=\"--splay-rot:-0.6deg;\" data-dimensions=\"1024×512\" class=\"img-full my-8 rounded-sm img-splay w-full mx-auto py-4\" crossorigin=\"anonymous\">\n<figcaption class=\"\">Diagonal gradients and spirals</figcaption>\n</figure>\n<p class=\"\">Making something genuinely <em class=\"\">generative</em> look good in 1-bit on a tiny embedded display is the whole challenge — the dithering is what turns smooth math gradients into something the Flipper's screen can actually render without looking like mud.</p>","title":"Flipper Generative Art","metadata":{"title":"Flipper Generative Art","date":"2025-01-15T05:00:00.000Z","category":"Hardware","featured":true,"url":"https://github.com/ejfox/flipper-generative-art","tech":["Flipper Zero","C","Floyd–Steinberg Dithering","Embedded"],"state":"deployed","ai-involvement":"ai-assisted","tags":["flipper","hardware","device","generative","art"],"words":213,"images":5,"imageDetails":{"total":5,"cloudinary":5,"withDimensions":0},"links":5,"codeBlocks":0,"headers":{},"toc":[],"type":"post"}},"_links":{"self":"https://ejfox.com/projects/flipper-generative-art.json","html":"https://ejfox.com/projects/flipper-generative-art","index":"/projects.json"}}