justinanderson
commented
4 years ago These sketches are just to get the conversation going and are not at all final. Everything is drawn too big. Please suggest changes. This is mostly aping inequality.media.mit.edu's design.
When a user visits the dashboard, they want to do 1 of 3 things:
-
Learn more about the dashboard itself, which they can do by visiting one of the static pages linked at the top right of the page.
-
Change what data the dashboard displays, which they can do in the panel on the right either by changing which data layer is active in the "Layers" dropdown or adjusting filters on attributes of the selected data layer, such as narrowing to a specific age range or ignoring certain categories of business.
inequality.media.mit.edu has a similar interface for filtering grouped data when both axes are numeric and when one axis is text.
-
Select a specific SA2 either by selecting it directly on the map or searching via an autocompleting search field in the top left of the map. Doing so replaces the panel of filters with a panel of location details, which can be dismissed by clicking the X in the panel, the X in the search, or clicking in the ocean so that no region is selected.
There are also areas for a legend and any logos for project sponsors that need to be on display.
These screens are in order of that one use case:
-
Load the site:
-
Select a data layer:
- Search for a location:
- View its details:
LeoSilvaGomes
The planned features are getting complex enough that we need wireframe mockups so contributors can reason about how the dashboard work as a whole.
The dashboard interface should be mostly a map with some navigation for reaching static pages, some method for switching between the type of data to visualize, some method for filtering and searching the given data, and some method for showing details about specific areas.
I'll add some simple wireframes to this issue to get the discussion started on how things should work.