← Work

NeoPhi · 2026 · Motion design

NeoPhi · Motion design system

NeoPhi · Motion design system

Twenty-one live animations for an AI platform built for scientific research: the feature system of its website, a secure workflow told as a flow, and ambient loops, all running as code in the browser.

21

Live animations

Delivered as HTML, played in the browser.

3

Features animated

Search, knowledge graph, synthesis with sources.

4

Aspect ratios

4:3 heroes, 5:4 sub-sections, fluid wide, 9:16.

0

Screen recordings

Everything is drawn, nothing is captured.

The brief. NeoPhi is a platform that helps researchers work through large corpora of scientific publications, built and hosted in France, with its AI kept inside a closed perimeter. When FMRXR took over the marketing mandate in the summer of 2026, the website explained three features with static screens. The ask was to make each feature legible in motion, in the exact slots of the live site, without screen recordings and without stock motion, and to tell the security argument visually rather than in a paragraph of compliance terms. The constraint that shaped everything. A research tool is judged on trust. Nothing could look like a gimmick or promise more than the product does: no fake interface, no invented figures, no spectacle. The motion had to read as reasoning, a question becoming a set of sources becoming a cited answer. The answer. One visual grammar for the whole system, drawn from the NeoPhi brand: a central sphere that breathes, dashed orbits that turn slowly, document cards, and citation traces drawn as marching dashes. Each of the three features (semantic search, knowledge graph, synthesis with sources) gets a hero in 4:3 and three sub-sections in 5:4, matching the site's own layout. The secure workflow follows a query into an isolated environment and back out as a traceable synthesis. Three CSS loops sit behind section copy without competing with it, and the full workflow has a vertical version for social, recomposed rather than cropped. Delivered as code, not video. Every piece is a self-contained HTML file the site can drop into an iframe: lighter than a video, sharp at any resolution, and alive under the cursor. What you can play below is the delivered files themselves. The same system then fed a platform demo, built as one continuous session on the real interface: one question, one corpus of a hundred publications, from start to finish. Delivered in August and September 2026. The client's feedback on the website motion was positive on first review.

Role

Art direction · Motion design · Front-end animation · Storyboard

Stack

HTML/CSS · GSAP · SVG · HyperFrames

Open in a new tab ↗
The delivered HTML files, running live. Open in a new tab for the full view.

Similar brief?

Build an experience like this one.