Vibe-coding seems to be popping up everywhere lately. Most of the time it’s framed around developers using AI to build apps faster, or folks who like to tinker with code but who aren’t full-on developers. Naturally, that’s how I thought about it too; it just seemed like a concept that primarily lives in dev circles.

As a non-developer, it never really felt like something I needed to pay attention to. And it didn’t occur to me that vibe-coding might actually show up in my world as a design student. Turns out, I’ve been doing it with Claude this whole time, since the way I use it largely overlaps with what people describe as vibe-coding. Not in the sense of building full apps from scratch, but by turning ideas into something interactive just by describing them in natural language.

What vibe-coding actually is

Behind the hype

I initially thought vibe-coding was just AI-assist for developers; that you still needed to know what you were doing as a coder, and that the AI was just a faster way to spit out snippets you’d still stitch together yourself. I pictured it as a tool where you either had to already write code and just ask the AI to polish it, or at least be comfortable enough with the programming language to make sense of whatever the AI generated. While this kind of use can fall under the vibe-coding umbrella, I realized that wasn’t really the full picture.

Vibe-coding is essentially using AI to build things without writing or necessarily understanding the code yourself - you build it using “vibes”. This involves writing a prompt of what you want to build using plain language, then having the AI generate the code for you. It shifts the focus from code lines to intent, which basically means anyone can do it. All you need is a description, and any LLM can spit out some code that roughly matches what you want. It’s become so popular that there are now dedicated apps built around vibe-coding - AI tools that are designed to turn natural language prompts into code you can use to build or iterate on projects.

While this does technically make programming more accessible, it’s still worth being careful - taking AI-generated code at face value could run you into issues and vulnerabilities. My colleagues have also written in-depth about the risks and limitations of running AI-generated code, and emphasize the value of using vibe-coding for learning and experimentation rather than as a supplement for real coding knowledge.

I’ve been vibe-coding with Claude

How vibe-coding snuck into my workflow

I’ve been using Claude for a couple of months now, mainly to help with my UX design learning materials, as well as to improve my productivity. So I’m not using Claude Code but rather Claude Desktop and Claude.ai in the browser, since I don’t know much about code beyond cleaning up HTML. But it turns out I’ve been vibe-coding with Claude this whole time… by using the Artifacts feature to help me visualize what a design could look like and generating prototypes.

I usually start by drafting what I want in plain language, and this includes notes from whatever project I’m working on. This is also the phase where I bounce around ideas with the AI. At the same time, I’ll create some rudimentary designs in Figma, and I use the Specs plugin to extract the anatomy of my frames. Then I’ll create an Artifact, funnel the specs file back into Claude, and that’s when I’ll prompt it for an interactive prototype - it’s much quicker than prototyping in Figma, so it gives me a preliminary idea of what the design would look like.

Claude uses OCR and holistic visual reasoning to analyze my spec file, which is actually a more accurate reference than I could have provided in natural language. Then it starts building my prototype with HTML, JavaScript, and CSS, which I can download as an .html file. This is vibe-coding - I describe what I want and provide my references, and Claude translates it into functional code without me needing to write or understand the syntax. From there, I can open the file in a browser, iterate on it, or even publish it (I definitely won’t be publishing it).

Why vibe-coding with Claude makes sense for designers

It’s not just for developers

I think anyone who’s getting into design should give Claude a try. It’s, first and foremost, a great way to quickly get a visual of what your screens would look like. Even if it’s not the full prototype, you can still get Artifacts to create mockup stills of the layout and components, all just from a rough idea in the prompt. And it’s also great for designers who don’t yet work alongside developers or who don’t want to pay the Figma subscription for enhanced prototyping abilities.

To summarize, you can:

• Turn designs into interactive prototypes
• Create screen mockups
• Explore interactions and flows more realistically (and quickly)
• Share clickable demos when you don’t have dev support
• Learn how interfaces behave in real code

So… I’ve been vibe-coding after all

Before Claude, vibe-coding felt like something happening in developer spaces that weren’t really for me. But after spending real time with Claude, I realized I’d already been working in that direction, just without labeling it. For designers, especially beginners or those working solo, vibe-coding opens up a practical way to experiment, prototype, and learn faster. It doesn’t replace real development, but it definitely expands what non-developers can explore on their own.