01 Overview

AI Tooling &
Prototyping

Exploring how AI can speed up creative and product work, from shader animation to multi-screen cockpit prototyping.

  • AI Prototyping
  • Shaders
  • Voice UI
  • 2025

Role

Solo creative technologist.

Concept, live-coded shaders, and rapid prototyping.

Approach

Pairing with AI to write and rewrite code in real time, tuning by ear and by eye instead of storyboarding first.

Focus

Two threads: voice-reactive shader animation, and rapid prototyping for multi-screen, multi-control cockpit experiences.

02 Voice & Shader

Intelligent Voice Expression

Every parameter (ripple size, voice sensitivity, spring stiffness, damping) is exposed through a custom-built live panel, so a whole family of visual behaviors can be explored without leaving the browser.

Intelligent States

Each state maps a different moment in a voice conversation to a distinct animation behavior.

Listening: the shader reacts live to the real human voice, driven directly by audio frequency.
Thinking (A): motion mimics a flock of birds.
Thinking (B): a soft, bouncing animation.
Speaking: ripple effects spread outward as the AI talks.

03 Rapid Prototyping

Experience and UI Orchestration

The same AI-assisted approach applies beyond shaders: using AI to rapidly prototype multi-screen, multi-control cockpit experiences, so a single set of design components can adapt across platforms and views instead of being rebuilt for each one.

Reusable Components

Building UI components once and reusing them across different views, from the cockpit cluster to other screen types, instead of rebuilding the same interaction for every surface.

How to reuse design and UI components across different views, including cockpit and other screen types.

Pixel-Perfect Alignment

An assistant ruler I built to check UI component positions and spacing at a glance, catching misalignment that is easy to miss by eye alone.

Building an assistant ruler to keep UI component positions pixel perfect.

Use Case Examples for GenUI

A few concrete GenUI moments prototyped this way, from a proactive arrival cue to camera-based detection and a routing alert.

Case 1, a proactive moment on arrival at a worksite. I used AI to create the 3D animation of the tailgate opening.
Case 2, camera detection: the cabin camera recognizes context and surfaces the right moment automatically.
Case 3, a proactive alert with routing and map interaction.