An interactive creative-coding website where users explore a playful virtual factory and create personalized digital collages through hand gestures, emotional inputs, and personal photographs.
Physical scrapbook aesthetics. Subtle digital animations. Personal creative decisions.
02
THE REASON TO MAKE
Motivation / Interests
What if the materials came from you?
Tools such as Canva and Photoshop let us arrange images, text, and decorations. I want to explore how bodies, emotions, and personal experiences can generate the materials themselves.
The process of making a collage becomes an interactive experience.
Transform personal inputs into visual elements
Encourage playful exploration
Support human–computer co-creation
Allow users to personalize the results
Schematic comparison · concept illustration
How can personal gestures, emotions, and images shape unique generative collages?
Colorful illustrations, character-based visuals, and experimental digital interactions.
I want to explore Bold graphics, visual creation, and exploratory interaction.
User-identified reference. No confirmed official URL or creator; no guessed link.
User-provided recording · press play to watch
Recording stills
04
A WALK THROUGH THE FACTORY
Pathway & Plan
SELECTED PATHWAY
Pathway A — Net-based Creative Coding
01Explore
02Create
03Generate
04Personalize
05Save
Three machines. Three kinds of personal expression.
MACHINE 01
Gesture Machine
Activate a webcam and move your hands to create stickers. Hand positions, movement speed, and finger trajectories influence the shapes.
Planned feature · concept illustrationMACHINE 02
Emotion Machine
Select emotions and adjust energy, softness, and chaos. Generate animated lines, particles, and abstract patterns.
Planned feature · concept illustrationMACHINE 03
Memory Machine
Upload personal photographs and transform them into Polaroids, film frames, and paper cutouts.
Planned feature · concept illustration
Then, make it yours.
The system combines the materials into a collage. Users can rearrange, rotate, resize, and regenerate elements before exporting the final image.
Every collage will reflect a different combination of inputs, movement patterns, and creative decisions.
05
HOW THE IDEA TAKES SHAPE
Tools / Production / AI Roles
01 — MY MAIN TOOLS
Codex, AI Image Generation & Creative Coding
Codex
Website development, implementation, debugging, and iteration.
AI Image Generation
Visual assets based on my references and creative direction.
Creative Coding
Personalized stickers, animated graphics, and unique collage compositions.
02 — MY ROLE
I define, evaluate, and refine.
I define the concept, interactions, and generative rules, then evaluate and refine the results.
03 — AI’S ROLE IN THE EXPERIENCE
AI supports production, while my design decisions and the users’ inputs shape the experience.
AI assists with visual assets, implementation, and debugging. The final collages will be created through user inputs and rule-based generative processes.
Begin with simple finger tracking and a mouse-based alternative.
Visual diversity
Continuous parameters with controlled randomness.
Complex development
Build the core system before the full factory.
Collage usability
Basic composition rules with manual adjustments.
Performance
Limit particle counts and optimize animations.
THE IDEA I WANT TO EXPLORE
Personal expression, generative possibilities.
By transforming gestures, emotions, and images into visual materials, Made by You aims to make digital collage creation more interactive, playful, and personal.