Page MenuHomePhabricator

Make workboard columns fixed-height and internally scrollable
ClosedPublic

Authored by epriestley on Feb 7 2016, 11:56 PM.
Tags
None
Referenced Files
Unknown Object (File)
Thu, Apr 11, 8:18 AM
Unknown Object (File)
Thu, Mar 28, 1:24 AM
Unknown Object (File)
Mar 20 2024, 5:50 PM
Unknown Object (File)
Mar 20 2024, 5:30 AM
Unknown Object (File)
Mar 7 2024, 12:13 PM
Unknown Object (File)
Mar 7 2024, 12:13 PM
Unknown Object (File)
Mar 7 2024, 12:13 PM
Unknown Object (File)
Feb 4 2024, 10:37 AM
Subscribers
None

Details

Summary

Ref T5240.

  • Columns are fixed height.
  • Columns scroll internally.
  • Drag behaviors generally align with these column behaviors.
Test Plan

Screen Shot 2016-02-07 at 3.56.11 PM.png (933×1 px, 352 KB)

Diff Detail

Repository
rP Phabricator
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

epriestley retitled this revision from to Make workboard columns fixed-height and internally scrollable.
epriestley updated this object.
epriestley edited the test plan for this revision. (Show Details)
epriestley added a reviewer: chad.

I think I need to try it in the wild. I think both approaches are definitely improvements over the status quo.

I do think there's some value lost here in terms of not having a "sense of scale". To me, the Subnautica trello board is a good example:

https://trello.com/b/yxoJrFgP/subnautica-development

There's no way to quickly assess how big each of those columns is relative to one another or relative to other columns of known size. And if you scroll through them, they're enormous! At least on my monitor, the scrollbar is nearly invisible, too, and I can't really use it to see how big the columns are.

I don't think communicating "sense of scale" is ultimately that important, and we're at least slightly better off because we show point counts, even if that's a less visual way of communicating things.

I haven't seen other users express interest in the "sense of scale" approach, nor complain about Trello's approach, so I may be relatively unique in caring about this or considering it valuable.

If it is valuable, we could also find other ways to communicate it while still using this scroll approach. For example, we could draw a "minimap" of the board and stick it somewhere, or we could put a progress bar above each column or in the header showing a summary of task states, with sizes relative to the sizes of the columns.

My inclination is to push this out, see if users hate it or I hate it after using it for a bit, and then if we do feel the sense of scale is missing, we can figure out if swapping the layout logic is really the best approach.

(This also ends up being quite a bit easier to implement than the other approach was, although I didn't know about the calc(100vh - ...) CSS cheatcode at that point.)

chad edited edge metadata.
This revision is now accepted and ready to land.Feb 8 2016, 3:07 PM
This revision was automatically updated to reflect the committed changes.

This feels fine in Safari, but Chrome the large panels are... bouncy? on side scroll. It's strange. One idea I had in the mock to convey "lots of tasks in this column" was automatically showing the scrollbar. At least on a laptop without a mouse it doesn't display, not sure if it can be overridden or not.

Hmm, I think I'm not seeing what you're seeing. This is chrome + laptop + mouse for me:

chrome.png (1×1 px, 166 KB)

Oh, without.

I think you can restyle it in CSS.

(As far as I know, there's no way to force OSX to use with-mouse style scrollbars without a mouse, but maybe you could make some trivial adjustment to the CSS to force it?)

Also not sure how to reproduce the "bouncy" behavior.

I side scroll on a trackpad (no mouse) in Chrome (two fingers), and the overflow columns just "bounce" when scrolling. I'd have to make a movie or something if it doesn't repro for you. I'm also on a slow Macbook.

Pretty sure I can't reproduce the bounce locally. I did this:

  • Disconnect mouse.
  • Restart Chrome.
  • Load a workboard with at least one very tall column.
  • Use two fingers to scroll it left/right.

I think I observed normal scrolling (same as using the scrollbar or mousewheel) and no bounce, but maybe I'm just not looking at the right thing.

Oh, hold on, it's still detecting my USB hub as a mouse or something.

No dice -- disconnecting all USB, restarting chrome, double-checking that there are really no scrollbars, then scrolling with two fingers still doesn't do anything bouncy for me, as far as I can tell.