Threaded comments

Hey guys, we had a bit of a discussion at the loomio table mocking up different ways to do threaded comments, and we determined that the easiest way to do things for now is to keep things simple and stick with "yammer-style threading" for now.

Obviously this is up for discussion. But we should point out that this isn't going to affect the back-end architecture, it's just a matter of the way the information is displayed. Anyway, here's the mock-up we've come up with so far:

https://www.yammer.com/loomio/uploaded_files/5273872

Another thing to note is that in this mock-up there is a "head" comment, which is the first comment that starts the discussion.

One last thing, we've thought about keeping both "Like" and "Useful" for now, as they really indicate two different things (one is about social cohesion, the other is about useful information). You'll see that the first comment has been tagged as useful 2 times, and has 7 likes.

Again, all of this is up for discussion, this is just the first mockup to get the conversation started.

Fire away!

Looks good - I'm confused about the head comment reference though. Wouldn't a discussion have many of these comment blocks? i.e. in this discussion this post would be the head of their own thread, as would jon's below?

No, the idea is that it would pretty much be exactly like yammer. As in, there's a single "head" comment which is the start of the discussion, and everything else would display chronologically underneath that. There would still be the ability to "reply to" specific comments, but from a user-perspective they would display in the same way that they do on yammer (chronologically, with an "in reply to" statement showing on the first line)

I'm not a fan of that as it would be only a slight improvement over what we have.

Personally I would rather see a discussion with multiple yammer style threads in it so we can pursue multiple trains of thought on one topic. It also means when we get branching you can branch a comment to a new thread within a discussion, branch a thread to a new discussion etc.

I also think that the initial description of a discussion should be outside of the comment/threading system and visible at the top of the page as the 'facilitation frame'

Cool. If we do "proper" threaded commenting (which is what it sounds like you're suggesting) there are a few new problems that come up which will need addressing.

I'll create a few new mock-ups to show what I mean and post them back here.

Alright, here's an initial mockup of "proper" threaded comments.

https://docs.google.com/open?id=0BwwrFxc5jNt9QkpGZTV4a3NFRGs

This mock-up still doesn't cover the problems/questions I was referring to in the previous post (e.g. what happens when a conversation gets really long?, can we display vote history inside a threaded conversation?). I'm going to have a go at addressing those questions in another mock-up now. But feel free to start providing feedback with what I've posted so far.

Handling long conversations is what facebook and yammer do really well 'show 3 older replies (2 unread)' etc.

I'm also not sure if multi threading is the way to go and I'd be happy with just one level of threading.

I guess that put's me back in the 'make it like yammer' camp which I acknowledge isn't what everyone wanted.

Limiting to a single level of threading is an interesting idea...

In regards to showing only unread comments:

I think "show 3 older replies" only really works when you're displaying comments chronologically (no threading at all). As soon as you even one level of threading it's a different ball-game (how do you display new comments which are replies to old comments?)

This is why we initially suggested displaying comments chronologically with yammer-style "reply to". Technically it’s the same thing as threaded comments, but from a UX perspective it’s simpler and could be a good "bridge" to a more full-featured threaded comment system later on. That said, I've been expanding upon the previous threaded comments mock-up. Take a look (the second link is the same as the first, but it has notes attached):

https://docs.google.com/open?id=0BwwrFxc5jNt9Z2RsaEVXaDM0QWs

https://docs.google.com/open?id=0BwwrFxc5jNt9VVk4LVVUMGtpdXc

New comments are highlighted with a vertical blue bar on the left. And we could make it so when you come back to the conversation it scrolls down to any new comments that you haven’t seen yet. We could also implement a filter to “show only new comments”. I’ve got an idea of how we could implement this filter in a straightforward way (which I can mock-up if people are interested).

Another option would be a shortcut and/or button to scroll through new comments (e.g. pressing the “down arrow” takes you to the next new comment). This could be really cool. It would mean that you get to see new comments within their context, and you wouldn’t have to spend any time searching for them, you’d just press a button and you’d see the next new comment instantly.

I think the main thing to consider is this: regardless of whether we do yammer-style or fully-threaded comments, from a back-end architecture standpoint it’s the same. Yammer-style is probably safer, fully-threaded is potentially cooler if we can overcome the usability/visual hurdles.

And perhaps the best idea: implement both, give the user the option to choose between either style, see which people prefer (or if they like having both options). In that case the question is, which one do we implement first?

This looks amazing Jon. Having trouble engaging with visual stuff through text medium though, so lets talk about it at the meeting tomorrow :)

Yep I'm happy with this.. I would be keen to implement both threaded and yammer style views at the same time - that should quell most of the discussion/uncertainty around this topic and let us move on to other features.

As I said to the other devs this morning.. I think the mixing of proposal events (Voting, starting proposals etc) into the stream of comments might cause some implementation headaches.. Also the proposals UX/wireframes are not complete so we don't know what we're actually mixing in to our comments yet.

So.. may I suggest we initially (just for first iteration) keep proposal event stuff out of the comments? I think this would make first release much simpler and quicker. When we have agreed on new proposals stuff we can then go back and mix it into a chronological view of stuff.

Yep, I'm happy to keep the proposal history out of the conversation for starters.

• https://www.loomio.org/m/WfgtswaY/threading-via-visual-shading-and-or-colour
• https://trello.com/c/SAMuMFoc/24-reply-to-comment-one-level-of-threading
• https://www.loomio.org/d/X8TxZVon/allow-to-comment-comments