M-01
费曼技巧FEYNMAN TECHNIQUE
用最简单的语言解释概念，教别人就是教自己。如果你不能把它讲清楚，说明你还没有真正理解。
EXHIBITION2026 前端交互趋势 · 线上常设展
让知识，
留下回声
LET KNOWLEDGE ECHO BACK
学习不是单向输入，而是一场与自我的对话。 往下滚动，每一件展品都会在你的指尖下运转——在交互中感受知识的回响。
向下滚动 · SCROLL
01学习无边界 · FOCUS WITHOUT BOUNDARY
屏幕不是屏幕，
是一扇通向专注的窗
你身后的极光从进入页面起就在跟随你：移动越快，色相偏移越大。 这类"指针反应式"背景是近年获奖网站的标志性手法—— 它把光标从工具变成了探索媒介。下面的仪表是实时的，试着甩动鼠标。
- 专注度 FOCUS
- 0%
- 知识色相 KNOWLEDGE
- 262°
- 思维涟漪 RIPPLES
- 0pcs
- 灵感色样 SWATCH
02知识引力 · KNOWLEDGE GRAVITY
学习方法开始迎向你的选择
磁吸交互让元素在指针靠近时轻轻偏移，像被吸住一样。 它缩短了心理上的"瞄准距离"，也是微交互里性价比最高的一种。 三种学习方法的引力强度依次递增，把指针悬到它们附近感受差异。
TIP · 移开指针，元素会以弹性曲线归位
03学习方法论 · LEARNING METHODS
知识在指尖下
翻出立体
3D 倾斜 + 追光高光，是"把网页做出实体感"的入门款。 卡片内容本身，就是四种最值得关注的学习方法论—— 悬停任意一张，注意标题比卡面浮得更高。
M-02
刻意练习DELIBERATE PRACTICE
不是重复，而是在舒适区边缘反复锤炼薄弱环节。有反馈的练习才是真正的练习。
M-03
思维导图MIND MAPPING
将零散知识编织成网，从中心节点向外扩展。一张好的导图就是一份可视化的思考过程。
M-04
番茄工作法POMODORO TECHNIQUE
25 分钟专注 + 5 分钟休息。用时间盒子对抗拖延，让注意力像肌肉一样有节奏地锻炼。
04学习旅程 · LEARNING JOURNEY
ACT 1
好奇
纵向滚动突然变成横向推移——预期被打破的一瞬间，好奇心就被点燃了。一切学习都始于一个"为什么"。
ACT 2
探索
横向画布像一条时间轴，天然适合知识脉络的展开。从一个概念出发，沿着路径走向未知的领域。
ACT 3
掌握
滚动条成了进度条。你控制节奏，每一幕都是对知识的一次内化。从"看懂了"到"做到了"。
FIN
创造
被点燃的好奇 + 被探索的路径 + 被掌握的技能 = 一次会产生回声的学习。这就是知识旅程的公式。
05学习箴言 · WISDOM IN MOTION
连阅读本身
也可以被点亮
EXIT · 出口即入口
再学一遍→ ECHO LEARNING '26 · 单文件 · 零依赖 · 纯 Vanilla JS本页所有效果均可在源码中直接取用