[messaging] Displaying threads

[Michael Rogers]

Reviving an old thread...

I've been playing around with some heuristics for displaying threaded
conversations on small screens, and I think I've found some rules that
produce reasonable results.

The key is to distinguish between replies that fork the conversation and
replies that keep the conversation linear. Linear replies don't require
indentation. The rules are as follows:

1. If a post has a single reply, show the reply below the parent.
2. If a post has multiple replies, indent the replies and apply the
rules recursively, or if we've reached the indentation limit, collapse
the replies.

On a narrow screen we can set the indentation limit to 1; on a wider
screen it might be 2 or more. (Reddit allows 9 levels of indentation,
but the same conversations would require less indentation in this system
because of rule 1.)

Results for an example conversation are shown below; if you're reading
in a variable-width font, use your imagination. :-)

Structure of the conversation (this is not how it's displayed):

AAA
|
+-BBB
| |
| +-CCC
|   |
|   +-DDD
|     |
|     +-EEE
|       |
|       +-FFF
|       |
|       +-GGG
|         |
|         +-HHH
|
+-III
|
+-JJJ
  |
  +-KKK
  |
  +-LLL

On a narrow screen we can set the indentation limit to 1:

AAA
|
+-BBB
| |
| CCC
| |
| DDD
| |
| EEE
| (3 replies)
|
+-III
|
+-JJJ
  (2 replies)

Expanding the first collapsed thread:

EEE
|
+-FFF
|
+-GGG
  |
  HHH

Expanding the second collapsed thread:

JJJ
|
+-KKK
|
+-LLL

On a wider screen we can set the indentation limit to 2:

AAA
|
+-BBB
| |
| CCC
| |
| DDD
| |
| EEE
| |
| +-FFF
| |
| +-GGG
|   |
|   HHH
|
+-III
|
+-JJJ
  |
  +-KKK
  |
  +-LLL

The junctions marked + could be used to jump to the parent to see the
context of a reply.

Cheers,
Michael

On 29/04/14 20:17, Nadim Kobeissi wrote:
> From my experience with mobile phones, the issues are that due to the
> screen's small size, things like delineating the depth of a message in a
> thread or providing ways to collapse/expand a thread have to happen
> within barely any space to clarify the necessary UI elements.
> 
> What could be helpful is to design the interface based on a specific
> understanding for your own application, and design  the UI to
> intelligently organize itself based on what you believe will be the most
> common use-cases for your users. This could be wielded to minimize
> instances wherein the user will be stuck needing to do things that
> require the navigation of interfaces that simply don't display well on a
> mobile phone.
> 
> NK
> 
> On Apr 29, 2014, at 4:24 AM, Michael Rogers <michael at briarproject.org
> <mailto:michael at briarproject.org>> wrote:
> 
>> Signed PGP part
>> Hi all,
>>
>> I've never come across a good way to display threaded conversations on
>> a small screen. Have you? Please share.
>>
>> On a large screen, the best example I've come across is Reddit: clear
>> nesting, plus a parent link in every message in case the nesting gets
>> deep and the context isn't clear. But nesting is better suited to
>> conversations with a high branching factor than conversations that go
>> back and forth between a few participants. Do you know of any other
>> good examples?
>>
>> Cheers,
>> Michael
>>
>>
>> _______________________________________________
>> Messaging mailing list
>> Messaging at moderncrypto.org <mailto:Messaging at moderncrypto.org>
>> https://moderncrypto.org/mailman/listinfo/messaging
>