Liquid Navbar
A real small landing-page navigation with a measured, spring active surface.
Experience-level UI
Navigation, Heroes, ambient backgrounds, page transitions and spatial interfaces—built from Pinky's shared motion, pointer, scroll and morph systems.
02 · Heroes
Scroll turns one large visual statement into a calmer persistent surface.
Independent design practice
A meaningful compression, with no pinned scroll takeover.
A few pixels of separation between atmosphere, artwork and content.
Quiet systems
Four restrained layers, flattened for mobile and reduced motion.
Production copy, one tactile action and one low-intensity spotlight.
Pinky workshop
Start with semantics. Add the smallest response that explains the relationship.
03 · Backgrounds
Three slow themeable fields pause when this section leaves view.
A shared pointer source moves a broad, low-intensity local field.
Ten deterministic orbs—not a particle engine—with optional gentle repulsion.
A local light reveals structure without becoming a neon cyber grid.
04 · Transitions
Open the project surface: the source itself expands using Pinky's existing Morph architecture.
The content genuinely changes beneath a soft circular cover.
View 1
Find the quiet signal before adding movement.
Two transform layers create an expressive, short chapter handoff.
View 2
Let one interaction explain the relationship.
The calm production default, with focus transfer after change.
View 3
Return attention to the content, not the transition.
05 · Spatial
Choose real media cards with click, focus or Arrow keys; mobile flattens the scene.
Three product surfaces focus and recede without pretending to be an operating system.
Live overview
42% calmer handoffs
Live overview
19 experience patterns
Live overview
Keyboard paths passing
A labeled action arc with a compact linear fallback and focus restoration.
Adjacent slides recede in depth; controls and live labels remain explicit.
Soft concrete
Spatial study · 2026
Shared studio
Spatial study · 2026
Browse all · 32 experiences
Live studies stay above. This compact catalogue keeps the full family visible, with canonical patterns first and quieter variations kept in context.
name / relationship / detail
17 entries
An anchored navigation panel that reveals from its trigger edge while keeping the destination list compact.
A header that reduces its vertical footprint after deliberate scroll while remaining present and readable.
A project index whose links reveal contextual preview media on hover or focus.
A narrow edge rail that gives icons room to become labels when the user focuses or approaches it.
A typography-led numbered index with a traveling rule that keeps the current destination legible.
A mobile-first bottom navigation where the selected destination opens into a labelled action without changing the rail footprint.
A compact elevated navigation island with optional proximity and scroll collapse.
A destination row where the engaged item opens enough room for its context while neighbours yield space.
A layered menu where the base index stays present behind a context layer, preserving spatial relationship during selection.
A semantic navbar with a softly stretching spring active surface.
A compact trigger that expands into a spatially continuous menu surface.
A primary navigation surface that grows into its own contextual index instead of dropping a detached mega menu.
A compact navigation strip whose active destination gains real width and makes adjacent destinations move around it.
A docked vertical table of contents whose indicator bar tracks whichever heading is currently in the reading window.
A local section index whose active indicator follows the content currently entering the reading window.
A stable open menu surface whose internal group content slides directionally as the user browses.
A two-pane menu that gives one focused navigation group a contextual preview and clear next destinations.
3 entries
A layered Hero with restrained spatial separation between content and artwork.
A production Hero with one tactile primary action and optional local light.
A Hero whose major title and media composition compresses with page progress.
4 entries
A capped deterministic field of slowly drifting soft orbs.
A gentle local gradient field driven by shared pointer infrastructure.
A slow themeable three-stop atmospheric background.
A quiet structural grid revealed by a local pointer spotlight.
4 entries
A minimal fade, low blur and focus-aware handoff between keyed views.
A soft circular cover and reveal originating from a trigger or point.
A short two-layer soft wipe between keyed views.
A semantic route link or accessible Morph surface with shared visual identity.
4 entries
A selectable stack of overlapping product windows with quiet focus depth.
A practical configurable arc of actions around a central trigger.
A selectable gallery with shallow, readable spatial depth.
A sequential carousel where adjacent slides recede instead of only translating.