Last Comment Bug 556285 - [k][forum] Create final mockup for individual question view for support forums
: [k][forum] Create final mockup for individual question view for support forums
Status: VERIFIED FIXED
:
Product: support.mozilla.org
Classification: Other
Component: Forum (show other bugs)
: unspecified
: All All
: -- normal (vote)
: 2.2
Assigned To: Chris Howse [:chowse]
:
:
Mentors:
Depends on:
Blocks:
  Show dependency treegraph
 
Reported: 2010-03-31 08:55 PDT by David Tenser [:djst]
Modified: 2010-07-09 10:13 PDT (History)
6 users (show)
See Also:
QA Whiteboard:
Iteration: ---
Points: ---


Attachments
Thread View Mock-up (User) (614.50 KB, image/png)
2010-04-21 08:44 PDT, Chris Howse [:chowse]
no flags Details
Thread View Mock-up (User) (745.50 KB, image/png)
2010-04-25 21:27 PDT, Chris Howse [:chowse]
no flags Details
Thread View States & Pop-ups (246.93 KB, image/png)
2010-04-25 21:29 PDT, Chris Howse [:chowse]
no flags Details
Thread View Mock-up (User) (778.36 KB, image/png)
2010-04-27 11:46 PDT, Chris Howse [:chowse]
no flags Details
Thread View States & Pop-ups (200.80 KB, image/png)
2010-04-27 11:47 PDT, Chris Howse [:chowse]
no flags Details
Thread View Mock-up (Thread Creator) (791.66 KB, image/png)
2010-04-27 11:48 PDT, Chris Howse [:chowse]
no flags Details
Thread View Mock-up (Admin) (795.13 KB, image/png)
2010-04-27 11:49 PDT, Chris Howse [:chowse]
no flags Details
Thread View Mock-up (Editing) (229.69 KB, image/png)
2010-04-27 14:34 PDT, Chris Howse [:chowse]
no flags Details
Extra Reply Details (164.99 KB, image/png)
2010-05-03 19:51 PDT, Chris Howse [:chowse]
no flags Details

Description David Tenser [:djst] 2010-03-31 08:55:17 PDT
Now that we have wireframes for the new support forum, we need the actual mockups for our awesome webdev team to implement. 

The latest (possibly not final) wireframe is at http://people.mozilla.com/~nlee/sumo/forum-reboot/wireframes/post-view-v3.png.
Comment 1 Chris Howse [:chowse] 2010-04-21 08:44:57 PDT
Created attachment 440514 [details]
Thread View Mock-up (User)

First draft, based on Neil's mock-ups.

Notes and comments:

* Button visual design is not final.

* The UI around the original message feels really cluttered right now. How would you feel about removing or minimizing (i.e. making expandable/collapsible) certain elements, like related questions, email/feed links, etc.?

* How will tags and related questions work in the broader system?

* I'm debating moving the 'N users have this problem' directly below the message, and the 'Post a Reply' button below the list of helpful responses. Having 'Post a Reply' be the first thing they see seems like it would encourage more 'Me Too' posts.

* We should probably discuss the 'Helpful' vs. 'Solution' language offline. I'm leaning more towards the 'Solution' side, but this could change the UI a bit (e.g. does this support positive and negative feedback?). In addition, what determines if a problem is 'solved' vs. having 'n solutions'?

* Are replies sorted chronologically or by helpfulness? Should this be configurable?
Comment 2 [:Cww] 2010-04-21 14:34:09 PDT
(In reply to comment #1)
* The UI around the original message feels really cluttered right now. How
would you feel about removing or minimizing (i.e. making
expandable/collapsible) certain elements, like related questions, email/feed
links, etc.?

I'd be up for it but we should talk about what we think each approach emphasizes


* How will tags and related questions work in the broader system?

Tags make for better search results and helps populate related questions.  Related questions are a key component of the workflow: if the current thread isn't a match to the user's problem, we should encourage that he find a matching threads vs posting a new one.

* I'm debating moving the 'N users have this problem' directly below the
message, and the 'Post a Reply' button below the list of helpful responses.
Having 'Post a Reply' be the first thing they see seems like it would encourage
more 'Me Too' posts.

I agree.  That seems like a good change.  Bear in mind that if they aren't logged in, though, they won't get a post a reply button at all.

* We should probably discuss the 'Helpful' vs. 'Solution' language offline. I'm
leaning more towards the 'Solution' side, but this could change the UI a bit
(e.g. does this support positive and negative feedback?). In addition, what
determines if a problem is 'solved' vs. having 'n solutions'?

A solved problem is marked so by the OP but we've found that only 10% of OPs come back and actually mark threads so we needed a secondary mechanism to float up useful threads which we do by letting anyone mark a thread as helpful.

* Are replies sorted chronologically or by helpfulness? Should this be
configurable?

Chronologically, because troubleshooting can sometimes involve a fair bit of back and forth and we are trying to promote interaction between contributors, a chronological layout makes the most sense.  To help the problem of burying the most helpful items, we have the "top posts" section at the top.
Comment 3 James Socol [:jsocol, :james] 2010-04-21 14:35:16 PDT
I saw a lot of collapsed areas already. This is just a gentle reminder that anything collapsed, we also need to see expanded, so we know what goes there.
Comment 4 Chris Howse [:chowse] 2010-04-25 21:27:14 PDT
Created attachment 441426 [details]
Thread View Mock-up (User)
Comment 5 Chris Howse [:chowse] 2010-04-25 21:29:11 PDT
Created attachment 441427 [details]
Thread View States & Pop-ups
Comment 6 Chris Howse [:chowse] 2010-04-27 11:46:11 PDT
Created attachment 441873 [details]
Thread View Mock-up (User)
Comment 7 Chris Howse [:chowse] 2010-04-27 11:47:19 PDT
Created attachment 441877 [details]
Thread View States & Pop-ups
Comment 8 Chris Howse [:chowse] 2010-04-27 11:48:14 PDT
Created attachment 441879 [details]
Thread View Mock-up (Thread Creator)
Comment 9 Chris Howse [:chowse] 2010-04-27 11:49:32 PDT
Created attachment 441880 [details]
Thread View Mock-up (Admin)
Comment 10 Chris Howse [:chowse] 2010-04-27 14:34:43 PDT
Created attachment 441936 [details]
Thread View Mock-up (Editing)
Comment 11 [:Cww] 2010-05-03 14:48:11 PDT
A few points from going through the PRD and noting discrepancies (These are all tiny features, can we mock up how they'd look?):
* Any replies from the original poster of the question should be also highlighted differently -- e.g. they should use the same background color as the original question at the start of the thread.
* The reply that has the most helpful votes should get a special highlight to make it stand out of the rest.  (We're now linking from the top of the page.  Is this enough or should we highlight as well?)
* Moderators should be able to see how many people marked a reply as unhelpful so we can quickly identify bad solutions.  (May be a P2 if hard to implement)
* Users are asked what their level of computer skill is as well as how long they've been using Firefox.  How will we display that data?
Comment 12 Chris Howse [:chowse] 2010-05-03 19:51:46 PDT
Created attachment 443273 [details]
Extra Reply Details

(In reply to comment #11)
> * Any replies from the original poster of the question should be also
> highlighted differently -- e.g. they should use the same background color as
> the original question at the start of the thread.

(See attached mockup) I've added a blue background to replies by the original author, and added an 'Author' label below it's avatar. The 'Helpful' options are also removed from these replies, but they still can be reported, edited, or deleted.


> * The reply that has the most helpful votes should get a special highlight to
> make it stand out of the rest.  (We're now linking from the top of the page. 
> Is this enough or should we highlight as well?)

(See attached mockup) I'd recommend a green background, even if we include it at the top of the page. I've only done this for the solution, though.

For other replies accessed through links, you may consider a brighten transition (http://bit.ly/cwA3MO). After clicking the link, we initially highlight the targeted reply (I'd recommend light yellow). After a few seconds, the highlight fades back into white. This is enough to highlight the intended reply without being a visual distraction afterwards.


> * Moderators should be able to see how many people marked a reply as unhelpful
> so we can quickly identify bad solutions.  (May be a P2 if hard to implement)

Check the original mock-ups again. Each reply is labeled as 'X out of Y found this helpful', so it is possible to know how many people didn't find it helpful (with a little mental arithmetic). If you want to make this clearer for moderators, we can change the color of the text from green to red after it crosses a certain threshold (e.g. <50% found it helpful and at least 4 people voted).


> * Users are asked what their level of computer skill is as well as how long
> they've been using Firefox.  How will we display that data?

You'll have to explain to me what these choices are, as I can't find them on the current site. But most likely, it will show up in the right sidebar at the top, along with system details.
Comment 13 Chris Ilias [:cilias] 2010-05-04 14:05:31 PDT
One thing I just noticed, that we forgot to include, is the ability lock/delete a thread when viewing an individual thread. 
Use-cases:
- Reading a discussion and seeing that it has gotten out of hand, and wanting to lock it. Especially if I want to post something in the thread saying that I'm locking it.
- Someone reports a post (spam) which is a new thread posted a day ago (i.e. somewhere on page 7 of thread list view)
Comment 14 Tiago Sá 2010-05-06 12:03:18 PDT
On the "most helpful replies", the poster should come after the post rather than before (since it's not nearly as relevant).

In my opinion, of course.
Comment 16 Rebecca Billings [:rbillings] 2010-06-22 16:45:38 PDT
Better case link format: 
https://litmus.mozilla.org/show_test.cgi?id=12006
etc.
Comment 17 Rebecca Billings [:rbillings] 2010-07-09 10:13:28 PDT
Verified implementation

Note You need to log in before you can comment on or make changes to this bug.