Karmadema.com
UX/UILive

Karmadema.com

The studio's own home: designed, built, and shipped end to end. A living UX/UI case study that evolves in public.

View Website

Project Conditions

RoleDesigner & Developer
ClientKDD Studio (self-initiated)
IndustryDesign
ToolsFigma, Next.js, TypeScript, Tailwind, Motion
DurationOngoing
StatusLive
Output
UX/UIWeb DesignDesign SystemFront-End Build

At a Glance

  • The studio's own site, designed and built end to end: Figma concept to self-hosted Next.js
  • Evolved in public: capsule navigation rebuilt as one continuous scroll after real-user feedback
  • Editorial design system, scroll-aware timeline, octopus mascot, envelope contact page
This website is itself a project: designed and built end to end by the studio, for the studio. It started as a Figma Make concept and was rebuilt as a self-hosted Next.js application with a documented design system, then kept evolving in public: a locked single-viewport capsule layout became one continuous scroll after watching real visitors struggle with unfamiliar navigation. The interface carries the studio's voice everywhere: an editorial, near-brutalist type system, a scroll-aware timeline that tracks your place through the sections, a pixel octopus mascot that books calls, and a contact page shaped like a plum envelope. Every project page is a scannable case study with its own URL, and every decision, from corner radii to conversion paths, is treated as design material.
Karmadema.com detail 1
Karmadema.com detail 2
Karmadema.com detail 3
Karmadema.com detail 4
Karmadema.com detail 5
Live Preview
https://karmadema.com
Karmadema.com live siteVisit the live site

Case Study

Final Artifact

The site you are on: a living product with per-project case-study URLs, a documented design system, email capture, booking, and a blog, shipped continuously.

Key Design Moments & Impact

01

The scroll decision

The signature capsule navigation was retired when visitors found it unfamiliar; scrolling is the one gesture everyone already knows.

02

The timeline, demoted to speedometer

Navigation became a scroll-progress rail: same brand signature, zero learning curve.

03

Personality as interface

A pixel octopus greets and books calls; contact is a purple envelope. Warmth is part of the UX, not decoration.

Reflection

Being your own client is the hardest brief. Every opinion in the studio's work had to survive being lived in, and the site is better for shipping, watching, and revising than it ever was as a concept.

Start a project

Want work like this for your brand?

Thirty minutes, free, no pitch — just your idea and where to begin.

Book a callhello@karmadema.com

Next Project