During the past couple of months, we came across some articles, posts, and talks about design and development techniques and tips, platforms, and technologies that we felt might have potential for use in eLearning.
While we explore some of them in more depth, we thought we’d go ahead and share them in case you see similar or indeed different application potential in your own areas of work.
1. React Native for Web
When eLearning extended to mobile devices, the question of “web app or native app” arose. Each approach had its advantages and its drawbacks. And then came hybrid apps, which seemed to offer a reasonably acceptable compromise solution. So the question that persisted was “Web App? Or Native or Hybrid app?” (You can read about the differences between these here.)
Several frameworks emerged to facilitate the development of hybrid apps.
With frameworks like Adobe PhoneGap (Apache Cordova) or Ionic, for example, you can use a single codebase to create an app (that can be downloaded, installed, and run on devices) as well as a web app (that can be run in a web browser). The app performance, however, is a bit slower due to the runtime conversion that takes place between the “wrapped” content and the device. The app also cannot take full advantage of device native features.
With frameworks like Appcelerator, for example, you can create a single codebase and package it into apps for specific platforms; but you cannot use the same codebase to create a web app as well. In this case, the apps have a better performance since they are pre-compiled into native code, and they can take better advantage of device native features.
Now, it seems like React Native for Web promises the advantages of both approaches: the ability to build apps pre-compiled into native code for better performance and richer features, as well as the ability to build a web app – all from the same codebase. What’s more – it’s open source.
So let’s wait and see how this project evolves. If it delivers on its promise, then it could take away the discussion about native vs. hybrid vs. web apps and make it easier for clients to go in for apps when needed.
2. Container Queries
When it comes to responsive design, we use media queries to control content display and layout. One of the most important properties that influences these is the browser window (i.e. viewport) width.
The possibility of using element or container queries instead, to control content display based on parent container width, has been raised before and solutions have been proposed and discarded (e.g. CSS-Element-Queries Polyfill, Prolyfill for CSS Container Queries, EQCSS, EQCSS, Element Queries for CSS, handling infinite loops, “Exit element queries (…) Enter container queries“, and more).
It seems the idea still holds appeal but limitations, such as circularity, invalid conditions, and infinite loops, need to be overcome. And while some attempts have been made to begin a standardization process, a detailed official specification still needs to be defined.
For now, let’s wait and see. If container or element queries can work effectively, and as per a set of global standards, they would certainly give designers more control over content layout and reusability.
3. Interactive Dynamic Video
Adding different types of interactivities to video clips allows us to create high-content- fidelity and high-visual-fidelity learning experiences. So far in our experience, we have tended to superimpose interactive elements over videos, or add questions or exercises after them – but we haven’t been able to manipulate anything in the recorded video clips themselves.
Researchers from MIT’s Computer Science and Artificial Intelligence Laboratory (CSAIL) have now come up with a technique called Dynamic Interactive Video, through which you can interact with objects within videos and thereby influence how the video plays after that.
This technique could have potential applications in engineering, architecture, the sciences – to name just a few areas – and specifically when it comes to Virtual/Augmented Reality. For eLearning, it could be used to animate 2D characters or objects in/with real-life environments, equipment, or objects; or design learning interactivities where 2D characters or objects interact with real-life objects and scenes. This could come in handy for a Physics eLearning course, for example; or for an eLearning program that seeks to show real-life cause-effect relationships of moving or positioning an object or item or machine part or even a part of a human body.
The question is: when and how can we get to try this out? We’d be keen to do so as soon as possible!
4. 3D Audio
eLearning courses, simulations, and games use audio narration, dialogs, sound effects, and music in different ways. These tend to be flat 2D audio or spatialized 2D-3D audio, depending on what tools are used.
Google’s open-source Omnitone project, which is based on the Google spatial media specification and uses the Web Audio API, is intended to provide a way to deliver surround sound over the web – directly in the browser.
This looks like it could come in helpful for creating more immersive learning experiences.
5. Increasing Learning Engagement
- Don’t tell the learners EVERYTHING! Pick a few key outcomes and design for achieving them. (“Quality over quantity,” as Justin put it.)
- Create meaningful interactions. Base design around problems linked to the purpose and outcomes, and include challenges that have associated risks and consequences. Where relevant and to the extent possible, allow learners to take significant actions that reinforce physical tasks.
- Avoid the media trap and the words/perfect wording trap.
- Let the learners struggle and do the hard work! Figuring it out will make for better learning and will let them feel they accomplished something.
While none of these points may be entirely new, they most certainly continue to be relevant. A good reminder!
6. Firefox and Chrome Ending Support for Flash-Based Content
Firefox has started to block specific Flash content that is invisible to users and whose absence won’t hinder their viewing experience. This step is being taken to improve security and browser performance.
Mozilla Firefox will be implementing a phased approach, and have released an initial block list. They intend to keep adding to this list over time. From 2017, Firefox users will have to explicitly approve activation of the Flash plug-in for any content/website they are viewing.
Meanwhile, Google Chrome had earlier announced that it would end support for Flash Player in its Chrome browser in December 2016. The ten biggest sites that use Flash – based on Chrome’s internal metrics – would be on a whitelist – that is, they will initially be enabled by default. This whitelist will expire after one year.
From an eLearning viewpoint, this means that individual learners may need to follow some steps to activate Flash-based content on their machines – either for each course or one time at domain level; or Network Administrators may also be able to do this at organizational level, depending on the available options.