Redesigning Bridg-it School's Dashboard & Reports
Original site home page (2014)
Redesigned desktop home page (2017)
Overview
After completing work on some of the icons in the original Reports interface, I pitched the redesign of the Reports system on the Bridg-it School platform using the themes we used in the Resource Center project. I wanted better integration of the icon visuals into the interface composition, and a clearer display of the user's progress when filing a report. New report types also needed to be added to the system as well.
The Dashboard (home page) was also refreshed, making all other pages and important information much more accessible than in the original design. Since the Bridg-it logo had a prominent orange color to it, I chose a dark blue as the main header color with more cool grays in this version.
Here you can see some examples of the designs I worked on to give the platform the look that it has today.
Initial Wireframes:
Designs that went into production:
Original desktop reporting interface (2014)
Redesigned desktop reporting interface (2017)
Mouseover states
For the What section
More information
Displayed using a dynamic progress bar on the left
Original design, location of risk indication
2017 redesign, moving risk indication to Who section
Adding unknown person with description
New icons for risky behavior reporting
Location
4th page showing all school location icons designed by me
Original design for Submit Report
2017 redesign, with more descriptors and progress
Mobile Designs
We also needed to change how reports would be viewed on both desktop and mobile. I focused on keeping the colors used in the File Report section consistent with the View Report pages, while adding new functions and interaction elements to the system.
Original Reports list screen
2017 Redesign of Reports list
Marvel prototype of mobile View Report:
