OXD branded illustration of new PEN registry system homepage prototype

A Complicated Expert System, Redesigned to Work Faster

OXD partnered with the PEN Registry team to redesign a complicated system through iterative prototyping.

XFacebookLinkedInEmailCopy Link

Modernizing the design of a 30-year-old application in 30 weeks.

The BC Ministry of Education uses the Provincial Education Number (PEN) registry system to identify students throughout the entire BC Education system, including Early Learning, K-12, and Post Secondary. With the Ministry planning a large-scale migration to a new technology platform, the PEN registry system would need a serious upgrade.

The highly specialized Ministry staff who used the PEN registry system had a clear and established workflow. But the 30-year-old OpenVMS application was showing its age: several features and over 60 screens of the application were no longer relevant or in use. The many steps involved to process each student number were time-consuming and error-prone. Since the application handled students' personal academic data, it was crucial that a new design solution kept functionality while adhering to data privacy regulations.

We partnered with the Ministry of Education PEN team to design a time-saving and error-free digital process. The new prototype needed to meet or exceed the performance of the existing application while fitting in seamlessly to the Ministry staff workflow. Thanks to frequent communication and flexible iterations, we were able to produce a high-fidelity prototype to hand-off to developers in 30 weeks. 

Co-creating side-by-side with end-users.

The project kicked-off just at the start of the COVID-19 pandemic. This offered an opportunity to help the PEN registry team rethink how we could work together and with the system’s users. Transitioning to an entirely remote collaborative process using virtual whiteboard sessions turned out to be a benefit for everyone. We could offer frequent and consistent design services, and maintain a persistent digital record of our work and progress.

Screenshot of virtual whiteboard sessions between PEN Registry team and OXD to design prototype. White boxes with notes and text and arrows on a grey background.
Virtual whiteboard sessions empowered the PEN registry team to work closely with OXD, quickly tackling sticky problems in real-time.

Increasing efficiency through flexibility.

By simplifying the visual design features and functionality of the system to support easy-to-access shortcuts and high-click areas favoured by users we reduced friction and potential hurdles. 

Common visual design patterns used in consumer-facing systems—like reusable interface modules and screen elements—enhance the learnability of digital services for new customers, avoid errors in common e-commerce transactions, or simply save development effort by not reinventing the wheel. 

OXD illustration of visual design patterns commonly used in prototypes, including light blue boxes with wireframe elements on a darker blue background.

But while working through the details of the new PEN prototype, we recognized that those common design patterns wouldn't always benefit our expert users, who put a premium on speed and information density over "user friendliness".

While standard practices have their place in design, we needed to take a more pragmatic approach. This project was a perfect example of where flexibility with standard practices better supported the needs of the end-users. Frequent working sessions with the expert users enabled us to adapt elements and patterns that improved a different dimension of usability: efficiency.

Thanks to the power of iteration, our team was able to quickly work out any inefficiencies and kinks of the new design. We handed over a well-considered and validated blueprint for the Ministry team developers, confident that the new system would improve these expert users’ jobs.

Keeping the power in the users' hands.

Ministry staff use the PEN registry application to manage student-related information in the system. They had a mature process and system in place that we needed to be aware of when redesigning the user interface. Our prototype needed to match the critical features of their current system while allowing room for growth and improvement through future PEN-issuance updates.

Prototypes can help shed light on critical issues, confirm features and design elements, and reduce potential developer costs that may come up in the future.

Iterative processes amplify buy-in from expert-users.

We went straight into user interviews and whiteboarding sessions to better understand the context of the application and workflow. The users are the experts of the existing process, and though it was difficult to navigate, they had customized the program to their unique way of working.

It was critical to co-create the new design alongside these power-users using design sprints. Leaning on their expertise, we kept what was working while solving the pain points of the legacy system. Our updates and changes could enhance the system for these users, not inconvenience them.

Functionality defined by the users’ needs

During our collaborative sessions, we identified areas critical to ensuring efficiency in the new user interface. These sessions also made it obvious to the end users that the new interface screens would improve their jobs in a tangible way, long before anything was built.

Blue and white infographic diagram with icons saying:
"Tips for designing expert systems" 
1. Support information-dense layouts. Help users move quickly through screens by maintaining a balance between grid layouts and component density.
2. Use good typographic standards. Consider the font weight, kerning, and spacing to help users easily scan through dense content.
3. Use colour deliberately. Use colour sparingly to highlight critical information on each screen.
4. Incorporate keyboard shortcuts. To keep users efficient, think about what shortcuts they already rely on and whether any new ones need to be created.

“Many typographers like to letterspace all strings of numbers as well. Spacing is essential for rapid reading of long, fundamentally meaningless strings such as serial numbers, and is helpful even for shorter strings such as phone numbers and dates.” 

The Elements of Typographic Style Applied to the Web

Through our frequent collaborative iterations, we mapped the system, simplified the user journey, and redesigned the visual and user experience interface to design a powerful front-end prototype.

Flow chart diagram with blue boxes on a white background saying: "Old matching flow" then boxes with arrows showing a flow system saying: "List schools with record errors" then arrow to "View first record in school" then arrow to "View attempted system match(es)" then arrow to "View attempted system match(es)" then a circular arrow relating to box saying "Detail view for each attempted match" then arrow back to "Open second application instance" then an arrow to "Go to student list" then arrow to "Search for other record options" then arrow to "Compare with first record" then arrow to "Issue new record" then arrow to "Confirm override". End of flow chart.
Flow chart diagram of OXD designed new matching flow for prototype. White boxes and black text set on a dark blue background saying: "New matching flow" as a header then boxes: "List schools with record error", then an arrow to, "View first record in school and attempted match(se)", then an arrow to "Browse and compare match records in-line", then an arrow to "Issue new record confirm override". End of flow chart.

PEN registry application, modernized by design.

The result of the PEN project is an intuitive prototype that puts the users’ experience first. By co-creating with the expert users throughout the entire project, we designed a system that would reduce data errors and simplify steps while keeping efficiency and value at the forefront. 

Screenshot of the new PEN Management System dashboard prototype on a white laptop set on a blue background.

Our work with the Ministry of Education PEN Registry team is a great example of transforming expectations of what’s possible through iterative design. You don’t need a large design team to produce a high-fidelity, functional prototype to support the build of faster, improved systems. The Ministry team now has an interactive prototype that demonstrates value to the users, while serving as a clear roadmap to help the Ministry team of developers get a jump-start on the modernized application.

Our team can help you research and redesign technology systems that will keep your business relevant and responsive for the decades ahead.