Flow/Research/UX workshop 2013-10-15

Notes from the Flow UX workshop, October 15, 2013.

See also the landing page offered to the participants and their original notes.

Bugs

Known issues/being fixed

when I click on reply I don't see what I'm replying to – e.g., scrolling behavior takes you too far down the page

New bugs

reply box sometimes has names sometimes doesn't
hidden controls cause UI to flutter and flash
Input fields change size on hover
Clicking an icon leaves an ugly outline in Firefox (caused by text-indent, can be fixed using overflow: hidden).
When I hover the thread, icons appear on the right, I start moving my mouse there and they flicker when I'm about to move the cursor over the area where they are.
jumpiness when hovering over elements
Anons can create Flow topics & posts, even when settings of wiki disable anon editing – Bug
The white inactive "Add topic" / "Reply" button changes to pale aqua blue color when active for use. I found myself wondering whether it was active or not (JZ: color is wrong)
A blank comment (single space) is allowed. Also a comment of nonbreaking space results in the same blank content.
- This is possibly related to w:Help:Markup#Limiting_formatting_.2F_escaping_wiki_markup "Leading space"
- See also: http://ee-flow.wmflabs.org/w/index.php?title=Special:Flow/Sandbox&workflow=0506fd8d9f990e132562fa163e68c4ac&action=view
Blank topics are allowed, should not be
Collapse lines space, e.g. don't allow users to insert multiple consecutive line breaks
Text field does not expand when it becomes a multiple-line post

Needs investigating

After I edit my post in-line on a Flow board, if I click the pencil to edit again, I jump to a page[1] where I'm only seeing and editing that one post. It has no Cancel and a blue [Submit changes] button.

Note: This is the expected non-JS fallback workflow. However, it seems to appear intermittently for JS users. We should investigate why.

In Sandbox one topic+comment appeared ~7 times. Maybe this is just because the ee-flow server was slow and hung.

If you use a Workflow link like [1] in a [URL link text] link, it gets garbled because of, I think, the square bracket in postId.[postId=0506fd0ed2010e132562fa163e68c4ac&workflow=0506fc4aad826e5b09a3fa163e68c4ac&action=edit-post Demo]
[1] http://ee-flow.wmflabs.org/w/index.php?title=Talk:Flow_workshop&topic[postId]=0506fd0ed2010e132562fa163e68c4ac&workflow=0506fc4aad826e5b09a3fa163e68c4ac&action=edit-post
- Don't use unescaped squarebrackets (or round brackets, or quotation marks, if at all avoidable) in urls - many email programs and IRC programs will break the link. Bug

Feature Requests

Planned for next iteration

Would want to be able to create topic with no initial post – Mingle story
Will there be a table of contents? Similarly: Participant wants to see all conversations to start, everything collapsed to start. Collapse topics by default on initial view – Mingle story

Planned for future iterations

Need basic styling only, Bold, Italic, bullets. Similarly: If you're going to allow markdown in these replies, consider a simple (toggle for advanced) toolbar for popular markdown tags (e.g., Visual Editor integration) – Mingle story
Idea of someone starting a new topic, can you split it off into something new? Similarly: If people want to take the conversation in a deeper/different direction, could they announce in the comments that they are originating a new topic? And then link somehow to that other topic? – Mingle stub
Comparing with current talk pages: I will not be able to easily copy and paste stuff from an existing page - needs source mode/collaborative editing – Mingle stub
feed of all topics I'm participating in, even if there are no new replies – Mingle stub

TBD

Someone wanted your own comments/posts called out.
Want to "skip" to my own posts. Similarly: Go to/show my topics / comments
Someone wants to see their own posts, also see replies to her own posts
Alternate sorting methods (oldest, newest, most activity, least activity, most active contributor)
Show topics as "These have the most posts", "These have the most participants", etc. Also tagging topics.
Tagged topics
Guided workflow for creating new topic (though could get old quickly)
The problem of huge long comments - cap length of posts?
Adding user picture and avatar, tying identity to user
Will you show people's real names?
Suggest ability to open up a tree structure, being able to zoom in to tangents.
"looks like you just posted a message that is very similar to this one" this pattern is used on Craigslist, Instagram, Bugzilla, and others
Ctrl+enter(?) should definitely be posting comment/topic
should we limit text field expansion as a soft way of suggesting post length?

Design Ideas/Improvements

On boarding exp, dynamic how to
A default view that is collapsed and more condensed (a possible double use as table of contents)
UI should change with velocity of posts
Can I post a topic without an inital post?
Just want to ask the Quora question, and others make comments.
Didn't understand why there were two fields topic versus comment on inital post
Unreadable big block of text could be solved by hiding everything after the first four(?) lines of a comment
The white inactive "Add topic" / "Reply" button changes to pale aqua blue color when active for use. pretty subtle compared to what I see else where online, found myself wondering whether it was active or not
The buttons made visible onHover for reply and thank should be a bit smaller and have the nice "seafoam" color like the "Add topic" button. Making them smaller would help limit the vertical space you're using
I also think if you do allow longer comments, you should give contributors a larger textarea.
Make the box scale as you enter more lines of text.
"Be the first to reply" (ugh) instead of 0 comments or 1 comment if OP
Allow adding of "scratchpad" object into topic
Move timestamp to left and buttons to right, avoiding zig-zag reading pattern
Context of the topic/first commenter when I write my response.

Issues

General

Actions hidden til i hover is no not mobile-compatible, there's no hover state there.
Timestamp leads to history was not obvious; the one who found this expected it to work like wiki page history

Topic Headers

How to collapse/expand topics isn't obvious (mutliple people)
Some users confused over topic ownership (anyone can edit this?)
Topic box is too big and prominent. The font size for participants and number of comments could be smaller, whitespace could be reduced.
Topic titles may be too big
Lots of grayspace (topic title)... does not need to be that big
Even if participants and count worked, some not sold on it.
"@todo: # comments" jumps down to the comment field interaction was not obvious

Comment prompt at thread bottom

Empty comment box… may be too flippant?
Empty comment box encourages people to say stuff, maybe we don't want to encourage that.
Ryan doesn't like seeing name above your "Comment on Topic title."
Having her name on the bottom was confusing
Is it focusing more on the author or the comment?
Unclear about the post placeholder at bottom of threads

Padding, spacing, and grouping

Timestamps are not visually attached to any message, I sometimes don't know if they refer to the message above or below them.
Elements are not grouped strongly enough, they feel loose (threads, UI elements of particular messages).
Much more information is on a page in the old system
Too much whitespace
Unclear who you are replying to, unclear who you are thanking – Mingle story
Info hierarchy comments are not tied to topic strongly enough
White space balance makes the conversation feel a little disjointed
Topic message (first comment) should be under the title, not in a form of a comment.

Workflow issues

Also the ordering is different - most recently active appears at the top.
Need different interface for pages with 200 topics. ... Quora fan points out finding similar questions, etc.
Can you bring me back where I was when I follow links and come back
Infinite scrolling may be problematic. Ryan points out failure of infinte scroll down to a post and then using back button, you don't get back to the post you were looking at, also you can't find the posts you were looking at before.
- MM: But I wonder how often do we have links that point out of the flow board, if you're talking about article history views, enlarging media, etc, can these be fixed with overlays? If users include links that bring you elsewhere, we should see how often this happens and not having infinite scrolling is better than with

Can't copy and paste content from talk pages into article anymore
Comment vs. reply is confusing. I think it should be only Reply and where the message goes should just depend on the context (where you hit Reply).
I don't know know the difference between commenting and replying
Why have some actions on hover (edit, permalink, star) and a chevron for the drop*down menu (hide/close topic options).
Weird things happen when I click the flag icon. I don't even know what it's supposed to do because there's no tooltip. It displays a "Hide post" button, but is that what a user would expect from this icon?
Some users starting a new topic were confused it creates a topic title and your initial comment on it, the other got it and thought it was fine.

Praise

Loves the idea of @mentions
love the design
looks modern
I think the project looks exciting and the meetup was fruitful with lots of useful comments.
Is this open source? Cus I want to use it for something else
Hiding actions by default and showing them when user hovers over the title/message is a nice idea
Very easy to use for relative newbie. Clean design, easy on the eye/legible, has a relaxing quality to it
It's pretty!
Doesn't feel like I'm walking into a clique
I feel so sorry for you, I will never work for Wikipedia, but I appreciate what you're doing