Handwriting my Website with a Digital Amanuensis

Handwriting my Website with a Digital Amanuensis

A Capital User Interface Idea

A few weeks ago I saw Ben Stokes’ post about PaperWebsite.com and my immediate reaction was, “I have to be able to do that!” I’ve long enjoyed writing by hand over typing as the tactile feel of of pen or pencil and paper is such an enjoyable one. I particularly enjoy using a nice fountain pen on high quality paper.

Obviously there was a route to doing a workflow like this as Ben had shown. I just needed to figure out a method with a low enough barrier that I could personally implement for doing this with my own WordPress website.

A Quick Solution

Not being a serious coder, I immediately began looking for ways I could leverage some of the IndieWeb building blocks my site supports. Micropub seemed like a no-brainer for the posting portion since I’ve got an endpoint using the Micropub WordPress plugin. Certainly not wanting to manually re-type everything once I was finished writing, I needed a way of converting my handwriting to text and then automating a way to plug that into my micropub client.

A short burst of searching revealed that Google Docs could do Optical Character Recognition (OCR) on photos. I pulled out my IFTTT app and found a recipe for taking a photo and saving it to Google Drive. Then I set up another recipe to watch a particular folder in Google Drive and take whatever text appears in new documents and send it to my website using a webhook that uses my Micropub endpoint. The whole thing only took a half hour from idea to a working prototype. In the end it took a tap to open IFTTT on my phone and another tap to take the photo. Then I had to manually open the document to trigger the OCR. Finally, I had to manually open and edit the post before posting.

I had set the micropub client to post as a draft as a default just in case the OCR wasn’t perfect. This was fortunate as the Google photo OCR was so solid that the letters “Dia” of the microscopic text from the word “Diamond” partially visible on my pen cap that was in the photo got pulled into the post.

In the few times I’ve used this workflow so far, I’ve mostly done straight text and syndicated posts to Twitter, Mastodon, and Micro.blog. Perhaps in the future I might set things up to add HTML links, but they’re fairly easy to add at the editing stage.

Since I started my experimentation, a few others in the IndieWeb community have noticed the paperwebsite.com site. Greg McVerry popped up and linked to it as well. He mentioned that he had a digital notebook with OCR capability. This reminded me that I’ve got both a Livescribe Echo pen and a Rocketbook notebook with a Pilot Frixion pen that has an app for uploading digitized images of notebook pages. I hadn’t done OER with Livescribe in ages, so I pulled out the Rocketbook, which is cleverly erasable and thus reusable not to mention being fairly inexpensive. A bit of quick set up allowed me to take a photo of a page which automatically uploads to Google Drive and does its own OCR process. This already dovetails with my prior process, so the whole thing is much smoother. As a result, I’m composing this post in my Rocketbook notebook and will automatically upload and post it to my site as a draft. I’ll probably add some links, a photo or two, and then publish it in a bit.

Rocketbook Interface

The Rocketbook notebook has some solid pages with an odd shiny texture and feel, presumably part of the technology that makes it easy to wipe them clean for reuse. The bottom of each page has seven different faint icon images which are meant to allow the app to determine where to send the digital copy of the notes. One can send them via email or to a variety of storage or sharing services. I could imagine having different recipes set up to allow one to publish their notes to different websites based on the icon X-ed out. Given the micropub possibilities, one could also use the icons as a means of differentiating post kinds (for example, indicating that a particular post is a note, an article, or a bookmark). Another alternate idea would be to use the icons as a means of selecting which services to syndicate your content to (for example, the diamond could mean syndicate this post to Micro.blog, the bell could mean Mastodon, and the clover syndicates the post to Twitter).

The printed interface at the bottom of the Rocketbook notebook: a QR code eith icons for a rocket, a diamond, an apple, a bell, a clover, a star, and a horseshoe. The last one has an "X" over it to indicate choosing the horseshoe.

The overall process is quite elegant and pleasant. The OCR for Rocketbook is reasonably good aside from a few spelling errors which are easy enough to click and fix. I’ll admit that I far prefer using a fountain pen on some Tomoe River paper to using the Rocketbook paper and the Frixion pen, but really, who wouldn’t?

Handwritten notes for your digital zettelkasten or personal wiki

Since I’ve already got most of the infrastructure, I’ve gone the extra mile and set things up so that I can take notes on index cards zettelkasten-style and use a similar set up to post them to my Obsidian vault using similar IFTTT recipes.

Try it yourself

For those who want to set this up themselves, I’ve documented the IFTTT/micropub portion before. I’ll post the specific code I’m using below for these who may want it. The nice part is that as long as you have a micropub server for your website platform (there are many CMSs that have native or plugin support) the WordPress portion isn’t a deal breaker for others.

I’m sure, now that there are multiple proofs of concept, some enterprising developer will build a custom micropub client to do all of this work automatically or with a few options built into a clever interface.

I could see pen and paper manufacturers (Moleskin, Leuchtturm, Rocketbook, etc.) creating apps for doing this too. I’d love to see and hear about others trying this out for themselves. Hopefully it can be done with almost no code or some easy cut and paste from my example. Ask if you need help, and I’ll see what I can do to help.

IFTTT Webhook settings

This following will be roughly standard for WordPress endpoints using the plugin, but they can obviously be modified for your platform of choice.

  • URL: https://example.com/wp-json/micropub/1.0/endpoint
  • Method: POST
  • Content type: application/x-www-form-urlencoded
  • Body: access_token=PasswordHere&content=<<<{{Body}}>>>&h=entry&category[]=Social%20Stream&post-status=published&visibility=private

Historical examples

While doing some of this I did come across some older examples of handwriting to websites. Aside from handwriting typography which I think is usually ugly, I saw some interesting examples from Jeff Bridges[1] [2], gRegor Morrill, and scrolled through some great examples of handwritten and typed Tweets by Alton Brown. In his case, he was simply taking photos of his writing, but it worked! I’ll admit he had some fun and was definitely creative about it. Hopefully Twitter always exists to save the copies for him.

https://platform.twitter.com/widgets.js

https://platform.twitter.com/widgets.js

https://platform.twitter.com/widgets.js

https://platform.twitter.com/widgets.js

Conclusion

In short, I’ve now got another great way to post to my website. I love the great old school tactile user interface of pen and paper. Now I’m glad to have a reason to be able to do more of it in an ever-digitized culture.

Until I start working on cuneiform solutions…

Write On! 🖋


Editor’s note: This post was originally handwritten on Dec 16, 2021 at 20:15.

This post was originally published on Chris Aldrich

How awesome would it be if IFTTT supported the W3C recommendation for Micropub? An endpoint like this could immediately be used to publish content to lots of websites with higher data fidelity and potentially better control over display.

I’m using something similar to bootstrap it with Webhooks, but had to jump through some additional hoops that IFTTT could smooth out.

This post was originally published on Chris Aldrich

Nine: Micropub for collecting data

The Micropub plugin helps me by creating an endpoint on my site for quickly and easily capturing lots of data. IFTTT, Zapier, Integromat, n8n can all help to aggregate this data too.

#HeyPresstoConf20


Here are some more in-depth details about how I use some of these tools and recipes/walk-throughs so you can too: Using IFTTT to syndicate (PESOS) content from social services to WordPress using Micropub.

 

 

 

This post was originally published on Chris Aldrich

A note taking problem and a proposed solution

tl;dr

It’s too painful to quickly get frequent notes into note taking and related platforms. Hypothes.is has an open API and a great UI that can be leveraged to simplify note taking processes.

Note taking tools

I’ve been keeping notes in systems like OneNote and Evernote for ages, but for my memory-related research and work in combination with my commonplace book for the last year, I’ve been alternately using TiddlyWiki (with TiddlyBlink) and WordPress (it’s way more than a blog.)

I’ve also dabbled significantly enough with related systems like Roam Research, Obsidian, Org mode/Org Roam, MediaWiki, DocuWiki, and many others to know what I’m looking for.

Many of these, particularly those that can be used alternately as commonplace books and zettelkasten appeal to me greatly when they include the idea of backlinks. (I’ve been using Webmention to leverage that functionality in WordPress settings, and MediaWiki gives it grudgingly with the “what links to this page” basic functionality that can be leveraged into better transclusion if necessary.)

The major problem with most note taking tools

The final remaining problem I’ve found with almost all of these platforms is being able to quickly and easily get data into them so that I can work with or manipulate it. For me the worst part of note taking is the actual taking of notes. Once I’ve got them, I can do some generally useful things with them—it’s literally the physical method of getting data from a web page, book, or other platform into the actual digital notebook that is the most painful, mindless, and useless thing for me.

Evernote and OneNote

Older note taking services like Evernote and OneNote come with browser bookmarklets or mobile share functionality that make taking notes and extracting data from web sources simple and straightforward. Then once the data is in your notebook you can actually do some work with it. Sadly neither of these services has the backlinking functionality that I find has become de rigueur for my note taking or knowledge wrangling needs.

WordPress

My WordPress solutions are pretty well set since that workflow is entirely web-based and because WordPress has both bookmarklet and Micropub support. There I’m primarily using a variety of feeds and services to format data into a usable form that I can use to ping my Micropub endpoint. The Micropub plugin handles the post and most of the meta data I care about.

It would be great if other web services had support for Micropub this way too, as I could see some massive benefits to MediaWiki, Roam Research, and TiddlyWiki if they had this sort of support. The idea of Micropub has such great potential for great user interfaces. I could also see many of these services modifying projects like Omnibear to extend themselves to create highlighting (quoting) and annotating functionality with a browser extension.

With this said, I’m finding that the user interface piece that I’m missing for almost all of these note taking tools is raw data collection.

I’m not the sort of person whose learning style (or memory) is benefited by writing or typing out notes into my notebooks. I’d far rather just have it magically happen. Even copying and pasting data from a web browser into my digital notebook is a painful and annoying process, especially when you’re reading and collecting/curating as many notes as I tend to. I’d rather be able to highlight, type some thoughts and have it appear in my notebook. This would prevent the flow of my reading, thinking, and short annotations from being subverted by the note collection process.

Different modalities for content consumption and note taking 

Based on my general experience there are only a handful of different spaces where I’m typically making notes.

Reading online

A large portion of my reading these days is done in online settings. From newspapers, magazines, journal articles and more, I’m usually reading them online and taking notes from them there.

.pdf texts

Some texts I want to read (often books and journal articles) only live in .pdf form. While reading them in an app-specific setting has previously been my preference, I’ve taken to reading them from within browsers. I’ll explain why in just a moment, but it has to do with a tool that treats this method the same as the general online modality. I’ll note that most of the .pdf  specific apps have dreadful data export—if any.

Reading e-books (Kindle, e-readers, etc.)

If it’s not online or in .pdf format, I’m usually reading books within a Kindle or other e-reading device. These are usually fairly easy to add highlights, annotations, and notes to. While there are some paid apps that can extract these notes, I don’t find it too difficult to find the raw file and cut and paste the data into my notebook of choice. Once there, going through my notes, reformatting them (if necessary), tagging them and expanding on them is not only relatively straightforward, but it also serves as a simple method for doing a first pass of spaced repetition and review for better long term recall.

Lectures

Naturally taking notes from live lectures, audiobooks, and other spoken events occurs, but more often in these cases, I’m typically able to type them directly into my notebook of preference or I’m using something like my digital Livescribe pen for notes which get converted by OCR and are easy enough to convert in bulk into a digital notebook. I won’t belabor this part further, though if others have quick methods, I’d love to hear them.

Physical books

While I love a physical book 10x more than the next 100 people, I’ve been trying to stay away from them because I find that though they’re easy to highlight, underline, and annotate the margins, it takes too much time and effort (generally useless for memory purposes for me) to transfer these notes into a digital notebook setting. And after all, it’s the time saving piece I’m after here, so my preference is to read in some digital format if at all possible.

A potential solution for most of these modalities

For several years now, I’ve been enamored of the online Hypothes.is annotation tool. It’s open source, allows me reasonable access to my data from the (free) hosted version, and has a simple, beautiful, and fast process for bookmarking, highlighting, and annotating online texts on desktop and mobile. It works exceptionally well for both web pages and when reading .pdf texts within a browser window.

I’ve used it daily to make several thousand annotations on 800+ online web pages and documents. I’m not sure how I managed without it before. It’s the note taking tool I wished I’d always had. It’s a fun and welcome part of my daily life. It does exactly what I want it to and generally stays out of the way otherwise. I love it and recommend it unreservedly. It’s helped me to think more deeply and interact more directly with countless texts.

When reading on desktop or mobile platforms, it’s very simple to tap a browser extension and have all their functionality immediately available. I can quickly highlight a section of a text and their UI pops open to allow me to annotate, tag it, and publish. I feel like it’s even faster than posting something to Twitter. It is fantastically elegant.

The one problem I have with it is that while it’s great for collecting and aggregating my note data into my Hypothes.is account, there’s not much I can do with it once it’s there. It’s missing the notebook functionality some of these other services provide. I wish I could plug all my annotation and highlight content into spaced repetition systems or move it around and modify it within a notebook where it might be more interactive and cross linked for the long term. Sadly I don’t think that any of this sort of functionality is on Hypothes.is’ roadmap any time soon.

There is some great news however! Hypothes.is is open source and has a reasonable API. This portends some exciting things! This means that any of these wiki, zettelkasten, note taking, or spaced repetition services could leverage the UI for collecting data and pipe it into their interfaces for direct use.

As an example, what if I could quickly tell Obsidian to import all my pre-existing and future Hypothes.is data directly into my Obsidian vault for manipulating as notes? (And wouldn’t you know, the small atomic notes I get by highlighting and annotating are just the sort that one would like in a zettelkasten!) What if I could pick and choose specific course-related data from my reading and note taking in Hypothes.is (perhaps by tag or group) for import into Anki to quickly create some flash cards for spaced repetition review? For me, this combination would be my dream application!

These small pieces, loosely joined can provide some awesome opportunities for knowledge workers, students, researchers, and others. The education focused direction that Hypothes.is, many of these note taking platforms, and spaced repetition systems are all facing positions them to make a super-product that we all want and need.

An experiment

So today, as a somewhat limited experiment, I played around with my Hypothes.is atom feed (https://hypothes.is/stream.atom?user=chrisaldrich, because you know you want to subscribe to this) and piped it into IFTTT. Each post creates a new document in a OneDrive file which I can convert to a markdown .md file that can be picked up by my Obsidian client. While I can’t easily get the tags the way I’d like (because they’re not included in the feed) and the formatting is incredibly close, but not quite there, the result is actually quite nice.

Since I can “drop” all my new notes into a particular folder, I can easily process them all at a later date/time if necessary. In fact, I find that the fact that I might want to revisit all my notes to do quick tweaks or adding links or additional thoughts provides the added benefit of a first round of spaced repetition for the notes I took.

Some notes may end up being deleted or reshuffled, but one thing is clear: I’ve never been able to so simply highlight, annotate, and take notes on documents online and get them into my notebook so quickly. And when I want to do something with them, there they are, already sitting in my notebook for manipulation, cross-linking, spaced repetition, and review.

So if the developers of any of these platforms are paying attention, I (and I’m sure others) really can’t wait for plugin integrations using the full power of the Hypothes.is API that allow us to all leverage Hypothes.is’ user interface to make our workflows seamlessly simple.

This post was originally published on Chris Aldrich