# „Google Stitch“ + „Claude Code“: svetainių dizainas be „AI išvaizdos“

> Visas rankinis Google Stitch ir Claude Code kelias: eksportuoti HTML/CSS, iš vietinių failų surinkti DESIGN.md, sukurti ir patikrinti puslapį, apeinant neišspręstą MCP autentifikavimo žingsnį.

Source: https://ailoot.ai/blog/lt/google-stitch-claude-code-design/
Canonical: https://ailoot.ai/blog/lt/google-stitch-claude-code-design/
Language: lt
Publisher: Ailoot (https://ailoot.ai/)
Translation: guide-106
Revision: sha256-85927211f6999e09811529f061e7b4eb6cb6943e356ee365359eac9fd7853a42


<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

„Claude Code“ puikiai rašo logiką, tačiau jo dizainas iškart jį išduoda: tamsus fonas, violetinis gradientas, „Inter“ šriftas, trys vienodi blokai. Google Stitch pagal tekstinį aprašymą sugeneruoja dizainą. Jo HTML/CSS eksportą Claude Code naudoja tikriems spalvų ir tipografijos žetonams surinkti į DESIGN.md bei puslapiui sukurti. Čia žingsnis po žingsnio parodau visą darbo eigą ir tai, kur ji stringa.

</div>

Papildomų instrukcijų, kaip dirbti su „Ailoot“, rasite [dokumentacijoje](https://ailoot.ai/docs/).

## Kodėl svetainės, sukurtos naudojant „Claude Code“, atrodo kaip „AI slop“?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

Neturėdamas dizaino sistemos, „Claude Code“ sukuria vidutiniškai atrodančią sąsają: tamsų foną, violetinį akcentą, „Inter“ šriftą ir tris korteles su vienodais šešėliais. Taip yra todėl, kad modelis atkartoja dažniausią mokymo duomenyse esantį šabloną, o tie duomenys – visas internetas su „Tailwind“ ir tūkstančiais vienodų nukreipimo puslapių. Nenurodžius tikslių apribojimų, agentas pateikia visų šablonų aritmetinį vidurkį.

</div>

Aprašytu praktiniu atveju darbas su skambučių programėlės pagrindiniu puslapiu prasidėjo nuo tuščio projekto ir prašymo „Claude Code“ sukurti nukreipimo puslapį. Rezultatas buvo klasikinis: fonui panaudotas `slate-950`, akcentui – `indigo-500`, antraštė paryškinta „Inter“ šriftu, o po ja – trys vienodos kortelės su šešėliais. Toks pat išdėstymas kaip pirmojoje v0 versijoje, pirmajame „Lovable“ ir pirmojoje „ChatGPT“ sugeneruotoje versijoje. Penkis kartus perrašiau užklausą, pridėjau žodžius „premium“, „ne kaip visi kiti“, „modernus“ – puslapis vis tiek atrodė kaip 2015 m. „WordPress“ tema.





Logika paprasta: nesant apribojimų, modelis apskaičiuoja statistinį to, ką matė, vidurkį. O jis matė milijoną vienodų nukreipimo puslapių, sukurtų naudojant „Bootstrap“ ir „Tailwind“. Jei norite ne vidutinio rezultato, turite nurodyti agentui konkrečius dalykus: kokias spalvas, šriftus ir tarpelius naudoti, kuriuos komponentus laikyti pagrindiniais. Modeliui žodis „gražus“ reiškia „2020 m. mediana“. Būdvardžiai rezultato nepakeis – reikia tikslių parametrų.

Šį patį skirtumą nagrinėjau vadove apie [paruoštas dizaino sistemas su „Refero“](https://ailoot.ai/blog/lt/claude-code-refero-design-md/) – ten perimate kito stilių („Apple“, „Linear“, „Stripe“) ir perduodate jį agentui. „Google Stitch“ prie temos prieina iš kitos pusės: užuot skolinęsi kito stilių, sukuriate savąjį pagal savo aprašymą.

## Kas yra „Google Stitch“ ir kuo jis naudingas?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

„Stitch“ yra nemokamas „Google Labs“ įrankis, paverčiantis tekstinį aprašymą arba vaizdą išbaigtu UI dizainu: ekranais, spalvomis, tipografija ir išdėstymu. Jis veikia naršyklėje su „Gemini“ modeliais. Pagrindinis jo privalumas dirbant su „Claude Code“ – dizainą jis pateikia kaip struktūruotus duomenis: tikslias spalvų, šriftų ir tarpelių reikšmes. Agentas jas perskaito ir atkuria kode, „nebandydamas iš akies“ nuspręsti pagal ekrano kopiją.

</div>

„Stitch“ yra „Google Labs“ eksperimentas, pristatytas „Google I/O“ 2025 m. gegužę. Užklausos lauke parašote, kaip turėtų atrodyti programėlė (arba įkeliate ekrano kopiją, eskizą lentoje ar konkurento puslapį), o „Stitch“ begalinėje drobėje sugeneruoja sąsajos ekranus. Fone naudojami „Gemini 2.5 Pro“ ir „Flash“, o 2025 m. gruodį pridėtas „Gemini 3“, skirtas labiau išbaigtiems išdėstymams.

Kas mums naudinga:

- **Vibe Design** – žodžiais apibūdinkite nuotaiką („minimalistinis ir prabangus, kaip „Stripe““) ir gaukite kelias vizualines kryptis, iš kurių galėsite pasirinkti.
- **Nuorodos** – įkelkite vaizdą iš „Dribbble“ arba „Pinterest“; „Stitch“ išlaikys jo išdėstymą ir pritaikys jūsų reikalavimus.
- **Eksportavimas** trimis formatais: į „Figma“ (su redaguojamais sluoksniais), kaip švarus HTML/CSS ir per MCP – tiesiai į agentą.

Skirtumas nuo paruoštų stilių, tokių kaip „Refero“, yra svarbus. „Refero“ – tai iš tikrų svetainių jau ištrauktų dizaino sistemų biblioteka; perimate esamą prekės ženklą. „Stitch“ nuo nulio sukuria sistemą jūsų produktui. Neturite pavyzdinio dizaino ir norite savito įvaizdžio? Rinkitės „Stitch“. Norite greitai pritaikyti gerai žinomo produkto stilių? „Refero“. Šie įrankiai skirti skirtingiems darbo etapams ir gerai papildo vienas kitą.

Pats „Claude“ taip pat turi integruotą dizaino režimą; apie jį rašiau vadove apie [„Claude Design“](https://ailoot.ai/blog/lt/claude-design-guide/). „Stitch“ skiriasi tuo, kad pateikia paruoštą sistemą išoriniame faile, kurį agentas perskaito kaskart kurdamas ką nors naujo.

## „Google Stitch“ prieinamumo reikalavimai

„Stitch“ pasiekiamas ne visose šalyse: „Google“ atstovas oficialiame forume parašė, kad paslauga prieinama 18 metų ir vyresniems naudotojams 212 šalių, o sąrašas plečiamas. Apribotuose regionuose apsilankę pamatysite tik vieną pranešimą: „Atsiprašome, „Stitch“ nepasiekiamas.“

Jums reikės „Google“ paskyros – prisijungti galite tik su ja.

## Kai Stitch MCP autorizavimas blokuoja Claude Code darbo eigą

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

„Stitch“ teikia dizainus agentams per MCP. Čia aprašyta sąranka Claude Code patyrė nuotolinio MCP adresu `https://stitch.googleapis.com/mcp` autorizavimo nesėkmę. Straipsnis nepateikia įrodyto suderinamo MCP konfigūracijos varianto, todėl visas toliau pateiktas kelias naudoja vietinį HTML/CSS eksportą.

</div>

Internete gausu nesąmonių apie MCP prijungimą, o pusė instrukcijų tiesiog neveikia. Pavyzdžiui, daugelyje vadovų (įskaitant populiarius anglų kalba) rekomenduojama įdiegti paketą `@google/stitch-mcp` naudojant komandą `npx -y @google/stitch-mcp@latest`. Tokio paketo nėra – npm grąžina `404`. Nekopijuokite šios komandos, nes tik sugaišite laiko. Dėl tos pačios priežasties rinkitės integracijas, kurių įdiegimas ir patikrinimas atliekant tikrą užduotį buvo patvirtintas.

Čia aprašytas nuotolinio MCP bandymas Claude Code pasiekė `Incompatible auth server` klaidą. Pastebėta klaida nėra veikiantis sąrankos receptas ar įrodymas, kad nepavyksta visos dabartinės konfigūracijos. Netęskite neapibrėžtu „prijunk MCP“ žingsniu: naudokite toliau pateiktą rankinį HTML/CSS eksportą, kol patikrinta tiksli suderinama konfigūracija.

„Claude Code“ veikianti konfigūracija yra vietinis Davido Easto tarpinis serveris (jis dirba „Google DevRel“ komandoje). Tarpinis serveris veikia jūsų kompiuteryje ir apeina autorizavimo problemą.

Pirmiausia sukurkite raktą. „Stitch“: spustelėkite savo avatarą → **Stitch settings** → skiltis **API key** → **Create key** → nukopijuokite jį.

Tada viena komanda pridėkite tarpinį serverį prie „Claude Code“:

bash



Įrašykite raktą į aplinkos kintamąjį (tai paprasčiausias būdas – nereikia naršyti „Google“ konsolėje ar rūpintis galiojančiais tik trumpą laiką žetonais):

```bash
export STITCH_API_KEY="your-key-from-stitch-settings"
```

Jei norite konfigūruoti rankiniu būdu, tai atrodo taip (faile `~/.claude.json` arba `.mcp.json`, esančiame projekto šakniniame kataloge):

json



Paleiskite „Claude Code“ iš naujo ir patikrinkite, ar ryšys veikia:

```bash
claude mcp list
```



Darbo eiga su „Stitch“ ir DESIGN.md – tai gryniausia konteksto inžinerijos forma: iš anksto įtraukiate tikslius žetonus į „Claude“ kontekstą, o jis kuria griežtai pagal juos ir „nebando atspėti, ką turėjau omenyje“. Visa metodika apima tris pagrindinius elementus – AI kloną, Antrąsias smegenis ir konteksto inžineriją. Šis derinys „Claude“ iš „spėliojančio asistento“ paverčia nuspėjamus rezultatus kuriančiu įrankiu.

## Kas yra DESIGN.md ir kodėl jis geresnis už ekrano kopiją?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

DESIGN.md – tai kompiuterio skaitomas Markdown failas su dizaino sistemos parametrais: šešioliktainiu formatu užrašytomis spalvomis, tipografijos skale, tarpelių vienetais ir komponentų taisyklėmis. „Claude Code“ jį perskaito kaip kontekstą ir kiekvieną elementą kuria naudodamas tuos pačius žetonus. Iš ekrano kopijos agentas negali nustatyti tikslios šešioliktainės spalvos ar tarpelio dydžio – jam tektų spėlioti. Iš Markdown jis skaičius paima pažodžiui, todėl visi ekranai atrodo tarsi sukurti „vieno dizainerio“.

</div>

Štai svarbi detalė, kurią dauguma instrukcijų pateikia klaidingai: „Stitch“ nėra mygtuko „Export DESIGN.md“. Failą surenka pats agentas. Remiantis oficialiu „Google“ codelab, užklausa galėtų skambėti maždaug taip: „per Stitch MCP atidaryk projektą, ištrauk spalvų paletę ir tipografiją, o iš jų sudaryk DESIGN.md“. Šis codelab daro prielaidą, kad MCP ryšys veikia. Čia pateiktame rankiniame kelyje Claude Code vietoj to skaito eksportuotą HTML/CSS ir projekto šaknyje rašo struktūruotą failą; trūkstamus žetonus turi įvardyti, o ne spėti iš vaizdo.

DESIGN.md pateikiami konkretūs parametrai, o ne būdvardžiai:

```markdown
# DESIGN.md
## Colors
- Primary:   #0F172A
- Accent:    #F97316
- Success / Error / Warning: ...
- Background / surfaces: ...
## Typography
- Font (body): "Instrument Sans"; (headings): "Instrument Serif"
- Scale: H1 48/1.1, H2 36/1.15, Body 16/1.6, Caption 13/1.4
- Weights: 400 / 500 / 700
## Spacing (base 8px)
- xs 4, sm 8, md 16, lg 24, xl 40, 2xl 64
## Layout
- Container max-width: 1200px; breakpoints: 640 / 768 / 1024 / 1280
## Components
- Button: radius 10px; variants primary / secondary / ghost; states hover / active / disabled
- Card: radius 16px; shadow 0 4px 24px rgba(0,0,0,.08)
```

Kad „Claude Code“ naudotų šį failą, nurodykite jį faile `CLAUDE.md` (pavyzdžiui, eilute „Visų komponentų dizainui naudok `DESIGN.md`“) – ir agentas kiekvienoje sesijoje įtrauks tuos pačius žetonus. Pirmadienį sukurtas mygtukas ir penktadienį sukurta kortelė bus to paties stiliaus, nes yra vienas tiesos šaltinis.



Šioje sąrankoje veikia du vietiniai pavyzdžiai. DESIGN.md saugo sistemos taisykles — spalvas, tipografiją, tarpus ir komponentus. Eksportuotas Stitch HTML/CSS ir ištekliai pateikia konkretaus ekrano išdėstymą. MCP pasirinktinė galimybė ir nėra būtinas šio kelio reikalavimas.

## Kaip sukurti svetainę: visas kelias nuo teksto iki dizaino?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

Visas rankinis kelias turi septynis žingsnius: patikrinti prieinamumą, aprašyti produktą, pridėti pavyzdį, patobulinti vieną ekraną, eksportuoti HTML/CSS, iš tų failų surinkti DESIGN.md ir Claude Code sukurti bei patikrinti vieną puslapį. Taip išvengiama neišspręsto MCP autentifikavimo žingsnio. Prisitaikymą prie ekranų, navigaciją ir interaktyvią elgseną vis tiek reikia įgyvendinti ir išbandyti.

</div>

1. **Atverkite Stitch.** Patikrinkite prieinamumą savo šalyje ir prisijunkite prie `stitch.withgoogle.com` su Google paskyra.
2. **Aprašykite produktą.** Nurodykite ekranus ir naudotojo kelią; patvirtinkite ar pataisykite pasiūlytą ekranų sąrašą.
3. **Pridėkite pavyzdį.** Įkelkite numatytą ekrano kopiją ir nurodykite išlaikytinas spalvas, tipografiją bei išdėstymą.
4. **Generuokite ir tobulinkite.** Prieš plėsdami dizainą pasirinkite vieną ekraną ir jį patobulinkite.
5. **Pasirinktą ekraną eksportuokite kaip HTML/CSS.** Eksporto failus ir reikalingus išteklius išsaugokite projekto pavyzdžių aplanke. Eksportuotą HTML atverkite vietoje ir patikrinkite, ar tai pasirinktas ekranas; vien ekrano kopija neturi tikslių CSS reikšmių.
6. **Iš vietinio eksporto surinkite DESIGN.md.** Paprašykite Claude Code perskaityti eksportuotą HTML/CSS, užrašyti tikras spalvų, šriftų, tarpelių, išdėstymo ir komponentų reikšmes bei išvardyti trūkstamas reikšmes jūsų sprendimui. Šiam keliui nereikia Stitch API rakto ar MCP autentifikavimo.
7. **Sukurkite ir patikrinkite vieną puslapį.** Claude Code pateikite šias užklausas, aplanko pavadinimą pakeisdami tikru vietinio eksporto keliu:

```
Perskaityk Stitch HTML/CSS eksportą refs/stitch-export/. Projekto šaknyje sukurk DESIGN.md iš šiuose failuose esančių reikšmių. Trūkstamas reikšmes įvardyk, o ne išgalvok.
```

```
Iš DESIGN.md ir vietinio Stitch eksporto sukurk vieną puslapį. Išlaikyk modulinius komponentus. Atvaizduotą puslapį palygink su eksportu kompiuterio ir telefono pločiais, tada atskirai patikrink navigaciją ir interaktyvias būsenas.
```

Toliau viską atlieka „Claude Code“: nukreipimą tarp ekranų, prisitaikymą prie DESIGN.md nurodytų lūžio taškų, animacijas ir interaktyvumą. „Stitch“ pateikia statinius ekranus ir spustelėjamą prototipą, bet nesukuria veikiančios logikos ir nepublikuoja svetainės prieglobos paslaugoje – tuo rūpinasi agentas.

## Kaip atsikratyti „AI išvaizdos“: ką konkrečiai reikėtų pakeisti?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

„AI išvaizda“ dingsta, kai subjektyvius būdvardžius pakeičiate tiksliais apribojimais. Trys pagrindiniai pakeitimai: pašalinkite numatytąjį violetinį akcentą ir nurodykite savo spalvą šešioliktainiu formatu, vietoj „Inter“ pasirinkite išraiškingą šriftų derinį, o agentui pateikite tikros svetainės pavyzdį, o ne žodį „modernus“. Visa tai įrašykite į DESIGN.md, ir agentas nebegrįš prie šablonų aritmetinio vidurkio.

</div>

Štai konkretūs dalykai, kuriuos pakeitus svetainė nebeišsiduoda:

- **Spalva.** Violetinė `indigo-500` – pirmasis išduodantis ženklas. Pagrindines ir akcentines spalvas nurodykite tiksliomis šešioliktainėmis reikšmėmis pačiame DESIGN.md. Kiekvienas agentas savaip interpretuos „prekės ženklo mėlyną“.
- **Šriftas.** „Inter“ yra saugiausias, todėl ir lengviausiai atpažįstamas „AI šriftas“. Rinkitės išraiškingą derinį: pavyzdžiui, sans serif šriftą pagrindiniam tekstui ir savitą šriftą antraštėms. Nustatykite jį „Stitch“ dizaine ir įrašykite į DESIGN.md.
- **Pavyzdys vietoj būdvardžio.** Modelis „padaryk moderniai“ supranta kaip „2020 m. medianą“. Nurodymą „naudok šio puslapio išdėstymą“ su tikra ekrano kopija jis supranta pažodžiui. Įkelkite į „Stitch“ pavyzdinį vaizdą – žodžiais skonio perteikti negalima.
- **Tarpeliai ir erdvė.** Šabloninį išdėstymą išduoda ankšti, vienodi blokai. DESIGN.md nurodykite erdvią tarpelių skalę – agentas elementus išdėstys laisviau.

Konkretumas nugali subjektyvius būdvardžius. „Stitch“ iš esmės paverčia jūsų „noriu štai taip“ tikslių žetonų rinkiniu, todėl agentui nebereikia nieko spėlioti.

## „Google Stitch“ ar alternatyvos: ką pasirinkti?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

„Google Stitch“ – geras pasirinkimas, kai reikia sukurti dizainą nuo nulio ir neturite biudžeto. Jūsų svetainė jau nupiešta „Figma“? Naudokite „Figma MCP“. Reikia paruošto React kodo? Naudokite v0. Norite žinomo prekės ženklo stiliaus? Rinkitės „Refero“. Reikia iškart programėlės su backend? Naudokite „Lovable“. Ribotą biudžetą turinčiam vibe coder „Stitch“ yra prieinamiausias pradinis variantas, tačiau jis nesiūlo publikavimo ar backend.

</div>

Palyginau įrankius pagal tai, kas iš tiesų svarbu vykdant vibe coding su ribotu biudžetu:

| Įrankis | Kaina | Ką teikia | Integracija su Claude Code |
|----|----|----|----|
| **Google Stitch** | Nemokama | Dizainas nuo nulio pagal tekstą: ekranai, HTML, Figma | Vietinis HTML/CSS eksportas; MCP tik su patikrinta suderinama sąranka |
| **v0 (Vercel)** | Nemokamai + \$20 per mėnesį | Paruoštas React / Tailwind kodas, publikavimas „Vercel“ | Per promptus ir kodą |
| **Figma Dev Mode MCP** | Nemokama beta versija | Pateikia paruoštą dizainą iš „Figma“, skirtą kodui | Oficialus „Figma MCP“ |
| **Refero Styles** | Nemokama biblioteka | Paruošti DESIGN.md failai iš tikrų svetainių | Oficialus „Refero MCP“ |
| **Lovable** | Nemokamai + \$25 per mėnesį | Viskas viename: sąsaja + duomenų bazė + publikavimas | Atskira platforma |

Mano naudojama darbo eiga: „Stitch“ dizaino idėjoms tyrinėti → „Claude Code“ kūrimui ir logikai. Ribotą biudžetą turinčiam vibe coder „Stitch“ laimi, nes yra nemokamas ir nuo nulio sukuria unikalų jūsų produkto įvaizdį. Jei norite susipažinti su visais rinkoje esančiais įrankiais, apie juos rašiau pagrindiniame straipsnyje [su kuo programuoti 2026 m.](https://ailoot.ai/blog/lt/ai-coding-tools/).

## Kur „Google Stitch“ stringa: kokie jo apribojimai?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

„Stitch“ kuria tik UI – be backend, publikavimo ar prezentacijų. Rankinio redagavimo galimybės ribotos: atskiro elemento negalima perkelti kaip „Figma“; jį galima tik sugeneruoti iš naujo. Rezultatai nedeterministiniai – ta pati užklausa gali pateikti skirtingus ekranus. Be to, yra nemokamų generavimų limitas, kurio negalima padidinti įsigijus papildomų generavimų, eksperimentinė būsena be garantijų ir autorizavimo problema su „Claude Code“.

</div>

Štai atviras sąrašas, kad nenusiviltumėte jau po trečio ekrano:

- **Tik sąsaja.** Nėra backend, duomenų bazės ar publikavimo prieglobos paslaugoje. Tam reikia „Claude Code“ (arba „Lovable“, jei norite visko vienoje vietoje).
- **Ribotas redagavimas pačiame įrankyje.** Atskiro elemento negalite perkelti pele – galite jį pakeisti tik promptu ir sugeneruoti iš naujo. Tai ne „Figma“.
- **Nedeterminizmas.** Ta pati užklausa pateikia skirtingus rezultatus. Tai naudinga ieškant idėjų, bet nepatogu, kai reikia pakartojamo rezultato.
- **Kvota.** Pasieksite nemokamų generavimų limitą (šiuo metu dienos); papildomų nusipirkti negalima, tad teks laukti, kol kvota bus atnaujinta. Tikslus skaičius skiriasi, todėl patikrinkite sąsają.
- **Eksperimentinė būsena.** „Google Labs“ negarantuoja ilgalaikio palaikymo. Paslauga gali pasikeisti arba būti nutraukta.
- **Geografiniai apribojimai** ir MCP autorizavimo problema „Claude Code“, minėtos prieinamumo ir sąrankos skiltyse.

Kada „Stitch“ netinka: jei daugeliui projektų turite laikytis griežtų prekės ženklo gairių, jei dizainas jau sukurtas „Figma“ arba jei reikia programėlės su jau paskelbtu backend.

## Kas toliau?

<div class="aside" data-semantic="key-takeaway" role="note" aria-label="Key takeaway">

Pagrindinė mintis

Toliau darbo eigą susikurkite patys: „Stitch“ sugeneruokite pirmą ekraną, ištraukite DESIGN.md ir pagal jį sukurkite vieną puslapį „Claude Code“. Tai užtruks vieną vakarą ir padės išspręsti pagrindinį rūpestį – kad svetainė vėl atrodys „sukurta AI“. Viskas priklauso nuo vieno įgūdžio: gebėjimo kontroliuoti, kas patenka į agento kontekstą. Visa kita ateina su praktika.

</div>

Sukurkite mažiausią darbo eigą su vienu ekranu: aprašykite produktą „Stitch“, sugeneruokite pagrindinį puslapį, eksportuokite jo HTML/CSS ir paprašykite Claude Code iš tų vietinių failų sudaryti DESIGN.md bei sukurti puslapį. Pamatę, kaip violetinis gradientas dingsta savaime, visa kita darysis lengviau.

Dizainas su „Stitch“ yra viena konteksto inžinerijos technika. Visa sistema sujungia AI kloną, Antrąsias smegenis ir konteksto inžineriją, kad „Claude“ galėtų remtis parengtomis taisyklėmis ir kontekstu.

<div class="section" role="doc-bibliography" aria-label="Sources">

### Šaltiniai

- [„Google Developers“ tinklaraštis – „Stitch“: naujas UI dizaino kūrimo būdas](https://developers.googleblog.com/stitch-a-new-way-to-design-uis/)
- [„Google“ tinklaraštis – „Stitch“ ir „Gemini 3“](https://blog.google/technology/google-labs/stitch-gemini-3/)
- [„Google Codelab“ – nuo dizaino prie kodo su „Stitch MCP“](https://codelabs.developers.google.com/design-to-code-with-antigravity-stitch)
- [„Figma“ – MCP sąranka „Claude Code“](https://help.figma.com/hc/en-us/articles/39888612464151-Claude-Code-and-Figma-Set-up-the-MCP-server)

</div>

AI klonas, Antrosios smegenys ir konteksto inžinerija svarbūs produktui. Dizainas su „Stitch“ – pirmasis šio derinio elementas.



Jei norite toliau dirbti su modeliais, apsilankykite [„Ailoot“](https://ailoot.ai/).

## Klausimai ir atsakymai

### Ką daryti, kai Stitch MCP grąžina Incompatible auth server?

Naudokite visą rankinį kelią: pasirinktą ekraną eksportuokite kaip HTML/CSS, išteklius išsaugokite projekte, vietoje patikrinkite eksportą ir paprašykite Claude Code iš tų failų sukurti DESIGN.md. Straipsnis nepateikia įrodytos MCP konfigūracijos, todėl „prijunk MCP“ nelaikykite užbaigtu žingsniu.

### Kaip išvengti atspėtų dizaino žetonų DESIGN.md?

Claude Code pateikite eksportuotą HTML/CSS, o ne vien ekrano kopiją. Paprašykite užrašyti tik failuose esančias reikšmes ir jūsų sprendimui išvardyti trūkstamas spalvas, šriftus, tarpus ar komponentų taisykles, tada vieną atvaizduotą puslapį palyginkite su eksportu.


## Ailoot · Įmonė ir jos projektų portfelis

Ailoot remiasi sukaupta veiklos patirtimi, plačia klientų baze, stabiliomis paslaugomis ir nuolatine KPI kontrole.

Įmonė ir jos projektų portfelis: milijonai klientų; mėnesio pardavimai siekia milijardus.

Ailoot šią veiklos patirtį pritaiko teikdama API prieigą prie DI funkcijų klientų produktuose, agentuose, programose ir automatizavimo sprendimuose.
