Touch up basic usability of Dashboards

Authored by chad on Feb 8 2017, 8:32 PM.



Ref T10390. This mostly shuffles layout into "View" and keepts "Manage" around for Edit/Copy/History. This feels better to me overall. Also tweaked some spacing and color.

Test Plan

New Dashboard, edit Dashboard, shuffle panels. Create new panels.

Diff Detail

rP Phabricator
Automatic diff as part of commit; lint not applicable.
Automatic diff as part of commit; unit tests not applicable.
chad created this revision.Feb 8 2017, 8:32 PM
epriestley edited edge metadata.Feb 8 2017, 9:07 PM

I have some feedback but I'm not totally sure what the intent here is: do you expect users to still use this new version of the "View" mode as a standalone view (for example, a standalone page that you might bookmark or link to from a wiki page), or only during editing/management and always "view" a dashboard by installing it somewhere? Or something else?

chad added a comment.Feb 8 2017, 9:09 PM

Hmm, I guess I didn't test just a plain "view" mode. I meant this to be both viewing (if you don't have edit access) and view/edit if you do.

chad added a comment.Feb 8 2017, 9:10 PM

Offhand, seems to work fine if I don't have edit permissions as just a plain view of the dashboard.

chad added a comment.Feb 8 2017, 9:11 PM

With Dashboards persistent in Home and Projects, I don't expect much (any?) browsing from the Dashboards application itself. But it seems to work fine.

As a "view" mode, it feels a bit broken for me if I have edit permission because it's very, very difficult to select text. When I go to select, say, T123, which I do pretty frequently, my cursor picks up the whole panel to reposition it instead. If I'm lucky, that's the worst that happens -- but if I'm moving too quickly, I might reposition the whole panel, and then go figure out what I just accidentally did in order to undo it.

The extra actions in the UI (edit, delete on each panel, add panel at the bottom) feel a little off, too. And some options (notably, the "" button to "View All Query Results") aren't visible at all in this combined "Edit/View" mode, while they would be on a normal "View" version of the dashboard. These aren't huge concerns -- text selection is the major issue -- they just feel a little rough.

I can get around the text selection issue by installing the dashboard on Home, or a Project, or Favorites, then using it from there. I think that's totally reasonable in 95% of cases and we should expect that most dashboard use will probably be in the context of other applications going forward, but I worry that the implicit "install" step may make dashboards less usable. That is, as currently written, it feels like there's a completely hidden "now, go find some application or project and install the dashboard there, then you can use it" step at the end of the dashboard creation flow, and the dashboard isn't really usable until then: I can't see the "good" view where I can select text until I do that. But the UI doesn't give you any hints about this, and it gives you an interface called "View" that feels bad as a view (text selection / editing clutter).

I also vaguely don't like that this UI feels so different for users with edit permission vs users without. In most other applications, we'd show all the same UI elements (like "Edit" and "Delete") and disable the if you don't have permission. I think this pattern is a particularly good one from a support viewpoint, since it means that when one user sends another user a link to a page they're always seeing pretty much the same thing. With this view, one user may see "Edit" and "Delete" while the other sees "View All Query Results". This isn't hard-and-fast, but it feels like we aren't getting much by having a hybrid view here.

Maybe a better approach would be to keep separate "Edit" and "View" modes more similar to how they are now, but swap them, so the default mode is "Edit" and there's a link to "View Standalone" (instead of the default mode being view with a link to "Manage")? Then everyone can do "View Standalone" to get the view experience, but it's no longer in the way as much if you're using Dashboards with profile menus, as I think we're expecting most people will be as we move forward.

chad added a comment.Feb 8 2017, 10:04 PM

Ok, maybe I can explain it a different way. I expect Dashboards the app to be about management of Dashboards, and not viewing. I'm happy to reconsider this approach if we do in fact have people that use the application separately, but I don't think we do offhand.

chad added a comment.Feb 8 2017, 10:09 PM

It's not hard to keep around a pure View, but it seems a little pointless. I think most issues with headers, cursors, can be resolved if needed.

chad added a comment.Feb 8 2017, 10:10 PM

(also, this is just one dashboard diff, I'm expecting more to fix install / editing, panel selection, etc)

If we don't expect users to use dashboards from this interface, I think non-editors should not see a "View" view of it, and the page shouldn't be called "View", and there shouldn't be a modal action to switch into an "Manage" mode, the "Manage" mode shouldn't be the only mode with the "Edit" action, etc. When the page is called "View", and there's a button that switches me into a different mode, and then you return to that mode by clicking "View Dashboard", and then text selection doesn't work, it feels like a bug / broken UI to me.

As this currently works, it feels strongly like there's a "View" mode for consuming dashboards and an "Edit" mode for editing them, except that the view mode isn't useful and the edit mode can't actually edit the dashboard.

If you don't think we should have a "View" mode at all, how about turning this into one page with everything on it (properties, actions, all the panels always in "Edit" mode with edit/delete greyed out if the user can't edit them, history)?

Although I think "you don't use Dashboards from the Dashboards" application is basically a reasonable way forward, I'm concerned that the application may sort of dead-end users by not making it clear that they need to go find somewhere to install the dashboard to actually use it. Do you have plans around this (e.g., an "Install Dashboard" workflow)? Are you not concerned about it (e.g., users will probably read the docs)?

chad updated this revision to Diff 41669.Feb 8 2017, 10:24 PM
  • Add a standalone view
epriestley accepted this revision.Feb 8 2017, 10:25 PM

This is fine technically if there's more coming product-wise.

To summarize my concern, I think the "View" mode is not useful to view the dashboard for users who can edit it, primarily because text selection is very difficult. Because the "View" mode doesn't work well for some users, you can't really link to it or use it as a "View" mode: some of the users who follow the link will end up in an unusable place. The viewer-dependent behavior of this mode and labeling of it as a "View" mode feel particularly confusing to me.

Without additional changes, I worry users will interpret this as the way they should be consuming dashboards and may report bugs like "You can't select text on a dashboard.". The real way to consume dashboards -- by installing them on a profile menu -- is not currently evident from the UI or workflow.

I am slightly concerned that this breaks existing standalone dashboards without reasonable replacement. It is possible that this feature saw so little use in the wild that essentially no one is impacted.

This revision is now accepted and ready to land.Feb 8 2017, 10:25 PM
chad added a comment.Feb 8 2017, 10:26 PM

I can address those, no problem

epriestley added inline comments.Feb 8 2017, 10:27 PM

Oh, was this dropped on purpose? I'd normally expect an object's main view interface to be publicly accessible.


I'm slightly concerned that this may be difficult for users to find. Analogous actions, like "Preview" in Phame, are available from the object page, not from the search result list.

chad planned changes to this revision.Feb 8 2017, 10:42 PM

I'll just add some more to this diff, no rush to get it in today.

chad updated this revision to Diff 41670.Feb 8 2017, 11:47 PM
  • resolve all noted issues by building a dashboard profile controller
This revision is now accepted and ready to land.Feb 8 2017, 11:47 PM
chad edited the test plan for this revision. (Show Details)Feb 8 2017, 11:49 PM
chad added inline comments.Feb 8 2017, 11:51 PM

This page I think doesn't show up if you can't edit it, so .... I can remove these and 404 the page? Or just leave it.

epriestley added inline comments.Feb 9 2017, 12:06 AM

I prefer showing-but-disabling the options over hiding them (eliminates "how do I edit dashboards?", "why can't I edit this dashboard?" support questions) but if you hide them you can just 404 this.

(I believe we are also pretty consistent about showing and disabling unavailable options across other applications and contexts; there isn't an obvious rule to me why this stuff should be hidden when unavailable if, say, "Edit Task" isn't also hidden when unavailable.)

chad updated this revision to Diff 41676.Feb 9 2017, 6:18 PM
  • Add a footer to all Dashboards to Profile View
  • Add some icons
  • Make Manage/Arrange page open to anyone
chad requested review of this revision.Feb 9 2017, 6:19 PM
chad edited edge metadata.


okay well to start with you put a lot more icons on it and you know I love icons so that is cheating

epriestley accepted this revision.Feb 9 2017, 9:35 PM

This iteration feels waaaay better to me. 💎

  • Arrange view without edit permission gives me a slightly odd link back to the dashboard (here, "New Simple Dashboard")? Maybe this view is just weird for some reason and it makes sense on other boards, but I don't immediately understand what this element is -- seems to be present even if the dashboard has panels. Oh, it's also at the bottom of View. Am I just confused?

  • Adding a panel redirects me to "Manage", after the workflow finishes, should redirect to "Arrange"?
    • Same for "Remove".
    • Same for editing a panel.
    • Same for right-click "Add Existing Panel" -> Cancel.
    • Right-click "Create panel" -> cancel takes me to search list (probably pre-existing?)
  • Wow that drop shadow on hover is fancy v. nice.
  • Maybe or something instead of ? We don't use the trash can very often and this action doesn't actually destroy the panel. We might have already decided on this a while ago.
  • This is probably pre-existing, but these are missing punctuation:


Yeah this thing is the confusing thing I think

This revision is now accepted and ready to land.Feb 9 2017, 9:35 PM
chad added inline comments.Feb 9 2017, 9:41 PM

It's footer-crumbs. Provides link to dashboard for editing. I may keep it I may not, but I wanted to start here, maybe I need to explicitly add more links to it?

Ohhhhhh. It kind of makes sense when you see it on Home. I think the element is probably reasonable to at least try as an attack on linking embedded-dashboards to Dashboards better, but it wasn't obvious to me that it was footer crumbs when I saw it on "Arrange" and "View". If it collects a little more stuff it might be more clear, my first thought was that it was some sort of ObjectBox rendering with just a header and no content or something.

chad updated this revision to Diff 41681.Feb 9 2017, 10:19 PM
  • Deleting panel takes you back to arrange
  • Adding panel takes you back to arrange
  • Editing panel takes you back to arrange
  • Better spacing on info views
  • Add some transaction periods
This revision was automatically updated to reflect the committed changes.