Загрузка видео...

Не удалось загрузить видео

На главную

Want to create beautiful, high-converting landing pages like this without spending days in Figma or Webflow? Here's my AI-first workflow: Start with Claude Have Claude interview you about the product, audience, positioning, features, concerns and tradeoffs using this prompt: "Create me a plan file for [Product Idea] and interview...

jp's profile picture

Joey Primiani

12,385 subscribers

471,049 просмотров • 2 месяцев назад •via X (Twitter)

ИскусствоОбразованиеНаука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

Packaging design used to feel like a job for professional designers. Then I tried Packify AI. You can start with a simple product idea and turn it into a complete packaging concept through AI without spending hours in complicated design software. The interesting part is what happens after the first design: → Edit individual layers → Generate realistic AI product photos → Preview the package in 3D → Export production-ready dielines The whole workflow feels like: Idea → Design → Edit → Product photo → 3D preview → Dieline Less back-and-forth. Less technical setup. More time to focus on the actual product. A useful tool for designers, e-commerce sellers, and anyone building a physical product. Try it free: Use my code RIAZ20 for 20% off. Packify AI #aidesign #packifydesign #packifyai
1:02

Packaging design used to feel like a job for professional designers. Then I tried Packify AI. You can start with a simple product idea and turn it into a complete packaging concept through AI without spending hours in complicated design software. The interesting part is what happens after the first design: → Edit individual layers → Generate realistic AI product photos → Preview the package in 3D → Export production-ready dielines The whole workflow feels like: Idea → Design → Edit → Product photo → 3D preview → Dieline Less back-and-forth. Less technical setup. More time to focus on the actual product. A useful tool for designers, e-commerce sellers, and anyone building a physical product. Try it free: Use my code RIAZ20 for 20% off. Packify AI #aidesign #packifydesign #packifyai

Md Riyazuddin

27,246 просмотров • 12 дней назад

The most complete AI design skill stack is now in Open Design. AI agents can build full apps. But most of them still design like shit. You used to spend more time fixing the design than building the app. And prompting harder does not fix taste. So Open Design integrated the design skills everyone on X is talking about: Taste Skill Hallmark Frontend Design Image-to-Code Design Review 100+ design systems It works locally with 20+ AI CLIs: Codex, Claude Code, Cursor, Gemini CLI, OpenCode, and more. Pick your agent. Generate pages that finally have taste. 👉
0:53

The most complete AI design skill stack is now in Open Design. AI agents can build full apps. But most of them still design like shit. You used to spend more time fixing the design than building the app. And prompting harder does not fix taste. So Open Design integrated the design skills everyone on X is talking about: Taste Skill Hallmark Frontend Design Image-to-Code Design Review 100+ design systems It works locally with 20+ AI CLIs: Codex, Claude Code, Cursor, Gemini CLI, OpenCode, and more. Pick your agent. Generate pages that finally have taste. 👉

Open Design

53,135 просмотров • 2 месяцев назад

A good design workflow should create more clarity, not more tabs. That is why OptimAI Claw is useful. One prompt can now help automate parts of your workflow on Figma and Stitch -- from research and structure to faster execution inside the tools you already use. “Turn this idea into a clean landing page concept. Draft the layout in Figma. Generate a matching flow in Stitch.” Less switching. Less friction. More room to think. That is what agentic AI should feel like: quiet, useful, and already inside the workflow. OptimAI Claw is built for that. --- 💡Launch OptimAI Claw with Core Node v2:
1:54

A good design workflow should create more clarity, not more tabs. That is why OptimAI Claw is useful. One prompt can now help automate parts of your workflow on Figma and Stitch -- from research and structure to faster execution inside the tools you already use. “Turn this idea into a clean landing page concept. Draft the layout in Figma. Generate a matching flow in Stitch.” Less switching. Less friction. More room to think. That is what agentic AI should feel like: quiet, useful, and already inside the workflow. OptimAI Claw is built for that. --- 💡Launch OptimAI Claw with Core Node v2:

OptimAI Network

204,785 просмотров • 3 месяцев назад

A designer who can ship code is one of the most valuable hires in tech today. Here's my new episode with Felix Lee (CEO of ADPList) where he showed me how to use Claude Code and Figma MCP to go from: ✅ Figma → Code: Design to website in 15 min ✅ Code → Figma: App back to editable design Felix also demoed a few apps he's designed and built in Claude Code, including a 3D globe website and a landing page analyzer. Some takeaways from Felix: 1. Stop pasting screenshots into Claude Code. Instead, use Figma MCP to pull in all your assets, icons, and images automatically. 2. You can use the same MCP to convert code back into editable Figma layers to explore more variations. 3. An underrated way to build: Use FigJam to plan a flowchart of your app first, then paste the link into Claude Code with the MCP. 📌 Watch now: Thanks to our sponsors: Replit ⠕: Plan, design, and build with AI agents Linear: The AI agent platform for modern teams
0:48

A designer who can ship code is one of the most valuable hires in tech today. Here's my new episode with Felix Lee (CEO of ADPList) where he showed me how to use Claude Code and Figma MCP to go from: ✅ Figma → Code: Design to website in 15 min ✅ Code → Figma: App back to editable design Felix also demoed a few apps he's designed and built in Claude Code, including a 3D globe website and a landing page analyzer. Some takeaways from Felix: 1. Stop pasting screenshots into Claude Code. Instead, use Figma MCP to pull in all your assets, icons, and images automatically. 2. You can use the same MCP to convert code back into editable Figma layers to explore more variations. 3. An underrated way to build: Use FigJam to plan a flowchart of your app first, then paste the link into Claude Code with the MCP. 📌 Watch now: Thanks to our sponsors: Replit ⠕: Plan, design, and build with AI agents Linear: The AI agent platform for modern teams

Peter Yang

77,115 просмотров • 5 месяцев назад

how to use Google's NEW open source Design.md + AI Skills to make your startup look like a $100 million company in 1 hour: 1. Design.md is an open source file from Google that captures the soul of a design. Typography, colors, spacing, all in one markdown file. You attach it to your prompt and your agent builds beautiful things every time. 2. Think of it this way. The HTML is the finished dish. The design.md is the recipe. The skills are the ingredients. Put them together and everything you build looks consistent and professional. 3. Don't create a design system from scratch. Find a brand you love. Linear, Stripe, Vercel, whatever resonates. Study it. Use ChatGPT or Claude to help you extract the design language into your own design.md file. 4. Build skills on top of your design.md. A landing page skill. A mobile app skill. A motion design skill. A slide deck skill. Each one references the same design.md so everything looks like it came from the same designer. 5. The biggest mistake people make: they nail one screen and then everything else looks generic. Design.md solves this. One file keeps every page, every format, every medium consistent. 6. Use it across everything. Your landing page. Your app. Your pitch deck. Your promo videos. Same DNA. Same taste. Same system. That's what separates a startup that looks real from one that looks vibe-coded. 7. Build a second brain for design inspiration. When you see something beautiful in the real world or online, capture it. Save it. When you're building something new, reference it. Taste is developed, not downloaded. 8. It's obvious but the difference between a product people trust and a product people bounce from is how it looks and feels. Design.md gives you that edge. you can watch below shoutout to Meng To for coming on The Startup Ideas Podcast (SIP) 🧃 and walking through his full workflow. if you want to use AI to actually build gorgeous designs, you'll want to use see this. watch
51:01

how to use Google's NEW open source Design.md + AI Skills to make your startup look like a $100 million company in 1 hour: 1. Design.md is an open source file from Google that captures the soul of a design. Typography, colors, spacing, all in one markdown file. You attach it to your prompt and your agent builds beautiful things every time. 2. Think of it this way. The HTML is the finished dish. The design.md is the recipe. The skills are the ingredients. Put them together and everything you build looks consistent and professional. 3. Don't create a design system from scratch. Find a brand you love. Linear, Stripe, Vercel, whatever resonates. Study it. Use ChatGPT or Claude to help you extract the design language into your own design.md file. 4. Build skills on top of your design.md. A landing page skill. A mobile app skill. A motion design skill. A slide deck skill. Each one references the same design.md so everything looks like it came from the same designer. 5. The biggest mistake people make: they nail one screen and then everything else looks generic. Design.md solves this. One file keeps every page, every format, every medium consistent. 6. Use it across everything. Your landing page. Your app. Your pitch deck. Your promo videos. Same DNA. Same taste. Same system. That's what separates a startup that looks real from one that looks vibe-coded. 7. Build a second brain for design inspiration. When you see something beautiful in the real world or online, capture it. Save it. When you're building something new, reference it. Taste is developed, not downloaded. 8. It's obvious but the difference between a product people trust and a product people bounce from is how it looks and feels. Design.md gives you that edge. you can watch below shoutout to Meng To for coming on The Startup Ideas Podcast (SIP) 🧃 and walking through his full workflow. if you want to use AI to actually build gorgeous designs, you'll want to use see this. watch

GREG ISENBERG

509,941 просмотров • 3 месяцев назад

I love using GLM 5.2 for web app iteration. My workflow: generate 6 variations, then pick the best one and continue iterating on it. I built Recast to make this even easier. Give it a prompt, get 6 variations, download the code for your favorite version, then continue iterating in your own coding agent. GLM 5.2 works really well for this use case since it's fast, cheap, and great at design. On average, you can make 3-6 landing pages with GLM 5.2 for every one you can generate with Opus 4.8. And the design variety of the GLM landing pages helps a lot with trying to think through what style you want to go with. Recast is launching soon (as a web app + skill).
0:34

I love using GLM 5.2 for web app iteration. My workflow: generate 6 variations, then pick the best one and continue iterating on it. I built Recast to make this even easier. Give it a prompt, get 6 variations, download the code for your favorite version, then continue iterating in your own coding agent. GLM 5.2 works really well for this use case since it's fast, cheap, and great at design. On average, you can make 3-6 landing pages with GLM 5.2 for every one you can generate with Opus 4.8. And the design variety of the GLM landing pages helps a lot with trying to think through what style you want to go with. Recast is launching soon (as a web app + skill).

Hassan

20,164 просмотров • 2 месяцев назад

I just tried Packify ai, and I wasn't expecting packaging design to be this simple. You can turn a simple idea into a complete product package using AI chat, even without professional design skills. Then refine everything in one place: 🎨 Edit individual layers 📸 Generate AI product photos 📦 Preview the package in 3D ✂️ Export factory-ready dielines The workflow is basically: Idea → AI design → Edit → Product photo → 3D preview → Production-ready dieline. No expensive design software. No complicated setup. Perfect for designers, e-commerce sellers, and anyone launching physical products. 👉 Get started for free: Use my code AMIT20 for 20% off. Packify AI #aidesign #packifydesign #packifyai
1:00

I just tried Packify ai, and I wasn't expecting packaging design to be this simple. You can turn a simple idea into a complete product package using AI chat, even without professional design skills. Then refine everything in one place: 🎨 Edit individual layers 📸 Generate AI product photos 📦 Preview the package in 3D ✂️ Export factory-ready dielines The workflow is basically: Idea → AI design → Edit → Product photo → 3D preview → Production-ready dieline. No expensive design software. No complicated setup. Perfect for designers, e-commerce sellers, and anyone launching physical products. 👉 Get started for free: Use my code AMIT20 for 20% off. Packify AI #aidesign #packifydesign #packifyai

Amit

36,712 просмотров • 14 дней назад

Design. Prototype. Ship. All with the power of Play AI. Use Play AI to: › Generate a chart, a full onboarding flow, or a background with shifting gradients. Play creates it in real time with the new AI View. › Prototype using natural language — “On tap, open this page in a sheet and add a haptic.” › Design effects like Liquid Glass, system icons, or native elements in seconds. Try Play AI for free today!
0:36

Design. Prototype. Ship. All with the power of Play AI. Use Play AI to: › Generate a chart, a full onboarding flow, or a background with shifting gradients. Play creates it in real time with the new AI View. › Prototype using natural language — “On tap, open this page in a sheet and add a haptic.” › Design effects like Liquid Glass, system icons, or native elements in seconds. Try Play AI for free today!

Play

26,079 просмотров • 10 месяцев назад

Kimi. Kimi. Kimi. 🔥 You can literally build a beautiful website in a couple of hours using Kimi.ai 3D effects, images, UI elements, everything gets generated on its own. You don't have to spend time finding assets, fonts, or any other design resources. This is the kind of intelligence I want from AI. Give it a prompt and a reference, and it should figure out the rest. Generate the assets, coordinate the sub agents, and ship a complete experience. That's the future. Live: Code: Design:
0:32

Kimi. Kimi. Kimi. 🔥 You can literally build a beautiful website in a couple of hours using Kimi.ai 3D effects, images, UI elements, everything gets generated on its own. You don't have to spend time finding assets, fonts, or any other design resources. This is the kind of intelligence I want from AI. Give it a prompt and a reference, and it should figure out the rest. Generate the assets, coordinate the sub agents, and ship a complete experience. That's the future. Live: Code: Design:

The Bugged Dev

30,210 просмотров • 22 дней назад

My favorite way of interacting with Claude Code is to have it generate static HTML files as outputs (reports, explorations, code structure, mockups etc.) I wanted to iterate on the file by commenting in browser and having Claude update the output live. So, I built this Claude Skill👇 How it works: - Install Claude Code skill (ask it to clone repo) - Build an HTML page for anything (e.g. research coding agents and generate HTML report) - Ask it to make the page interactive That's it. CC will launch a localhost server and allow you to then leave comments on the page itself and once it updates, will give you a tour of changes. It's like Google Docs kind of comments/iteration but for HTML pages.
0:55

My favorite way of interacting with Claude Code is to have it generate static HTML files as outputs (reports, explorations, code structure, mockups etc.) I wanted to iterate on the file by commenting in browser and having Claude update the output live. So, I built this Claude Skill👇 How it works: - Install Claude Code skill (ask it to clone repo) - Build an HTML page for anything (e.g. research coding agents and generate HTML report) - Ask it to make the page interactive That's it. CC will launch a localhost server and allow you to then leave comments on the page itself and once it updates, will give you a tour of changes. It's like Google Docs kind of comments/iteration but for HTML pages.

Paras Chopra

215,661 просмотров • 3 месяцев назад

New open source project: Easel, a macOS workspace for AI-assisted product design and frontend iteration powered by the Codex SDK. Think of it as "Claude Design for Codex." It brings together a local project library, design-system setup, Codex chat, and a live web preview with a point-and-click inspector. Set up your design system however you like. Import one from Figma , bring your own, or have the agent generate it as a design.md. Then use it to build prototypes and slide decks. Codex-first, with Claude and other AI providers and local models planned for future releases. OpenAI Developers
0:51

New open source project: Easel, a macOS workspace for AI-assisted product design and frontend iteration powered by the Codex SDK. Think of it as "Claude Design for Codex." It brings together a local project library, design-system setup, Codex chat, and a live web preview with a point-and-click inspector. Set up your design system however you like. Import one from Figma , bring your own, or have the agent generate it as a design.md. Then use it to build prototypes and slide decks. Codex-first, with Claude and other AI providers and local models planned for future releases. OpenAI Developers

James Rochabrun

61,199 просмотров • 2 месяцев назад

How to build a brand from scratch using Paper, Codex + GPT image model 2 Since two weeks back, I´ve done most of my design work in paper And I´m genuinely impressed by what you can do with their MCP Combined with claude & codex you can pretty much build out a brand in an hour or two 1. Brainstorm a name for you product or service 2. find a good design system you can iterate on or come up with one from scratch 3. create a moodboard of things you like and want the brand to be about (images, colors, shapes, elements, you name it) inside paper 4. select the moodboard and prompt codex to create a brand brief (hooked up to paper mcp) to create the inital brand book in code 5. Use the new brand book you created and copy as PNG, take that image into ChatGPT and use GPT model 2 (with the brand prompt) to create the brand book 6. You will get a finished and well-done 10 paged brand book Now you can use that to create anything in line with the brand: Landing pags, lead magnets, ads, anything you can think of Comment "bookmarkable" + RT and I´ll send you the brand prompt and step by step guide in DMs.
1:09

How to build a brand from scratch using Paper, Codex + GPT image model 2 Since two weeks back, I´ve done most of my design work in paper And I´m genuinely impressed by what you can do with their MCP Combined with claude & codex you can pretty much build out a brand in an hour or two 1. Brainstorm a name for you product or service 2. find a good design system you can iterate on or come up with one from scratch 3. create a moodboard of things you like and want the brand to be about (images, colors, shapes, elements, you name it) inside paper 4. select the moodboard and prompt codex to create a brand brief (hooked up to paper mcp) to create the inital brand book in code 5. Use the new brand book you created and copy as PNG, take that image into ChatGPT and use GPT model 2 (with the brand prompt) to create the brand book 6. You will get a finished and well-done 10 paged brand book Now you can use that to create anything in line with the brand: Landing pags, lead magnets, ads, anything you can think of Comment "bookmarkable" + RT and I´ll send you the brand prompt and step by step guide in DMs.

Shann³

14,157 просмотров • 3 месяцев назад

Introducing Code on Canvas in AI design tool for Claude and Codex. Design ❤️ Code are officially in a relationship, opening new ways to create on canvas. Ask agent to generate custom design tools inside Pencil on the fly, create interactive components, generative art and more, but still keep the full manual design control. This is just the beginning. Let us know what you think. And let's take it to the next level together. Download the new Pencil update today.
0:57

Introducing Code on Canvas in AI design tool for Claude and Codex. Design ❤️ Code are officially in a relationship, opening new ways to create on canvas. Ask agent to generate custom design tools inside Pencil on the fly, create interactive components, generative art and more, but still keep the full manual design control. This is just the beginning. Let us know what you think. And let's take it to the next level together. Download the new Pencil update today.

Tom Krcha

79,899 просмотров • 4 месяцев назад

I gave Claude Mythos ONE prompt… And it instantly built this fully branded eCom landing page 🔥 It looks like something a $15k agency would spend weeks creating. But I used: ❌ No code ❌ No designer ❌ No Fiverr ❌ No page builder Just one prompt. This is where dropshipping is heading. AI that can take a product idea and turn it into a conversion-focused landing page in seconds. If you want the exact prompt + my full Claude skill to create pages like this for your own store… ❤️ Like 🔁 Repost 💬 Comment “Claude Mythos” I’ll DM it to you. First 500 only 👀
0:20

I gave Claude Mythos ONE prompt… And it instantly built this fully branded eCom landing page 🔥 It looks like something a $15k agency would spend weeks creating. But I used: ❌ No code ❌ No designer ❌ No Fiverr ❌ No page builder Just one prompt. This is where dropshipping is heading. AI that can take a product idea and turn it into a conversion-focused landing page in seconds. If you want the exact prompt + my full Claude skill to create pages like this for your own store… ❤️ Like 🔁 Repost 💬 Comment “Claude Mythos” I’ll DM it to you. First 500 only 👀

Kamil Sattar | The Ecom King

14,298 просмотров • 2 месяцев назад

working theory for a new vibe code workflow: 1. create a proof of concept in v0 2. move to github and clone in a local repo 3. use as ref for agent planning 4. create a backend directory to test API plumbing 5. create a frontend directory to prototype iteratively this way you can repeatedly rip apart the frontend for ideation without worrying about breaking changes to the backend. i really like asking for an open ended "job to be done" (i.e. place a bet with a single tap) with 5-10 variations to feel. it's the modern day wireframing. it's still UI slop but i can get ideas in my head out faster and reveal design shortcomings before polishing or worrying about making components functional. and because the v0 prototype gets you to functional ai features and backend integration fastest, you have both a technical and conceptual reference to use in your agentic planning so your v1 is more predictable with minimal effort.
0:22

working theory for a new vibe code workflow: 1. create a proof of concept in v0 2. move to github and clone in a local repo 3. use as ref for agent planning 4. create a backend directory to test API plumbing 5. create a frontend directory to prototype iteratively this way you can repeatedly rip apart the frontend for ideation without worrying about breaking changes to the backend. i really like asking for an open ended "job to be done" (i.e. place a bet with a single tap) with 5-10 variations to feel. it's the modern day wireframing. it's still UI slop but i can get ideas in my head out faster and reveal design shortcomings before polishing or worrying about making components functional. and because the v0 prototype gets you to functional ai features and backend integration fastest, you have both a technical and conceptual reference to use in your agentic planning so your v1 is more predictable with minimal effort.

0xDesigner

14,912 просмотров • 8 месяцев назад

This design manager vibe coded a Figma plugin with Claude Code in 40 mins to save $2000 per project Every designer should take an inspiration from this and leverage AI to automate boring parts of their design work 👀 Watch the full interview on Sneak Peek: Hammed shows how the Jump design team uses Claude to create custom Figma plugins 👇
1:33

This design manager vibe coded a Figma plugin with Claude Code in 40 mins to save $2000 per project Every designer should take an inspiration from this and leverage AI to automate boring parts of their design work 👀 Watch the full interview on Sneak Peek: Hammed shows how the Jump design team uses Claude to create custom Figma plugins 👇

Jayneil Dalal

66,181 просмотров • 10 месяцев назад

how to use claude code + 3 MCPs + 2 AI tools to go from cold idea to live A/B test in 1 session (full workflow): 1. connect ideabrowser as an MCP. pull your project context like ICP, positioning, offer, growth strategy directly into the terminal. 2. use ideabrowser skills to generate a lead magnet concept tailored to your niche. it builds the strategy doc and saves it as a file. 3. open paper (connected to claude code). design your landing page visually and iterate on hero, sections, components. design and code stay in sync. dont necessarily need figma here. 4. deploy the landing page. wire up humblytics for analytics like traffic, scroll depth, heat maps, funnel tracking, full attribution. 5. run a no-code A/B experiment directly from claude code. it dynamically swaps your headline on the live site. 6. store the results back into Idea Browser (pro plan) so your agent compounds context over time. every future decision is informed by past data. 7. everyone can build landing pages now. the gap is knowing what to test, how to get customers, and how to optimize. this stack/workflowcloses that gap. amirmxt showed me this live and i can't stop thinking about the arbitrage. 99.999% of people don't know this stack exists. it's like when 5 cent facebook ads were around, arbritrage is all over again. episode is finally live on The Startup Ideas Podcast (SIP) 🧃 (full demo there) this one is different. send it to a friend who likes ideas and automating businesses. 100% free to watch this and get your creative juices flowing (let me know what you want me to cover next) watch
35:22

how to use claude code + 3 MCPs + 2 AI tools to go from cold idea to live A/B test in 1 session (full workflow): 1. connect ideabrowser as an MCP. pull your project context like ICP, positioning, offer, growth strategy directly into the terminal. 2. use ideabrowser skills to generate a lead magnet concept tailored to your niche. it builds the strategy doc and saves it as a file. 3. open paper (connected to claude code). design your landing page visually and iterate on hero, sections, components. design and code stay in sync. dont necessarily need figma here. 4. deploy the landing page. wire up humblytics for analytics like traffic, scroll depth, heat maps, funnel tracking, full attribution. 5. run a no-code A/B experiment directly from claude code. it dynamically swaps your headline on the live site. 6. store the results back into Idea Browser (pro plan) so your agent compounds context over time. every future decision is informed by past data. 7. everyone can build landing pages now. the gap is knowing what to test, how to get customers, and how to optimize. this stack/workflowcloses that gap. amirmxt showed me this live and i can't stop thinking about the arbitrage. 99.999% of people don't know this stack exists. it's like when 5 cent facebook ads were around, arbritrage is all over again. episode is finally live on The Startup Ideas Podcast (SIP) 🧃 (full demo there) this one is different. send it to a friend who likes ideas and automating businesses. 100% free to watch this and get your creative juices flowing (let me know what you want me to cover next) watch

GREG ISENBERG

57,852 просмотров • 4 месяцев назад

My AI made Shopify pages are getting better and better everyday Here’s an example of a Shopify section I built with the reference page and the result on my store 👇 Guide: To make good AI landing pages, you need to use the same method as making good AI UGC or AI product images you have to take something that's already good as a reference for Claude/gemini to analyze and adapt for your product/brand for now you can't adapt full landing pages to your product because the Claude context gets bloated fast and you get poor output. Listicles are the only kind of page you can "one shot" with Claude. But Product pages are another story Analyze an existing page and adapting it to your product section by section is the way to go. The results are 10x better. here's an example (on the video): 1- I found this good product section from im8's product page. I screen-recorded the section on both desktop and mobile, going through the animations to capture the dynamism that a screenshot wouldn’t show. Then I asked Claude Web or Gemini to analyze the recording and produce a very detailed report. Full prompt is on my TG channel, it's quite long. 2- then ask Claude (inside your Shopify brand project folder): "I have a detailed UI/UX specification document for a product page section I want to adapt to my product. Recreate this exactly on Shopify as a section template and adapt it to [name of the product] using the brand guidelines" (paste the result prompt from step 1 ). 3- you will have your section ready after 3-4 minutes. you'll probably have to change a few things. spacing, small visual bugs, price not appearing correctly. it will take you 5 minutes maximum. 4- then you can ask Claude to make 4 different variations of the section using different designs and pick the best one using this prompt: "Create 4 design variations of this section. Keep the content and layout structure identical across all, only vary the visual treatment (color usage, typography hierarchy, spacing, component styling). I will choose the one I like the most." after that you have a pretty good section, and you can do the process again for all sections of the page. The less complex the section, the faster the process will be. note: I know the AI result is not perfect, but it's pretty impressive imo and it will only get better.
0:27

My AI made Shopify pages are getting better and better everyday Here’s an example of a Shopify section I built with the reference page and the result on my store 👇 Guide: To make good AI landing pages, you need to use the same method as making good AI UGC or AI product images you have to take something that's already good as a reference for Claude/gemini to analyze and adapt for your product/brand for now you can't adapt full landing pages to your product because the Claude context gets bloated fast and you get poor output. Listicles are the only kind of page you can "one shot" with Claude. But Product pages are another story Analyze an existing page and adapting it to your product section by section is the way to go. The results are 10x better. here's an example (on the video): 1- I found this good product section from im8's product page. I screen-recorded the section on both desktop and mobile, going through the animations to capture the dynamism that a screenshot wouldn’t show. Then I asked Claude Web or Gemini to analyze the recording and produce a very detailed report. Full prompt is on my TG channel, it's quite long. 2- then ask Claude (inside your Shopify brand project folder): "I have a detailed UI/UX specification document for a product page section I want to adapt to my product. Recreate this exactly on Shopify as a section template and adapt it to [name of the product] using the brand guidelines" (paste the result prompt from step 1 ). 3- you will have your section ready after 3-4 minutes. you'll probably have to change a few things. spacing, small visual bugs, price not appearing correctly. it will take you 5 minutes maximum. 4- then you can ask Claude to make 4 different variations of the section using different designs and pick the best one using this prompt: "Create 4 design variations of this section. Keep the content and layout structure identical across all, only vary the visual treatment (color usage, typography hierarchy, spacing, component styling). I will choose the one I like the most." after that you have a pretty good section, and you can do the process again for all sections of the page. The less complex the section, the faster the process will be. note: I know the AI result is not perfect, but it's pretty impressive imo and it will only get better.

Olivier

84,679 просмотров • 5 месяцев назад

figma "god mode" just leaked.. this week i tried the future of autonomous design: claude connected directly to the figma api with full edit access.. yes it can design in figma what does it mean? you prompt, it designs. it’s like having a team of designers inside figma working with you and 10x ing your capacity ​why is this different? ​official figma ai/mcp only "reads" files to help devs. this tool (unofficial MCP) "writes" in figma to replace manual labor. hours of grinding turned into seconds of waiting ​imagine this: - ​prompt to design: generate a new screen based on your design or not - prompt to flow: generate end to end user journeys - iteration: create multiple variations in one click - design system: it can use your components to create new screens - ​zero click management: auto layout, component creation, deduplication handled by prompt - ​universal control: if you can do it in figma, it can do it for you ​the impact ​if figma officially releases this, almost every existing plugin becomes obsolete overnight it feels like figma on steroids. i’m still processing whether i feel empowered or replaced ​full tutorial in this article from Mark A. Cianfrani. handle with care: ai will have access to everything in figma »
0:48

figma "god mode" just leaked.. this week i tried the future of autonomous design: claude connected directly to the figma api with full edit access.. yes it can design in figma what does it mean? you prompt, it designs. it’s like having a team of designers inside figma working with you and 10x ing your capacity ​why is this different? ​official figma ai/mcp only "reads" files to help devs. this tool (unofficial MCP) "writes" in figma to replace manual labor. hours of grinding turned into seconds of waiting ​imagine this: - ​prompt to design: generate a new screen based on your design or not - prompt to flow: generate end to end user journeys - iteration: create multiple variations in one click - design system: it can use your components to create new screens - ​zero click management: auto layout, component creation, deduplication handled by prompt - ​universal control: if you can do it in figma, it can do it for you ​the impact ​if figma officially releases this, almost every existing plugin becomes obsolete overnight it feels like figma on steroids. i’m still processing whether i feel empowered or replaced ​full tutorial in this article from Mark A. Cianfrani. handle with care: ai will have access to everything in figma »

Aurelien

79,132 просмотров • 6 месяцев назад

I’m thrilled to announce we’ve raised $44M to build a new home for product design. Meet Noon. No workflow is more broken and fragmented in 2026 than the product designers’. The very same people who care most about building software don’t have software purpose built for them. Kushagra Sinha and I have lived this problem first hand as designers ourselves. That’s why we built Noon. The first product design tool that works entirely on your product code, so you can design not only how a product looks, but also how it works. With AI at its core that works in seconds, not minutes. For the first time, you can create, iterate, build, test and ship. All in one canvas. No translations or roundtrips to the codebase and back. Comment “Get Noon” and we’ll get you on the list for early access.
0:41

I’m thrilled to announce we’ve raised $44M to build a new home for product design. Meet Noon. No workflow is more broken and fragmented in 2026 than the product designers’. The very same people who care most about building software don’t have software purpose built for them. Kushagra Sinha and I have lived this problem first hand as designers ourselves. That’s why we built Noon. The first product design tool that works entirely on your product code, so you can design not only how a product looks, but also how it works. With AI at its core that works in seconds, not minutes. For the first time, you can create, iterate, build, test and ship. All in one canvas. No translations or roundtrips to the codebase and back. Comment “Get Noon” and we’ll get you on the list for early access.

Aditya Bandi

684,370 просмотров • 4 месяцев назад