← All projects

FisioterapiaCasuso

A dynamic experience that explains assessment, clinical judgement and treatment tools without turning technique into an outcome promise.

portfolio.local/demos/fisioterapia-casuso
Fisioterapia Casuso hero on desktop
Fisioterapia Casuso hero on mobile
  • ARIA accordion
  • Three-step method
  • Editorial motion
  • Fixed mobile contact
Sector
Physiotherapy
Contribution
Art direction · Interaction · Front end
01

The commercial challenge

Explain technique without losing sight of judgement.

Need

The proposal combines practitioner, approach, four treatment tools, clinic information and contact. Technical content needed depth without dominating the entire page.

Objective

Present a practice centred on assessment before intervention and let visitors explore each treatment on demand from any device.

Designed response

I defined the art direction, architecture, interactive accordion, motion system, responsive navigation and contact hierarchy.

Built with

HTML5CSS3JavaScriptARIAIntersectionObserverJSON-LD

Validated with

Playwright QA1440 / 390 px
02

Interface evidence

The solution on screen

Fisioterapia Casuso original hero
01

Assessment comes before technique

The narrative places clinical judgement before the tools to preserve a professional, understandable hierarchy.

  • Three-stage method
  • No outcome promises
  • Techniques presented as support
Treatment accordion on mobile
02

Interactive depth in one column

The accordion opens one treatment at a time, updates accessible state and reduces initial page length.

  • Updated aria-expanded
  • Panels use hidden
  • Readable mobile state
03

Commercial journey

From initial assessment to an accessible action.

  1. 01

    Assess

    The hero introduces judgement and movement.

  2. 02

    Understand

    The method explains the care structure.

  3. 03

    Explore

    Four tools open on demand.

  4. 04

    Book

    Phone and directions stay accessible.

Fisioterapia Casuso mobile composition

Demonstrated capabilities

Interaction and narrative reduce complexity together.

The accordion, motion and hierarchy demonstrate interaction design for dense clinical content and clear mobile conversion.

Discuss a project
04

Verifiable build

The engineering stays available without slowing the story.

Solution

An exclusive accordion concentrates detail while keeping every title visible.

Solution

Ticker, reveals and scrolling coordinate through requestAnimationFrame and IntersectionObserver.

Solution

A fixed bar keeps the primary action available.

Built features

Interactions with a specific purpose.

  • Menu with aria-expanded
  • Continuous ticker
  • Three-step method
  • Exclusive accordion
  • IntersectionObserver reveals
  • Fixed mobile contact
  • Phone and Maps
05

Implementation quality

A technical, dynamic and controllable experience.

Responsive

Accordion, ticker, navigation and contact bar adapt specifically to touch interaction.

Accessibility

Skip link, ARIA controls, hidden panels and keyboard structure support interaction.

Performance

Direct HTML, CSS and JavaScript; animation is concentrated in a small number of controlled loops.

Delivered

  • Responsive navigation
  • Three-step care method
  • Functional four-treatment accordion
  • Phone and location contact

Does your offer need this kind of clarity?

Let’s design a website that helps people understand, trust and act.

Tell me what the business sells, what content exists and where the decision stalls today. We will define scope before quoting.

Request a quote