819167 - Short questions generate a lot of white space

Status: RESOLVED FIXED

(support.mozilla.org :: Forum, task, P3)

Description

[Ibai Garcia [:ibai]]

Example:

https://support.mozilla.org/en-US/questions/943662

Short questions generate a huge white space between the initial question and the answers because the side-bar rules the layout.

There should be a way to make this better.

Comment 1

[Bram Pitoyo [:bram]]

Attachment: Sidebar with hidden tools

The easiest solution to save a lot of space is to hide the sidebar tools by default and only expand them on click.

Comment 2

[Bram Pitoyo [:bram]]

Attachment: Full-width tools, expanded

The second method is splitting the sidebar into 4 different sections, then lining up these sections under OP’s question. This way, we still get the visibility of each tool and save vertical space at the same time.

Keep in mind that, if user is not logged into SUMO, he will not see any of the tool.

Comment 3

[Bram Pitoyo [:bram]]

Attachment: Full-width tools, hidden by default

The third method is hiding all of the tools and information under one bar that extends to the full-width of the page. This is a similar treatment to the “For Contributors” section.

Comment 4

[Ibai Garcia [:ibai]]

I think I like the first version best. We don't alter the placement for the people who are already familiar with it and we don't use vertical pixels for it like we do in v2 and v3 (i.e. reducing the information above the fold).

Just my 2 cents.

Comment 5

[Kadir Topal [:atopal]]

I also like the first one most, but hiding information means more clicking for contributors, which can be a drag. I know I sometimes have a look at the system details at least. Let's ask the contributors what they think about this. Also, hiding the "subscribe" option would be particularly interesting for non-contributors who won't look under "question tools".

Here is an alternative: Let's put product, topic, system details and tags into one box and and "edit, delete, move" into another box and collapse them by default. "subscribe by mail, and subscribe to feed" should be on top and displayed by default.

Like this:

+-------------------+
|Get Email updates  |
|-------------------|
|Subscribe to feed  |
+-------------------+

+-------------------+
|Question Tools   v |
+-------------------+

+-------------------+
|question and       |
|product details  v |
+-------------------+

Comment 6

[Kadir Topal [:atopal]]

Discussion is happening here: https://support.mozilla.org/en-US/forums/contributors/708845

Comment 7

[Bram Pitoyo [:bram]]

To summarize the discussion, it seems like our forum participants all agreed that certain informations are more important than others, and that some may be collapsed while others should be left expanded.

But there are talks on reorganizing the sidebar into smaller sections, and different contributors uses different techniques to deduce problems.

* One prefers tag only, since it’s the most straightforward
* Others prefer any combination of product, topic and system details
* Others don’t use the sidebar at all and prefer to read the question right away

Nobody mentioned the importance of get email updates and subscribe to feed, so if there’s an item that we can safely hide or even remove, it will be these two.


My proposal (for now):

1. Separate the sidebar into 4 major sections:
a) Product, topic and system (needs a better section name)
b) Tags
c) Edit
d) Other article tools (lock, delete, etc.)

2. Make section a and b collapsible, but save viewing preference. This means, if a contributor expands the tags sidebar, that sidebar should always be expanded upon opening any question.

Comment 8

[Ibai Garcia [:ibai]]

What about something like this...

The subscription doesn't make much sense for contributors and for non contributors we want them to say they have the same problem. The 'me too' button covers a similar use case.

If we remove those 2 components we can change the UI a little bit to fit everything without collapsing and expanding the boxes.

Comment 9

[Ibai Garcia [:ibai]]

Attachment: Compact Sidebar

Comment 10

[Bram Pitoyo [:bram]]

Comment on attachment 698136 [details]
Compact Sidebar

Ibai,

Good idea about removing both “Get email updates” and “Subscribe to feed”.

I’m with you in thinking that the notification feature should kick in in either one of these scenario:

* When user clicks on the “I have this problem, too” button
* When user replies on a thread

I think that these actions remove the need for a specific notification link.


I also like your idea of making product and topic inline. I am worried that the text strings won’t fit. For example, what if the product name is “Firefox for Mobile”, and the topic name is “Fix slowness, crashing, error messages and other problems”?

It might be resolved by separating the support forum into different products (which was in the plan), so we can remove the “Product” section entirely?

Comment 11

[Kadir Topal [:atopal]]

Attachment: sidebar for users

(In reply to Bram Pitoyo [:bram] from comment #10)
> Comment on attachment 698136 [details]
> Compact Sidebar
> 
> Ibai,
> 
> Good idea about removing both “Get email updates” and “Subscribe to feed”.
> 
> I’m with you in thinking that the notification feature should kick in in
> either one of these scenario:
> 
> * When user clicks on the “I have this problem, too” button
> * When user replies on a thread
> 
> I think that these actions remove the need for a specific notification link.

This is already happening today, so we can indeed get rid of those two links (although the discoverability for that is low, and we should check at least the usage pattern for the email link)

 
> I also like your idea of making product and topic inline. I am worried that
> the text strings won’t fit. For example, what if the product name is
> “Firefox for Mobile”, and the topic name is “Fix slowness, crashing, error
> messages and other problems”?

I don't think putting them on their own line would be an issue, we might get rid of "tags" anyway, and the big box of "edit,lock, delete" is only visible to admins/mods.
 
> It might be resolved by separating the support forum into different products
> (which was in the plan), so we can remove the “Product” section entirely?

Yeah, that is the plan, but there would always be a "all products" forum, which would still require the distinction. 


Bram, Ibai, with this change I'd say that there is no issue for users anymore. If you guys agree, we can go ahead and make those changes.

Comment 12

[Ricky Rosario [:rrosario, :r1cky]]

style changes are easyish

Comment 13

[Bram Pitoyo [:bram]]

I agree to make these changes. Removing “Get email updates” and “Subscribe to feed” is a no brainer.

cor-el specifically wrote that he uses the “tags” section quite a bit, so let’s make sure that, if the tag section is disappearing, the alternative (which may be the “Topics” section), is good enough.

Comment 14

[Rehan Dalal (Inactive)]

Do we have a final decision on how this is meant to be implemented?

Comment 15

[Kadir Topal [:atopal]]

Rehan, let's go with comment 11, and attachment: https://bugzilla.mozilla.org/attachment.cgi?id=699218

Comment 16

[Ricky Rosario [:rrosario, :r1cky]]

Deployed to prod:

https://github.com/mozilla/kitsune/commit/4be72d8e367398a5e3b627d6c3fd882a33ebaaeb

Comment 17

[Ibai Garcia [:ibai]]

Sorry to reopen but this is not fixed as intended.

The "Get Email Updates" and "Subscribe to feed" where not removed.

If this piece of logic needs to be removed elsewhere and requires another bug, please let me know and we can mark this as resolved.

Comment 18

[Ricky Rosario [:rrosario, :r1cky]]

I'll take care of this quickly. Yay for deleting more code!

Comment 19

[Ricky Rosario [:rrosario, :r1cky]]

Landed on master:
https://github.com/mozilla/kitsune/commit/807607f5ce5a5f0b12a722d6a86f209deddd56cf

Blocked on deployment issues for deploying.

Comment 20

[Ricky Rosario [:rrosario, :r1cky]]

This made it's way to prod.

Comment 21

[Alice Wyman]

Has anyone tried to verify the fix?  The original example [1] and newer questions [2] still show plenty of white space, as long as a helpful reply or solution doesn't take it up.

[1] https://support.mozilla.org/questions/943662
[2] https://support.mozilla.org/questions/948952

Related discussion: https://support.mozilla.org/forums/contributors/708958 unsubscribe from certain threads

Comment 22

[Kadir Topal [:atopal]]

Alice, you are quite right. There is still a lot of white space in some cases. But since threads are read much more often than being written, the focus was on non-logged in users. For that group the issue is fixed indeed. 

If contributors feel that it's still an issue we can file another bug for that and see what other options we can come up with. I personally don't feel that it's an issue anymore.

Comment 23

[Alice Wyman]

(In reply to Kadir Topal [:atopal] from comment #22)
> Alice, you are quite right. There is still a lot of white space in some
> cases. But since threads are read much more often than being written, the
> focus was on non-logged in users. For that group the issue is fixed indeed. 
>  
My mistake, then.  The focus **seemed** to be on contributors, based on Bram's attachments and the fact that you have to be logged in to answer questions on the forum (excess "white space" would require contributors to scroll down to make an initial reply).  Were non-logged in users seeing a "a huge white space between the initial question and the answers" as Ibai wrote in the bug description? (There's no screenshot of that).  Also, what would be the issue with excess "white space" for non-logged in users ... aesthetics?  

In any case,  I think that Ibai's original description that "Short questions generate a huge white space" was (and still is) a bigger issue for forum moderators, who have additional tools in the sidebar (Edit this post - Delete this post -Lock this post) which take up more room and create more white space.

(In reply to Kadir Topal [:atopal] from comment #22)
> 
> If contributors feel that it's still an issue we can file another bug for
> that and see what other options we can come up with. I personally don't feel
> that it's an issue anymore.

I'll leave that up to Ibai and the other contributors, whether or not this bug is fixed or if a new one needs to be filed.

Comment 24

[Ibai Garcia [:ibai]]

My point was related to both contributors and users. 

In the case of users it can be more dangerous, if they don't see and answer, they many not scroll down, if they identify that there's content after the white space, they have better chances to scroll down.

It would be ideal to fix it for contributors. My take on the sidebar was trying to compress it enough that fixed the issue for contributors. Maybe we can evaluate implementing that one?

Comment 25

[Kadir Topal [:atopal]]

Alice, what Ibai said is also why this was primarily about users for me.

The issue for contributors seems to be that they need to scroll down further? Or maybe aesthetics?

Like I said, I don't really see much of an issue anymore, but I'm open to any suggestions. Let's file a new bug for that though.

Comment 26

[Alice Wyman]

Kadir,  I never had much of an issue with the white space.  The issue I have now is with the "fix" for this bug, which removed the "Get email updates" option.

Comment 27

[Alice Wyman]

(In reply to Ibai Garcia [:ibai] from comment #8)
> What about something like this...
> 
> The subscription doesn't make much sense for contributors and for non
> contributors we want them to say they have the same problem. The 'me too'
> button covers a similar use case.
> 
> If we remove those 2 components we can change the UI a little bit to fit
> everything without collapsing and expanding the boxes.

(In reply to Bram Pitoyo [:bram] from comment #10)
> Comment on attachment 698136 [details]
> Compact Sidebar
> 
> Ibai,
> 
> Good idea about removing both “Get email updates” and “Subscribe to feed”.
> 
> I’m with you in thinking that the notification feature should kick in in
> either one of these scenario:
> 
> * When user clicks on the “I have this problem, too” button
> * When user replies on a thread
> 
> I think that these actions remove the need for a specific notification link.
 
I've tested the "I have this problem, too" button  and it only sends you notifications when the thread is marked solved so it doesn't remove the need for the "Get email updates" option.  I'm using the default "Watch Questions threads I comment in" setting in my profile so, to get e-mail updates for every new comment, I'd have to add a comment to the thread.  I didn't want to add "empty" comments just to subscribe to e-mail notifications so what I ended up doing was to add my own "Subscribe" button (since that option was also removed) and then watch the threads' RSS feed via Live Bookmarks ... but it's not as convenient to me as e-mail updates.

Comment 28

[Alice Wyman]

In case I wasn't clear, I often watch threads without participating in them, for various reasons.  Removing the "Get email updates" option made that harder for me.  

For other contributors,  it made it harder to unsubscribe from threads, since the only way to do that now is from the e-mail "unsubscribe" link.  Related discussion: https://support.mozilla.org/forums/contributors/708958 unsubscribe from certain threads

Comment 29

[Bram Pitoyo [:bram]]

UI-wise, there are two possible solutions to this problem:

The first solution is easy to deploy. Show a button called “Watch this thread” to every logged in user, so it allows active contributors like Alice to monitor threads while not adding more things to the sidebar. This is the same button found on the community discussion forums, and should behave the same way. We won’t show this button to users who aren’t logged in.


The second solution is harder to deploy, but I think addresses the underlying problem, which is the fact that different user levels need different kinds of information, and should have interfaces tailored towards that need.

For active contributors like Alice, we can show absolutely everything on the sidebar, including “get email updates” and “subscribe to feed”. We can disregard any empty vertical space gaps that might occur, because this interface is designed for contributors to access all of the tools that they need effectively.

To users who are just logged in but aren’t active, we should show the sidebar and hide each section by default so it takes minimal vertical space. Some users who are logged in are just there to get their questions answered, not to contribute. In fact, they might not realize that they’re logged in. All they want is to be able to post clarifications to their questions, read responses, and get out. We should support this.

Finally, to users who are not logged in, we either:
* Hide the sidebar entirely, or
* Collapse every section into something called “Question tools”, so it is still accessible

This way, big vertical gap ceases to be an issue entirely for those group.

Comment 30

[Kadir Topal [:atopal]]

Bram, I think you've hit the nail on the head. 

Alice, I'm sorry. I didn't expect this to cause much issues.

Here are my thoughts for now:

1. Hide as much as possible behind collapsed blocks in side sidebar, like we do on the KB. 

2. Save expand state. 

This means that users will see very little of the sidebar while contributors can decide for themselves how much they want to display. Some might not need tags, but are interested in the editing tools, and the other way around.

Since we'd save your preference, this should never get in your way, and you can change your perference easily.

Comment 31

[Kadir Topal [:atopal]]

Bram, I took your initial design here and filed bug 851487

This will also give us more wiggle room when we add subtopics.