需求创造世界,我创造需求

为方便回顾和写博客,一直有做生活 Log 的需求:书影游和护肤品 “开封”/“空瓶”、今天买了什么、一年去了哪些城市、看了几场音乐剧、零式副本攻略记录、萨卡兹肉鸽每把翻车。很多 APP 服务于这些生活中的小小里程碑,比如豆瓣和 Neodb 都能标记书影音游,一些朋友用朋友圈做锚点,NGA 记录贴高楼鳞次节比,我画过手帐内页,盖印印章图案进行分类,写完厚厚一叠活页纸。但 APP 在内容导出上总让人疑虑,朋友圈给人社交压力,纸笔记录固然好,在翻查上往往还是受困于实体,且很难向前补充。如果使用 Obsidian 等常规电子笔记,文档型书写前要找到对应的记录文章,卡片型外观过于占据视野范围,Notion 的 database 倒是很好,无奈太复杂,始终用不习惯,我想要一个更简单、更便利、也许不是开箱即用,但不会复杂到需要反复学习的工具。做了许多研究之后,以内容倒推载体,最适合做 Log 的形式是无序列表,无序列表是:大纲。

先展示一下最终成果

搜索条件保存在STARRED,点击即可直达搜索结果

为什么是 Workflowy

作为老牌纯文本大纲型笔记工具,Workflowy 的优势不需赘述,即便是在笔记工具大爆发的今天,将所有内容浓缩进一页纸的设计仍然出彩。但,大纲型笔记千千万,无序列表更是笔记标配,为什么是 Workflowy 而不是其他?

平铺又浓缩的搜索结果

对于生活 Log 而言,矛盾在于,记录型内容与感受型内容往往互相打架:搜索时,我想看到的只是 “日期 + 做了什么”,一行足矣,太多就污染视野。而记录时,却倾向于细致入微地书写做这件事的感受。大纲工具可以以母子节点来区别这二者,是形式上的一大优势,但如果搜索时所有节点同时展示,或者需要手动关闭层层累积的节点,简单的事就又变得复杂。

在这一点上,Workflowy 的搜索策略相当合适,参考我的 workflowy 使用分享作者描述,Workflowy 的搜索逻辑是 “直接展示搜索条件下的段落,并且能看到它上级节点的内容”“直接把搜索结果平铺展示出来,一目了然。”
因此可以注意到,Workflowy 搜索的的另一个特征是:Workflowy 只展示搜索条件所在的节点,不会自动展开下属所有的子节点。

也就是说,在 Workflowy 中搜索时;Workflwy 只聚焦搜索词所在的节点,并同时只展示搜索词的上一个节点。 利用这个特性,就能很好地解决 “搜索时只看一行,记录时写得太长” 的问题。

懒人必备:存储搜索词

我很喜欢钻牛角尖,所以有一个问题一直没想明白:使用双链或者 Tag 来标记内容时,怎么保证自己一直记得从前用了哪些双链标题 / Tag 标题?

解决方案当然有很多,在 Workflowy 中的是我最喜欢的一种:Workflowy 支持保存常用搜索词,同时支持高级检索条件,例如搜索 “is: todo -is: complete”,Workflowy 就会展现所有 “未勾选完成的 TO-DO”、或者搜索 “today OR Last 365 days”,如果之前有用日期标识内容,去年今日功能就完成了。

只需要保存常用搜索词,它就能同时成为记录的提示和便捷查询的入口,天下苦 “我应该搜什么来着” 久矣,我辈当揭竿而起—— Workflowy 支持的搜索运算符

我就要花里胡哨:CSS

我有一个 “不再用工具” 列表,其中,给 Worfkflowy 判的死刑是:纯文字虽好,但看起来费劲。

稍微试一下就能明白,Workflowy 的文本样式设置很麻烦,效果也不太好,大量文字与节点堆在一起时,阅读体验相当惨烈。原生的二三级标题等样式也离美观二字相去甚远,至少我不能接受,更不要提默认 Workflowy 的默认搜索高亮是亮黄色——亮黄色!

幸好 Workflowy 的本体是网页,是网页就能用插件,能用插件就能折腾,Obsidian 教育我们:笔记工具的外貌是最重要的,记不记可以再议。

我用的工具是 WFx for WorkFlowy,相比 Stylebot、Code Cola 等插件,它的优势是可以将 CSS 直接嵌入进 Workflowy,只要在一处修改,其他设备即使不安装插件,也可以显示修改后的样式,几乎是原生体验。

添加方式可以参考:Custom CSS Widge,具体步骤为:

  1. 安装 WFX 插件,复制网页最末端代码
  2. 右键插件图标 - 选项 - 添加 Javascript,复制代码,并设置 Shortcut 为 css
  3. 在 Workflowy 页面按快捷键 Alt+w 打开插件,输入 css(刚设置的 Shortcut)
  4. 编辑自己需要的 CSS 代码,保存后立刻显示在网页上。

一些我自己在使用的CSS样式,一部分是社群分享,一部分是 Chatgpt 写的,仅供参考,能用就行。

/* 修改TO-DO样式,去掉完成删除线,并加入完成庆贺Emoji */
 .done.checkmark .content {
    opacity: 1 !important;
    text-decoration: none !important;
}
.done.checkmark .content::before {
    content: '🎉';
}

/*修改镜像节点显示,使之更明显*/
.mirrorDiamondIcon{
     color:#7d798f ;  /*节点颜色*/
    border: 1px dashed #7d798f; /*虚线颜色*/
    border-radius: 50px;    
}

/*展开所有的note*/
.notes .content {
  display: block;
  max-height:none;
  color:#323232;
  font-size: 15px;
  line-height: 1.8;
}

/*调整节点行距*/
.children ._18v0h7c, .draggableNameClone > ._18v0h7c {
    padding-top: 6px;
}

/* 为Tag加上🏷️ */
._1wsppdf .contentTag {
    color: #1c765a;
    font-weight: bold;
    position: relative; 
    padding-left: 1.4em; 
}
._1wsppdf .contentTag::before {
    content: '🏷️'; 
    position: absolute;
    left: 0; 
    font-size: 1em; 
}

/* 在日期前加入📅 */
.monolith-pill .content-wrapper {
    position: relative; 
    padding-left: 2em; 
}
.monolith-pill .content-wrapper::before {
    content: '📅';
    position: absolute;
    left: 4px; 
    font-size: 1em; 
}
.notes .monolith-pill .content-wrapper {
    line-height: 15px;
    font-size: 14px;
    padding-top: 3px;
    padding-bottom: 3px;
}

/* 设置备注颜色为浅灰色 */
.notes .content {
    color: rgb(183, 188, 191);
}

/* 设置高亮颜色为浅灰色 */
:root {
--wf-yellow-100: rgb(220, 224, 226);}

还有一些便利插件和调整可以参考 Workflowy 资料分享
顺便一提,在 Workflowy 的 Experimental features 中,有一项就叫做 “Rich tags
(Allows emojis and some other characters in tags. )”,也可以使用这一功能来使页面更加易读。

再找出一块拼图:日期节点生成

最后,诚挚敬献,Workflowy 日期节点生成器:Workflowy Calendar Generator

可以自动生成漂亮的Daily模板,生成后复制到剪贴板,直接粘贴进 Workflowy 即可。Workflowy 支持编写 Date format 和 Time format,可以自由调整成自己喜欢的日期和时间格式。

后记

笔记工具的使用路径,往往是以发现、解决、思考为脉络展开的。有时候花几个小时尝试的功能实现,在使用时却发现更享受的是“实现”本身,细水长流地用了很久的,却常常是简单明了,形式与需求直接匹配的产品。对Workflowy的使用就是后者,看过很多安利,尝试用它作为卡片笔记、Inbox、项目管理。最后还是觉得,大纲是“一行即可”的形式,那么,最适合它的,还是“一行足矣”的记录。

最后,感谢@Seyee的Workflowy交流群,以上插件、工具等多是群友交流得来,极为启发,非常感谢。