The Challenge
New sailors must be able to identify the common parts of any sailboat so that they can understand and follow directions while acting as a crew member. However, new sailors can often be intimidated by the vast amount of sailing specific terminology. While learning to sail is best done as a hands-on activity, it can be overwhelming for a new sailor to try to learn and remember these different parts while out on the water. These activity-oriented learners may also find learning terminology from a book to be quite boring.
The Design Process.
This interaction is meant to supplement in-class and on the water learning. So, the learner is immediately presented with the drag and drop activity, in case they have already developed some familiarity with the subject matter. A link to a study guide is provided for users who feel overwhelmed by the activity or want to review first.
On the Study Guide page, learners can click on each of the tabs to reveal the name of the sailboat part, read a brief description of its purpose and see a real-life example. The user is also given the option of viewing a diagram with all of the labels displayed. At any time, a user can choose to return to the drag and drop activity.
Storyboarding and Design: I got the idea for this interaction because I was one of those learners who felt overwhelmed by terminology when I took the Hong Kong Sailing Federation’s Level 1 and Level 2 course. I used the textbook I received during that course to identify the sailboat parts that I wanted to include in this interaction.
I began my design process in Adobe XD. First, I mocked up a layout for my main activity. Then I found a vector graphic on Adobe Stock and edited it to suit my purposes using Adobe Illustrator. I selected a color palette using coolors.co and I began to refine my design until I had the look that I wanted for each of the main slide types.
Articulate Storyline: I developed the final product in Articulate Storyline. During the course of the interaction, learners are presented with what appears to be a multitude of custom slides. However, by using a combination of states, layers, triggers, conditions and variables this interaction is in actuality only four slides in total.
The interactivity of this module is increased using states and triggers to create custom intuitive button behaviors. Each button glows as a student hovers their mouse over an option. The buttons return to their original states when the learner’s mouse moves off of them.
Positive reinforcement is also built into the drag and drop activity. As learners successfully match the correct term with its correct picture, a counter appears and tracks the number of completed matches. When the learner successfully matches all 15 parts they are automatically taken to the Interaction Completed slide. This is accomplished using a combination of conditions, triggers, variables and states.
xAPI Implementation
Summary: For this project, I worked with Javascript xAPI code to collect data on my learners’ experiences. This information was collected in my Veracity LRS account for future analysis and supports the module’s design and goals. I used Visual Studio Code to write my custom code.
User ID: I coded my module to generate a unique, anonymous, random ID for each learner. The module will then cache that username, so if the same learner returns, they have the same username. Facilitators would then be able to track if a repeat learner completes the drag and drop activity at an accelerated rate. This could indicate the effectiveness of the study aid. A repeat learner would also indicate that a learner finds the resource helpful to their studies.
Resources Viewed & Duration: An xAPI statement is generated and sent every time a learner consults one of the optional resources. The time a learner spends on each resource is also recorded. A learner who does not consult the optional resources, but does complete the drag and drop activity in an expedient manner would be demonstrating mastery of the module’s subject matter.
Browser focus: Utilizing Joe Stueben’s tutorial, I was able to code my module to track when learners minimize the module, switch to another window, or switch to another tab. This allows me to identify points in the module where learner’s attention may have drifted or when a learner was consulting outside resources. It can indicate areas of the module where additional engagement or resources may be necessary.
Duration (Module): When a learner successfully completes the module, a statement is generated which records the length of time a learner spent on the module. In conjunction with the other generated statements, the module duration may indicate the level of learner engagement, the level of difficulty the learner has with the subject matter or their mastery of the materials.
Summary: As you can see my xAPI implementation provides for a far more detailed and robust picture of a learner’s experience than the simple pass/fail user score and time spent data captured with SCORM. Without the generated xAPI statements, I would be unable to determine if or how the users were utilizing the additional study guides provided within this study aid.
