lianasvet.ru

Case studies / Signature website · Wellbeing

A beautiful site that breathes — and stays light.

Liana Svetlanova is a kinesiologist and osteopractic practitioner: women’s practices, aesthetics without injections, “reset” and kinergetics, in Goryachy Klyuch, Krasnodar and online. Her workshop, Zvuchanie Zhenshchiny, needed a website worthy of work built on slowness and attention. We built it around the breath: every movement on the page follows the same cycle, there’s a 3D map of the body — and none of it is paid for in speed or accessibility.

lianasvet.ru ↗

lianasvet.ru
The first screen of the lianasvet.ru home page on desktop: the photograph and the headline revealing itself line by line

The problem

A beautiful site is usually a heavy one.

In wellbeing, the website is the first meeting: visitors should feel calm and care before they read a word. That’s why personal sites in this field often go all in on effect — huge photos, animation, maybe a little 3D. The phone pays the bill: pages that load in fits and starts, motion that distracts instead of guiding, and people who browse by keyboard or don’t cope well with animation get left out.

There’s a second, subtler risk: overpromising. Bodywork touches on sleep, tension, the face — and it’s easy to slide into claims no study supports. A beautiful site that promises too much doesn’t earn trust.

Our answer

The design follows the breath, and every effect earns its weight.

We gave the site a single rhythm: a slow breath. Every animation derives from it, written by us as a tiny motion engine rather than a heavy library pulled in from outside. The showpiece — a 3D map of the body — was cut down to a fraction of its original weight. And the copy draws a clear line between what is proven and what is experience. It’s the care we put into every signature website: beauty, yes, but without leaving anyone behind.

✓All motion comes from a single breathing cycle, 10.9 seconds long
✓Our own animation engine, about 2 KB gzipped
✓3D body map: from 37.2 MB down to 0.55 MB, usable by keyboard too
✓With “reduce motion” switched on in the system, every animation turns off

Breath tempo

Every movement follows the same breath.

Five and a half breaths a minute: one full cycle lasts 10.9 seconds. The whole site is tuned to that number — every duration is derived from the same cycle, so nothing moves at random or in a hurry. Even the headline breathes, its letterforms shifting slowly along the axis of a variable font. Visitors don’t count the seconds, but they feel that the page has a calm, consistent pace, the same from one section to the next.

lianasvet.ru/telo
The body map on lianasvet.ru/telo on a phone: the headline ‘Where the body holds tension’, the figure with its points and the hint to drag it to rotate

The body map on a phone: soft light, the figure with its points — you turn it with a finger.

01Lines that rise. Headlines slide out from under a mask, one line at a time.
02Frames and depth. Image frames open up, and layers drift with a gentle parallax.
03Numbers and lines. Counters tick up, lines draw themselves as you watch.
04Living light. Soft glows that give the page warmth without pulling the eye from the text.
05About 2 KB. All of this is our own engine, about 2 KB gzipped, instead of a heavy animation library.

And if “reduce motion” is on in the device settings, the site honours it all the way: every animation switches off, the content stays.

Body map · 3D

A 3D body that doesn’t slow anyone down.

The /telo page holds a three-dimensional model of the body with six points, each opening its own panel. 3D weighs a site down fast — the model we started from was 37.2 MB. We brought it down to 0.55 MB, from 831,198 to 41,550 triangles. The 3D scene loads separately, and the home page, which has to open quickly, doesn’t use WebGL at all.

01From 37.2 MB to 0.55 MB. The model goes from 831,198 to 41,550 triangles.
02Six points, real buttons. You reach them with the Tab key and open them from the keyboard, not only with a mouse or a finger.
03Loaded on its own. The 3D scene arrives separately from the rest of the page; if it isn’t available, a silhouette stands in for it.
04No WebGL on the home page. Two static renders take the place of the 3D scene, so the main page stays light.
lianasvet.ru/telo
The 3D body map on lianasvet.ru/telo: the figure with its points and, on the right, the list of six places — back of the head, jaw, neck and collarbones, shoulders and upper back, diaphragm, lower belly

The 3D model with the list of six places beside it: each one opens its own panel. All six points are real buttons, reachable from the keyboard.

Content · photos · autonomy

Honest in the words, consistent in the pictures.

The beauty of a signature website isn’t only in the motion. It’s in the tone of the copy, the consistency of the images — and in the author being able to look after it herself, without calling a developer for every comma.

01A circle to breathe with. The /rezet page has a breathing circle you follow right there on the page: the practice can be tried straight away.
02Proven and experience, kept apart. The direction pages carry blocks that separate what is proven from what is practical experience.
03One photographic series. The photos, supplied by the client and taken at different shoots, were colour-graded by a script into one consistent series.
04The copy in the client’s hands. A lightweight panel lets her edit her own texts, with snapshots to roll back to an earlier version.

The workshop’s four directions:

Women’s practicesAesthetics without injectionsResetKinergetics
lianasvet.ru/rezet
The /rezet page of lianasvet.ru on a phone, with the breathing circle to follow

The breathing circle on the /rezet page, to follow with your eyes straight from the phone.

How it’s built

Beautiful, yes — but fast, findable and accessible first.

Under the surface it’s a modern, restrained build: React and TypeScript, bundled with Vite; three.js comes into play only for the body map. The build generates ready-made HTML with the content for every page, meant for whoever arrives — a person or a search engine — before JavaScript even starts.

The site is in Russian and speaks to women; it has been live since September 2026.

SpeedFirst screen from 1,081 KB to 191 KB, LCP from 2.9 s to 1.5 s — the developer’s lab measurement
SEOFor every URL its own title, canonical, Open Graph and structured data (Person, Service, FAQPage, BreadcrumbList); automatic sitemap; an honest 404; favicon to Yandex’s requirements
AccessibilityA skip-to-content link, the closed menu taken out of the tab order, “reduce motion” switching every animation off
AutonomyA lightweight panel for the texts, with snapshots to roll back
Structure10 URLs: 7 pages and 3 journal articles
TimelineFrom 8 August to 16 September 2026

The result

Beauty that isn’t paid for in speed.

191KB

first-screen weight, down from 1,081 KB — lab measurement

1.5s

LCP, down from 2.9 s — the developer’s lab measurement

0.55MB

the 3D body model, down from 37.2 MB

BUILT BY STUDIO REMARKA FOR THE CLIENT — VERIFIABLE AT lianasvet.ru

Interested in this project?

Need a custom website or app? Let’s talk.

We design and build custom websites and web apps for companies and professionals. Tell us your idea: we’ll reply with an analysis or a fixed quote.

  • Fixed quote within 24 hours
  • Clear price, no surprises
  • Your data stays in the EU

Quick request

Prefer to tell us everything at your own pace? Fill in the brief →