Figma: https://www.figma.com/file/5d92g3sqYVqLkS2rVkEovo/PowerBi-Reporting?type=design&node-id=59-5687&mode=design&t=KnBDLeoK2F5zmtj8-0
Overview:
When a user navigates to the ‘Student Center’ within the EDU Platform, the ‘Overview’ tab will be the users landing page. It provides important, high level, information to the user at a glance.
UI Description:
Tabbed Navigation:
A tabbed interface that the user can click on and navigate to different sections of the Student Center Reporting. Tabs include ‘Overview, Login/Activity, SEL/MH Curriculum and Content, Skills’.
Date Picker:
A date picker that allows users to determine the data range of data that they want to see.
Information Blocks:
Information Blocks that provide users high level information on key areas. Blocks include ‘Unique Students Login, Utilization Percentage, Completed SEL/MH Activities, Completed Skills Activities’.
Unique Students Login: (Count of all Unique Students who have logged into the Student Center)
Utilization Percentage: (Unique Students who have logged in/Total Student Count)
Completed SEL/MH Activities: (Count of all completed materials for SEL/MH)
Completed Skills Activities: (Count of all completed materials for Skills)
Group By Area:
A filter that allows the user to group the data being presented in the table and information blocks.
Group by, ‘Building, Classroom, Grade,’
Totals and Average Filter:
A filter that allows the user to change the data being presented in the table between Total Counts, and Averages.
Totals, Daily Average, Weekly Average, Monthly Average.
Totals and Average Description:
A brief description of the different Totals and Average Filters that will be displayed to the user.
Search Bar:
A search bar that allows for filtering within the data table rows.
Filters:
Filters that the user could use to narrow down data.
Grade, Genders, Race, IEP, FRL, Housing Status, 504, EP
Data Table:
A data table that shows key information to the user at a smaller level. Columns in the data table include, ‘Unique Students Login, Utilization Percentage, Completed SEL/MH Activities, Completed Skills Activities’.
Rows in the data table should correspond to the Group By Area.
User Interaction and Validation:
Tabbed Navigation:
Users should be able to switch between Overview, Login/Activity, SEL/MH Curriculum and Content, Skills tabs to view different content types.
The Overview tab should be the landing page when a user first navigates to the Student Center.
Date Picker:
Users should be able to utilize the date pick to select the date range of data they want to see.
The data in the table and information blocks should automatically update when a new date range is selected.
The default date range should include the last 7 days of data.
Information Blocks:
The information blocks should populate with the data in the date range selected.
Unique Students Login: (Count of all Unique Students who have logged into the Student Center)
Utilization Percentage: (Unique Students who have logged in/Total Student Count)
Completed SEL/MH Activities: (Count of all completed materials for SEL/MH)
Completed Skills Activities: (Count of all completed materials for Skills)
Group By Area:
Users should be able to change the ‘Group By' filter to change the data present in the table and information block.
The default selection for when a user first visits this page should be ‘Group By Building’, which would show all schools within their district.
Totals and Average Filter:
Users should be able to change the ‘Totals and Average' filter to change the data present in the Data Table. ‘Totals’ should be the default filter.
Totals: Total Count of ‘Unique Students Login, Utilization Percentage, Completed SEL/MH Activities, and Completed Skills Activities’ for the set date range.
Daily Average: Daily Average of ‘Unique Students Login, Utilization Percentage, Completed SEL/MH Activities, and Completed Skills Activities’ for the set date range. (Total Count of all 4 fields/Number of days in the date range)
Weekly Average: Weekly Average of ‘Unique Students Login, Utilization Percentage, Completed SEL/MH Activities, and Completed Skills Activities’ (Total Count of all 4 fields/Number of weeks in the date range)
Monthly Average: Monthly Average of ‘Unique Students Login, Utilization Percentage, Completed SEL/MH Activities, and Completed Skills Activities’ (Total Count of all 4 fields/Number of Months in the date range)
Totals and Average Description:
When ‘Totals’ is selected display the description:
Total's Filter: Shows the Total Count of each column for the date range defined.
When ‘Daily Average’ is selected display the description:
Totals Filter: Shows the Daily Average of each column for the date range defined.
When ‘Weekly Average’ is selected display the description:
Totals Filter: Shows the Weekly Average of each column for the date range defined.
When ‘Monthly Average’ is selected display the description:
Totals Filter: Shows the Monthly Average of each column for the date range defined.
Search Bar and Filters:
Users can refine the resources displayed by typing in the search bar or selecting options from dropdown filters.
The search function should validate input and return relevant results within the data table.
Filter selections must reflect accurately in the data table.
Data Table:
Data table information should populate with the data in the date range selected.
Data table should have its rows defaulted to the ‘Group By Area’ of Buildings (showing all Schools within the district) when first navigated to.
User should be able to click on a row in the data table to show the the same overview page, but for the row they have selected.
Information blocks should update to show the specific schools metrics.
Group by filter should be updated to ‘Group By Classroom’
Rows in the data table should be updated to show all Classrooms within the building selected.
Rows in the data table should be updated to show all Classrooms within the building selected.
Example: https://www.figma.com/file/5d92g3sqYVqLkS2rVkEovo/PowerBi-Reporting?type=design&node-id=117-1464&mode=design&t=HLIKPqo1cbegZBg3-0 When I am viewing Smith School District but want a smaller view of Prism Elementary, I should be able to click on Prism Elementary within the table and be shown the same view but for Prism elementary with Classroom as the group by filter.