Next.js and React with TypeScript, Tailwind CSS for styling, and Motion for the interactions. A few primitives (the scroll areas and pills) come from shadcn/ui; the rest is custom-built for this site. Icons are Tabler and Lucide, the interface sounds are synthesised live with cuelume, and the type is set in three faces: Geist for the interface, Geist Mono for the technical bits, and Caveat for the handwritten asides. Hosted on Vercel, with the images and video served from Cloudflare R2 so the site stays quick as the media grows.
AI helped me implement the ideas, but the ideas themselves are mine. The structure, visual direction, interactions, accessibility decisions, and every pixel were shaped by my own judgement.
About this site
My previous portfolio was built around visual direction and experimental ideas. It gave me a lot of creative freedom, and Framer was a big part of that process. It was also where I challenged myself to learn something I didn't know and eventually became comfortable with it.
Since then, my approach to design has grown.
I became more aware of the inconsistencies in my work and the things that can get lost when visual design takes the lead, particularly accessibility, clarity, and usability.
This redesign was a chance to step away from those habits and put UX first.
I wanted the visual design to support the experience rather than become the experience. A big part of that came from White by Kenya Hara, and his ideas around white space and how it can be used with intention. White space was already something I explored in my previous portfolio, so I wanted to carry that idea forward here, but with more restraint and purpose.
The goal was to find a balance between accessibility, minimalism, and small interactions that make the site feel personal without getting in the way.
I also wanted my work to be experienced, not just viewed. So wherever possible, my prototypes and experiments are live and interactive.
As a canvas
I've always treated my portfolio as a canvas, and this website as a piece of art in its own right.
I'm an artist myself, so the making matters to me as much as what it holds.
From the preloader to the fade ins and fade outs, the timing between them, the morphs, the easing curves, how the content is presented and designed, the responsiveness, and that small, pleasant feeling in the details, I've treated every part of it as a form of art.
Still evolving
This portfolio is not finished, and I don't think it needs to be.
I'm proud of what I've built, but there is always something to improve. For now, the aim is simple: make it easy to find what you're looking for, make it enjoyable to explore, and let a little of my personality come through in the details.
This one is less about a visual effect than a decision on how the interface should behave. For a while the only way to close the feed and return to center was to tap the active tab again. That was my mental model, and it worked.
But watching a stranger use it, almost no one would guess that. Tap to open is obvious. Tap the same thing again to close is a hidden gesture. The working thing was not good enough once it left my own head.
So I added an explicit close button next to the controls, shown only while the feed is open. Same outcome, now discoverable, and the tap-again shortcut still works for anyone who found it. The feed above starts open, because the whole question is how you get back out: flip Before and After, and try to close it in each.
Thejas Hassan Ravishankar is a design engineer in Sydney. He designs and builds product UI, interactive experiences and creative technology, with a focus on how software feels to use.
