Redesigning Orchestration View

[prastut]

We are planning a redesign of the Orchestration View. All feedback will help us look at more perspectives and refine the ideas. It contains some explanations before so that we all are on the same page as to how to go about redesigning. Feel free to add your comments here or on the slides, whatever is easier for you.

Redesign Version 1 (Link).

[prastut]

Cross posting @houshuang from email:

My initial comments on slides:

9: How do you rename graph? Hamburger menu + modal dialog? Thinking about what teachers see when they log in - in the future, I guess we can have some kind of nice “startup screen” in FROG showing “load one of your own graphs”, “explore graph library” , “create graph from pre-defined template etc”. In the future :)) I wonder if it makes sense to always have a bar saying “Teacher view” - it’s pretty obvious that it is :) I’m not sure I like the toggle for the sidebar - how is this usually done in Material? (Not the most urgent!)

10: I like this in general (New session). Maybe we could make it even more explicit “Create session from graph”? So if you were running a session, and went to the graph editor, you would by default be editing the running session, if you wanted to go back to the main graph, you would use the menu and find the underlying graph (Ie CS211, and not CS211->ABAC)?

14: It should be possible to go back to session view without starting a session, to configure for example? Now it sounds like Start session both switches to session view, and actually starts the session?

15: One thing we should consider is enabling or even asking teachers to name sessions - right now we just have the slugs, but it’s more useful for a teacher to know that one session is morning-class, and the other is afternoon-class, or something like that. They shouldn’t have to deal with the slugs at all other than when copying the links for the students. Also a bit worried about what happens to this menu when there is a lot of data… Of course it won’t happen immediately for anyone but researchers, but if FROG becomes more used… For example, at the medical school in Singapore, where they use LAMS (a bit similar to FROG), they have 70 unique scripts per school year, with multiple sessions of students… That won’t work in a pull-down menu! :) This could be fine for now though, and we could work on a graph/session library in the future.

21: I like this! Much better than having the pie chart and all that stuff. Orchestration buttons on the side seems to work well. I’m wondering if the “Graph Editor” link could be moved up to the top bar or that creates too much clutter? We should also redesign the dashboard menu selector - maybe the interface for choosing which activity to display is to click on it in the graph, and we remove the sidebar, etc? Are you planning to have teacher tasks also appear in the same space?

27: I like the controls. We should have some visible indication that the graph is paused, other than just switching the pause button to the play button? Greying out the graph editor or something like that.

Overall, really good work!

It’s not a priority, but it would be interesting to think about whether there are some small changes we can make to the graph editor to make it fit in better… Changing a lot of the interaction etc will be a big job, and anyway we are redesigning everything. But that’s a huge job and won’t be complete for months. Are there small things around colors and perhaps shapes (how rounded boxes are etc) that can make the graph editor “fit in better” with the Material look? For example the latest yellow background I put on top of teacher task was just randomly chosen - and it makes the teacher task very salient… Anyway think about if there are small changes around colors etc, this could be very easy to do, and might significantly change the overall perception of the screen.

[prastut]

Update on the redesign, taking into consideration the above points.

Redesign Version 2 (Link).

[prastut]

For Redesign Version 3, we first discussed on Google docs (link) to get the entire scope of the redesign.

Combining all the feedbacks received and best of both Version's 1 and 2:

Redesign Version 3 (Link)