E-Learning Tools

jQuery, D3.js, CamanJS, Node.js

The examples below illustrate some of the work I did while working as a Lead and Senior Front-End Developer for Computerized Assessments and Learning (CA&L) and Educational Testing Services (ETS).

Color Accommodations Processor

(CamanJS, Regular expressions, SVG, Node.js, Grunt)

  • Color conversion of different media by using modular filters (eg. CSS stylesheets, SVG graphics and images)
  • Easily expandable to support new media types (eg. videos) by creating new filters
  • Node.js / Client Side JavaScript hybrid design. Color conversion algorithms can be run at run-time or at build-time.
  • Performance optimized by caching computation results

Rich Text Editor

(Plugin-based architecture)

  • Plugins: Text Styles, Math Expressions, Clipboard Manager, Undo Manager, Toolbar, Key Combos, Custom Scrollbar
  • Thoroughly tested via unit tests and integration tests
  • Performance optimized through state saving (to avoid duplicate computations)
  • Performance optimized through function merging pipeline (to merge consecutive operations into one)

Graph Tool

(D3.js, state-machine)

  • Modular tool types
  • Data-Driven
  • Accessible: User can draw with mouse, touch or keyboard

Automator

(Asynchronous JavaScript, Functional testing)

  • Automates tasks which are defined as a series of consecutive steps
  • Simplifies asynchronous behavior of functional testing by using busy-wait checks within steps
  • Expandable by defining custom steps

Media Sequencer

(Multi-track, clock synchronization)

  • Modular architecture allows defining different track types (audio, video, subtitles, slide shows, etc.)
  • Clock based synchronization method to keep multiple tracks aligned