A design-skillek telepítése
A skillek előre megírt útmutató-csomagok, amelyek megtanítják a Claude-nak, hogyan tervezzen igazán profin. Ez a titka annak, hogy ne „AI-szagú” legyen az eredmény.
Egy skill egy mappa, benne egy SKILL.md fájllal (és kiegészítőkkel), ami a Claude-ot egy adott területen profivá teszi. Weboldalépítéshez két skillt ajánlunk.
Hol tárolódnak?
| Rendszer | Mappa |
|---|---|
| Windows | C:\Users\<felhasználónév>\.claude\skills\ |
| macOS / Linux | ~/.claude/skills/ |
Skill #1 — Frontend Design (Anthropic hivatalos)
Ez felel azért, hogy az oldal megjelenése egyedi és igényes legyen. A legegyszerűbb telepítés: indítsd el a Claude Code-ot, és írd be neki ezt:
Telepítsd ezt a skillt: https://github.com/anthropics/skills/tree/main/skills/frontend-designA Claude letölti és a helyére másolja, pl.:
C:\Users\<felhasználónév>\.claude\skills\frontend-design\SKILL.mdEzután a /frontend-design paranccsal manuálisan is aktiválhatod, de automatikusan is betöltődik, amikor webes felületet, landing page-et vagy React komponenst kérsz.
Skill #2 — UI/UX Pro Max
Ez a felhasználói élményre (UX) és a konverzióra fókuszál: jobb elrendezés, tisztább felépítés, erősebb cselekvésre ösztönző (CTA) elemek.
Telepítsd ezt a skillt: https://github.com/nextlevelbuilder/ui-ux-pro-max-skillHasználati példa (a parancs után jön a brief):
/ui-ux-pro-max Készíts egy prémium weboldalt egy budapesti
steakhouse-nak. Tartalmazzon elegáns animációkat. Tegyél fel
tisztázó kérdéseket, mielőtt elkezded.Ellenőrzés és kézi telepítés
A telepített skilleket kilistázhatod, vagy megkérdezheted a Claude-tól, mely skillek érhetők el. Kézzel is teheted: klónozd a repót, és másold a frontend-design mappát a .claude/skills/ alá. A skill akkor él, ha a SKILL.md a mappa gyökerében van.
Görgess a fejezet végére, hogy továbbléphess — vagy válassz másik fejezetet a bal oldali listából.