Aircraft Instruments

(Case Study In-development)
Pilots gain mastery over a long period of training. By simulating different real-life flight scenarios, this module aims at accelerating the process of mastery.




A screenshot of the final product in prompt state.



The Ask
The ask was to recreate and modernize an old module that was written in C++.




The  Execution
I kicked off the mission by categorized efforts into three areas: Learning the basics of the domain; recreating visual elements; and programming dynamics and animations of the gauges, to stimulate flight scenarios.



An earlier iteration of the original software, from 1990s



To gain familiarity with the physical attributes, and develop some intuition on how to recreate them, I studied numerous physical examples of flight instruments.

This exercise also helped me map the limits of creativity for creating these visuals since certain characteristics such as color, typography, scales, and forms are somewhat universally constrained.





I also reviewed some relevant literature on the subject to undestand the skills in examination, from which two publications, predicablly, provided the most insights:

  1. Kellman, P. J., Stratecnuk, T., & Hampton, S. (1999, April). Training pilots' pattern recognition skills: Perceptual learning modules (PLMs) in instrument flight training. In Proceedings of the 2nd Annual Embry-Riddle Aeronautical University Flight Instructor Conference (pp. 85-92).
  2. Kellman, P. J., & Kaiser, M. K. (1994, October). Perceptual learning modules in flight training. In Proceedings of the Human Factors and Ergonomics Society Annual Meeting (Vol. 38, No. 18, pp. 1183-1187). Sage CA: Los Angeles, CA: Sage Publications.



Building Blocks of the Visuals





I used Adobe Illustrator to recreate the isolated elements of the interface from which some will be animated.

Using a fixed unified canvas for all elements, I was able to ease the process of assembling tham on top of each other in CSS.

Using keyframes and temporary classes, I was able to mimic the real-life behaviour of the gauges and by involving a real life pilot, I was able to validate the look and feel of them.



Feedback for Correct Response; An example scenario of a climbing turn answered correctly; Since Reaction Time is an essential criterion for measuring mastery when users pick a correct response, the RT is also displayed.
Feedback for Incorrect Response;
An example scenario of a level turn answered incorrectly; for such cases, the correct response gets highlighted.




The Outcome
A modern responsive version of the app was successfully made and used to demo our capabilities for similar stimulation projects.

Case Studies



Select Projects







Employment Involvement Log (Sep. 2013 - Aug. 2022)



2022
Emergency Action Items in Flying
Interface Design
Template Design
Web Development


2021
Novel Education Modules Addressing the Underrepresentation of Skin of Color in Dermatology Training (Research)
Interface Design
Web Development
Motion Design


2020
Analytics (Internal Tool)
Interface Design
Web Development

2020
Training Visual Pattern Recognition in Ophthalmology Using a Perceptual and Adaptive Learning Module (Research)
Prototyping
Interface Design
Web Development

2020
Marketing Partnership Facilitation
Design Guidelines
External Assets Hand-Off


2019
UCLA Human Perception Lab Website Redesign
Web Design
Web Development

2019
Conference Material Preparation
Motion Design

2018-20
Perceptual and Adaptive Learning in [dermatologic and mammographic screening] Cancer Image Interpretation (Research)
Interface Design
Web Development

2018
Help Center: Features and Components
Design
Development
Co-Writing
Editing

2017-21
Advancing Theory and Application in Perceptual and Adaptive Learning to Improve Community College Mathematics (Research)
Interface Design
Web Development

2017
Technology and Value Proposition Explainer Video
Motion Design
Storyboarding
Script Co-writing
Editing

2015-2022
Archival, Recreation, and Version Control of Scientific Figures (Internal)
Asset Management
Motion Design
Vector Graphics
Figure Optimization
DeGuidelines

2018
Lab Website SEO Improvements
Usability Audits
Web Development

2017
Component Redesign: App Launcher
Interface Design
Web Development

2016, 2021
Business Finance Courseware: Dynamic Content Presentation Design
Web Development
Visual Design

2016, 2021
Development of a Novice Driver Training Module to Accelerate Driver Perceptual Expertise (Research)
Interface Design
Web Development

2016

Company Logo Redesign
Branding

2015
Teaching and Learning Video Showcase: Improving Science, Math, Engineering, and Computer Science Education
Motion Design





Independant Work Log (2002 - 2022)



2019
Undisclosed Client (Publishing)
Visual Identity
Technical Consulting
Website Design & Development
WordPress Theme Development


2018
M-Cubed Design (Architecture)
Brand Design
Website Design & Development

2018
Be Fit Biz
Strategy
Web Design
Visual Identity

2017
Undisclosed Client (EME) (Technology)
Technical Consulting & Prototyping

2017
Undisclosed Client (Publishing)
Website Design & Development
Technical Consulting
Visual Identity
CMS (WordPress Theme Development)

2016
Wristocracy (E-Commerce)
Strategy
Prototyping
Website Design & Development

2016
Tilofy: Trend Forecasting App (Technology)
Prototyping
Technical Consultation

2016
Mixx Yoga (Fitness & Wellness)
Website Redesign & Development
Visual Design
Strategy
CMS (WordPress Theme Development)

2013
SoCal Stormwater Solutions (Environment)
Strategy
Visual Identity
Website Design & Development

2012
Undisclosed Client (Interior Design)
Editorial Design

2012
Undisclosed Client (Medicine)
Website Design & Development

2010
Printing Division at Global Textile (Textile)
Website Design & Development

2009
Undisclosed Client (Art & Music)
Website Design & Development

2008
Undisclosed Client (Art & Music)
Website Design & Development

2008
Dustoe (E-Commerce)
Branding
Website Design & Development
Technical Consulting

2008
Undisclosed Client (Art & Music)
Website Design & Development

2007
Undisclosed Client (Art & Music)
Website Design & Development

2006
Dissolved Entity (E-Commerce)
Website Design & Development

2005
Moaser Theatre Company (Art & Music)
Website Design & Development

2003
Disolved Entity (Academia)
Website Design & Development

2002
Disolved Entity (Art & Music)
Website Design & Development

2002
Undisclosed Client (Oil & Energy)
Website Design & Development


* Undisclosed means either the work has been under confidential agreement or the client is dissolved/inaccessible.