

Workshop | Build a Landing Page Using Your Design System and Claude
βπ― For UX/UI designers, product designers, and PMs | π§ Beginner | π οΈ Hands-on workshop | π 90 minutes | π₯ 40 seats | π΅ $100 Standard / $59 Uxcel Pro
βEvery AI-generated landing page looks the same. You spend time re-explaining your brand in every prompt, and the output still comes back looking like a generic template with a logo dropped on top. Thereβs a better way.
βIn this hands-on workshop, youβll take your brandβs design tokens, colors, fonts, and spacing, and turn them into a custom Claude skill that remembers your brand rules. Then youβll use it to generate a real landing page that looks like your company, not like AI.
βLed by Serg Lotz, founder of webentity.ai, an AI agent platform that builds and runs websites autonomously. Serg brings 16 years of experience in product and web development, builds custom Claude skills for production web workflows daily, and took first place at the OpenClaw Showcase at Merantix AI Campus in Berlin.
βNo coding experience needed; just bring a style guide, a brand PDF, or a screenshot of a website. Youβll leave with a working landing page and a reusable skill file ready to share with your dev team.
βπ§ What You'll Learn
βHow to create a custom Claude skill that remembers and enforces your brand rules automatically.
βHow to prompt AI to generate pages that follow your specific design system instead of defaulting to a generic look.
βHow to iterate on AI-generated output to progressively refine it to match your brand standards.
βHow to package your work into a reusable skill file that you and your team can apply to future projects.
βπ Agenda
βIntroduction: Why design systems break when AI builds a frontend, and what's going wrong under the hood.
βExtract brand tokens: Pull colors, fonts, and spacing from whatever brand materials participants bring: a style guide, a PDF, or a website screenshot.
βBuild a custom design system skill: Step-by-step construction of a Claude skill that encodes brand rules and keeps AI output on-brand automatically.
βGenerate a landing page: Use the newly created skill to generate a real landing page that reflects the company's design system, not a generic AI aesthetic.
βIterate and refine: See how targeted prompt changes improve fidelity and bring the page closer to production-ready.
βQ&A: Open discussion on edge cases and applying this workflow to specific projects.
ββοΈ Format
βHands-on workshop.
βYou can actively work on building a custom Claude design system skill and landing page as you follow along during the session, or simply observe and apply it later.
βπ€ Who Should Attend
βExperience level: Beginner
βThis session is for UX designers, product designers, product managers, and marketers who are tired of re-explaining their brand to AI every time they need to build something. No coding experience is required. We will be using the Claude Desktop app, the "Code" tab inside it, no terminal usage required.
ββποΈ Meet Your Instructor
βSerg Lotz is the founder of webentity.ai, an AI agent platform that builds and runs websites autonomously. He brings 16+ years of experience in product and web development, and builds custom Claude Code skills for production web workflows on a daily basis. Serg won 1st place at the OpenClaw Showcase at Merantix AI Campus in Berlin.
βHe previously ran the OpenClaw for UX workshop with Uxcel, bringing the same hands-on, practical approach that made that session a hit.
βπ οΈ Tools
βClaude Desktop App
βCode Tab/Function (requires Claude Pro subscription)
βOptionally: GitHub account (free)
βOptionally: Vercel account (free)
βπ€ Brought To You By
ββββββββββββUxcel is an online platform where UX and product professionals upskill through interactive, gamified learning. Level up your UX, product, and AI skills with expert-led courses at your own pace, earn certificates, and join a strong community of product professionals committed to lifelong learning.
ββββββββββββInterested in hosting an event with us? Apply here.
Join our Discord community of 6,800+ UX and product professionals and start connecting today.
ββββββββββββCatch up on past events and stay connected with us on LinkedIn, Instagram, and Twitter for more updates!
βπ Notes
βIncludes access to the full recording.
βTickets are non-refundable once the session has started.
βUse Uxcel registered email address when purchasing Uxcel Pro tickets.
βAll participants will receive a prompt library and toolkit/framework after the session.
βA Claude Pro subscription is required for the workshop. Please make sure you have access before joining.