behind the scene of this website
This site started from the idea of finally hosting my own space, something I can just edit late at night in a Dracula themed VSCode, trying to remember which command actually pushes it to the web. I tried tools like framer and webflow
. I made polished screens, but every year I looked back and felt ugh… this already looks old and the same as everything else.
It is built with next.js and tailwind
, with project pages in markdown so future me does not hate myself too much when I make edits. Since my code knowledge is no muy bueno, Claude
helped a lot along the way.
In earlier versions of this site, I experimented with fonts like Inter, DM Sans
, and IBM Plex Sans
. For this version, I’ve settled on Geist
.
The pixel art on this site was first inspired by an earlier ChatGPT experiments and then customized/edited in Aseprite
. For animations, I checked out sprite examples on Spriters Resource
and created short sequences using my Wacom Tablet. Alongside the pixel artwork, the interface also uses icons from Lucide
.
While working on this design, I spent a lot of time exploring resources like Dead Simple Sites, Minimal Gallery
, Game UI Database
as well as wandering through the digital gardens of various creators. Unfortunately, some gems are lost to me since I forgot to save them in my Raindrop “fave websites” collection. Still, a few stood out as major inspirations that shaped the direction of this site:
This website has gone through many iterations over the years, but since this is the first version I’ve actually hosted myself, I’m calling it v1.0. The earlier versions still matter to me as they’re a reminder of how often I’ve agonized over my portfolio.
The very first version of this website was built with Webflow. I spent countless hours trying to figure out how containers worked and how to keep everything responsive, all while experimenting with BEM naming conventions. Eventually, I gave up and ended up with a messy setup that made editing a nightmare.
The first ever homepage of thisisdoga.com
Old case study page, spent too long just trying not to make the images a blurry mess.
Proof I can design and draw questionable portraits.
Still on Webflow, I got curious about no vertical scroll pages and playing with some animations. This time I wanted to step away from heavy illustrations and aim for a cleaner, more modern look, basically trying to match whatever felt “cool” at the time.
Back before ChatGPT, when the em dash was still cool.
The thing about portfolio sites is that every now and then you get the itch to redo them. Non-designer friends would go, “You’re working on your portfolio again!?” but once you learn new tricks, your old site starts glaring at you like, “Really… this is the best you can do?”
When the itch got too strong, I jumped to Framer, which at the time was buzzing as the "Figma for websites.” What followed was months of agonizing over every detail (is this layout okay? ugh, I hate this nav bar… why did I even start this again?). About 2000 revisions later, I finally finished it, and this was also when the pixel character idea first born.
The best part? Once it was done, Framer made things feel much smoother, the only headache left for me was wrestling with anchor links in project pages.
I still like the cleanness of this version, but it feels a bit generic.
Pixel Doga cameo that probably no one noticed.