Like many others in the field, my first experience in creative coding was with Macromedia Flash.

While pursuing my undergrad in Electronics, I along with a couple of friends designed and built websites for college co-curricular events.

Aranya Flash Website Team Fateh Flash Website

Flash provided a creativity canvas like no other, allowing for seamless animations triggered by user events.

Alas the joy was short lived, iPad's lack of support for Flash inhibited pursuing a career in it.

I moved from the windowed fixed resolution and skeuomorphic experience of Flash to building responsive websites using flat design with HTML/CSS/JS.

But the more I delved into designing interfaces, more it became apparent that the tools and platform were not the limitation.

To widen my understanding in interface design I took up Masters in Human Computer Interaction at University of Michigan, Ann Arbor.

Learning about the user centered design approach, I designed a few mobile app interfaces that got familiarised me with the user first, not technology first, approach.

The masters widened my perspective in interface design, encouraging me to think in processes than solutions.

Taking courses across departments (arts, engineering, business, psychology) extended the array of tools I had at my disposal.

I built interactive data visualisations using D3 and even did a parametric 3D printed calendar interface.

With this wide view of design practice, I got a role at Adobe's Search and Sensei (ML/AI) team as an Experience Developer.

Being at the cutting edge of what computer vision and Machine Learning can provide, working at Adobe provided an avenue to bring together all I had learned over the years.

I picked up front end JavaScript frameworks like React and Angular to build rich web apps, and built interactive prototypes to allow users to interact with outputs from Machine Learning models.

Working with various graphics APIs the web platform has to offer, from Canvas to SVG, it allowed me explore parametric design further.

I started designing custom inputs for web based interfaces, and even delved in building a web based game for a Game Jam.

I challenged myself to use only vanilla JS to push my understanding of various web APIs, which introduced to me Web Animations API that provides capabilities equivalent of GSAP.

As I headed deeper into creative expression using code, it kept on introducing me to new communities on the platform.

One such community was of Plotter artists. To bring my parametric creations to physical world, I got a plotter hobby kit.

I did a month of Inktober using the Plotter and built a series of plots using parametric SVG drawn using vanilla JS.

One thing leading to another, and I got the opportunity to volunteer for GRaphics On Web (GROW) conference in Paris.

It was an amazing experience to meet a group of like minded people having similar career trajectories, interests, and skills.

One thing became apparent soon, a skill I didn't get much to look into in all these years of building app interfaces was WebGL.

Coincidentally I was volunteering for Leon's WebGL workshop, which went from the WebGL triangle to all the way to building VFX using WebGL, providing me enough resource material to work upon for next few years.

I started exploring WebGL as a creative medium with the same constraint of starting with VanillaJS.

I did some prints from those explorations, and also produced some static promotional media for events I was hosting.

But it only came together when I was introduced to Hydra, a WebGL library primarily made for live coders that allow them to mix and match shader functions.

Harkening back to creative tooling days from Adobe, I built a Blockly interface for the library, allowing beginners to get started using Hydra.

I extended the WebGL functions it came with and started doing dailies on Instagram using the tool allowing me to explore creative possibilities of creating interactive graphics using just Fragment shaders.

In a progression from working with WebGL as a creative medium, I got the chance to implement these skills in a client project for the local museum soon after.

I built a tool for Chandigarh Museum, where in traditional artists could upload a face mask drawing that gets rendered as an AR face filter, all on the web.

The tool was built using TensorFlow's FaceMesh model and ThreeJS library.

I got the chance to showcase it at Google's TensorFlow show and tell, and ran a workshop for it for NodeSchoolSF.

The museum project led to another gig for an audio installation for Berlin city.

This time it was pertaining to web audio streams, and using the audio context to convolve an ambient sound recording to live stream coming from a binaural microphone placed at the venue.

I got the chance to put in a bit of visual element in it as well, where I got to visualize the convolved audio data as a Spectogram in the background.

While I was exploring AudioContext and live-coding through Hydra, another library I came across was Gibber. It allowed live coders to create music using code.

Inspired by Google's Piano roll experiment I built an interface for beginners to get started in Gibber.

This lead to a series of workshops with Codame. But all of these explorations came together when I got the chance to build a website for an art festival in India.

The curator of FutureLanding wanted to express the overwhelming nature of content being generated on the internet, that a user can never catch up to it.

For this we conceptualized a warp field where screenshots of various artists' pages are being sucked into a black hole, as if they are landing into a future that never lands (arrives).

It was a great experience putting together all my skills in creative coding together. We had node JS scripts to dynamically pull screenshots, WebGL warping effect, SVG animations for navigation, the entire mix.

Looking back at all these myriad of explorations, I find that they have one thing in common, Building creative experiences using Web APIs. It is this diversity of skills I cherish with one common thread of Web as a medium of expression.