Google Antigravity: IDE, które generuje grafiki bez wychodzenia z kodu
A wiesz, że Google Antigravity poza kodowaniem może wygenerować ci grafiki?
Jeśli kojarzysz asystentów do kodu jako „autocomplete na sterydach”, to Antigravity wchodzi w inną ligę. To IDE w stylu „agent-first”: zamiast tylko podpowiadać linijki, agent potrafi sam zaplanować robotę, wykonać ją w repo, odpalić komendy w terminalu, a potem jeszcze wejść w przeglądarce i zweryfikować efekt. I co najważniejsze - zostawia po sobie Artifacts, czyli paczkę dowodów: plan, checklisty, diffy, screenshoty albo walkthrough, żebyś mógł to szybko ocenić.
No i teraz najlepsze: w tym samym workflow agent może ogarnąć też grafiki do frontu.
Antigravity = mniej przełączania kontekstu
Klasyczny dzień frontendowca wygląda tak:
dłubiesz komponent,
potem poprawiasz CSS,
potem Figma / generator obrazków / stocki,
potem znowu kod,
potem build, przeglądarka, poprawki…
Antigravity próbuje to skleić w jedno: agent siedzi w IDE, ale ma też „ręce” do terminala i przeglądarki. W praktyce możesz mu zlecić zadanie typu: „przerób hero sekcję + dorzuć ilustrację + sprawdź RWD” i on ogarnia pełen loop, raportując wynik artefaktami.
Skąd te grafiki? Nano Banana Pro w tle
Antigravity potrafi dobrać model obrazowy Nano Banana Pro (Gemini 3 Pro Image), czyli generator/edytor obrazów od Google DeepMind. To nie jest „osobna apka”, tylko element workflow - agent może wygenerować asset i od razu wrzucić go do projektu.
W blogowych materiałach Antigravity pojawia się wprost use case „collateral generation” / assety do UI, gdzie ten model ma dowozić relewantne grafiki do projektu.
Konkretne zastosowania dla frontendu
- Assety pod UI bez wychodzenia z repo
ilustracje do onboardingów
obrazki do kart, sekcji landing page
placeholdery „production-like”, a nie losowe szumy
grafiki do empty states / error states
- Social / SEO
OG image do artykułu lub landing page
miniatury, banery, grafiki do wpisów
- „Design glue”
szybkie makiety ekranów (nawet jeśli finalnie i tak poprawiasz ręcznie)
spójny styl zestawu ilustracji (ważne przy większym projekcie)
Przykładowe prompty, które mają sens (i są „frontendowe”)
Prompt 1: ilustracja hero
Wygeneruj ilustrację do hero sekcji SaaS (temat: automatyzacja raportów). Styl: płaski, nowoczesny, bez postaci, spójny z paletą #0A84FF i #111111. Rozmiar 1600×900. Zapisz jako src/assets/hero.png i podmień w komponencie Hero.tsx.
Prompt 2: zestaw ikon/mini-assetów
Potrzebuję 6 prostych ikon (SVG) w jednym stylu: dashboard, alert, cloud, lock, chart, integration. Grubość linii 2px, zaokrąglone końcówki. Dodaj do src/assets/icons/ i zrób export barrel.
Prompt 3: OG image pod wpis
Zrób OG image 1200×630 do artykułu „Antigravity generuje grafiki w IDE”. Tło ciemne, czytelny tytuł, małe logo w rogu, styl tech. Zapisz do public/og.png i dodaj meta tagi w index.html.
Bezpieczeństwo i „nie rób sobie krzywdy”
Antigravity ma polityki uruchamiania komend i wykonywania akcji w przeglądarce (m.in. tryb, w którym agent prosi o review vs jedzie automatem). To jest fajne, ale ma też konsekwencje: im więcej autonomii, tym większe ryzyko głupiego command-fuckupu. W docach/codelabach jest wprost o politykach terminala i JS w przeglądarce oraz o allowliście domen dla browser agenta.
Moja praktyka:
Request review dla terminala, dopóki nie zaufasz workflow,
allowlista domen na dokumentacje, które odwiedza agent,
a assety generowane traktuj jak „materiał” - dalej warto je sprawdzić pod licencje/brand/zgodność wizualną.
Kiedy to faktycznie robi różnicę?
Największy zysk jest wtedy, gdy grafika jest elementem taska developerskiego:
„dodaj sekcję + obrazek + RWD + sprawdź w przeglądarce”
„zrób onboarding carousel + 5 spójnych ilustracji”
„wygeneruj OG image + podepnij meta”
Bo wtedy nie przeskakujesz między 5 narzędziami i nie gubisz kontekstu. To jest dokładnie ten „task-oriented level”, o którym Google pisze w kontekście Antigravity.
Podsumowanie
Antigravity nie jest tylko od „szybszego klepania kodu”. W praktyce chodzi o to, że agent robi pełne taski i zostawia artefakty do weryfikacji - a przy frontendzie dorzuca jeszcze brakujący element układanki: asset generation z Nano Banana Pro bez wychodzenia z IDE.
Jeśli budujesz UI i regularnie stoisz na tym, że „kod gotowy, ale brakuje grafik / OG / ikon / ilustracji” - to jest realna oszczędność czasu i przełączania kontekstu.
Chcesz opanować GitHub Copilot od podstaw?
Kurs GitHub Copilot - 5 poziomów, 15 modułów, od instalacji do własnych agentów. Pisany przez człowieka, weryfikowany z oficjalną dokumentacją VS Code.