跳到正文

组件试验场

媒介组件库的现场演示与 QA 页面。

ParamSlider

拖动滑块试试 →

左边的滑块控制右边的知识网络：卡片越多，连接越密。

拖动滑块试试 →

多参数模式：频率与振幅共同塑造波形。

BeforeAfterSlider

文字描述的山与落日（线稿）
亲眼所见的山与落日（彩色）
⇔
文字 所见
拖动分割线：同一个故事，两种媒介档位。

ScrollScene

01 / 03

一切从一张卡片开始

每个想法都是一个节点。它们彼此孤立，安静地漂浮。

02 / 03

链接让知识生长

当你开始链接，节点之间出现了结构 —— 网络涌现了。

03 / 03

最终形成你的第二大脑

密集链接的知识网络，会在你需要的时候把答案递到手边。

滚动推进故事：可视化随场景平滑演变。

Timeline

  1. 🌱

    第一行 Swift

    从 UIKit 起步，爱上原生开发的手感。

  2. 🎙️

    Robert 立项

    语音优先的笔记应用开始动工。

  3. 🚀

    这个网站诞生

    从博客到超媒体容器。

时间线组件：节点随滚动渐入。

StatCounter

7
进行中的项目
1200+
知识卡片
3
媒介档位
100%
折腾指数
数字滚动计数：进入视野时从 0 数到终值。

AudioClip

自绘波形播放器：点击波形跳转进度。

InteractiveDemo

知识花园 · knowledge-garden

全屏 ↗
知识花园预览：深色背景上的知识网络 在新窗口打开演示 ↗
沙箱中运行的真实小软件：点击画布种下想法。未加载时先展示 poster 预览。

Robert · 语音笔记

全屏 ↗
在新窗口打开演示 ↗
语音录制 UI + 转写后的块级卡片。

Network · 键盘笔记

全屏 ↗
在新窗口打开演示 ↗
键盘导航卡片网格，Enter 进入 Markdown 编辑。

ImageGallery

线稿山景 文字档彩色山景 图像档站点默认 OG 图 封面
点击图片打开灯箱：Escape 关闭，方向键切换。

VideoEmbed

点击封面播放 在 YouTube 观看 ↗

封面点击后加载官方播放器；播放器被拦时可去 YouTube。

TweetEmbed

jack 已认证
@jack

just setting up my twttr

20:50 · 2006 年 3 月 21 日

自绘 X 卡片：完整正文；X 进原帖，头像与 handle 进主页。
余温 已认证
@gkxspace

牛逼，我真没想到，Dethink 居然把 Claude Code、Codex、各种大模型、不同的 Harness 还有 X、抖音、小红书、YouTube、SEO 的实时数据，甚至电商和金融数据，全塞进一个工作台了？？？ 一个窗口解决所有问题，随时切模型、切 harness，支持 BYOK 自己配置模型 Dethink 可以跑通这整个流程： 1、先接 X、抖音、小红书、YouTube、Instagram、Semrush 等实时数据，查趋势、关键词、竞品和用户反馈。 2、然后随时切 Claude、GPT、Grok、Gemini、DeepSeek、Kimi，同一窗口调用不同模型分析、写作、改方案、做图。 3、你还可以直接切 Claude Code 或 Codex 等不同的 Harness，并且同一窗口，前面的文件和上下文还在。 一条内容从找题、研究、成稿到配图，全在一个地方跑完。开发任务也一样，你可以随时切换不同的 Harness： Claude Code、Codex等，还能随时切换不同的模型，比如 Claude 规划、Codex 实现、Grok 来做快速任务...... 这个组合确实有点牛逼，还能稳定使用的 Claude Code / Codex 官方订阅，支持国内支付方式，🔗和优惠码放评论区

10:06 · 2026 年 8 月 17 日 在 X 上查看

长帖完整展开；视频在页内播放，不跳转。

CodePlayground

hello.js

const medium = ['文字', '图片', '视频', '软件'];
console.log(medium.at(-1) + ' 是最高档位的媒介');

document.body.innerHTML = '<p style="font-family:system-ui;padding:1rem;color:#22d3ee">' + medium.at(-1) + ' 是最高档位的媒介</p>';
启用 JavaScript 后点击 Run 在线运行
Sandpack 沙箱：点击 Run 在 iframe 中执行代码。无 JS 时降级为只读代码块。

Scene3D

3D 场景将在 JavaScript 就绪后加载
three.js 岛屿：线框地球，颜色来自设计 token。关闭动效时静态渲染。
3D 场景将在 JavaScript 就绪后加载
粒子场场景：900 个粒子缓慢旋转。

SideNote

旁注是正文的余光：它不打断论证，只在页边补一句。下面这段文字旁边挂着一条旁注—— 宽屏（≥1536px）时它悬挂在右页边，窄屏时回落为正文内的插注块。

旁注的纪律写在创作规范里：每屏至多一条，只放"离题但增味"的内容。 能进正文的话就不该做成旁注。

反应式散文 Var + Calc

正文里的数字可以拖：假设我每天读 10 张卡片， 一年就是 3650 张， 写满一个千卡片库要 100 天。 左右拖动下划线数字（或聚焦后按方向键），后面两个结果立即重算—— 黑色是你的手，青色是机器的推导。

VerdictTable

媒介档位 × 设计原则
媒介 亲手操作无 JS 降级实现成本
纯文字 ✗ ✓ ✓ 零成本
交互组件 ✓ — 降级为静态内容 —
规则引擎 ✓ — 降级为散文描述 ✗
裁决表：把「多方案 × 多维度」的论证变成可扫读的评分矩阵。

Mention + MentionTarget

正文里的这张山景图 与下方的媒介块互相印证： 悬停或聚焦任一侧，两侧同时点亮；点击词语会把图滚进视野。

彩色山景
Mention 的落点：被正文词语引用的媒介块。

RuleGarden

页面即房间：下面这些物件都用 RuleTarget 声明了自己的身份。比如 这段文字 ——当它进入视野或被鼠标掠过，房间里的其他物件会按规则响应。

色块目标

这里还有一个计数徽标： 已被点击

这个页面的规则

这个页面里住着 3 条规则：当『intro-text』进入视野，希望『color-box』变成青色；当『counter-badge』被点击，希望『counter-badge』计数加一；当『intro-text』被悬停，希望『color-box』被高亮。（启用 JavaScript 后，你可以亲手开关、改写、添加这些规则。）

Claim/When/Wish 的网页玩具版：勾选、改词槽、加规则，页面立即响应。