Redesign webu pomocí AI

Redesign webu býval projekt na týdny nebo měsíce. Dnes stačí AI nástroj, který umí pracovat s kódem, a za jedno odpoledne (nebo přes noc) máte na výběr z několika hotových návrhů.

Postup

Celý princip je překvapivě jednoduchý:

1. Otevřít AI nástroj, který umí upravovat kód.

2. Napsat mu: „Udělej redesign webu do moderního stylu.”

3. Nechat ho pracovat.

4. Prohlédnout si výsledek a vybrat, co se líbí.

To je celé. Ale zajímavé to začne být, když tento postup zopakujete víckrát.

Kde to pustit

Ideální je použít nástroj, který běží kompletně na pozadí na vzdáleném serveru:

• Claude Code – webové rozhraní pro Claude, které přímo pracuje s Git repositářem.

• Codex – podobný nástroj od OpenAI.

Pro oba nástroje stojí předplatné na měsíc kolem 20 USD, za které zvládne těch redesign možná stovky.

Codex má přímo funkci pro vytvoření více versí:

Výhoda je, že nemusíte mít zapnutý počítač. AI běží na cizím serveru a pracuje sama. Úkol jde zadat i z mobilu – třeba cestou z práce nebo před spaním.

Zadáte instrukci, zavřete prohlížeč a ráno se podíváte na výsledek.

Víc variant = lepší výběr

Místo jednoho návrhu si nechte vygenerovat 5–10 variant. Každou jako samostatný běh.

Proč? Protože:

• Každý běh AI vytvoří trochu jiný výsledek – jiné barvy, jiný layout, jiný celkový dojem.

• Z deseti návrhů se téměř jistě najde jeden, který bude vypadat dobře.

• Je to jako mít k disposici tým designérů, kteří pracují paralelně.

Instrukce můžete obměňovat:

"Udělej redesign webu – minimalistický styl, hodně bílého prostoru"
"Udělej redesign webu – tmavý režim, moderní gradientové pozadí"
"Udělej redesign webu – inspirace Stripe.com"
"Udělej redesign webu – brutalistický design"
"Udělej redesign webu – pastelové barvy, měkké tvary"

Nebo můžete nechat samotnou AI, ať navrhne různé styly, a pak každý z nich pustit jako samostatný běh.

Předplatné vs. API

Pokud platíte měsíční předplatné (např. Claude Pro, ChatGPT Plus), tak za skutečné využití neplatíte přímo. Na rozdíl od API, kde se účtuje každý token.

To znamená, že je možné pustit generování třeba přes noc. AI bude podle složitosti webu desítky minut nebo hodiny pracovat na jednom návrhu – a ráno je výsledek hotový.

Při deseti paralelních bězích to znamená deset různých návrhů do rána.

Automatický deploy přes Vercel

Když je repositář napojený na Vercel (nebo podobnou platformu jako Netlify), každý push do nové Git větve automaticky vytvoří preview deployment na vlastní URL.

Jak to funguje v praxi:

1. AI vytvoří větev a pushne změny.

2. Vercel detekuje nový push a automaticky spustí build.

3. Výsledek je dostupný na URL typu projekt-redesign-varianta-1.vercel.app.

Ráno si tak stačí otevřít 10 odkazů v prohlížeči a prohlédnout si živé verse webu. Žádné lokální spouštění, žádné nastavování – jen klikání a porovnávání.

Praktický návod krok za krokem

1. Připravit repositář

Mít web v Gitu. Pokud ještě není, tak ho tam dát. Napojit na Vercel nebo Netlify pro automatické deploye.

2. Otevřít AI nástroj

Otevřít claude.ai/code nebo chatgpt.com/codex. Připojit k repositáři.

Funguje to i z mobilu – stačí prohlížeč.

3. Zadat instrukci

Příklad instrukce:

Udělej kompletní redesign webu do moderního stylu.
Použij čistý design, velkou typografii a hodně bílého prostoru.

Případně kratší verse:

Udělej redesign webu do moderního stylu.

4. Opakovat s obměnami

Spustit dalších několik běhů s různými instrukcemi. Pokud platíte předplatné, nemusíte hlídat náklady.

5. Projít výsledky

Otevřít si všechny preview URL z Vercelu. Porovnat návrhy. Vybrat ten nejlepší.

6. Doladit

Vybranou variantu dále vylepšovat – opět pomocí AI. Tentokrát s konkrétnějšími instrukcemi:

Na stránce /kontakt změň barvu tlačítka na zelenou.
Zvětši nadpisy o 20 %.
Přidej animaci při scrollování.

Tipy

• Buďte konkrétní i obecní. Záleží, jestli víte, co chcete. Takže proč nezkusit „Moderní styl”, ale i třeba „minimalistický design s tmavým pozadím, bílým textem a akcentovou barvou #06b6d4”.

• Přiložte inspiraci. Pokud se vám líbí design nějakého konkrétního webu, uveďte ho v instrukci. AI se jím může inspirovat.

• Testujte na mobilu. Zkontrolujte, že návrhy fungují i na mobilních zařízeních.

Omezení

AI redesign není bez problémů:

• Rozbití funkcionality. AI může při úpravě CSS nebo HTML rozbít JavaScript logiku. Proto je důležité funkčnost po redesignu ověřit.

• Generický výsledek. Bez konkrétních instrukcí může výsledek vypadat jako tisíce dalších „moderních” webů. Vlastní identitu webu je potřeba dodat.

• Přístupnost. AI nemusí vždy dodržet pravidla přístupnosti (accessibility). Kontrast barev, velikost textu a navigace klávesnicí je nutné zkontrolovat. V praxi ale bude takový web statisticky spíš přístupnější než web od lidí.

Oproti klasickému redesignu

Opravdový redesign webu je zpravidla složitější proces. Zahrnuje uživatelské testování, analysu dat, tvorbu wireframů, iterace s klientem a ladění detailů napříč desítkami stránek.

Ale v drtivé většině případů tohle nepotřebujete. Většina webů – osobní stránky, blogy, portfolia, malé firemní weby – nepotřebuje měsíce práce designérského týmu. Potřebuje prostě vypadat moderně a fungovat.

A přesně to AI zvládne.

Závěr

Redesign webu se z týdenního až měsíčního projektu stal činností na 5 minut. Stačí AI nástroj, Git repositář napojený na Vercel a trocha kreativity při formulování instrukcí.

Místo jednoho návrhu si můžete nechat vygenerovat deset. Místo platby designérovi využít předplatné za pár stovek. A místo představování si výsledku v hlavě si ho prohlédnout živě na URL.