Honda's Responsive Training Module Viewer Platform (jViewer)

The jViewer is a Javascript driven Module Viewer. This colaborative project involved Joselina Sutoyo (Behance Portfolio) who designed the UI and UX, Joe Sidorowicz (www.joesid.com) who pioneered some of the early coding solutions, and Alex Szeto who has picked up on polishing the code for production and who has provided a lot of patches since. I designed and developed most of the code and it's structure. I am continuously improving it and adding new features. The jViewer utilizes the following frameworks and libraries: PureMVC (Javascript Flavor), jQuery, and Bootstrap.

The jViewer supports multiple languages

Multilingual Screen

The jViewer supports multiple content types including standard HTML content, HTML5 Video, Audio, HTML5 Canvas (with CreateJS), Multiple Choice Knowledge Checks and Test Questions, and will soon support two new content types: Scenarios, and Dropdown Questions. This is an example of an opening Splash Page.

Splash Page

When a user clicks Play All, the shelf menu automatically slides off to the left and maximizes the available viewing area.

Collapsible Shelf

The user can click on the shelf to re-open it.

Shelf Re-opened

When a user clicks on a video, the navigation and playback controls appear.

Playback Controls

Here is an example of a Multiple Choice Test Question.

Multiple Choice Question

Here is the test menu opened. The menu has check marks that appear when the user answers a question.

Test Shelf Open

Here is the dialog that appears when a user is about to submit a test.

Test Submit Dialog