Therefore symbol

Case Study - Technical Certification Web Application

Setting the Technician Certification Standard for Canada.
Person working on blueprint project

Project Overview

Technology Professionals Canada (TPC) is a partnership of the provincial regulatory bodies across Canada representing more than 91% of registered technology professionals in Canada. TPC and Therefore worked to design and deliver a gateway for information and digital certification workflow standards for Technicians and Technologists across the nation.

Client

Technology Professionals Canada

Industry

Government

Project Type

CMS Website, Web Application

Technology

Drupal, React, GraphQL

Partners

Platform.sh

Services Provided

UX research, UI/UX design, digital strategy, technical architecture, API development, ReactJS, Drupal development, support & maintenance, training & documentation.

ASTTBC website page screenshot

The Challenge

Our target audience for this project are Canadian technicians, newcomers to Canada with technical skills, and civilian transition military service persons who are interested in making the transition to a career as a technology professional in Canada.

The humans we are designing slide with personas listed.

Technology Professionals Canada had an existing solution, however it was built using older technology with an application process that was spread out across multiple systems presenting challenges for both back-office operators and persons who were submitting applications online.

With disparate systems in place to address areas such as education validation, the professional application form, and data sync integrations with various provinces, our opportunity was to learn from past mistakes, re-envision the application process, and develop something that would serve users and back-office equality well, scale to national usage, and have a lasting positive effect.

Our challenge was to:

Deliver a consolidated bilingual information gateway which would serve our target audience and could optionally be used by all provinces;

Deliver a flexible and modern certification online application form that can be repurposed across multiple province back-office systems;

Design, architect and develop an easy to use website content management system that allows site administrators to build custom page layouts using UI components.

Home screen of the application for technical certification webapp.
ASTTBC website page screenshot on a mobile phoneASTTBC website page screenshot on a mobile phoneMobile screenshot of technical certification application webform.

The Solution

Therefore delivered two solutions to satisfy the needs of Technology Professionals Canada and their users:

A new website powered by Drupal 9 CMS.

A modern online certification application workflow using a modern Javascript framework.

Research and UX Design

Our initial investigation started with building a shared understanding informed by existing technical and end-user documentation for the existing back-office systems and application process. Interviews and design workshops with stakeholders and back-office personnel helped clarify assumptions and validate our assertions.

Card sorting analysis results screenshot.

Our team worked closely with the Technology Professionals Canada product owner and technical project manager to develop UX wireframes and adapt the Aurora design system to both the website and certification webapp.

Drupal 9 CMS Website

Developing an easy to use content management experience was a key consideration for the Engineering Technology Canada site. The design system we'd developed with them was highly intuitive, so we utilized the UI components from the design system to create a visual page builder solution within their CMS dashboard which provided content editors with visual references to the page structures as they built and/or edited pages.

For the delivery of complex content management, Drupal stands above the rest in flexibility, scalability, and overall cost. For the Engineering Technology Canada site we built complex content relationships, taxonomy, and user structures in a way that can be easily maintained by their internal staff. The content model and content governance workflows closely matched the real world systems Technology Professionals Canada back-office staff workflow, making it easy for them to adopt Drupal into their routines.

Online Certification Application WebApp

The Application for Technical Certification workflow was developed as a React javascript application that is powered by a Drupal 9 CMS API. All aspects of the form can be managed through Drupal for ultimate flexibility.

The screenshot below is an example of an automated test running through all possible interactions a user may have with the web form application.

System Interface example

As of this writing, there are three provinces that are integrated. Our near-term goal for this project is national adoption and integration into all province back-office workflows.

T4 circle