Threaded/nested mobile comment section

Question

I'm building a mobile application that is supposed to encourage conversation, and one feature is being able to comment on posts, as well as comment on comments.. essentially a threaded comment system.

This can get very messy very quickly, especially on mobile, so I'd be curious to know what you guys think of my solution that I currently developed for my app.

So the way I have it is something like this:

^{download bmml source – Wireframes created with Balsamiq Mockups}

So essentially, each comment has a replies button, and when you click on it it takes you to a new screen where the comment is the "main text" and it has x amount of comments below.. essentially offering infinite nested/threaded comments.

Is this a good UX implementation? I think it works.. perhaps not brilliantly, but I don't know if you can make a brilliant implementation of threaded comments for mobile.

I think one potential addition I could do to make it better is that in the second screen maybe show the original post as well, so users don't forget/lose the context of the post.

What do you guys think? Any feedback would be great! Thank you.

Answer 1

I think your solution is actually very mobile-friendly and a common pattern in other contexts. It's also pretty scalable (replies to replies to replies to replies ... etc).

The indented approach would be tricky beyond the first level of replies, and any limit on the comment levels would seem arbitrary to the user (and it would be - it would only be there to accommodate the design problem)

One thing that seems to be missing (and to be fair you haven't asked for comment on it!) is how the user actually replies to any of these. That might affect your design because of the space that it might occupy.

Answer 2

I want to start off by saying that using so many fragments/activities for comments is a serious waste of device resources and would make a mess out of activity stack since you can't kill the previous ones cause you need to allow back navigation.

I would show the main comments and each of them with the latest 3 replies and implement an accordion system that upon clicking "show more", loads 6 more comments and so on.

If you expect to have a lot of comments, I would also limit the comment levels like so:

• Main comment
• A user can reply to a main comment
• Another user can reply to the child comment

Ex:

To keep things clean I would close back to the original state the previously opened main comment when the user clicks "load more" on another comment.

This ensures that the user doesn't have a huge amount of comments to scroll back up after navigating for a while.