Video yükleniyor...
Video Yüklenemedi
Wow... This Claude Code Design Hack is wild. When building landing pages, don't ask for a single landing page. Ask for a directory of landing page options... and in your 1st prompt tell it to learn from your preferences as you generate more. Use this prompt below 👇
187,098 görüntüleme • 9 ay önce •via X (Twitter)
36 Yorum

Prompt for @vibecodeapp (Which uses Claude Code) --- Build a landing page showcase app for [YOUR COMPANY NAME] that lets users browse and preview different landing page design options. The app should function as an internal design directory where team members or stakeholders can view multiple landing page variations side-by-side before deciding which style best represents the brand. The main screen displays a clean, dark-themed list of all available landing pages with the company logo and a title like "Landing Page Options." Each option appears as a clickable card that navigates to the full landing page preview. Each landing page in the directory should be a complete, fully-designed landing page. Start off with 3 landing pages in the directory. Over time, the user is going to be providing their thoughts and making changes on all the landing pages. Based on those changes, all future generations of landing pages should take those into account, and you should improve making landing pages to their liking as time goes on. And when asked to create new landing pages without specific direction, please search the internet for new trending styles for landing pages that work. This can help you come up with concepts, but make sure it aligns with the company style and the preferences of the user. If the user doesn't specify any styling you can ask them follow up questions about the styling of their brand. ---

The levelled up version of this strategy is to add a styling skill with Figma. You can convert any Figma board into a claude skill. The process requires @claudeai desktop app for now, but this will soon be built into @v_computer.

If you want this repeatable btw: This is pretty much what is happening, He got a nice rich substrate of info on good design from the figma designs into english and provided it to Claude. This repo is how you can use it yourself without the above, you can iterate with Claude to refine your design, and update your context, what's not mentioned in the video, is this method works for ANY medium that AI can work on, not just code. So you can use this to refine how claude code writes, how it strategises, etc... the sky is the limit... Index everything in your claude . md file and then claude has access to a super rich substrate of info, much less hallucinations, much better results.

@learn2vibe Since inference cost is effectively zero, we should treat AI like an infinite intern. Why settle for one "best guess" when you can generate 10 distinct variations, A/B test the copy angles, and merge the best sections? Quantity is a quality of its own in the AI era.

@learn2vibe Pretty cool!

I remember thinking that prompt engineering was not important... and this proves that it is QUITE the opposite. I created a VERY simple landing page with Claude Sonnet 4.5—my first #vibecoding experience and I believe it turned out great: But... I am barely scratching the surface and I am definitely going to use something way more powerful for the next one: Claude Code. I am going to admit that the first time I saw CC was on an @AlexFinn video and I was like... DANG: looks confusing! But I am sure that after using it 10 times I will be wondering why I didn't start sooner.

@learn2vibe using AI to design landing pages is like hiring a robot chef to make your dinner. sure, it's efficient, but can it really capture the soul of a perfectly seasoned argument?

@learn2vibe choosing a landing page is confusing I had to make mine a gallery of landing pages. Eventually, small sites like this should be generated on the fly and per user preferences

@learn2vibe I built a landing page generator that takes feedback per round of 6, saves things i don’t like into an md and does the next round with that in context. Amazing outcomes.

Design Part ✅ Buyer Psychology ❌ A high-converting landing page only when: - Builds trust quickly - Removes confusion - Reduces fear - Shows proof - Makes the next step effortless We can’t rely only on AI for a website, especially when it is one of the most crucial parts of a business. - Even if you spend $1 million on ads, if people are not converting, - its just an expensive hobby. (Secret Key = Copywriting skills)

@learn2vibe These are not landing pages at all.

@learn2vibe This learn from your preferences pattern is strong, the missing piece is persistence. Wiring the chosen variants back into a tiny preference schema or skill file makes Claude’s taste actually compound across projects instead of resetting every session.

@learn2vibe Don't forget to add that obnoxious animate/load as you scroll that everybody is doing now. And the testimonials! The more bullshittery, the better

@learn2vibe We use a similar pattern. The key is giving it a style reference file with your brand's color tokens and typography preferences upfront. Then each iteration builds on your aesthetic instead of starting from generic defaults. Saves a ton of back and forth.

@learn2vibe It’s called riff coding

@learn2vibe the bitter lesson in the form of landing pages

@learn2vibe This is a great idea.

@learn2vibe @rileybrown Ah! Super smart one 🙌🏽

@learn2vibe I love this idea!

@learn2vibe Your thread is creating a buzz! #TopUnroll 🙏🏼@alykhan for 🥇unroll

@learn2vibe nice

@learn2vibe Claude Code skills definitely level up

@learn2vibe @threadreaderapp unroll me

@learn2vibe I've noted this Claude design hack; it's a surprising, effective approach.

@learn2vibe That's insanely clever

@learn2vibe Please check DM. Does one apply code in the redeem code segment in settings?

@learn2vibe This looks very promising.

@learn2vibe wow

@learn2vibe Strong prompt. Clear UX direction, iterative learning, and trend-based inspiration filtered by brand constraints — that’s a good recipe for non-generic landing page outputs.

@learn2vibe Strong approach. Start with a brand style seed (color tokens, typography, spacing) in the first prompt, then iterate on preferences. A directory of landing pages beats a single page every time

@learn2vibe Nice strategy🤔🤔

@learn2vibe Amazing hack to speed up client variants

@learn2vibe This prompt strategy is genius.

@learn2vibe Will try today this trick. Today I am trying to tell it to take some sites as reference yo jumpstart on design

@learn2vibe @v_computer I need to borrow someone Claude opus 4.5 pro api or get some senior vibecoder gang to join me to finish several projects with Input api/compute/work/ get back portion of subscription to -platform and other builds/automations etc. Other apis always gets stuck on some ridiculous

@learn2vibe where to open this on web instead of iphone
