Noesis Slide System

Pitch Deck 原子能力

用组件和布局 primitives 替代 deck-local CSS

2026-07-13 · internal showcase
01 / Atomic Capability Map

现在的原子能力应该覆盖 deck 的 80% 基础需求

版式骨架

Cover、Section、Grid、Stack、TwoColumn、MediaFrame。

内容表达

Card、StatGrid、SignalPillRow、QuoteBlock、Callout、StepList。

演示控制

Reveal runtime、进度条、导航、概览、全屏、演讲者模式和 notes。

02 / Layout

Layout 应该像搭积木一样组合

不要在每个 deck 里写一套 grid/card/stat。让内容作者只选择结构，视觉由主题接管。
Design principle

可用布局

2 columns3 columns4 columnsasymgoldenstackmedia frame
03 / Metrics

数据页：指标卡 + 解释卡

Delivery snapshot

-70% 写 deck 时的局部 CSS 目标：迁移到组件和 sl-* class
+3x 布局复用速度 常用版式无需重写
1 source 主题一致性 tokens + theme config
built-in 演讲者模式 notes / preview / timer

设计收益

指标、标签、引述、步骤、媒体框都成为可组合原子能力，后续 deck 不需要再发明一套 .xxx-card。

04 / Media + Process

复杂页：媒体容器 + 步骤叙事

ContentAtomsThemeComposable Pitch Deck System
MediaFrame 支持图片，也支持任意 slot 内容。
  1. 01
    Author 写内容结构

    选择 Section、Grid、Stack，而不是手写布局 CSS。

  2. 02
    Compose 选择表达原子

    用 StatGrid、Callout、QuoteBlock、MediaFrame 表达常见信息。

  3. 03
    Theme 主题统一接管

    openai/stoneco/xhs 等主题只覆写 token 和少量语气样式。

05 / Target

下一步

把现有 deck 的 le-*、oai-*、xhs-* 局部 CSS 迁移到 sl-* primitives