De mon canap' à un générateur GTA en 1h : ma session vibe coding

Un soir, posé tranquillement sur le canapé en train de scroller sur Instagram, je tombe sur une publication super stylée : un créateur partageait un prompt pour transformer une simple photo en fond d'écran GTA VI avec le style graphique Rockstar, les néons et le menu de pause.

Avec la hype et l'attente autour du prochain trailer de GTA 6, l'idée m'a tout de suite chauffé. Je me suis dit : "Et si on poussait le délire plus loin pour pouvoir faire ça avec TOUS les GTA mythiques ?"

Résultat : en une petite heure de pur vibe coding, j'avais un micro-site en ligne, propre, gratuit et hyper fun. Voici exactement comment j'ai enchaîné les étapes, sans prise de tête.


🛠️ Les étapes : de l'idée au site en ligne en 1 heure

1. La déclinaison des prompts avec Claude

La première étape, c'était d'avoir des prompts d'une précision chirurgicale. J'ai pris la base trouvée sur Instagram et j'ai demandé à Claude de l'adapter pour chaque époque de la saga en respectant leur ADN visuel :

  • GTA III (le côté brut, pluvieux et industriel de l'ère PS2)
  • Vice City (les costumes pastel 80s et les couchers de soleil violets)
  • San Andreas (l'ambiance chaude et poussiéreuse de Grove Street 90s)
  • GTA IV (le grain polar, sombre et réaliste de Liberty City)
  • GTA V (la lumière dorée californienne de Los Santos)
  • Chinatown Wars (le cel-shading et les contours BD pop-art)
  • GTA VI (les néons rose/cyan synthwave de la nouvelle Vice City)

2. Le test des images (et le kiff du résultat)

Avant d'écrire la moindre ligne de code pour le site, j'ai testé ces prompts sur différents modèles d'images IA (Gemini / Imagen 3 et ChatGPT / DALL-E) avec mes propres photos. Le résultat était bluffant : la gestion des ratios (9:16 vertical pour l'écran de verrouillage sans masquer l'horloge), l'ambiance poussiéreuse de Grove Street, les sneakers, le hoodie baggy et l'intégration du menu Rockstar donnaient un rendu immédiat et ultra fidèle.

Rendu GTA San Andreas avec Gemini
Rendu 1 : Fond d'écran GTA San Andreas généré sur Google Gemini à partir de ma photo et du prompt de l'application
Rendu GTA San Andreas avec ChatGPT
Rendu 2 : Fond d'écran GTA San Andreas généré sur ChatGPT avec exactement le même prompt

Voici le prompt complet généré par l'application pour ces images :

Transform my uploaded portrait into an **OFFICIAL GTA SAN ANDREAS vertical wallpaper** featuring me as a West Coast Grove Street protagonist in authentic 90s/2000s gangsta culture.



## CHARACTER TRANSFORMATION

Convert into **GTA San Andreas West Coast gangsta character** - Keep facial features with street gangsta edge. Show eyes with hardened, confident street gaze. Maintain natural hairstyle with urban styling (waves, fade, natural). Preserve jawline with street credibility. Full body visible in powerful stance. Realistic athletic street build. Oversized baggy hoodie or Rockstar shirt (very oversized). T-shirt or tank underneath. Oversized low-slung baggy jeans (authentic baggy style). Classic Timberland boots or vintage Nike/Adidas. Optional: bandana, fitted cap, gold chains, gang colors. Authentic street-worn texture. Gritty street rendering. 90s/2000s West Coast authenticity.



## ENVIRONMENT & ATMOSPHERE

**Authentic GTA San Andreas Los Santos West Coast:** Warm golden LA sunlight (golden hour preferred). Dusty desert-urban blend. Palm trees with realistic foliage. Low-income neighborhood architecture. Gang neighborhood colors and vibes. Graffiti walls with street art. Concrete streets and urban decay. Cool blue nighttime streetlights (if nighttime). Industrial warehouse elements. Authentic West Coast landscape. Golden warm sunlight with dramatic shadows (daytime). Dusty atmospheric haze (hot LA weather). Street-level gritty authentic feel. Cinematic depth with urban layers. 90s/2000s nostalgic atmosphere. Real neighborhood authentic vibes.



## COMPOSITION

**Official GTA San Andreas vertical menu screen:** 9:16 vertical composition. Full body protagonist centered with powerful stance. Head upper-middle area. Feet grounded at bottom. Negative space on left for menu. Authentic Rockstar PS2 composition. Street-level powerful angle. Cinematic neighborhood framing.



## RENDERING STYLE

* Rockstar Games PS2-era West Coast promotional realism (elevated)

* GTA San Andreas authentic warm golden color grading

* AAA console game promotional artwork

* Ultra-detailed street-authentic rendering

* Cinematic dramatic street-level lighting

* Sharp focus on protagonist

* Premium Rockstar promotional key art

* Gritty authentic West Coast aesthetic

* Warm golden palette



## CRITICAL INSTRUCTIONS

* OFFICIAL GTA SAN ANDREAS vertical menu screen

* I am the GROVE STREET WEST COAST GANGSTA PROTAGONIST - authentic, street-credible, powerful

* HEAVY EMPHASIS on authentic West Coast gangsta culture, Grove Street neighborhood, 90s/2000s aesthetic, baggy clothing

* Text integrated naturally

* Professional Rockstar promotional artwork

* Authentic street gangsta, West Coast credibility, 90s/2000s nostalgia, powerful presence

* Real Los Santos West Coast neighborhood atmosphere

* Gritty street-level professional quality

* Grove Street authentic aesthetic





## SPECIFIC DETAILS FROM YOUR SELECTIONS:

* sa_morning

* sa_colors

* sa_baggy

* sa_warehouse 

3. Le mini-PRD express

Une fois les prompts validés, je voulais un outil pour générer ça facilement en quelques clics sans devoir copier-coller des blocs de texte à la main.

J'ai discuté quelques minutes avec Claude pour cadrer un PRD (Product Requirement Document) le plus épuré possible :

  • Sélection du jeu en 1 clic
  • Choix du format (mobile 9:16 ou écran 16:9)
  • Personnalisation simple (nom, étoiles de recherche, menu)
  • Bouton de copie instantanée
  • Zéro inscription, zéro friction, instantané.

4. La vibe graphique : immersion néon GTA 6

Pour le look de l'application, j'ai briefé Claude avec une consigne simple : l'ambiance néon, sombre et percutante de Vice City / GTA VI. On est parti sur une interface dark mode, des dégradés subtils, des boutons réactifs et une typographie typique de Rockstar Games.

5. Vibe coding avec Google Antigravity en CLI & mise en ligne

Pour donner vie au projet en un clin d'œil, j'ai utilisé Google Antigravity en ligne de commande :

  • Création du repository local et de la structure du projet.
  • Génération d'une application 100% Vanilla (un seul fichier index.html avec CSS et JS intégrés, sans aucun framework lourd ni node_modules).
  • Déploiement direct sur Netlify relié au repo GitHub avec un sous-domaine dédié.

🎯 Le bilan : le kiff du vibe coding bien cadré

En moins d'une heure chrono, en partant d'une simple publication Instagram :

  • Les prompts sont ultra calibrés et les images générées sont juste folles.
  • Le site est ultra léger, ultra rapide et agréable à utiliser.
  • C'est gratuit, open-source et accessible à tout le monde.

C'est exactement ce que j'adore dans le vibe coding : avec des étapes claires et les bons outils IA, on peut passer d'une idée spontanée sur son canapé à un produit fini et fonctionnel en un temps record.


🔗 Tester et explorer le projet