Design Concept - Project-Specific Landing Page (Dashboard-Like UI)

[brettpalmberg]

Tasks Remaining:

• [x] Move Batch Plotting Page to Project Tab
• [x] #124
• [x] Create secondary graph to track instrument types
• [x] Integrate with APIs to pull new data
• [x] Adjust fetch techniques based on active tab
• [x] Create badges for cards displaying counts

[KevinJJackson]

@brettpalmberg I think we should start the discussion off with a few questions:

1. What do we want the user to see when the log into the site for the first time?
2. What about users that have already been on the site and have done some customization?
3. What is the main goal that users come to the site to achieve? a. Do different types of users have different goals, meaning multiple designs based on user type?

I think if we can answer these questions, it'll help greatly in designing the workflow for a new dashboard-like interface.

[brettpalmberg]

Completely agree @KevinJJackson . I will work on pulling this information together. cc @MegCQuinn

[brettpalmberg]

Re-assigning for @adamscarberry to lead requirements, design on the project-specific homepage.

cc @MegCQuinn

[adamscarberry]

@KevinJJackson Here are a few initial user stories/objectives:

• Dam/Levee Safety Program Manager

  • Portfolio view of Projects (NIDID) / Instrument Groups
  • Quick access to pre-designed/developed reports
  • [note] There is an existing Dam Safety Program Management Tool. How can we provide information to feed that tool?

• Water Manager/Modeler

  • Portfolio view of instrument groups (watersheds)
  • Instant access to Alerts/Instrument Anomalies
  • How watershed is responding to events, rates of rise, precip

• Instrumentation Data/Field Technician

  • Heads up view for any instrument issues (alerts created by values exceeding thresholds aka actual movement) or automated instruments not reporting (instrument/transmission issue)
  • Quick access to enter/import manual data from instruments
  • [field suggestion] Report for last reading entered across groups/instruments

Here is an initial design mockup:

Would love your feedback or additional ideas for informative panels to include on the initial dashboard. cc @MegCQuinn Credit to @jeffsuperglide for review and chart ideas.

[KevinJJackson]

I think this is definitely a great starting point! Also, having the roles expected usage is very helpful information.

Did you have any thoughts on ways we can take this new design concept, which seems to be oriented around districts, and implement a new Home page as well? That might be worth a new issue to track work around but I like the direction this is heading so figured I'd ask about it here.

[adamscarberry]

@KevinJJackson Here is what I would call a first iteration on making the home page tailored to the user and providing quick access to tools for each project:

I thought we could continue to utilize the cards to at least browse and favorite the "My Project" list. Cards are not a necessity and could also be a table list.

I realized there are probably some mixed messages by using "My Project" tab and showing "All Projects" cards below. I wanted to retain a way to quickly favorite a new project (although I suppose a modal to select "favorites" would also work.

Alternatively, the tabs could be removed and a blank "My Projects" panel could prompt the user to add favorite projects to the list (if empty).

Metrics at the top of "My Project" would only be for favorited projects unless no favorite projects (aka "my projects") were selected.

[KevinJJackson]

So just thinking about how we'd integrate the new pages into the app, would this new landing page fully replace the current explorer page? or would we want to keep that accessible via some other navigation link?

I'd also assume we'd remove the Instrument Manager from the navigation as it seems like all of that functionality is getting merged into this view via the tabs.

[adamscarberry]

This is just my opinion and may be overruled, but I think the landing page for a project should be the dashboard. As it currently stands, the explorer doesn't provide any "heads up" information about a project. I'm curious about an additional tab for the "map view" / explorer. Having the tabs and header areas visible for the explorer view may be a bit odd. A bit of a crude rendering below (assume map tab is active):

I would agree with the removal of "Inventory Manager". I see the very top nav links as global to the MIDAS app and not related to the project. Again, just my opinion and may not be the final say.

[KevinJJackson]

I agree that the dashboard should be landing page for the project and moving the map to a tab should still work for it's intended use.

I'm fairly indifferent on the top navigation links but I do understand you POV where that should only house global links. And if we go that route, we may need to tinker with the Reporting tab as the pages under that are project specific currently.

[jeffsuperglide]

I looked at the updates with a dashboard as a landing page. Instrument Status looks good and I like there is a count and percentage. Used Nashville District Streamgages to add Instrument Groups, Collection Groups, and seem to work as expected. Explorer tab showing locations as what is seen before but toggle too quickly between tabs only shows North America centered without instruments. Uploader clears any file uploaded toggling off and then back onto Uploader tab. Notice that Tools icon goes away when not logged in but is it possible to just be greyed out?