01Vertical / CinematicOrigin Cinema
Immersive narrative system
Full-screen chapters use photography, pacing, and restrained type to build confidence one scene at a time.
Best for: premium services, property, hospitality
The original experience library / 01-12
Twelve ways a website can move.
A working catalogue of premium interaction systems, built to be touched, navigated, and understood in motion.
Enter the libraryVertical progression / spatial navigation / full-screen transformation
The Sotory standard / 001
Interaction is part of the message.
Each moment has one job. Direction, sequence, pacing, and spatial memory help visitors understand what matters without fighting the interface.
Motion is never decoration. Every transition must improve meaning, orientation, or the path to action.
The collection / 01-12
Experience systems.
Each system is a complete interaction direction. Open one to use it, move through it, and feel how its navigation changes the story.
Showing 01-03 of 12
01Vertical / Cinematic
02Horizontal / GridMeridian Grid
Structured lateral system
A disciplined horizontal journey that turns each section into a precise panel with clear forward and backward movement.
Best for: architecture, engineering, professional firms
03Vertical / ColorColor Current
Chromatic transition system
Color becomes a navigation signal, carrying visual momentum between focused business sections.
Best for: creative brands, events, modern retail
04Horizontal / RailCommand Rail
High-contrast navigation system
A compact side rail keeps complex content within reach while the main canvas stays cinematic and focused.
Best for: legal, security, technology, consulting
05Vertical / EditorialEditorial Drift
Magazine-inspired story system
Long-form thinking meets tactile mobile movement for brands with a strong point of view and a story worth reading.
Best for: studios, publications, cultural brands
06Vertical / AccessibleClarity Stack
Accessible panel system
Generous controls, direct language, and stable panels create a confident experience for the broadest possible audience.
Best for: healthcare, public service, senior audiences
07Mixed / FeedBusiness Reel
Social-native business system
A vertical business feed with optional horizontal detail stories, combining familiar gestures with useful depth.
Best for: contractors, portfolios, active brands
08Vertical / SequenceSystem Story
Guided process system
Complex workflows become an understandable sequence, turning invisible operational value into a visible story.
Best for: SaaS, automation, operational services
09Vertical / ProductProduct Stage
Demonstration-first system
The product remains the visual lead while specifications, proof, and purchase intent arrive at the right moment.
Best for: products, equipment, e-commerce
10Vertical / PersonalFounder Voice
Authority-led narrative system
A human-centered format that makes expertise, conviction, and direct communication the primary interface.
Best for: founders, advisors, coaches, experts
11Transform / FlipFull Turn
Two-sided flip system
Each complete page turns into the next, giving transitions physical presence without fragmenting the content.
Best for: campaigns, launches, bold presentations
12Transform / FoldLiving Fold
Two-sided folding system
The current section folds as one complete surface, revealing the next section on its reverse side.
Best for: storytelling, education, guided discovery
The Sotory framework / 004
Movement must improve meaning.
Every experience is evaluated against four practical principles. If an interaction does not improve orientation, comprehension, confidence, or action, it does not belong.
Interaction architecture for business outcomes
01
Orientation
People understand where they are, what changed, and where they can go next.
02
Comprehension
Sequence and pacing reduce the effort required to understand the business.
03
Confidence
Visual behavior feels intentional, stable, accessible, and appropriate to the promise.
04
Action
Every chapter moves toward a useful decision instead of an ornamental dead end.
Field Notes / Publication
Writing the playbook.
Research, principles, and practical guidance for designing websites as navigable experiences rather than stacks of interchangeable sections.
How to choose a website navigation system
A framework for deciding when vertical, horizontal, guided, or transformed navigation serves the story.
Read articleWhen motion improves a business website
How directional memory, hierarchy, and restraint turn motion into a useful business tool.
Read articleCan immersive websites be accessible?
Keyboard paths, reduced motion, focus management, target sizing, and alternatives to gesture-only controls.
Read articleWhat is experiential web design?
A practical definition of a website designed as a navigable experience rather than a stack of sections.
Read articleBuild with Sotory