This is a submission for the Hacktoberfest Open-Source AI Challenge Week 2: Side Hustle
What I Built after-flash PWA androidfirst
Apparently, we are approaching the point where it is easier to slop together an app than to find the right one in the store.
As someone who makes a living writing software, Iâm not entirely sure I should be celebrating this. Anyway, I made a drawing app.
It is called After Flash.
One drawing tool. Three brush sizes. An eraser. Two layers: drawing and background color. No fill tool, no merging vectors. You can draw frame by frame, play the animation, and export individual drawings as SVG.
There is also an AI color palette generator. Give it a theme, a mood, or a few words, and it suggests 8 or 64 colors you can use directly in your drawing.
Thatâs roughly it. I wanted to draw, so I kept the distance between opening the app and drawing something reasonably short.
Another excavation
Years ago, I used to draw in Flash with a Wacom tablet connected to a Windows PC. The hardware setup was considerably more cumbersome, but I was productive. I wasnât a particularly brilliant illustrator, although I did make a decent living as a graphic designer.
On my Android tablet, this little app brings that feeling back.
If you have read Vibe Archeologist: From Z80 Assembly to an 1859 Mudbrick House and Beyond, this probably sounds familiar. I keep digging through old experiences and finding things I want to use again.
Sometimes it is assembly. Sometimes it is a mudbrick house. This time, it is Flash.
Who would pay for it?
The plan is to keep the standalone app free, including an app-store version. The paid part would be embedding it into somebody elseâs website.
A blog platform could let authors sketch an illustration directly inside the editor and insert it into their post. A diagram, a little character, something that is easier to draw than to explain in three paragraphs.
That is the integration I would sell, with the setup and support needed to fit it into an existing website.
I havenât sold an integration yet. This is a business idea to test.
And yes, I just said making an app might become easier than finding one. Now Iâm suggesting somebody might pay me to integrate mine.
Well, they might have other things to do.
Demo
It feels great on my Android tablet, but I also drew a character in the browser on my MacBook using just the trackpad.
Then I gave that drawing to an AI image generator and asked for a small-town scene with similar characters. It reproduced the style frighteningly well. Describing the same style using only words would have been considerably harder, I think.
That was a separate experiment, not a built-in feature. But it revealed another use for this little app: quickly drawing your own visual reference for AI.
Apparently, everything is connected.
Code
How I Built It
I read an article on prog.hu about Googleâs AI app-building tools, opened Google AI Studio, and started describing the drawing experience I wanted.
The app uses React, TypeScript, and SVG. The palette generator calls Gemini 2.5 Flash. Yes, I used Flash to help bring back Flash. I didnât plan that joke.
A surprising amount of my contribution came from remembering what I liked about drawing years ago: which tools I wanted within reach, and which features I could happily leave out.
Apparently, being old enough to remember the workflow is now part of the development stack.
Eventually, I hit AI Studioâs daily development limit while trying to improve the 64-color palettes. Fair enough. There was already something I could draw with.
Why Does Open Innovation Matter?
For an embeddable tool, being able to inspect the code and adapt it to different websites matters. I would also want the AI component to be replaceable, so the drawing tool does not depend on one provider forever.
There is still a loose end for this challenge: the current palette generator uses Gemini, which is not an open-weight model. Publishing the appâs source code alone does not fulfil the open-AI requirement. That part still needs to be addressed.
Meanwhile, I have a drawing tool I enjoy using again.
The AI helped build the app and can suggest the colors. The questionable drawing skills are still entirely mine.
My Agent Session
// I am slop coding in hungarian on : https://aistudio.google.com/
|> CsinĂĄlj andoridra egy vektoros rajzolĂł programot csak a következĆ funkcionalitĂĄst tudja nyomĂĄsĂ©rzĂ©keny fekete vonal rajzolĂĄs, frame törlĂ©se, Ășj frame rajzolĂĄs, mozgĂĄs a framek között. frame mentĂ©se svg-be
|> Hogyan tudom ezt kiprĂłbĂĄlni az android tabletemen
|> Minden szöveg és felirat legyen angol, legyen egy play gomb is
|> A gombokon csak ikonk legyenek ne legyen rajtuk felirat, de legyen egy help screen is
|> A vonal hĂșzĂĄs lassĂș, Ă©s bĂĄr pontosan Ărja ki a nyomĂĄst a kis kijelzĆn a vonal nem ennek megfelelĆen vastagszik vagy vĂ©konyodik. Illetve mintha magĂĄtĂłl is szimulĂĄlnĂĄ a nyomĂĄsĂ©rzĂ©kenysĂ©get, na erre nincs szĂŒksĂ©g. A vonal vastagsĂĄga 50% esetĂ©n pont a beĂĄllĂtott legyen, Ă©s a nyomĂĄsnak megfelelĆen annĂĄl vĂ©konyabb Ă©s vastagabb.
Ne legyen a vĂĄsznon felirat hogy ide kell rajzolni.
A vĂĄszon mindĂg full screen mĂ©retƱ legyen.
PrĂłbĂĄld a vonulhĂșzĂĄs sebessĂ©gĂ©t gyorsĂtani, minden mĂĄs mĂĄsodlagos.
Elég 1 play gomb alulra
|> csinĂĄlj belĆle PWA-t
a program neve after-flash a help screenen lĂĄtszĂłdjon
legyen benne egy szĂnvĂĄlasztĂł
|> 64 szinbĆl lehessen vĂĄlasztani, Ă©s legyen egy gomb ami az aktuĂĄlis szinre vĂĄltja a vĂĄszon szinĂ©t
|> Legyeb benne radĂr,
Illetve 2 layer egy layer vĂĄltĂł gombbal
a felsĆ a draw az also a color
lehet egy frame clone gomb is.
|> A file mentĂ©sekkor after-flas-{randomString} nevet adj hogy ne legyen nĂ©v ĂŒtközĂ©s.
|> Milyen AI tudsz bekötni ami egy megadott szĂłbol Ășj szĂnpalettĂĄt generĂĄl?
|> jól hangzik, kösd be
|> Jól mƱködik a paletta vålasztó funkció.
Ăt tudod vĂĄltani a modellt Gemma-ra?
https://ai.google.dev/gemma/docs?utm_source=chatgpt.com
Mert van egy versenykiĂrĂĄs ahol szerepelhetne ez a program de ahoz open AI programnak kell benne mƱködnie
|> A mentĂ©snĂ©l lehetĆsĂ©g legyen ĂĄtlĂĄtszĂł hĂĄttĂ©rrel menteni
szed ki a mentĂ©sbĆl a playback speed-et, mert csak az aktuĂĄlis frame-et mentjĂŒk jelenleg.
A UI ki be kapcsolható legyen és a våszon teljes képen az UI alatt is mƱködjön
FrissĂtsd a leĂrĂĄst,
Ărd meg a README.md-it
|> Bocsi nem mondtam angolul töltsd ki a README.md-t
|> A zen mód lead pen ikon klikkelésével is kapcsolható legyen.
A generålt palettåt is JSON-ba lehessen menteni ennek a mentés gombja a paletta generåtor formon legyen.
A kezdĆ hĂĄttĂ©rszĂn random vilĂĄgos szĂn legyen a palettĂĄbĂłl
A kezdĆ paletta termĂ©szetesebben ossza el a vilĂĄgosközeli szineket
|> A gemma model egyenlĆre 64 szines palettĂĄk esetĂ©n mĂ©g elĂ©ggĂ© egysĂkĂș eredmĂ©nyt generĂĄl. NĂ©zz utĂĄna a 64-es szĂnpaletta generĂĄlĂĄs elmĂ©letĂ©nek.
Itt egy oldal ahol pĂ©ldĂĄul szĂ©p palettĂĄkat kĂ©szĂtenek a felhasznĂĄlĂłk
https://lospec.com/palette-list/tag/64
nem az a cĂ©l hogy ilyen minĆsĂ©gƱ palettĂĄk kĂ©szĂŒljenek, de ha lehet a modelnek egy cĂ©lzottabb promptot adni akkor az lehet sokat segĂt
// ... At this point I reached the limit
Prize Categories
- Gemmini
Slop Crime?
This topic belong to my next post if I will escape! -- Vibe Archeologist
Top comments (0)