Building a conversation platform — Part 5

Building blocks of posts

7 min readAug 26, 2016

In the previous part, and the others before, we have concentrated on the shape of conversations, and we have come up with a unified graph model, which from all kinds of conversation platforms can be derived. Also, this model opens the door to combining specific features of different platforms in novel ways. One obvious example is a threaded chat. How many times have you been in a chatroom, where multiple parallel discussions were taking place, and you wished you could highlight the one you’re interested in, and fade the others?

But we are not going to explore these opportunities now. Instead, I would like us to focus our attention on the post. The post abstraction of our model represents one-liner messages in a chatroom, posts of a forum, 140 character long tweets of Twitter, comments of a blog post, and long articles of a blog, consisting of images, videos, quotes, subheadings and ordinary text. Obviously we need a more elaborate concept, that scales with all these various use cases. And the best strategy again is to take the most complex one, and see if the others can be derived from it. So we need to take a look at the blog article, and its features.

Figure 1: the post as a sequence of blocks

An article, as a first approximation, is a sequence of paragraphs, where each paragraph is of a certain kind: heading, text, image, video, quote etc. This is — not surprisingly — a graph, which graph’s objects are paragraphs, and its arrows point from one paragraph to the next. We will call the paragraphs blocks, as it is a more generic term, that refers to building block, and at the same time avoids any connotation of being only textual.

Thinking of an article as a graph of blocks, that are linked by arrows pointing from the previous to the next block, allows us to integrate concepts like sidebars, in a very natural way. Sidebars are detours from the main flow of the article, providing additional information, background, context of the subject. Sidebars are visually distinguished from the main article, usually as boxes adjacent to it. In our graph model, we can represent them as optional routes that can be taken at a given block, and that eventually lead back to the main thread.

Figure 3: post with insets linking to other posts

Another feature that is fairly common in publishing, is the representation of links to other articles, as summary boxes of that other article, consisting of its heading, cover image and lead. These visually distinguished insets are either adjacent to the paragraph containing the link (as in the case of sidebars), or at the end of the article, as recommendations. In a model where both the conversation, and both its atom, the post, are graphs, we can easily represent these references to other posts as arrows in the graph, of type link.

Figure 4: insets linking to posts that form a conversation

Of course these other posts referenced from a block, are usually part of a conversation. They might be conversation starters or replies. Even multiple posts of the same conversation might be linked, as you can see exactly this on Figure 4, where one of the paragraphs of our article links to both a starter (Post 2), and one of its replies (Post 3). Before we clarify what the relationship between blocks of a post and other posts is, let’s look at another, possibly even more enlightening example of common publishing features.

Some publications and platforms allow readers to comment parts of an article, either arbitrary selections of the text, or entire paragraphs individually. This is especially characteristic of Medium, as one of its signature features. Our example below is from Quartz, that does paragraph level commenting:

Figure 5: paragraph annotation on Quartz

This feature tends to be called text annotation or paragraph annotation, or more generally block annotation. There exist versions, which also let images to be annotated, and not only as a whole, but arbitrary fragments of an image, addressed by coordinates, analogously to the annotation of arbitrary text selections.

Despite the name, annotations are ordinary comments, and as such, are ordinary posts — as it follows from our intuition in the previous part, that comments are regular posts. In this discussion we will focus only on block annotations, which comment entire blocks. By these being regular posts, they can, of course, be part of conversations, as it was the case with linked posts. You can see on Figure 5 how Quartz lets users to reply to block annotations, which is a perfect real-life example of this.

What we have learned from block annotations, and from the fact that these are ordinary posts, is that link is not the only arrow type, that points from blocks to other posts, but reply arrows can be such too. You can observe this on Figure 6, where we have a reply arrow from the last paragraph of the article to a different post (Post 10, a block annotation), and we even have reply arrows from a block of the sidebar, pointing to other posts (Post 7 and Post 8, both block annotations, annotating the sidebar).

The question we are seeking to answer now, is that if the post is a graph of blocks, does that mean that this graph is inside a single node of another graph, that is the conversation? Is the conversation a graph of graphs? And if this was the case, where would link or reply arrows, that point from a block to another post, precisely point to? It’s almost like as if, in the graph of posts, these pointed from within a node — from a specific part of a node — to another node. Or, in terms of the nested graph of blocks, these pointed from a node to an entire graph in general, without pointing specifically to any node of it.

But this is an unnecessary complication. After all, reading, writing and conversing are all linear, one-dimensional activities, because they all happen in time, which itself is one-dimensional. We can only read, write or discuss one thing at a time, we cannot really do any of these in parallel, as we cannot branch our attention (although sometimes, when reading those pieces with many sidebars, I wish I could read the sidebars with just one eyeball and one brain hemisphere, without any interruptions in reading the main article, using the other eyeball and hemisphere).

We can leverage this one-dimensionality, and simply say that replies of a post are linked from the last block of it:

Figure 7: post with replies attached to its last block

And in the same manner, we can point the link arrows to the first block of the linked post. This sounds logical, as an article linked from another article is likely to be read from the top, by the reader following the link.

After these two simplifications, both reply and link arrows point from blocks to blocks. In the above graph, we can actually replace every post node with its blocks:

Figure 8: conversation consisting only of block nodes

I have renamed paragraph and heading blocks to text and head, for brevity and clarity.

The block graph model is scalable, and seems to be well suited for all the use cases we had in mind. A chat message is most of the time a single text block, although chat clients tend to unfold web links into insets, similar to ones used in articles that link to other articles, and also image or video links into the actual image or video. This is another common feature that the graph model integrates in the most natural way. Furthermore, a tweet is almost always a single text block. Forum posts, blog comments, blog articles tend to consist of multiple blocks.

As we saw, replacing post nodes in our graph model with subgraphs of blocks, results in a model that not only accounts for all the content atoms of various conversation forms, but covers other features, ones specific to publishing for example, like sidebars and insets. And does this in such a way, that these features are not extensions to the model, but can be derived from the core of it. And thus, these features can also be recombined in novel ways.

Let’s see if we need the notion of post at all, in the next part.

Building a conversation platform — Part 5

Building blocks of posts

Written by Mikolaj Szabó