A collection of visual experiments exploring the friction between code & motion, utilizing HTML/CSS/JS, Figma, and generative AI to build active digital environments + cool physical products.

⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣴⣶⡀

⠀⠀⢠⣤⡀⠀⠀⠀⠀⠀⠀⠀⠀⣠⣤⣾⠏⠘⠿⣦⣤

⠀⠀⣾⠉⠻⢶⠶⠛⢻⡇⠀⠀⠀⠘⢻⡦⠀⠀⢰⡾⠃

⢀⣤⠿⠀⠀⠀⠀⢠⡟⠁⠀⠀⠀⠀⠸⠷⠿⠿⣾⣷

⢿⣥⣀⠀⠀⠀⠀⠀⢻⡆

⠀⠈⠉⣿⣀⣾⠟⠛⠋⠁

⠀⠀⠀⠘⠛⠁

Dissonance Toolkit: Check it out further

Tools: Adobe AfterEffects, Adobe Illustrator, Laser Cutter, NFC Tag

Handheld NFC Music Tag Set: You can open up your playlist by hanging this tag anywhere!

Tools: NFC Tag, Adobe Illustrator

Object Screensaver: Screensaver that is not calm! Using kinetic typography and a manifesto, composed a JavaScript-driven type animation that forces the user to jump back into creation.

Tools: HTML/CSS/JS

Computing Screensaver: Computing is _____

Tools: HTML/CSS/JS

GardenCore: Design exhibition website in 2024! interactive data-driven by classmates

Tools: Figma, Framer, Adobe Illustrator

Order: Motion treatment as if the word is a slot machine.

Tools: Adobe AfterEffects

Kristen Mallia: A motion introduction for artist Kristen Mallia for the Multiple Formats exhibition in Boston

Tools: Adobe AfterEffects

Phonetic Korean: Code driven keyboard practice that combines the American alphabet with korean letters.

Tools: HTML/CSS/JS