digital school board redesign
Updating Outdated Software
I had the amazing opportunity of being hired as a product designer for a local school to redesign their digital communication board. The redesign resulted in cutting down phone calls by 35%. It also increased the engagement of parents during events and it more than tripled the average visitor numbers.
3x Monthly Visitors
Full Platform Redesign
20 Hours of User Interviews
30+ Components
Complete Design System
Overview
My Role
Product Design Lead
UX/UI
UX Research
Timeline
12 Weeks
The Team
Product Designer
Front + Backend Engineers
IT & Security
Parents Council
School Board
Deliverables
User Interviews
UX/UI Audit
Sketches
Clickable Prototype
Executive Presentation
Design Language System
01
Goal:Redesign an outdated school board to increase visitor numbers and decrease support call volume.
As the sole designer responsible for this project, I conducted multiple rounds of research, produced sketches, wireframes, and mockups. At the end, final assets and documents were delivered after ensuring that engineers were able to implement the content smoothly.
"Covid really shifted how parents are accessing information and our current school board receives too many complaints. I’m too busy answering calls, so we want to invest in an updated platform to show all the important information for parents and students."
Paul Foley - Principal
Overview of the old board
The old dashboard was created decades ago. The design was outdated and the functionality was not up to date. There were also several problems with the ease of use.
Research activities and outputs
Rather than just redesigning the old software with a fresh look, we wanted to ensure that parents can access the information they find relevant and that the IT department of the school can update the content easily. We accounted for several different user avatars and made sure that all skill levels can be adressed.
417
Survey Replies
We sent out a Google Survey as a more time efficient method to capture opinions.
8
Workshops
Several workshops were held with parents and internal staff to discuss needs.
6
User Personas
Based on the data we captured, several user personas were created to ensure that future updates will be in line with user needs.
60
Pages of Documentation
After capturing the data, we created a Notion page for teachers and the IT staff so that they have continued access to the findings.
10
Progress Meetings
The main stakeholders were updated weekly about the findings and design progress.
02
Auditing the software highlighted problems and laid the foundation for the first design sketches.
A full UX/UI audit was performed to identify areas of improvements and to highlight the current problems with the software. Doing this ensured that the main stakeholders were involved early and that they understood the foundations that the redesign was being built on.
"Oh yeah, now that you say it, it was really difficult to find the downloads the first time I used this, too. I guess it’s easy to forget that once it becomes part of your daily routine."
Paul Foley - Principal
Visual auditing
Most of the audit was done during workshops to explain why specific sections were problematic and to allow to capture feedback and concerns early. The audit was done on a Figma file that was shared and the audit was supported with markers.
03
Rapid Figma iteration
The stakeholders preferred visual assets over pen and paper sketches, so we used several quick Figma sketches to show the designs and why they were chosen. This allowed for capturing feedback beyond their personal likes and dislikes because they were able to focus on the interaction. This really helped deciding on colours, the branding and other parts of the design.
"Can you do that in red? I just want to see the difference."
One of the many, many comments asking for changes
A new central hub
One of the early ideas of a new central hub that parents could access to stay informed about the latest news and developments. Mockups like these were used early and often to allow for rapid iteration.
In total that meant...
47
Screens & Iterations
Showing different colours, layouts and workflows in a real environment rather than sketches on paper.
4
Variants
To show different ideas from dark-modes to high accessibility implementations
70
Components
To allow for rapid iterations, more than 70 components were built from scratch.
2
New Features
Two new features were approved to implement as an addition to the redesign. This can be attributed to the extensive research period.
04
Final design
"I’m really happy with this result!"
Paul Foley - Principal
Design Overview
The following images show a few screens of the final design. Real data has been replaced with mock data for data security purposes.
