Le pitch
Un générateur procédural de mouettes en SVG. Chaque oiseau est unique, construit à partir d’un seed — une graine numérique qui détermine chaque courbe, chaque angle, chaque proportion. Tous s’appellent Steve.
On peut en générer autant qu’on veut, les collectionner dans une grille, les inspecter, les partager. Un designer interactif permet aussi de construire son propre Steve à la main, paramètre par paramètre.
Essayer : presque.cool/council-of-steves/
Origine
Septembre 2020, plages normandes. Les mouettes sont partout, elles volent votre sandwich sans sourciller, elles vous regardent avec un aplomb inexplicable. On en a fait une private joke avec ma femme : toutes les mouettes s’appellent Steve.
L’idée de faire un générateur est venue naturellement. Pas pour faire quelque chose d’utile — juste pour donner une forme à cette absurdité de vacances.
Deux versions
Prototype jQuery (septembre 2020) : Le “Birb Generator”. Un designer interactif avec des sliders pour ajuster la géométrie d’une mouette en SVG en temps réel. Pas de seed, pas de collection — un seul oiseau à la fois, façonnable à la main. C’était un prototype exploratoire, une preuve que le concept visuel fonctionnait.
Version Preact (février 2026) : Réécriture complète. La pièce manquante est ajoutée : la génération par seed. Un nombre devient un oiseau entier — déterministe, partageable, permanent. Et avec la génération par seed, l’idée du “Council” devient possible : une grille de tous les Steves générés, qui s’accumule, qui persiste.
L’autre ajout de cette version : les identités. Chaque Steve reçoit désormais un surnom, un titre éventuel, une ville côtière française d’origine, une année d’apparition. C’est le “fluff” qui transforme un SVG en personnage.
Le Council
La collection est au cœur de la v2. On génère des Steves au hasard, ils s’accumulent dans la grille. On peut cliquer sur n’importe lequel pour voir sa fiche d’identité complète. Un seed dans l’URL suffit à partager un Steve précis — la même graine produira toujours le même oiseau, partout.
L’idée du “Council of Steves” vient de là : une assemblée de mouettes, toutes différentes, toutes Steve.
Les identités
350 KB de JSON. Des centaines de surnoms (“Docteur Steve”, “Stevouyouille”, “Solid Steve”, “Lawful Good Steve”), des dizaines de titres maritimes et fantaisistes (“Voleur de Frites”, “Grand Amiral”, “Baron de la Crécelle”), 50 villes côtières françaises pour les origines, et un titre légendaire au 1% de chance — une phrase longue comme un parchemin médiéval.
5% de chance d’obtenir un Steve célébrité (Steve Jobs, Steve Martin, Steve Wozniak…). Et un titre légendaire unique, tiré au sort à 1%.
C’est cette couche d’identité qui donne sa personnalité au projet. Deux Steves au SVG similaire auront des histoires complètement différentes.
Le designer
Le designer interactif reste de la v1 : des sliders couvrant 21 paramètres géométriques — longueur du cou, angle de la tête, courbure du dos, position du bec, couleur des ailes… La mouette se reconstruit en temps réel à chaque mouvement. On peut exporter le résultat en PNG (512px, 720px, 1024px).
En v2, le designer permet aussi de “planter” son design dans la collection — lui assigner un seed aléatoire et l’ajouter au Council.
Stack technique
- Preact + TypeScript — 3 KB de runtime, même API que React
- Zustand — State management des seeds et des préférences, persisté en localStorage
- Vite comme bundler
- Tailwind CSS — Palette bleue/blanche, dark mode chaleureux
- Hash routing maison — navigation sans lib externe (#seed pour partager un Steve)
- PWA — installable, offline
- i18n maison — français/anglais
- Compression — Brotli + Gzip sur les assets
- CSP — Content-Security-Policy avec hashes auto-générés
Évolutions
| Date | Version | Description |
|---|---|---|
| Sep 2020 | 1.0 | Prototype jQuery “Birb Generator” — designer SVG interactif, un seul oiseau à la fois |
| Fév 2026 | 2.0 | Réécriture Preact — génération par seed, collection, identités complètes, export PNG |
Bilan
Ce que j’ai appris :
- Un générateur visuel gagne en intérêt dès qu’on lui donne une mémoire. Les seeds, la collection et le partage transforment un simple designer SVG en système qui donne envie de revenir.
- Le “fluff” n’est pas un habillage secondaire. Les noms, les titres et les origines sont ce qui fait passer les Steve du statut de variations graphiques à celui de personnages.
Ce que je referais pareil :
- Garder la génération déterministe par seed. C’est la base qui rend la collection, le partage et l’accumulation possibles.
- Assumer le volume de contenu texte. Les centaines de surnoms et de titres sont une grosse partie de la personnalité du projet.
Ce que je changerais :
- Je pousserais davantage les interactions autour de la collection : tri, favoris, ou comparaison de deux Steve côte à côte. La génération existe ; il reste encore de quoi enrichir l’après.
The pitch
A procedural SVG seagull generator. Every bird is unique, built from a seed — a number that determines every curve, every angle, every proportion. They all go by Steve.
Generate as many as you want, collect them in a grid, inspect them, share them. An interactive designer also lets you craft your own Steve by hand, slider by slider.
Try it: presque.cool/council-of-steves/
Origin
September 2020, Normandy beaches. Seagulls everywhere — stealing sandwiches without hesitation, staring you down with inexplicable confidence. My wife and I turned it into a running joke: all seagulls are named Steve.
The idea for a generator followed naturally. Not to build something useful — just to give shape to this holiday absurdity.
Two versions
jQuery prototype (September 2020): The “Birb Generator.” An interactive designer with sliders to adjust a seagull’s SVG geometry in real time. No seeds, no collection — one bird at a time, shaped by hand. An exploratory prototype, a proof that the visual concept worked.
Preact version (February 2026): Complete rewrite. The missing piece was added: seed-based generation. A number becomes an entire bird — deterministic, shareable, permanent. And with seeds came the possibility of the Council: a grid of every generated Steve, accumulating, persisting.
The other addition: identities. Every Steve now gets a nickname, an optional title, a French coastal hometown, a year of appearance. The fluff that turns an SVG into a character.
The Council
The collection is at the heart of v2. Generate Steves at random, watch them pile up in the grid. Click any one to see their full identity card. A seed in the URL is all it takes to share a specific Steve — the same seed always produces the same bird, everywhere.
The name “Council of Steves” comes from exactly this: an assembly of seagulls, all different, all Steve.
The identities
350 KB of JSON. Hundreds of nicknames (“Docteur Steve,” “Stevouyouille,” “Solid Steve,” “Lawful Good Steve”), dozens of maritime and fantastical titles (“Fry Thief,” “Grand Admiral,” “Baron of the Crécelle”), 50 French coastal cities for origins, and a legendary title with a 1% drop chance — a sentence as long as a medieval scroll.
A 5% chance of rolling a celebrity Steve (Steve Jobs, Steve Martin, Steve Wozniak…). And that one legendary title, drawn at 1%.
This identity layer is what gives the project its personality. Two Steves with nearly identical shapes can have completely different stories.
The designer
The interactive designer carries over from v1: sliders covering 21 geometric parameters — neck length, head angle, back curve, beak position, wing color… The seagull rebuilds in real time with every adjustment. Export as PNG (512px, 720px, 1024px).
In v2, the designer also lets you “plant” your design into the collection — assign it a random seed and add it to the Council.
Tech stack
- Preact + TypeScript — 3 KB runtime, same API as React
- Zustand — State management for seeds and preferences, persisted in localStorage
- Vite as bundler
- Tailwind CSS — Blue/white palette, warm dark mode
- Hash routing — In-house navigation without external lib (#seed to share a Steve)
- PWA — installable, offline
- i18n custom — French/English
- Compression — Brotli + Gzip on assets
- CSP — Content-Security-Policy with auto-generated hashes
Timeline
| Date | Version | Description |
|---|---|---|
| Sep 2020 | 1.0 | jQuery prototype “Birb Generator” — interactive SVG designer, one bird at a time |
| Feb 2026 | 2.0 | Preact rewrite — seed generation, collection, full identities, PNG export |
Takeaways
What I learned:
- A visual generator becomes much more compelling once it has memory. Seeds, collection, and sharing turn a simple SVG designer into a system you want to come back to.
- The fluff is not secondary dressing. Names, titles, and hometowns are what turn the Steves from graphic variations into characters.
What I’d do the same:
- Keep deterministic seed-based generation. It is the foundation that makes collection, sharing, and accumulation possible.
- Keep the large text corpus. The hundreds of nicknames and titles are a big part of the project’s personality.
What I’d change:
- I’d push the collection layer further with sorting, favorites, or side-by-side comparison between two Steves. The generation part is there; the post-generation experience could still grow.