Hey Guys,

This page is just for temporary and my new portfolio is currently under heavy development. Meanwhile, you can either check out the work I did below or go to my old-Flash-no-one-cared portfolio and humor me instead.

I am currently living in Bristol, UK and I am constantly looking for new opportunity. If you got any freelance projects you think I can be the right fit, please let me know. I am also up for relocation for good full time opportunity :)


TOUCH with Leap Motion

It is an experiment to showcase the possiblity to apply the physics with 262k particles on Leap Motion by using the signed distance field.

Youtube | Github

縳 Constraint

It is a simple experiment I did to use the position based contraint and curl noise movement on the velocity to create that organic look and feel.

Youtube | Github


It is an experiment to recreate a 3d model with a million of particles and use GPGPU for the physics.

Youtube | Github

About me

My name is Edan Kwan and I am a front-end developer. I spent 2 years working at firstborn in New York and before that I worked for Unit9, Logitech and even as a contract singer. At the moment, I am working freelance remotely for different advertising agencies. Other than my interactive development specialty, I also do UX consulting and design work for various advertising agencies and companies including Adobe.

If you are an agency looking for a freelance developer to do some interactive projects or a designer looking for collaboration for your experiments, please contact me at: info(at)edankwan.com

Almost all of my works are web based and used technology including WebGL, Web Audio, HTML5 Cavnas, NodeJS, [bunch of marketing terms] etc.

You can also find out more about me at:
Linkedin / Twitter / Github / Blog


Featured Projects

Google x L'Équipe - Toprecherches

Toprecherches comes in 2 parts - the hub and the embedded widget. My role involved all frontend development and generating static files for the seo. The hub uses adaptive design with CSS3D and Canvas technologies.

Agency: 60fps, AKQA

Client: Google, L'Équipe

Related links: Live site, Example of the embedded widget

Assassin's Creed Unity - Unite

Unite is a website for the game Assassin's Creed. User can create their own avatars and the avatars with highest daily votes will be selected to be part of the TVC. In this project, the most challenging parts are the configurator and the backend optimization.

For the configurator, as all of the avatars are generated in 2D and we cannot pre-generate the avatar due to the crazy amount of possibility, we decided to create the diffuse and mask images for each parts and merge them all together. I had to find a way to render the parts from both frontend(with canvas) and backend(with ImageMagick).

For the backend part, the unexpected high amount of active users(over 2000 online at the same time) almost killed our server and we had to find several solutions to patch the website before we could get some extra CDN servers during the live release. It was really fun though :)

In phase 2, there is a map that contains 420,000 boxes that contains hidden gifts and real prizes. I had to find a way to ensure the board mechanism works well so that the boxes can be recovered that the users will always have boxes to play with. I also needed to find a way to cache the user interaction so that there can be a realtime world map to show the status of the Paris.

In phase 3, we put those 1400 winners in phase 1 into the TV trailer and make it interactive in the website. User can discover them by hover the trailer and there are some frames contains different images with depth of field. Also, there is a Giga pixels panorama view for those winners who are not in the trailer.

Agency: 60fps, Sidlee

Client: Ubisoft

Awards: SOTM on FWA/ SOTD on Awwward/ 1 Silver, 2 Bronze on Cannes Lions/ 2 Silver, 1 Bronze on Eurobest/ Grand Prix de la Publicité 2015

Related links: Case Study

Dan Paris

This is the portfolio site I developed for Dan Paris. My role involved all frontend development and backend JSON development. Since it is updatable, I created extendable template system for the projects so that the client can add more templates easily afterward.

Agency: 60fps, Dan Paris

Client: Dan Paris

Awards: SOTD on FWA/ SOTM on Awwward

Related links: Live site


I Remember is a website for fund raising for Alzheimer's disease. The site will fade away when the users do post their memory. All particles are rendered using WebGL with custom GLSL shaders.

In this project, I did all of the front/back end development. I created custom GLSL shaders for all of the particles and postprocessing effects. For the backend and client CMS, I used Laravel 4 as I had experience using this framework before.

Agency: 60fps, Werkstatt, CLM, BBDO

Client: Fondation pour la Recherche Médicale

Awards: SOTD and TCEA on FWA/ SOTM on Awwward

Related links: Live site / Case study

Paco Rabanne Invictus

Paco Rabbane Invictus is a HTML5 Canvas website. It uses a lot of subtle lighting and cloud effects.

I do all of the frontend development as well as parts of the backend development in this project. The hardest part of this project is to fine tuning the subtle canvas effects. As this site needs to work on IE8 and tablet devices, I had to develop it in the way that the animations/effects will have some sort of fallbacks.

Agency: 60fps, DAN Paris

Client: Paco Rabanne

Awards: SOTD on FWA

Related links: Live site

Obsession | Channel for iPad

It is an interactive HTML5 website embedded in an iPad app. The user can seamlessly play 2 videos back/forward by rotating along the Chanel logo.

Due to the restriction of iOS, it is not possible to jump to different position in 2 videos seamless and play backwardly, I did some tricks to make it work. I merge several videos into one and recalculate the video timing in runtime.

Agency: BETC

Client: Obsession, Chanel

Related links: Live site

Les Revenants Mobile site

In order to achieve the interactive 3d panorama experience on mobile devices, I created my own 3d engine and did tons of optimization. Like the animated characters in the 3d scenes are using sprite sheet due to the restriction of mobile devices. I also created a custom 3d scene editor and script engine for the non-technical people to change the experience easily.

Agency: BETC

Client: CANAL+

Awards: MOTD on FWA

Related links: Live site

Music Can Be Fun

Back in 2011, right after I finished my Flash portfolio. I saw the HTML5 contest by Microsoft and it was my first HTML5 website which well used the IE9 hardware acceleration technology.

Awards: Champion prize of the Microsoft Dev. Unplugged contest

Related links: Live site

Mountain Dew Kickstart

Agency: firstborn

Client: Mountain Dew


Agency: firstborn

Client: Sobe

Awards: SOTD on FWA

Related links: Live site