Web za odpoledne: Framer návod s AI agentem 2026
Postavte web za jedno odpoledne s Framer AI agentem. Praktický návod: kredity a plány, branching a napojení Claude Code přes MCP.
Obsah článku 7 sekcí
V kostce
- Framer 3.0 z 16. června 2026 přinesl AI agenty přímo na plátně, kteří generují stránky, píší obsah, spravují CMS a auditují web.
- Free plán dává 500 kreditů denně, Basic 1 000 měsíčně za cca 10 $ a Pro 3 000 měsíčně za cca 30 $ při roční platbě; vlastní doménu máš od Basicu.
- Branching ti umožní nechat agenta pracovat v izolované větvi a produkci nechat nedotčenou; před publikací pusť audit rozbitých odkazů a přístupnosti.
- Přes External Agents a MCP připojíš Claude Code, Cursor nebo Codex a kredity Framer nečerpáš; nehodí se ale na webové aplikace ani složitý e-shop.
Framer se v roce 2026 změnil z prototypovacího nástroje na plnohodnotný website builder s AI agenty přímo na plátně. Verze 3.0, kterou Framer vydal 16. června 2026, přinesla agenty, kteří umí generovat stránky, psát obsah, spravovat CMS i auditovat web — a k tomu branching pro bezpečné experimentování. V tomto návodu ti ukážu, jak s Framerem postavit firemní web s AI agentem krok za krokem, kolik tě to bude stát a kdy má smysl sáhnout po externích nástrojích místo kreditů.
Pokud řešíš, jak rychle dostat web od promptu k produkci bez toho, abys týden ladil šablonu nebo čekal na developeru, je tento Framer návod přesně pro tebe. Projdeme celý workflow: od zadání prvního promptu, přes úpravy na plátně, až po publikaci s napojením na vlastní doménu.
Co Framer 3.0 umí a proč se to týká i tvé práce
Framer agenti nejsou další chat v postranním panelu. Pracují přímo na canvasu — vidí a upravují stejné komponenty, styly, CMS obsah a SEO nastavení, které používá tvůj tým. Framer tomu říká "Cursor pro design" a analogie sedí: stejně jako Cursor změnil psaní kódu, Framer mění tvorbu webů.
Konkrétně agent zvládne tyhle úkoly:
- Generovat stránky od nuly nebo podle screenshotu existujícího webu
- Navrhovat layouty a sekce v rámci existujících stránek a dodržovat tvé styly
- Řešit responzivní breakpointy — mobilní verze už není samostatný projekt
- Psát a vylepšovat obsah včetně SEO metadat
- Spravovat CMS kolekce a vytvářet detail stránky pro ně
- Psát vlastní code komponenty, když vám dojdne šablona
- Auditovat web na rozbité odkazy, accessibility problémy a nekonzistentní styly
- Překládat celý web do dalších jazyků
Proč je to pro profesionály důležité? AI generované weby mívají problém s přechodem z dema do produkce. Vygenerovat landing page je snadné — horší je dodělat responzivitu, strukturu obsahu, SEO a přístupnost. Framer agenti pracují v prostředí, kde se web zároveň navrhuje, kontroluje a publikuje, takže výstup není vyhozený HTML snippet, ale skutečná stránka.
Framer návod krok za krokem: od nuly k publikovanému webu
Teď k praktické části. Takhle vypadá workflow, které zvládneš za jedno odpoledne.
Založ projekt a vygeneruj první stránku
Zaregistruj se na framer.com — na Free plán dostaneš 500 agent kreditů denně, takže první pokusy tě nestojí korunu. Popiš agentovi, jaký web chceš. Ne abstraktně ("moderní web pro firmu"), ale konkrétně: kdo jsi, co prodáváš, komu to je, jakou má web mít strukturu a tón.
Dobrý prompt vypadá takhle: "Web pro pražskou kavárnu se specialty kávou. Struktura: hero s otvírací dobou, nabídka kávy, o nás, kontakt s mapou. Tón přátelský, ale věcný. Barvy tmavě zelená a krémová."
Čím konkrétnější zadání, tím méně iterací. Agent vygeneruje stránku se strukturou, texty i vizuály — a každou změnu můžeš na plátně ručně doladit.
Iteruj na plátně, ne v chatu
Tohle je hlavní rozdíl oproti klasickým AI generátorům webu. Klikneš na element a řekneš agentovi "zmenši hero, přidej sem sekci s recenzemi, přeuspořádej galerii". Agent vidí kontext celé stránky, takže výsledek drží tvůj layout místo toho, aby přegeneroval všechno od nuly.
Praktický tip: nech agenta dodržovat styly, které si nejdřív nastavíš ručně. Založ si barvy a typografii jako text a color styles a agent je pak používá při generování dalších sekcí. Tím web udrží vizuální konzistenci i po dvaceti promptech.
Naplň CMS a nech agenta psát obsah
Pro firemní web potřebuješ blog, portfolio nebo katalog služeb. Vytvoř CMS kolekci (Basic plán jich má od června dvě), nadefinuj pole a nech agenta importovat a strukturovat obsah. Agent umí vygenerovat i SEO metadata pro každou stránku a vytvořit CMS detail pages — šablony, které se automaticky plní obsahem z kolekcí.
Pokud máš obsah v Notion, Google Sheets nebo starém WordPressu, zvládne ho agent importovat a roztřídit. Pořád kontroluj každý text — AI píše věcně, ale češtinu s diakritikou a lokálním kontextem musíš většinou doladit.
Otestuj varianty s branchingem
Branching je funkce, kterou Framer přidal v 3.0 právě kvůli AI experimentům. Vytvoříš izolovanou větev, nechas agenta (nebo kolegu) v ní pracovat a produkce zůstává nedotčená. Změny pak porovnáš, schválíš a mergneš.
Použij to takhle: nech agenta vygenerovat dvě varianty hero sekce do dvou větví, porovnej je s týmem a publikuj jen vítěze. Je to stejné PR review, jen pro design — a u AI generovaného obsahu je to jediný způsob, jak neztratit kontrolu nad tím, co žije na produkci.
Audit a publikace
Než web publikuješ, pusť agentův audit: rozbité odkazy, accessibility problémy, nekonzistentní styly. Agent najde a většinu věcí rovnou opraví. Pak už stačí publikovat — hosting, SSL certifikát a CDN má Framer vestavěné, takže žádný server nezakládáš.
Na Free plánu web běží na framer.com subdoméně. Pro vlastní doménu a vlastní branding potřebuješ Basic plán.
Kolik stojí Framer v roce 2026: AI kredity a plány
Framer přešel v červnu 2026 na systém AI kreditů (viz oficiální oznámení AI credits, simpler plans, and lower prices z 16. června 2026). Každý plán má měsíční příděl a drobné úpravy stojí málo — kreditů naběhne hlavně generování celých stránek a lokalizace do mnoha jazyků.
| Plán | Kredity | Vhodné pro | Cena |
|---|---|---|---|
| Free | 500 denně (~2 landing pages) | první pokusy, prototypy | zdarma |
| Basic | 1 000 měsíčně (~5 landing pages) | osobní weby, malé projekty | cca 10 $/měs ročně |
| Pro | 3 000 měsíčně (~10 landing pages) | firmy a týmy | cca 30 $/měs ročně |
Kredity si dokoupíš kdykoliv od 1 000 kreditů. Zároveň Framer zjednodušil plány — Scale plán zrušil, editor seat zlevnil z 40 $ na 20 $ a Content Editor seat stojí 10 $. Basic plán teď zahrnuje 2 CMS kolekce (dřív 1) a 50 GB bandwidth (dřív 10 GB).
Pro českou firmu to znamená: pořádný firemní web na Basic plánu vyjde zhruba na 250 Kč měsíčně, s Pro plánem na 750 Kč. Oproti agentuře, kde stejná práce začíná na desítky tisíc, je to řádově levnější — cena za tvůj čas strávený řízením agenta.
Kdy sáhnout po externích AI nástrojích místo kreditů
Tady přichází chvíle pro trik, který ušetří nejvíc peněz: Framer podporuje External Agents přes MCP. Připojíš Claude Code, Cursor nebo Codex a necháš je stavět Framer web přímo z těchto nástrojů. Protože AI běží v tvém předplatném (třeba Claude Pro, které už pro coding stejně platíš), nečerpá Framer kredity.
To se hodí ve dvou situacích:
- Máš těžší měsíc a kredity docházejí — pokračuj přes Claude Code místo dokupování kreditů
- Web je součástí většího projektu — když už máš v Claude Code rozjetý workflow s ostatním kódem firmy, přidáš Framer MCP a web spravuješ ze stejného terminálu
Pokud chceš vidět, jak MCP servery nastavit v praxi, máme na to samostatný návod na napojení Claude na WordPress přes MCP server — princip je stejný i pro Framer.
Komu se Framer vyplatí a komu ne
Buďme konkrétní. Framer dává smysl, když:
- Potřebuješ firemní web, landing page nebo portfolio rychle a bez developeru
- Chceš vizuální kontrolu nad výsledkem — Framer je pořád primárně design nástroj
- Spravuješ více webů a potřebuješ škálovat obsah přes CMS
- Chceš agentům přenechat rutinu (audity, lokalizace, obsah) a rozhodovat o designu sám
Nedoporučuji ho, když:
- Stavíš webovou aplikaci s přihlášením a databází — na to sáhni po Google Stitch nebo klasickém vývoji
- Potřebujeje plnou kontrolu nad kódem a hostingem — self-hosted řešení je levnější dlouhodobě
- Máš komplexní e-commerce s pokladnou a skladem — na to je lepší specializovaná platforma, třeba Shoptet s AI automatizacemi
Framer není zázrak, který postaví web bez tvé práce. Je to nástroj, který zkrátí cestu od nápadu k publikovanému webu z týdnů na odpoledne — za předpokladu, že mu umíš dávat dobré pokyny a výsledek kriticky zkontroluješ.
Časté otázky
Je Framer zdarma?
Ano, Free plán zahrnuje 500 AI kreditů denně (cca 2 landing pages), publikaci na framer.com subdoméně a plný přístup k agentům. Pro vlastní doménu potřebuješ Basic plán.
Kolik stojí Framer v roce 2026?
Basic plán stojí cca 10 $ měsíčně při roční platbě (cca 250 Kč), Pro plán cca 30 $ (cca 750 Kč). Oba zahrnují AI kredity — 1 000 na Basicu, 3 000 na Pro. Další kredity dokoupíš od 1 000 kreditů.
Umí Framer agent opravdu celý web sám?
Agent vygeneruje strukturu, obsah i responzivní verze, ale produkční kvalita vyžaduje tvou kontrolu. Workflow "prompt, zkontroluj, uprav, publikuj" je záměrné — agent dělá práci, ty držíš kontrolu nad tím, co vyjde.
Jak Framer porovnat s Wixem nebo Webflow?
Framer je výrazně AI-first: agenti pracují přímo na plátně a kredity jsou součástí každého plánu. Webflow má robustnější CMS a ekosystém pro větší weby, Wix je jednodušší pro úplné začátečníky. Pro rychlé weby s AI asistencí je Framer v roce 2026 nejrychlejší cesta.
Vyčerpám kredity, co teď?
Buď si dokup kredity (od 1 000), upgraduj plán, nebo přepni na External Agents — připoj Claude Code nebo Cursor přes MCP a pokračuj s AI, kterou už platíš v předplatném, bez odběru Framer kreditů.
Závěr: postav si web za odpoledne, ne za měsíc
Framer 3.0 posunul tvorbu webů tam, kde už coding dávno je: od ruční práce k řízení AI agentů. Nástroj zvládne generovat stránky, psát obsah, spravovat CMS i auditovat výsledek — a ty rozhoduješ, co se publikuje.
Začni na Free plánu, projdi si pět kroků z návodu a uvidíš reálný výsledek ještě dnes. Až ti dojdou kredity, připoj Claude Code přes MCP a pokračuj dál. Web už není projekt na měsíc — je to odpoledne s agentem, kterému dáváš směr.
Claude AI zdarma 
Shoptet zdarma 
Google Sheets zdarma 
Cursor zdarma 
Google Stitch zdarma 
Framer zdarma 
Codex zdarma 
Claude Design 
