Back to projects
2026SerenisBrand identity and web design

Therapy you don't have to brace for.

Online therapy usually arrives in clinical blue and careful hush. Serenis takes the opposite line: a warm orange, real faces instead of abstractions, and an interface that moves.

Brand identityWeb designArt directionNext.js
Therapy you don't have to brace for.
The Serenis hero: a 'Licensed online therapists' pill, the headline 'Your mental wellbeing, one step at a time' split between a plain sans and an orange italic serif, a short subtitle, and two buttons, over a softly dimmed video of a person outdoors.
A slow video loop sits behind the headline, dimmed almost to a wash.
Three rounded photographs in a row (a figure meditating at sunset, two hands reaching toward one another, a person facing a sunrise with arms open) above the start of a How it works section.
Photographs do the emotional work before any UI appears.
A How it works section titled 'Three simple steps to feeling better', with three numbered circles in serif (1 Share your needs, 2 Meet your therapist, 3 Grow at your pace) joined by a thin horizontal line.
Three numbered steps, joined by a thin hairline.
Three feature cards (Chat with your therapist, Wherever you are, Personalised matching) above a full-bleed dark band reading 'Therapy that fits your life' over an aerial video of surf, with a Get started today button.
The feature grid drops into a full-bleed video band.
A dark rounded panel on a cream page reading 'Taking care of yourself is an act of courage' in sans and italic serif, a two-line subtitle, and an orange 'Book your first session' button.
The page signs off on a dark card, one orange button doing the asking.

The build

No animation library underneath. The service icons are live SVG: the heart beats, the shield's checkmark draws itself, the globe keeps turning. Video runs under the hero and the mid-page band, and the whole thing rides on the latest Next.js, intentionally light.

Built with

  • Next.js16
  • React19
  • TypeScript

Even the icons refuse to sit still.

The constant small motion does as much as the color, and keeps a page about therapy from reading like a waiting room.