为什么先做阅读页
Fathom 不应该只是一个技术笔记列表。它要能放下一段认真写过的技术复盘,也要能放下一张照片、一首歌、一个视频,或者某天突然冒出来的想法。
图片是一等内容
图片不只是装饰,它经常就是想法本身。截图、手绘草图、旅行照片、设计参考,都应该能直接粘贴或拖进笔记。
音乐也可以是正文的一部分
一篇笔记不一定只有文字。音乐可以是一段情绪的注脚,也可以是一个主题的入口。
Audio
视频用于演示和记录
技术博客经常需要演示,生活记录也可能需要片段。视频组件应该安静、稳定、响应式。
代码块仍然重要
技术内容必须保留清晰的代码阅读体验。
type ContentType = "note" | "moment";
type FathomPost = {
title: string;
type: ContentType;
content: string;
media: Array<"image" | "audio" | "video">;
};表格要像正文里的工具
表格不应该像后台报表一样笨重,它只是把判断讲清楚的一种方式。
| 内容能力 | 当前原型 | 设计要求 |
|---|---|---|
| 图片 | 已支持 | 保持稳定比例和图注 |
| 音乐 | 已支持 | 不抢走阅读注意力 |
| 视频 | 已支持 | 响应式并保留封面 |
| 代码 | 已支持 | 黑夜模式也要好读 |
链接卡片让材料更像材料
ReferenceAceternity UI首页动态光束的风格参考,但 Fathom 会克制使用动效。接下来
这个原型只验证第一条链路:
- 首页第一眼有 Fathom 气质。
- 阅读页可以承载文字、图片、音频、视频和代码。
- 内容仍然保持 Markdown-first,未来可以迁移。