Conversation System - Further features and improvements (2.0)

[vladolaru]

Following up on #253, I will sketch what further features I see useful to implement to have a really human-oriented conversations system with the smoothness and finesse required for a blissful experience. I believe the quality of the system, unconsciously, can set the tone for a higher quality of the said conversations.

For all interested in this, I believe it's important to clarify some of the terminology used around comments, thus maintaining clarity without loss of the human touch:

• comment: Any message/text submitted by a reader for a certain post/article. It doesn't matter if it is a reply to another message.
• reply: A comment in response to another comment. The reply becomes the child of the other, parent comment.
• top-level comment: A comment without any parent comments. We could say that top-level comments are children of the main article (technically. they actually are). We could call such comments as conversation roots. See the definition below.
• [comment] thread: A comment and its immediate replies. Those replies can (technically) have threads of their own but we won't consider them part of the parent's thread.
  Basically what this means is that we will work with only two layers of hierarchy at any one time. I know WordPress allows up to 5 levels of depth for comments, but that is just a technical possibility, not a practical one. To make further layers practical, we should have a way to read a single thread in a separate view (here is how The Correspondent does it), with the navigation between top-level threads and lower-level threads. That is for version 3.0 😉
• conversation: A comment thread starting with a top-level comment. We could say that the top-level comment was the starter for a conversation, with people continuing the chain of thought, showing their appreciation or disagreement with the initial thoughts.
• highlight: The action of marking a certain comment as worthy of more emphasis due to its quality. Highlighting can only be done by "editors", meaning registered users who can manage comments. There can be multiple highlighters for a certain comment. The comment author can not highlight his own comment.

Many features mentioned here are optional, under the control of the site owner. Do not sum them up and consider them all active at the same time (although that is certainly an option)!

With that being said, let's get going. I will group features by areas of interest to be able to have the proper context behind each.

---

Commenting Experience

Here it's all about the act of writing and posting one's comment. This should happen with as few losses of context and flow as possible.

People should read and when they feel they have something to share should have the tools at hand to do so right then and there. No "scroll this many pages", "jump to the end since there must be something there to help me", "copy this is in the clipboard since I will need it later on", etc.

The whole system should reduce the cognitive load related to organizing and crafting the comment, thus leaving one's mind to focus on the prior conversations and the message itself.

We have done many things in this direction in version 1.0, but I believe we can do even better. In no particular order:

• Conversation System: Post new comments with AJAX #270 Post new comments with AJAX. As simple as that. The default core experience of going to a separate page in case of errors, or reloading the page is not smooth enough. It is good as a fallback, but the primary experience should be AJAX-based, including validation and error messages. This should not mean duplicating the server-side logic, but only relying on it and presenting its results without page reload.
  The WP Ajaxify Comments plugin is a good starting point.
• Conversation System: Allow users to edit their comments #271 Option for post-submission editing of the comment, for a limited time (minutes). There is nothing more frustrating than noticing a typo or missing word after submission and having no way of correcting that. It feels that all the craft that went into your message was for nothing.
  The Simple Comment Editing plugin does this, but I think we may have to integrate it for a more consistent experience (the same form fields as when posting initially).
  This action should be AJAX-based.
• Option for social commenting. This is not Social Login, meaning no user is registered on the site. But, the commenter details are fetched via a social network of choice. Here is a plugin developed a while back.
• Option to insert the comment form pseudo-button (looks like an input field) in all the places people might feel the need to pitch in. If there are more than say three replies in a conversation, show the comment form button after the last reply so people don't have to break flow, scroll to the main comment, and hit the reply link.
  Basically have a button stylized as an input that acts the same way as the reply link.
• Conversation System: Add email notifications for comments  #272 Option for conversation subscribe via email. Nothing fancy, just a checkbox at the end of the form to subscribe to notifications. In fact, there should be two checkboxes: one for subscribing to updates for the current thread, and another one for any conversations of the current article.
  The Subscribe To Comments Reloaded plugin is a good starting point. There is also Replyable from Postmatic.
• Option for select-to-quote-comment in the article body. This means that if I read something that really catches my mind's eye (and I was ready to do some commenting) I can simply select the text and I would have an icon ready to get that text and prefill it in the comment form as a quote, and scroll the view on the comment form. A nice feature would be to have a link to take me back up to where I left off; again, maintain a coherent reading+interaction flow.
  This feature could be coupled with the share logic in Create a Sharing System #254 to have icons for commenting and sharing in the same container.
  Here is a WP plugin that does this for social sharing.
• Option to double the converstation starter block at the end of the conversations list, besides "doubling" the comment form.
• Option to have comment form fields instructions. Think of these as sort of inline contribution guidelines (here is an example from Lesswrong.com). These instructions would be shown only on focus on that certain field, and hidden when losing focus.

Reading Comments Experience

Here it's all about getting to grips with prior conversations. This should happen in a way adapted to the context of threaded comments: a hierarchical list of thoughts with a specific context given by the author info, highlights, or references.

Reading conversations is not the same as reading an article. While an article is, by design, a linear flow of thoughts cascading from one into another, a set of conversations is a tree of possible linear flows of throughs. This increase in complexity necessitates a more considerate approach towards displaying them and the tools we provide for readers to navigate the said hierarchy.

We have a very good starting point in version 1.0, but there are still things we can take into consideration.

• Option to partially hide long comment replies. In order to keep the initial vertical length of the conversations to a manageable size, we should provide the option to have a "Read more" control at the bottom of the comment after a certain length of words. This should not apply to highlighted replies.
  We could consider having 3 options: full (no cutting), reduced (cutting after a certain length), compressed (a minimal state that expands on click on it - kind of like a button; only a minimal amount of text gets displayed).
  There is a plugin that might function as a starting point.
• Option to show only top-level comments by default, with collapsed replies. This scenario allows to keep the initial focus only on the conversation root messages and rely on the judgment of the reader to expand a conversation that catches his or hers eye.
• Option to display highlighted comments in a separate list, before all the conversations. This scenario brings further emphasis on highlighted comments, while providing "View in context" link to the actual place of that comment in the conversations list.
• Conversation System: Add support for comments reporting #273 Option to flag a certain comment. Readers could flag a certain comment with a required short message about why they reported the said comment. This could include false information, bad language, errors, etc. Basically it's a tool to assist with moderation. The link should reside in the "More" dropdown and use AJAX to send. Only registered users should be allowed to report.
  The Correspondent has a very nice take on this in the form of a "letter" of sorts to the article author.

Managing Comments Experience

Here it's, mainly, about moderating comments. This whole section is dedicated to the editorial team or one-man crew that gets to decide what goes and what doesn't on a specific site.

We already have the comment highlight functionality working, allowing for multiple highlighters of a single comment. But, since moderators or editors are also human 😀 , I believe they deserve some nice tools to be able to handle, hopefully, a deluge of conversations.

There are two areas of interest here: the editor specific frontend tools and the way editors know there is something they need to do like approve a comment or know someone flagged a certain comment. In version 2.0 we will focus on the frontend side of things, while in version 3.0 we may tackle a system of email notifications tailored to a editorial context.

• Allow editors to edit any comment inline, using the same logic as the time-limited editing available to all commenters.
• Allow moderators to approve, unapprove, mark as spam comments from the frontend. This should be AJAX-based.
• Provide options for the site owner to add pre-registered users to the list of users allowed to manage comments, with a short field for the role of each (e.g. "Conversation editor"). The value of this field will be used in the comment highlighters list also.
  These options could reside in the Settings > Discussion WordPress dashboard page.

There is a (premium) addon to the Simple Comment Editing plugin that promises to tackle many of these challenges. It is may be worth a look.

Refactoring as things evolve

As we add features, think deeper about things, learn better ways we will surely reach points where we need to do some heavy-handed refactoring to keep things sane and be able to progress without losing our hair.

This is a placeholder section at this point.

Things considered for version 3.0

To have a place to gather any ideas that we should consider in the next version, here is a list:

• Single conversation/thread view. To make further layers practical, we should have a way to read a single thread in a separate view (here is how The Correspondent does it), with the navigation between top-level threads and lower-level threads.
• A system of email notifications tailored to a editorial context.
• A continuous history for each comment, including edits (with the possibility to view the diff). This could be important where the timeline of events and opinions is important to the trust of the public.
• Automated tools for editors to gather insights towards meaningful actions. For example, automatically recommend comments to be considered for highlight. This plugin is an implementation of the API created by the researcher Nick Diakopoulos under the name of Comment IQ - Github page. Lots of interesting work!
• Allow readers to flag comments as innapropriate and put a comment in pending review mode after a certain number of flags. This way, a large site, can avoid troll flooding while moderators are not available. Here is a WordPress plugin developed some time back.

---

NOTE: This initial message should be updated as things evolve. We should open issues for each feature and reference this discussion.

[vladolaru]

I will leave this here as a note.

A very clever and performant way to generate SVG avatars, multicultural to boot :) https://github.com/multiavatar/Multiavatar Available also in JS and PHP.

[vladolaru]

A possible way of avoiding Akismet as an effective dependency of the comments system in WordPress: https://wordpress.org/plugins/lh-zero-spam/