Skip to main content

Sketchnoting a Book in Obsidian

Yesterday I completed my first "Book on a Page" sketchnote for Storyworthy by Matthew Dicks. This article will summarize the workflow I followed. 

My approach borrows heavily from Tiago Forte's Progressive Summarization method and Doug Neil's wonderful video How to Sketchnote a Book.

My note-taking and reading continue to evolve. I share some of my journey in an earlier post My Book Summaries in Roam Using Tiago's Progressive Summarization. Two things have changed since my article in December last year. First, I have integrated Excalidraw first into Roam Research and later into Obsidan. I have always been keen on visual note-taking. The integration of Excalidraw into these tools has taken me a huge step closer to my ideal Personal Knowledge Management solution. Second, I have moved from Roam to Obsidian. I discuss some of the reasons for my switch in How Secure is Secure Enough? and Roam Sex Ed.

Book Summary in Obsidian - Book on a Page

Progressive Summarization

Progressive summarization balances compression with maintaining context. The basic idea is to create a document that is short, searchable, and if I pick it up a couple of years from today, it will hold enough context to remind me of the key points I've learned from reading that book. It is the process of taking a book and creating a mini-summary or book-on-a-page sketch in such a way, that each step of the compression process is simple to execute and can be accomplished in a relatively short amount of time, spread across time, in the course of other work, and only doing as much or as little as the information deserves. 

Tiago defines 5 layers of summarization, each layer simple to implement, and requiring limited effort. By building the layers one on top of the other, the end result is a powerful compression of the text. The beauty of the approach is that it maintains context throughout the process allowing for later drill down into my literature notes or even the book if required.

Layer 0 - Original Full-Text Book

In Obsidian I add a page for the book under the Books/Title-of-the-Book folder of my Vault. I place the book in its own folder because during the sketching process I will create many drawings in separate files and having them all organized in a folder is neater. I add three links to my book page: "Literature Notes", "Summary" and "Book on a Page".
Storyworthy book page

Layer 1 - Literature Notes

I read on a Kindle. My layer 1 notes are text highlights and occasional personal notes next to the highlights. I found Tiago's best practice advice, to highlight every chapter title, very helpful as this way the resulting Kindle clippings maintain the original structure of the book. This provides context later when processing the clippings in Obsidian. I am very liberal in deciding what I highlight. I typically end up with roughly 5-10% of the book highlighted.

Once finished with the book I download the "My Clippings.txt" file from my Kindle, rename it to "My Clippings.md" and drop it into Obsidian. I then use a simple Templater script to convert the clippings file to markdown literature notes. You can find my script here.

<%*
const editor = this.app.workspace.activeLeaf?.view?.editor;
if(!editor) return;

const linecount = editor.lineCount();
let titles = [];
for(i=0;i<linecount;i++) {  
  if(i%5==0) {
    const line = editor.getLine(i);
	if(!titles.includes(line)) {
	  titles.push(line);
	}
  }
}

const title = await tp.system.suggester(titles, titles,false,"Select book from list");

let output = [];
let page = 0;
let includeLine = false;
let isNote = false;
for(i=0;i<linecount;i++) {
  const line = editor.getLine(i);
  if(i%5 == 0) {
    includeLine = line == title;
  }
  if (includeLine && i%5 == 1) {
    const p = line.match(/(\d+)/);
	if(p && page!=p[0]) {
	  page = p[0];
	  output.push("**"+page+"**");
	}
	isNote = line.startsWith("- Your Note");
  }
  if (includeLine && i%5 == 3 && line !="" && line !="\n") {
      output.push((isNote ? "" : "> ") + line);
  }
}

navigator.clipboard.writeText("# "+title+"\n\n"+output.join("\n\n")+"\n\n");

alert("Extracted kindle highlights are available on the clipboard.");
%>

Layer 2 - Highlighted Notes

Once I have imported my Layer 1 notes into Obsidian, I read through the notes and mark chapter headings (#, ##, etc.). During this first readthrough, I also ==highlight== (CTRL+H) parts of my notes that I find more important. I don't spend too much time deciding what to highlight, I just follow my heart. If inspired by the text I add quick sketches as well. I have another Templater script to help add sketches with the least friction possible. You can find my Templater script here.

<%*
  const folder = tp.file.folder(true) == "/" ? "/" : tp.file.folder(true) + "/";
  let title = await tp.system.prompt("Title?");
  if(title == "") return;
  title = tp.file.title + " - " + title ;
  tR += "!["+"["+folder+title+".excalidraw]]\n"; //the .excalidraw extension is automatically added by EA.create
  
  const ea = ExcalidrawAutomate;
  ea.reset();
  ea.create({
    filename:title, 
	foldername:folder, 
	templatePath: "Excalidraw/template.excalidraw",
	onNewPane: true
  });
%>

Highlights and sketch

Layer 3 - Bold Highlights

During my second pass through the literature notes, I focus my attention on the highlighted text and mark with bold the keywords or fragments that I find particularly important. I also refine my sketches or add new ones.

Layer 4 - Mini-Summary

I use a third Templater script to extract the highlighted text and the sketches from my literature notes to create a rough draft summary document. I work myself through this text making edits, sometimes shifting text around to finalize my book summary. You can find my Templater script here, and my finalized mini-summary for Storyworthy here. The picture below illustrates how the first draft summary looks like.

<%*
//check if an editor is the active view
const editor = this.app.workspace.activeLeaf?.view?.editor;
if(!editor) return;

const separator = " ... ";

function getHighlight (i) {
  const line = editor.getLine(i); 
  const match = line.matchAll(/==(.*?)==/g);
  const heading = line.match(/^(#+)\s/);
  const sketch = line.match(/^(!\[\[.*?]])/);
  let result = null;
  while(!(highlight = match.next()).done) {
    result = result ? result + separator + highlight.value[1] : highlight.value[1];
  }
  if(result) return (heading ? heading[0]:"") + result;
  if(sketch) return sketch[0];
  return null;
}

let output = [];

const linecount = editor.lineCount();
for(i=0;i<linecount;i++) {
  const highlight = getHighlight(i);
  if(highlight) output.push(highlight);
}

navigator.clipboard.writeText(output.join("\n\n"));

alert("Extracted highlights are available on the clipboard.");
%>

Draft summary page

Layer 5 - Book on a Page

This is the final step in the process. I can't say I have much experience with this since I have only created a single Book on a Page summary until now. I read through my mini-summary and looked at my sketches. I copied all the sketches to a single Excalidraw page and played with organizing them, removing unnecessary text and drawings until I felt satisfied with the result.

Storyworthy by Matthew Dicks
Like this post?
Show your support.

Comments

Popular posts from this blog

Deep Dive Into Roam's Data Structure - Why Roam is Much More Than a Note Taking App

Which are the longest paragraphs in your graph? Which pages did you edit or create last week? How many paragraphs of text do you have in your database in total? Which pages do you have under a given namesapece (e.g. meetings/)?

Showcasing Excalidraw

Conor ( @Conaw ) pointed me to Excalidraw last week, and I was blown away by the tool and especially about the opportunities it opens up for  Roam Research ! It is a full-featured, embeddable sketching component ready for web integration. This post will showcase key Excalidraw features and discusses some of the issues I still need to solve to complete its integration into Roam. I spent most of my free time during the week integrating Excalidraw into Roam. This article will introduce Excalidraw by showcasing its features.

My GTD - How I Organize Meetings and TODOs in Roam

How efficient is your workflow for keeping on top of all your meeting notes, action items, contacts, projects and more?  If you were to bump into someone unexpectedly would you be able to remind yourself of all the relevant topics you wanted to discuss with the person?  Can you remember all the things you wanted to get done when running your errands?  Can you keep track of your discussions with all the people you talk to regularly? In this post I will walk you through my meetings-actions-people workflow in Roam. If you are new to Roam and Roam42... Just in case you are not familiar with Roam , it is an ultra flexible note taking tool. It's like the Excel for text. If you want to find out more, there is tremendous amount of quality content available on YouTube, just search from "Roam Research". Equally, you can head over to RoamBrain.com for all the best links and more. My workf

Roam-Excalidraw Plugin MVP Release

  I am releasing the MVP version of the Roam-Excalidraw Plugin. Over the past two weeks, I have been super focused on getting to this point. As a consequence, this post is going to be shorter and more utilitarian than usual. I had to make a choice whether to release the plugin this weekend or to write a detailed blog post. I opted for the first.

contact: info@zsolt.blog