VIBE CODING/ AI EXPLORATIONS
Various Projects created with Claude AI & Motion design tools
CommonGround(in progress)
A web-based, project management platform & Figma plug-in created to be a bridge of communication between creatives and non-creatives.
LET'S DIVE INTO THE PROCESS!
CHALLENGE
Marketers struggle to translate business strategy into visuals people relate to, while designers lack the product context to execute that strategy.
The gap produces miscommunication, unnecessary back and forth revisions, and potential off brand work.
SOLUTION
A platform that helps to align vision, where marketers can organize their ideas into structural briefs, track progress and request changes without the hustle of learning Figma. As well as giving designers product context upfront, where designers get the campaign's details in one brief inside Figma, and can push work for review without leaving their file.
BRAINSTORM
LEVERAGING CLAUDE/INITIAL PROMPT
This initial prompt helped me to set up the core structures of the webpage:
1. Review Dashboard: a space to track, review, and approve on going campaign. As well as where past campaigns lives.
2. New Campaign Brief: a 4 steps "survey" to create a structured brief according to marketers. As a brief is created, an auto generated "brief card" would be available for Designers to reference in figma.
3. Brand Guideline: a space where the brand guideline lives. Users are able to upload any brand guide. To ensure design/product quality, CommonGround would evaluate designs based on the provided informations, ensuring both creatives & non-creatives are staying on brand.
VIBE CODING FOR CINEMA 4D
A quick vibe coding project to experiment with the python tag in Cinema 4D.
After a few rounds of iterations with Claude AI, I was able to create a code that randomly generate a bunch of ripples on the same plane, mimicking the motion of a plane of water in the rain. I am also able to control tiny details(rippling speed, radius etc) within the code in C4D.
INITIAL TEST RENDER
SPEC PROJECT RENDER
All modeled by me. Textured and render in Redshift
VIBE CODING FOR HOUDINI
A vibe coding project to create a tool for Houdini
EDITS
Rounds and rounds of iterations!
I spent hours expanding the details under the three basic foundation and removing flaws. Majority of the fixes are related to user experience.
I would test run every iterations while referencing my own experience working in house, challenge I faced and different little thing I observed.
My personal experience also allowed me to envision myself as a non-creative to experience this website(trying my best!)
WEB KEY FUNCTIONS
FIGMA KEY FUNCTION
CHALLENGE
Organization is the key to success in Houdini. However, as project proceed,
the node tree can easily get more and more complicated and intimidating.
SOLUTION
A easy shortcut that allows user to create a basic node structure with
one click. The tool aim to speed up the process of node tree building,
but also make organizing in Houdini more approachable.
BRAINSTORM
I started with a prompt that clearly stated the purpose of the code, as well as asking for direction on how to install the code:)
After the initial prompting, it was some rounds of iteration to fix specific code errors. I also ask the Al to directly incorporate the hotkey registration in the code so I can don't have to register the hot key manually!
CODE IN USE
