Still ironing out the responsive layout! If you're checking this on a tablet or mobile, thanks for your patience. 🙏
Unlike a typical UX Designer in this day and age, my career roots trace back to the end of the Adobe Flash epoch in the digital agency scene. As a technical designer, or what some might call a ‘Creative Technologist’ (read¹)(read²), I specialize in bridging the gap between design and engineering, with a strong focus on crafting design systems & iconography, prototyping and integrating motion design into interaction and product experiences.
CHROMA STUDIO — The RGB Battlestations Editor
Product Design & Illustration
The Razer Chroma, Chroma Studio empowers customers to create and customize vibrant RGB lighting effects for Chroma-enabled devices. With intuitive controls, it allows for complex, layered patterns, game-synced effects, and precise key or button illumination. Making it the ultimate tool for personalizing your battlestations.
RAZER Windows SOFTWARE Component Library
Interface DESIGN
Initiated a component library and iconography in Adobe XD for the UX team behind Razer Synapse, Chroma RGB, Streamer Companion App, THX Spatial Audio, and 7.1 Surround Sound, back when Razer had no dedicated design systems team.
I occasionally use code to prototype interactions and motion natively, making them readily available for engineers to implement. The above can be seen on Razer Synapse 3 using the Razer Naga Trinity or Razer Naga Pro Wireless.
EARLY CONCEPTS
The team explored numerous early concepts, narrowing them down over time. Ultimately, the final decisions rested with Min (CEO). Here are a few of my personal favorites that didn’t make it to the customer keyboards.
PIIII KAAAA CHUUUUUUUU!
I also designed the custom Pikachu startup Chroma animation exclusively for the Razer Pokémon Limited Edition Gaming Soundbar, available only in China.
The animation mimics Pikachu's Thunderbolt move, beginning with two red LEDs representing Pikachu's iconic cheeks. These emit a few sparks, followed by a striking thunderbolt effect.
creating emoji and emoji animation editor on Streamer Companion App
Interaction & Interface Design
pixel art & Motion Design
A Windows app that delivers captivating light shows during live streams, reacting to subs, followers, donations, and chat keywords with emojis and dynamic lighting effects.
I designed a suite of ready-to-use emojis for streamers and developed a frame-by-frame emoji animation editor, enabling streamers to craft their own unique animated emojis.
A concept phone case for the Razer Phone featuring a slide-out controller for seamless gaming on the go.
Drop + Glimy
DSA 2077 Keycap Set
KEYCAP DESIGN
Participated in a Drop.com contest in 2017, where my sci-fi-inspired design was voted the winning piece by the community and brought to life. It was manufactured by Signature Plastics using Doubleshot ABS material.
And to answer the inevitable question, no, the year wasn’t inspired by Cyberpunk 2077.
Made a set of artisan polymer clay cat keycaps as a farewell gifts for my UX team at Razer.
Made a bunch of Pochita keycaps from Chainsaw Man.
Durian Hedgehog artisan keycap made with polymer clay.
DESIGNING 2077 Theme FOR THEMEBOARD APP
Interface DEsign
Before DSA 2077, there was a 2077 theme for the Themeboard app by Taphive. An iOS 8 custom keyboard app that let designers submit themed keyboard designs without the need to develop a keyboard app from scratch.
DESIGNING A CALCULATOR USING iOS CUSTOM KEYBOARD SDK
Product DESIGN
It's called Keykulator. Co-designed and developed with Zoon when Apple introduced custom iPhone keyboards with iOS 8. I wanted a way to calculate numbers directly from the keyboard without switching to the calculator app. Unfortunately, Apple rejected it for not complying with their guidelines. 🤷
Designed this AR glasses concept in 2016, enabling users to effortlessly retrieve bus arrival information simply by looking at a bus stop sign, along with other interactive features.
Snippet of animation for Resort World Genting & Star Cruises Mobile Baccarat How-to video.
Illustrated and animated Singapore’s oldest surviving dragon kiln for a pro bono interactive ebook. Contributed by designing a page that detailed the anatomy of the dragon kiln.
“Shazam” for the Myanmar music industry - Melomap
Moe, a developer, launched his own 'Shazam' for the Myanmar music industry. I laid the foundation for the UI components and motion design.
Melomap has discontinued its service.
A practice piece of Kylo Ren inspired by his first appearance in The Force Awakens teaser. And no, I do not condone his actions.
DESIGNING THE
IE SINGAPORE: GLOBALISING SG INTERACTIVE E-BOOK
Product DESIGN
An interactive e-book app showcasing Singapore's journey to becoming a global trading hub and expanding its companies' global reach. Contributed to the iPad implementation and adapted it for a seamless mobile experience.
Agency: Dezainwerkz
Client: Enterprise Singapore
No longer available
Worked as an animator on a motion graphic project for Esplanade with Pupilpeople.
GESTURE ICONS
ICONOGRAPHY
Featured in BranD Design Magazine 2014 E “Hand Communicates” issue.
DESIGNER
INTERACTION
INTERFACE
MOTION
Media Features
Behance (02 May 2015) — Featured App Design for IE Singapore: globalisingSG App
Behance (12 Mar 2015) — Featured App Design for SG TravelKaki
BranD Design Magazine (2014, Issue E) — “Hand Communicates” Gesture Iconography
Lian He Zao Bao (23 Sep 2009) — Featured 魔 illustration as part of Noise Singapore
Gameaxis (March 2008) — Featured Just Connect illustration as part of Noise Singapore
Awards
Gong Show 2008 — Silver in Interactive Craft (Animation and Motion Graphics) for Mix & Mash Installation for Samsung Asia