MSlide³ organizes content as a guided journey.
Unlike MSlide², which focuses on structured exploration through sections, slides, and visual navigation, MSlide³ focuses on progression through Content States. Shared framework architecture, navigation behavior, and inherited state patterns are covered in the MSlide² Build documentation.
A journey is the main experience path.
Journey
│
├── Content State
│
├── Content State
│
├── Content State
│
└── Content State
Each Content State represents one focused stage of the experience.
A basic MSlide³ journey is built from full-height sections.
<!-- Content State 1 -->
<section class="full-height-section" id="intro">
<!-- State content goes here -->
</section>
<!-- Content State 2 -->
<section class="full-height-section" id="product">
<!-- State content goes here -->
</section>
<!-- Content State 3 -->
<section class="full-height-section" id="contact">
<!-- State content goes here -->
</section>
The full-height-section class defines each major Content State.
The id gives the state a semantic destination.
A Content State is a focused screen within the journey.
<!-- Single Content State -->
<section class="full-height-section" id="product-overview">
<div class="hero is-fullheight">
<div class="hero-body">
<!-- Main state content -->
<h2>Product Overview</h2>
<p>
Focused content for this stage of the journey.
</p>
</div>
</div>
</section>
MSlide² structures content for exploration.
MSlide³ structures content for progression.
MSlide²
│
└── Structured Content Exploration
MSlide³
│
└── Content State Journey
MSlide² documentation covers the shared foundation.