Prerequisite Building Tool for Aviation Training Courses
A sprint feature among the visual and systemic upgrading of the Learning Management System (LMS), one of 6 applications among Pelesys’ Training Management and Deployment System (TMDS) app suite.
Client: Pelesys Learning Systems Inc., subsidiary of CAE
Space: EdTech, Aviation Training
Timeframe: 1 month (2 sprint cycles)
My role: Visual Designer, UX/UI Designer
Team: Product Owner, Developers, QA agents
Context: In the Pelesys Learning Management System (LMS) web application, each course consists of activities. The order that end users interact with these activities is determined by score-based and completion-based prerequisite conditions to be met. This project has been white-labelled in compliance with NDA.
Prerequisite Building Tool for Aviation Training Courses
A sprint feature among the visual and systemic upgrading of the Learning Management System (LMS), one of 6 applications among Pelesys’ Training Management and Deployment System (TMDS) app suite.
Client: Pelesys Learning Systems Inc., subsidiary of CAE
Space: EdTech, Aviation Training
Timeframe: 1 month (2 sprint cycles)
My role: Visual Designer, UX/UI Designer
Team: Product Owner, Developers, QA agents
Context: In the Pelesys Learning Management System (LMS) web application, each course consists of activities. The order that end users interact with these activities is determined by score-based and completion-based prerequisite conditions to be met. This project has been white-labelled in compliance with NDA.
Prerequisite Building Tool for Aviation Training Courses
A sprint feature among the visual and systemic upgrading of the Learning Management System (LMS), one of 6 applications among Pelesys’ Training Management and Deployment System (TMDS) app suite.
Client: Pelesys Learning Systems Inc., subsidiary of CAE
Space: EdTech, Aviation Training
Timeframe: 1 month (2 sprint cycles)
My role: Visual Designer, UX/UI Designer
Team: Product Owner, Developers, QA agents
Context: In the Pelesys Learning Management System (LMS) web application, each course consists of activities. The order that end users interact with these activities is determined by score-based and completion-based prerequisite conditions to be met. This project has been white-labelled in compliance with NDA.
Prerequisite Building Tool for Aviation Training Courses
A sprint feature among the visual and systemic upgrading of the Learning Management System (LMS), one of 6 applications among Pelesys’ Training Management and Deployment System (TMDS) app suite.
Client: Pelesys Learning Systems Inc., subsidiary of CAE
Space: EdTech, Aviation Training
Timeframe: 1 month (2 sprint cycles)
My role: Visual Designer, UX/UI Designer
Team: Product Owner, Developers, QA agents
Context: In the Pelesys Learning Management System (LMS) web application, each course consists of activities. The order that end users interact with these activities is determined by score-based and completion-based prerequisite conditions to be met. This project has been white-labelled in compliance with NDA.
Redesigning Prerequisite Creation as an Infrequent, High-Impact Task
Updating course prerequisites is often manual and infrequent, so admins need a system that's intuitive even without prior training.
A modernized UI and interaction model reduces the learning curve, speeds up edits, and improves team communication through clearer, more readable design.
I laid the design groundwork to help developers build the new, streamlined prerequisite builder.
Redesigning Prerequisite Creation as an Infrequent, High-Impact Task
Updating course prerequisites is often manual and infrequent, so admins need a system that's intuitive even without prior training.
A modernized UI and interaction model reduces the learning curve, speeds up edits, and improves team communication through clearer, more readable design.
I laid the design groundwork to help developers build the new, streamlined prerequisite builder.
Redesigning Prerequisite Creation as an Infrequent, High-Impact Task
Updating course prerequisites is often manual and infrequent, so admins need a system that's intuitive even without prior training.
A modernized UI and interaction model reduces the learning curve, speeds up edits, and improves team communication through clearer, more readable design.
I laid the design groundwork to help developers build the new, streamlined prerequisite builder.
Redesigning Prerequisite Creation as an Infrequent, High-Impact Task
Updating course prerequisites is often manual and infrequent, so admins need a system that's intuitive even without prior training.
A modernized UI and interaction model reduces the learning curve, speeds up edits, and improves team communication through clearer, more readable design.
I laid the design groundwork to help developers build the new, streamlined prerequisite builder.
Outcome
Major Improvements
Embedded the prerequisite tool into the main UI for a sense of uniformity with its context
Changed from typed input to drag and drop interaction for increased flexibility
Object-oriented, visually-blocked UI simplifies readability
Converted to live error detection instead of making it dependent on a “verify” button.
One-click access to embedded support documentation.
Impact
Prioritized in the upcoming year’s sprint plans
Lowered the barrier of entry for users without a background in boolean logic
Softened usability for new users
Saved users time in creating and updating prerequisite information
Outcome
Major Improvements
Embedded the prerequisite tool into the main UI for a sense of uniformity with its context
Changed from typed input to drag and drop interaction for increased flexibility
Object-oriented, visually-blocked UI simplifies readability
Converted to live error detection instead of making it dependent on a “verify” button.
One-click access to embedded support documentation.
Impact
Prioritized in the upcoming year’s sprint plans
Lowered the barrier of entry for users without a background in boolean logic
Softened usability for new users
Saved users time in creating and updating prerequisite information
Outcome
Major Improvements
Embedded the prerequisite tool into the main UI for a sense of uniformity with its context
Changed from typed input to drag and drop interaction for increased flexibility
Object-oriented, visually-blocked UI simplifies readability
Converted to live error detection instead of making it dependent on a “verify” button.
One-click access to embedded support documentation.
Impact
Prioritized in the upcoming year’s sprint plans
Lowered the barrier of entry for users without a background in boolean logic
Softened usability for new users
Saved users time in creating and updating prerequisite information
Outcome
Major Improvements
Embedded the prerequisite tool into the main UI for a sense of uniformity with its context
Changed from typed input to drag and drop interaction for increased flexibility
Object-oriented, visually-blocked UI simplifies readability
Converted to live error detection instead of making it dependent on a “verify” button.
One-click access to embedded support documentation.
Impact
Prioritized in the upcoming year’s sprint plans
Lowered the barrier of entry for users without a background in boolean logic
Softened usability for new users
Saved users time in creating and updating prerequisite information
Designing Cross-Functionally and Centred on User Research
💡How might we redesign the prerequisite building experience to be flexible, legible, and error-resilient?
💡How might we redesign the prerequisite building experience to be flexible, legible, and error-resilient?
💡How might we redesign the prerequisite building experience to be flexible, legible, and error-resilient?
Existing constraints included avoiding modals to preserve context and adhering to the parent company’s (CAE’s) in-house design system. I still had room to visually shape the redesigned prerequisite creation experience.
As the sole designer on this feature during the sprint, I collaborated closely with a cross-platform, globally distributed team to bring clarity and consistency to a complex tool.
I also built on prior UX research where multiple customers asked for a drag-and-drop model. That insight guided key interaction decisions and kept the user voice at the center of the design.
Ideation
Drag and drop design is composed of:
drag handles and rectangular shape to create foundation for the affordance of dragging
mini tree with shorthand codes as shorthand to represent the activities within this course
written words instead of symbols for the operators - more accessible for users without knowledge on boolean operators
grouping as visually embedded rectangles instead of parentheses for simpler visual representation
The prerequisite building tool is situated inside its own tab within the course, instead of a modal that reduces the context of that course.
Building a Prerequisite Expression
Prerequisite expressions are built by dragging the appropriate activity or block items, as well as operators, into the working area.
Error Handling and Support Documentation
The legacy system’s way of detecting errors was dependent on clicking the Save button and uninformative. This complicates debugging longer expressions because it doesn’t distinguish between multiple errors and user can get lost in debugging their input.
Live error detection and order of resolution (most to least recently committed error) distinguishes between errors and allows the user resolve them piecemeal
Error Handling and Support Documentation
The legacy system’s way of detecting errors was dependent on clicking the Save button and uninformative. This complicates debugging longer expressions because it doesn’t distinguish between multiple errors and user can get lost in debugging their input.
Live error detection and order of resolution (most to least recently committed error) distinguishes between errors and allows the user resolve them piecemeal
Error Handling and Support Documentation
The legacy system’s way of detecting errors was dependent on clicking the Save button and uninformative. This complicates debugging longer expressions because it doesn’t distinguish between multiple errors and user can get lost in debugging their input.
Live error detection and order of resolution (most to least recently committed error) distinguishes between errors and allows the user resolve them piecemeal
Error Handling and Support Documentation
The legacy system’s way of detecting errors was dependent on clicking the Save button and uninformative. This complicates debugging longer expressions because it doesn’t distinguish between multiple errors and user can get lost in debugging their input.
Live error detection and order of resolution (most to least recently committed error) distinguishes between errors and allows the user resolve them piecemeal
The legacy system’s support documentation consisted of 4 example statements explained in plain English.
New support documentation explains all operators and their properties in plain language. Users without foundational knowledge of boolean operations get a succinct explanation on the operators. It also has the option of opening a longer, unabridged support PDF document in a new tab so users can save/share it.
Reflections and Future Considerations
A speculative read-only design mode aligns with the team’s decision to distinguish user permissions between read, read/edit, and read/edit/delete.
Due to the volume of content in the prerequisite building tool, a future iteration focused on accessibility would involve using a modal to edit prerequisites.
Reflections and Future Considerations
A speculative read-only design mode aligns with the team’s decision to distinguish user permissions between read, read/edit, and read/edit/delete.
Due to the volume of content in the prerequisite building tool, a future iteration focused on accessibility would involve using a modal to edit prerequisites.
Reflections and Future Considerations
A speculative read-only design mode aligns with the team’s decision to distinguish user permissions between read, read/edit, and read/edit/delete.
Due to the volume of content in the prerequisite building tool, a future iteration focused on accessibility would involve using a modal to edit prerequisites.
Reflections and Future Considerations
A speculative read-only design mode aligns with the team’s decision to distinguish user permissions between read, read/edit, and read/edit/delete.
Due to the volume of content in the prerequisite building tool, a future iteration focused on accessibility would involve using a modal to edit prerequisites.
