Back to blog
Build Logs20 Mar 20261 min read

Building a portfolio that feels alive

The core idea behind this site was simple: if everything looks polished but nothing reacts, it still feels dead. I wanted motion, friction, feedback, and a bit of personality in every section.

Building a portfolio that feels alive
Next.jsUXMotion

Highlight

Interaction should feel intentional, not decorative.

Most personal sites are finished the second they load. You scroll, you read, you leave. I wanted mine to keep revealing itself. Not through noise, but through small moments that suggest there is an actual person behind the interface.

The rule set

  • Every motion needed a job.
  • Metadata should sound like a system, not marketing.
  • The page should reward curiosity without becoming a gimmick.

That is why the home page uses staggered reveals, the navbar scrambles text, the project cards expand like panels, and even the scroll feedback is treated as part of the interface language. The point was consistency. Once you establish one interaction pattern, the rest of the site has to speak the same dialect.

components/animated-section.tsxtsx
const observer = new IntersectionObserver(
  ([entry]) => {
    if (entry.isIntersecting) {
      setTimeout(() => setIsVisible(true), delay)
      observer.unobserve(entry.target)
    }
  },
  { threshold: 0.08, rootMargin: "0px 0px -30px 0px" }
)

If a detail feels invisible when it works, that usually means it is doing its job.

TThe blog is an extension of that same thinking. It cannot look like a CMS template. Same system, just less noise.

Otherwise it’s just a screenshot pretending to be a website.

A page not found that still wants to be found.ts
Small Easter eggs.
An interactive terminal.
Even the 404 page is not really an error.

If you explore long enough, things start to show up.

Share