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