Hello & welcome

I’m Sujoy Kr. Haldarui/ux Designer & Design Engineer.

Portrait of Sujoy Kr. Haldar

I design thoughtful digital experiences and bring them to life in code, crafting polished frontends backed by solid backend know-how. Away from the screen, I'm an artist who draws detailed pencil portraits.

About me

I'm a designer who codes. I care about the space between an idea and the screen: the type, the motion and the small details that make an interface feel alive. I take products from the first sketch to a polished frontend, and I'm comfortable going deeper into the backend when a project needs it. Away from the screen, I pick up a pencil. Drawing portraits taught me patience, light, and how much a single line can say.

My crafts

I don't just build interfaces, I take them apart. Each case study is told the way it was made: the thinking, the plan and the build, with live demos you can slow down and the real code behind every one.

My writing

I also write about how interfaces are made, and none of it is only read: every idea comes with a demo to drag, resize or switch, from easing curves to the files an AI agent reads.

  1. CSS

    Separators that know where the line breaks

    A mark between items, left hanging at the end of a line when the row wraps: why a breakpoint can't fix it, a script that can, and a few lines of CSS that do it better.

    1. 01Where they hang
    2. 02Not a breakpoint
    3. 03The JavaScript way
    4. 04The CSS way
    5. 05Which one

    Read it →

    06 · 6 min

  2. Data

    TanStack Query, visualised

    The cache you never see, drawn: query keys, fresh and stale data, one request for many components, retries, mutations, optimistic updates and pages, each played on a network you can slow down and break.

    1. 01The cache
    2. 02Fresh and stale
    3. 03One request, many readers
    4. 04Retries
    5. 05Mutations
    6. 06Optimistic updates
    7. 07Pages

    Read it →

    05 · 13 min

  3. UI

    The interface guidelines, played

    Rauno Freiberg's Web Interface Guidelines, every rule built twice: once without it and once with it, side by side, so you feel the difference instead of reading about it.

    1. 01Interactivity
    2. 02Typography
    3. 03Motion
    4. 04Touch
    5. 05Performance
    6. 06Accessibility
    7. 07Design

    Read it →

    04 · 14 min
Read all my writing