rerun-io
Project: low-hanging UX/UI to improve ad-hoc analysis in Viewer
Context
The heavy lifting of the Viewer is to help users debug and make sense of whatever they are working on, and that often involves ad-hoc investigation, be it comparing several versions of the same algorithm or desired behavior with an actual behavior. While this may incorporate many various needs, let's try to simplify it into a following user flow:
From here we can zoom in to even more concrete micro-tasks, just to give you a few examples:
- Search for a non-visualized entity and add it to existing plot view
- Look for 3 visualized instances and hide all the other ones
- Spot the outlier in one view (i.e. map) and add a corresponding entity to a new view (i.e. timeseries)
Objectives and goals
To make such interactions more seamless and intuitive there are several UX improvements we can bring, so that the whole ad-hoc analysis flow would become more seamless and intuitive
Evidences
Collection of various user requests and user interview calls support the need for more contextual exploration in the Viewer, some user feedback examples include:
- poor discoverability of existing functionalities to add entities to a new views
- poor discoverability of existing functionalities to modify entities in the existing view
- long list of entities makes it cumbersome to quickly find the required entity
- current query expression of the entity path filter does not take into account the data structure of the hierarchy, which makes the query harder to use
- improve workflow when analysing with plots, i.e. allow for non time axis, lock the X axis of several plots
What and how?
So this sounds like a big thing! How can we crunch it into smaller digestible pieces that would either already bring value or serve as a stable baseline to build on top of?
1. Drag and drop
- https://github.com/rerun-io/rerun/issues/7108
- also think of non-happy flows, i.e. indicate when user drags an entity to an existing view where they can't add it
- Fancy addition: if there are several view types: ask in a modal which one user prefers once they drop the entity
2. Search for entities
- What? : 1 or many entities. Typically similar types of entities which are located in different hierarchy trees, i.e. all acceleration values
- Where? local: blueprint/streams/entity-path-filter; and global: like a command pallette
- Why? search to add result(s) to an existing/new view; to hide/show result(s); to hide everything but the result(s)
- Solution? @gavrelina to figure out what's the first design and possible interactions for the first step of such search. Preliminary ideas: start with local search, enable more fuzzy-like search. Later: possibility to add fancy filters (at some point, like semantic search, think of searching specifically for an archetype, which is not necessary to start with), also a global search panel.
3. Plots analysis improvements
hover select states for plots, dots on plots? in progress
4. Pleasant and small nits
- Change icons for the hierarchy tree chevron from closed shape to open shape (as all other styles) => reduces visual noise and clutter
- Make the icons next to an entity (chevron, container, view type, entity type, components) 'grey-er' as it will improve visual hierarchy
- Hide the chevrons that show hierarchy when mouse is out of the panel, this way the hierarchy is still visible due to indentation but hiding chevrons reduces visual noise and clutter
- Shift select several entities (now we only support ctrl/cmd select)
- We have discussed once to remove Projections — thoughts on this? if not => then change the indentation of it, so it would not stick out as if it's hierarchically on another level (see nuscenes example)
- change styling of the text inputs from "non visible black" to something more noticeable
- when editing an input (like fps) - the size of the input changes a few px (OCD!!) => should stay the same
- Table view: leave a bit space extra (~16px) to width before the next column starts, otherwise there is no visual separation between columns
