Skip to main content

Uses

A somewhat comprehensive list of tools, apps, hardware, and more that I use on a daily basis to design and code things. And yeah, that is a Johnny Mnemonic GIF in the background.

Design

  • Figma is my primary tool for UI design these days. Made the switch from Sketch in 2020 and haven’t looked back. I’ve also created a few plugins that you can install.
  • Any motion graphics I create are created in Adobe After Effects. So far I haven’t found a non-Adobe product that’s as good. If anyone has suggestions please message me.
  • For any 3D models and video editing I use Blender. Since 2.8 it’s become way simpler to use and in a lot of ways better than expensive paid tools like 3DS Max or Maya.

Development

  • I use VSCodium as my text editor, with the Tokyo Night theme and Operator Mono as my typeface of choice.
  • Firefox is my main browser for both development and general use.
  • React is my front end Javascript library of choice. The component-centric mental model is the first thing that truly made sense to me as a designer.
  • For 3D effects and image shaders I use three.js. It has a bit of a learning curve but you can do some really powerful stuff with it.
  • For CSS I’ve used a myriad pre-processors and css-in-js solutions like styled-components, but these days I’m using vanilla CSS with PostCSS to get upcoming CSS features today.
  • For Javascript animations I use Framer Motion, it’s a great way to add spring animations to React and three.js.
  • For building and testing UI components in isolation I use Storybook. Check out the storybook for this website.

Hardware

DesktopCustom built
Operating systemArch Linux (by the way)
Monitor1440p IPS 144hz LG 27GL850
KeyboardTofu65
MouseLogitech G403
LaptopMacbook Pro 14″
HeadphonesAudio Technica ATH-M50x/Apple Airpods
MicrophoneBlue Yeti