Task Pane - Easier vertical navigation via "scroll spy" / "pane tabs" control

I’ve used the following approach successfully in several enterprise web apps and you use it in your new Asana API site sidebar too. To avoid lots of indirect, inaccurate manual scrolling, add “pane-tabs” (aka scroll spies.) See the crude Title, Description, Subtasks and Comments lightweight tabs I added below within the sticky header:

Clicking on one of those tabs (e.g. Comments) would make the task pane animate-scroll vertically such that the start of the chosen tab (e.g. the first Comment) would now be scrolled into view to appear at the top of the pane just below this sticky header. It’s much faster and more accurate than scroll bars. “Title” would effectively be “scroll to top” (and optionally move the cursor into the task title area).


Recently Asana updated its Customize menu to use exactly what I’m describing above (except it’s shown in vertical layout, not horizontal layout). As an alternative to my lousy mockup above, consider this which is now used to easily navigate the long Customize menu contents:


Now imagine if the Task Detail pane used this same kind of navigation widget too. So in the image above, replace the first four icons (Fields, Rules, Apps, Forms) with Title, Description, Subtasks, Comments, and imagine having direct access to any section of the Task Detail pane with no scrolling and no expand/collapse sections to manage like the new A/B for custom fields.



This would definitely improve efficiency in those tasks with a long description.