Vibe Coding in Practice: Creating Particle Effects and Retro Camera Filters with Zero Code

From Anxiety to Action: Vibe Coding Isn't That Hard

Seeing others create stunning interactive websites with Vibe Coding, feeling impressed yet hesitant to try it yourself — this is probably a common mindset among non-programmers. Vibe Coding is a concept that gained popularity starting in 2024, originally coined by former OpenAI researcher Andrej Karpathy. It refers to developers no longer writing code line by line, but instead describing the "vibe" and intent in natural language, letting AI generate the actual implementation. The core shift here is that the bottleneck in programming moves from "how to implement" to "how to describe" — it lowers the technical barrier while raising the bar for expressive ability and aesthetic judgment.

A Bilibili content creator shared their experience taking the first step: using the Qwen 3.7 Max model paired with the CoderWork platform, they created a gesture-controlled 3D particle system and retro camera filter effects without writing a single line of code.

The core discovery throughout the process was: getting started is far easier than imagined — what actually takes time is fine-tuning the details. This also reveals the real experience of Vibe Coding today — AI can quickly build functional frameworks, but polishing a project to a satisfying state still requires human aesthetic judgment and iterative refinement.

Gesture Particle System: One Prompt for Core Functionality

The first project was a 3D interactive webpage that detects hand gestures via webcam to control particle movement. The implementation was surprisingly straightforward: open CoderWork, select the Qwen 3.7 Max model, and type a single natural language description:

Use Three.js to create a real-time interactive 3D particle system webpage that detects when the hand is open to scatter particles and when the hand makes a fist to gather them, using the webcam.

The AI model quickly generated a fully functional demo, complete with webcam access, gesture recognition, and particle physics — the entire logic chain. What's interesting here is that Qwen 3.7 Max has a remarkably solid understanding of frontend 3D libraries like Three.js, capable of connecting WebGL rendering, MediaPipe gesture detection, and particle dynamics into a cohesive system in one shot.

The tech stack involved here is worth elaborating on. Three.js is currently the most popular JavaScript 3D graphics library, providing a high-level abstraction layer on top of the underlying WebGL API, allowing developers to create 3D scenes, lighting, materials, and animations without writing complex shader code directly. WebGL itself is a browser-native graphics rendering interface that directly leverages GPU hardware-accelerated rendering. Traditionally, becoming proficient with Three.js requires understanding concepts like Scene Graphs, camera systems, and render loops — a learning curve that typically takes weeks to months. The gesture detection component relies on MediaPipe, Google's open-source cross-platform machine learning framework. Its hand detection module runs a lightweight neural network model directly in the browser, tracking 21 key points of the hand in 3D coordinates in real-time, with the entire inference process completed client-side at latencies typically under 30ms. The fact that an AI model can generate a complete project integrating all these modules in one pass demonstrates that large language models can already handle complex frontend engineering involving multi-module coordination.

Qwen 3.7 Max is a large language model released by Alibaba Cloud, representing the high-performance version of the Qwen series. In code generation tasks, this model's advantages lie in its precision in understanding Chinese instructions and its broad coverage of frontend tech stacks. Its ability to connect WebGL rendering, gesture detection, and particle physics in a single pass suggests that the model's training data includes extensive complete code structures from open-source projects, rather than just code snippets. This "system-level" code generation capability is a key indicator that distinguishes specialized programming models from general-purpose chat models.

Remote Control: Let AI Keep Working While You Grab Lunch

CoderWork supports remote operation, meaning you can check AI's work progress in real-time on your phone and issue modification instructions via voice at any time. CoderWork belongs to a new generation of AI-assisted programming platforms. Unlike traditional IDEs, its core interaction method is natural language rather than code editing. After users describe their requirements, the platform calls large language models to generate complete runnable projects and provides a real-time preview environment. The remote operation capability means code generation and execution happen on cloud servers — the user's device only needs a browser. This explains why you can check progress on a phone: it's essentially a cloud-based development environment.

The creator mentioned going out for a meal and coming back to find new work ready to play with — this asynchronous collaboration model further boosts Vibe Coding's efficiency.

Retro Camera Filter: Injecting Artistic Vision into Code

The second project was the currently trending Web Camera effects — generating visual effects in real-time on physical objects like tissues. Again, a single sentence describing the requirements was enough for Qwen 3.7 Max to generate a highly complete base demo.

But what makes this project more interesting is the subsequent creative injection phase. The creator simply spoke to the computer using voice, describing their artistic vision and having AI transform the effects to match their personal aesthetics.

Visual Expression of Information Overload

The final work incorporated concepts of "algorithmic burst" and "ASCII aesthetics" — using constantly fluctuating data streams and rapidly changing graphics to express the cognitive overload people experience when facing today's information flood.

Both concepts have deep cultural roots in digital art. ASCII Aesthetics originated from early computer culture, constructing visual patterns from pure text characters. It has experienced a revival in recent years within digital art and cyberpunk visual styles, representing a "lo-fi but high information density" aesthetic orientation. "Algorithmic burst" is an expressive technique in digital art that presents algorithm-generated visual elements at speeds and densities exceeding human processing capacity, serving as a metaphor for the modern condition of information overload. The combination of both reflects the creator's attempt to use technological means to reflect on technology's own impact on human cognition.

Specific features include:

• Users can upload their favorite images as particle shapes
• An input field supports adding text, with internet buzzwords generating visual noise around them
• Cute but rapidly changing information elements "spawn" on physical surfaces

This case demonstrates an important value of Vibe Coding: it enables non-programmers to quickly transform abstract artistic concepts into interactive digital works without first spending months learning Three.js and WebGL.

The Real Rhythm of Vibe Coding: From Prototype to Finished Product

From this practice, we can summarize the typical Vibe Coding workflow:

1. Rapid prototyping (5-10 minutes): Describe core functionality in one sentence, AI generates a complete demo
2. Detail refinement (takes most of the time): Repeatedly describe modification needs in natural language
3. Creative injection: Infuse personal aesthetics and concepts into the technical framework

Step two is where the real time investment lies. AI excels at building technical scaffolding, but sensory judgments like "does it look good" and "does the interaction feel natural" still require human oversight. This actually reflects a universal characteristic of current AI programming tools: models are already quite reliable in terms of "functional correctness," but remain highly dependent on human perceptual feedback for "experience optimization." Each round of modification is essentially a human-AI collaboration loop — humans provide aesthetic judgment, AI provides technical implementation, and the two alternate until the work reaches a satisfactory state.

Voice input is particularly useful at this stage — describing lengthy modifications is much faster by speaking than typing. This also hints at the future interaction trend for programming tools: when code generation is handled by AI, the human-tool interface will shift from keyboard input toward more natural multimodal interaction methods.

For those wanting to try Vibe Coding, the message from this case is clear: don't stay on the sidelines watching. The tool's barrier to entry is now so low that all you need is the ability to clearly describe what you want. Instead of feeling anxious about what others have built, open an AI programming tool right now and start with a single sentence.