Stack
Back End
Built using 11ty static site generator with nunjucks templating, because I want something low-maintenance.
Articles can written in markdown with the option to include custom HTML, so the best of both worlds.
Hosted on Github and deployed using Github Pages, but planning to move to Gitlab.
Front End
All screenshots are of software I have worked on.
All other images are my own creations, mostly drawn in Figma.
All animations are either screen recordings of my software or generated in Figma Motion based on my prototypes.
The intearctive molecule was rendered in rdkit.
I'm using alpine.js for filtering, because it's just nice to have your interactions defined inline.
The smooth-scrolling gallery is provided by splide.js because writing a good, smooth, interactive gallery in vanilla JS is beyond by JS ability.
Icons provided by the awesome Font Awesome.
The subtle animation on the steam coming off the mug was acheived using an SVG fractalNoise filter; I want to learn more about these, because they are crazy powerful.
Inspiration
Credit where credit's due. I believe in sharing your sources. The design for this site was inspired by several great creators who you should check out
- The stick figure design is of course based on Randall Munroe's ever-genius XKCD and the associated font is literally Randall's own handwriting.
- The cream and charcoal styling and Bricolage Grotesque font was basically stolen from Zen browser (which incidentally is my favourite browser)
- My good friend and incredible UX designer, Dev Patel, has a wonderful portfolio, I stole the design of several of his components