Intro

The concept of the ‘right to repair’ has been on my mind recently, both as a user of tech products and as a designer of online courses. Electronics are notorious these days for their enigmatic design. The user is not trusted to make repairs or is restricted in the ways they can interact with device components. This is a choice made by manufacturers to limit access to approved vendors or repair shops. Instructional Designers have a similar choice when building courses. Do we follow a restrictive approach to modifications, or open up courses by anticipating, welcoming, and providing the resources for modifications?

Difficult by design

I recently experienced the restrictive side myself as I needed to fix an air purifier that had an unfortunate run-in with my youngest child and her colorful stickers. Apparently, the inside of the machine was not pretty enough, and the stickers were now stuck inside the machine, not quite clogging up the fan, but making a noticeable noise when the purifier was running. Realizing that I should probably remove them from the mechanism, and the partially obstructed fan, I grabbed my handy screwdriver, and rotated the cylindrical case to find where to begin.

And then I saw it – nothing. There were no screws on the outer shell. I turned it around a few more times, holding on to some hope that there was another way in – some switch to press or clasp to unhook. Nothing. The company designed the device to prevent a consumer from taking it apart. The only thing I had access to was the filter opening. No screws inside there either, and the manual had no sections on repairing the device.

I was put into a situation where I knew what I needed to do, and how to do it, but had no way of accomplishing it. If I tried to open it in a way it was not designed to be (whatever that was), I risked breaking the device even further, and voiding the warranty.

This is the situation many technology users find themselves in these days, which has led to a push for the right to repair one’s own devices.

Right to repair principles

Had the manufacturer made the air purifier with the consumer in mind, it may have been more closely aligned with right to repair principles, which are given by The Repair Association through their Policy Objectives. Some more relevant ones are currently paraphrased on the Right to repair – Wikipedia article:

  1. the device should be constructed and designed in a manner that allows repairs to be made easily;
  2. end users and independent repair providers should be able to access original spare parts and tools (software as well as physical tools) needed to repair the device at fair market conditions;
  3. repairs should by design be possible and not hindered by software programming;
  4. the repairability of a device should be clearly communicated by the manufacturer.

Applicability to Instructional Design

This whole endeavor got me thinking: What is the best choice for designers and developers who create courses and complex elements for our users? It seems that it falls into the same design philosophy choices that we see with other products like computer hardware or electronics today. For simplicity’s sake, let’s narrow it down to these two opposite choices designers have when making course components:

  1. Modifying course elements is made difficult because the designer is either not confident in the instructor’s abilities to properly work with the design, actively discouraging changes, thus resulting in no change until the user approaches the designer(s) again.
  2. Course elements are designed with user modifications in mind, and the user is left with sufficient instructions, access, and ability to make changes when necessary.

I prefer to use technology that closely follows the second choice, as this is more aligned with the ‘right to repair’, and results in more user-friendly practices. That is not to say that everyone would want to modify courses, but the option should be there.

Or, in other words:

It is the philosophical difference between engineering things to make them harder for the end user because you don’t trust them and documenting things to educate the end user so you know you can trust them.  

Linus Sebastian, talking about the design choices of a pro-repair consumer laptop

If the previous main points of “right to repair” were to be re-written with online education in mind, how would these look? Perhaps something like this:

  1. The course and its objects should be constructed and designed in a manner that allows edits to be made easily.
  2. Instructors and SMEs should be able to access course components and tools needed to modify the course and its elements.
  3. Revisions and additions should be possible and not hindered by design choices.
  4. The Instructional Designer should clearly communicate the ability to modify the course, and how to do it.

How we could do it

What could we do as course designers to inform and empower faculty? Here are a few ideas:

General Documentation for Course Elements

By far one of the simplest ways to provide support to users is through basic documentation pages. If located on the course site itself, they can remain unpublished so learners do not see them. For those who would like more autonomy over their course structure and design, detailed documentation pages provide an excellent way to take the initiative and make the desired edits. Well-written documentation may also reduce the need for Instructional Designer support after the course is running. Plus, if you, as the designer, are worried about things breaking, you can always have a backup of all materials ready to revert pages.

Side by Side Code Blocks Tutorials

I use these all the time with fellow designers. On a Learning Management System (LMS), these function as a tutorial page where the page is split into two columns. Users can see the HTML/CSS code on the left and how it is displayed on the right. Then it’s a matter of copying the code from the code block and pasting it where they want it to go. This practice is very useful when it comes to the more advanced features of your LMS. This makes it easier to choose which element a user wants to incorporate or edit.

Side by side code tutorial blocks provide a quick way to show off how elements work, and a quick way to copy elements into other parts of the course.

Learner Journey and Alignment

If an instructor wants to change the course a few terms after it has been running, how do we achieve a similar look and feel to the one created by the Instructional Designer long after the project has been developed? Mapping the expected learner journey, and how the content aligns with learning outcomes, can help with this. For example, imagine the learner is expected to interact with a week-long module by completing the following tasks in this order:

  • Step A (Fulfills Learning Outcomes 1, 3. Informs Steps C and D)
  • Step B (Fulfills Learning Outcome 2. Informs Steps C and D)
  • Step C (Fulfills Learning Outcomes 3, 4)
  • Step D (Fulfills Learning Outcome 1, 4)

Each step may include reading or watching learning materials, completing an assignment, participating in a discussion, and so on. How would this expected behavior change if, later on, an instructor added an additional assessment between C and D? What about removing Step B entirely (which in this example would remove alignment to Learning Outcome 2 from the module). Would a learner on this new version of the course still have the required information to complete the remaining parts of the module? Would they interact with the content in the same order as initially expected (and how the course was likely designed to be completed)?

These are things Instructional Designers plan and check during the initial development which can be shared to ensure that the same methods are followed in subsequent iterations of the course.

Conclusion

Some may prefer to leave everything in the hands of an experienced Instructional Design team, and use their expertise whenever a change is required. For others who have enough technical skills to edit content, the desire to learn more, or would like more autonomy and ownership over course content, an open course design provides the same user-friendly approach that at ‘right to repair’ would have for general electronics.

References

  1. Right to Repair, Wikipedia: https://en.wikipedia.org/wiki/Right_to_repair
  2. Policy Objectives, The Repair Organization: https://www.repair.org/policy
  3. Linus Tech Tips: https://www.youtube.com/c/LinusTechTips

Introduction

The LMS Canvas by Instructure comes with a decent set of styled elements to start with, but diving into the HTML editor is where you can really modify content, giving it a specific look and feel. Recently I have found that I am going to these customized elements more often to help achieve learning outcomes and provide a different look and feel for accessible course pages.

It is not limitless, however, or even as open as regular web development would be. Canvas has an HTML Editor Allowlist for elements, styles and classes (though some absent from this list will work if you give it a go!). Many of these are activated by using in-line class or style, but other attributes are also available.

Without further ado, here are three of the more popular elements I have been drawn to when creating courses over the past few terms.

Accessible Rich Internet Applications (ARIA)

Defined as

a set of attributes that define ways to make web content and web applications more accessible to people with disabilities
Source

These attributes are some of the most popular because they help with accessibility (particularly, screen readers) on the course site. Where native HTML5 elements are not available, these ARIA attributes help to explain what a particular piece of content does and how a learner should interact with it. By using these, we help to make courses open to a wider set of learners.

See the Canvas HTML Editor Allowlist for a full list of supported ARIA attributes.

Example 1: Element Togglers

You want to include an element on your course site that expands to reveal more content. You will need to make a screen reader aware that the content is there, and what it does. Using the following should get you off to a good start:

<span class="element_toggler" role="button" aria-controls="something" 
aria-label="longer description of the element" aria-expanded="false">
Click here to see the explanation</span>

<div id="something" style="display: none;">
The explanation.
</div>
aria-controls="something"
combines with id="something" later on in the code. The value must match the id value for it to work correctly. This is used to interact with the element.
aria-label="longer description of the element"
used to describe the functionality of the element if it is not explained prior to the interaction.
aria-expanded="false
used to tell the screen reader the button is initially closed.

Example 2: Descriptions

You have a particularly visual element on the page, and you want to write a larger piece of text for a screen reader to explain this. You can use aria-describedby and then link it to the id of an element (in the <span> below):

<p><img src="close_up.jpg" aria-describedby="close_up">
<br>
<span id="close_up">A close-up view of the rock target named "Máaz" from the SuperCam 
instrument on NASA's Perseverance Mars rover.</span> 
Analysis of SuperCam data shows that Máaz has a basaltic composition. 
It is either an igneous rock or consists of fine grains of igneous material 
that were cemented together in a watery environment.<br>
Full image and caption from 
<a href="https://www.jpl.nasa.gov/images/supercam-close-up-of-maaz">
NASA Jet Propulsion Labratory.</a> NASA/JPL-Caltech/LANL/CNES/CNRS
</p>

Device specific content

Next up, is hidden content. So you added the element_toggler above, but your learners with the Canvas Mobile App let you know they cannot click it!

Some of the projects I work on with these elements require an entirely different way of accessing the content on a mobile device.

A potential fix

Create different versions of the content by hiding each one depending on the device.

To do this, you will need to divide the content using two containers. Using the same element_toggler code from above, we can easily add a separate, but hidden part underneath for Canvas app users.

<span class="element_toggler" role="button" aria-controls="something" 
aria-label="longer description of the element" aria-expanded="false">
View the explanation</span>

<div id="something" style="display: none;">
The explanation.
</div>

<div class="hidden-desktop hidden-tablet hidden-phone">
The explanation.
</div>

The addition of the class="hidden-desktop hidden-tablet hidden-phone" attributes will hide this container for most users. As it is sitting outside of the element toggler, however, mobile app users do not need to click the element toggler to see the explanation! This provides a more accessible option for users of those devices.

Note: if you have access to the stylesheet for your institution, it would be more beneficial to add these changes there than on a per-page basis.

Anchoring to part of a page

If you have ever seen text content that says something similar to this…

As we discussed before…

As I mentioned previously…

Back in Module 3, we talked about…

…then you need to use this simple feature of the anchor element!

I use this a lot on course content that requires students to refer to previous material. Everyone will have heard of a hyperlink using the <a> tag, but you can also use this anchor to link to a certain part of the page. I regularly use it to send learners to particular headings or content that they would find relevant for assignments. If you set up your course from the start with this in mind, it can be a fast way to group revision material from certain parts of a page, or create more accessible navigation menus.

Give an element an id, like this:

<h3 id="section_2">Section 2</h3>

Then, when you want to send a learner back to that part of the page, just reference it by adding the id to the end of the page link with a `#`. For example:

<a href="https://yoursite/page#section_2">Section 2</a>

This will take the learner directly to the heading with the id of ‘section_2’, which you set up before.

You can even do this within the same page to jump to that part of the page. Just link it like this without the rest of the URL.

<a href="#section_2”>Section 2</a>

Conclusion

These are a sample of the elements, classes, and styles I have used to enhance content over the last few terms. With each, accessibility has been a must, which requires a bit of reflection on how learners would interact with the content. There are a lot more available, and you have a list in the Canvas HTML Editor Allowlist to start experimenting. By thinking of accessibility from the early stages of course design, more users can appreciate these page elements and content.

References

1. The Canvas Style Allowlist: [http://bit.ly/cnvs-allowlist]
2. “ARIA” from MDN Web Docs/Mozilla [https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA]

Man Reading Touchscreen
Man Reading Touchscreen” | Image by Karolina Grabowska from Pixabay

Background

Five years ago, I wrote a small entry in the ORTESOL Newsletter about the then state of “adaptive software capable of teaching, testing, giving feedback, and most importantly, adjusting to student needs” (Chambers, 2015: 13). I mentioned a set of technologies colloquially referred to as the “Digital Aristotle”, or ‘Project Halo’ (Friedland et al., 2004), and the update to this six years later (Gunning et al., 2010). The Digital Aristotle was described as ‘an application that will encompass much of the world’s scientific knowledge and be capable of applying sophisticated problem-solving to answer novel questions’ (Friedland et al., 2004).

At the time, I was writing about a more grandiose piece of software that might one day replace the repetitive tasks of an ESOL classroom. The idea, or perhaps the concern about this technology for existing teachers was where they would fit in once a set of algorithms could replicate much of the day to day learning of a language course.

Five years on, I turn to how learning designers might be able to incorporate AI into course design.

Potential

First, a question: is there currently a program capable of teaching a course and adapting to student needs like an instructor? The answer is still no. Certain technology has, however, progressed to the point that portions of an online course can be enhanced by AI.

Adaptive Learning

Quite possibly the most exciting development in artificial intelligence for learning is that of adaptive learning. This concept has been in the works for a while with certain platforms utilizing algorithms to produce content that adapt to specific learner needs.

Instructure’s Canvas for instance, allows Instructional Designers to set up ‘Differentiated Assignments’ (Canvas Doc Team, How do I view differentiated assignments with different due dates in a course?, 2017) and ‘MasteryPaths’ (Canvas Doc Team, How do I use MasteryPaths in course modules?, 2020) which ‘allows targeted learning activities to be assigned to different users and sections’ (‘MasteryPaths’). Currently this is a manual process with course designers creating every assessment beforehand. The best students might not see the additional activities. It is not ‘intelligent’ in the way that course content is adapted specifically for a learner’s needs and on the fly. To do this requires large amounts of data and most importantly, AI training to see patterns, strengths, and weaknesses for a particular learner.

This is why Duolingo records progress at every step and offers learners a review of concepts the learner struggles with in previous activities. Platforms that provide an automated review often use large question banks and flag questions that learners initially, or continuously incorrectly answer. An intelligent AI could create novel questions based on learner goals, data from prior students, and information about the subject matter. An example of this is Google or Amazon’s ability to predict and offer products or suggestions based on the vast amount of information provided to them every single day. Certain training providers are currently working with application developers to produce tools capable of this on-the-fly feedback and adaptation.

Discussions

At the OLC Innovate 2020 conference, Kasey Gandham from Ed Tech company Paperback and Kim A. Scalzo, Executive Director of Open SUN, demonstrated how Paperback’s AI is being used with online discussions to help students write higher quality posts. As students write their discussion posts, the AI program checks for “close-ended questions, plagiarism, insufficient length, content about class logistics, profanity and abuse’ (Gandham & Scalzo, 2020). After this, if required, the post is moderated and the learner receives email feedback saying why and how to revise their post. The AI is also capable of suggesting posts to feature as the best of the week by analyzing, among other things, sentence depth and ‘curiosity score’.

More than a Quiz

The role and importance of ‘big data’ in online learning cannot be understated. Technology already exists that records the time learners interact with learning materials. It knows where they are clicking/tapping on the screen and how long activities hold learner attention. Using this data, AI could suggest, or even craft assessments that are adapted specifically to a single learner’s usage habits. Traditional quizzes which assess information retention could become only part of the larger formative assessment of the entire course, at every point in the course, without the learner even realizing any of this is happening.

Future

AI-enhanced design has the ability to transform Instructional Designers like never before. It could help us to modify our own design practices based on how learners are responding to course content. Through learner feedback, it could demonstrate which activities are most appealing and conducive to personalized learning goals. Big data’s role in recording learner interactions with content can provide insights into preferred learning styles and methods of instruction. Instructional Designers will have to continue adapting with the technology just as we have done in our everyday lives.

References

Canvas Doc Team. (2017, April 19). How do I view differentiated assignments with different due dates in a course? Retrieved July 02, 2020, from https://community.canvaslms.com/docs/DOC-10036-how-do-i-view-differentiated-assignments-with-different-due-dates-in-a-course

Canvas Doc Team. (2020, April 6). How do I use MasteryPaths in course modules? Retrieved July 02, 2020, from https://community.canvaslms.com/docs/DOC-26231-how-do-i-use-masterypaths-in-course-modules 

Chambers, P. (2015, Spring). “Digital Aristotle” and ESL: What does it mean for us?. ORTESOL Quarterly Newsletter, 38(1), P.12-13.

Friedland, N.S. et al. (2004). ‘Project Halo: Towards a Digital Aristotle’, American Association for Artificial Intelligence, 25(4), pp. 29-47. DOI: http:// dx.doi.org/10.1609/aimag.v25i4.1783.

Gandham, K. and Scalzo, K., A. (2020, June). USING AI IN DISCUSSION TO SCALE ACCESS TO QUALITY ONLINE EDUCATION. OLC Innovate 2020, Online Presentation. https://onlinelearningconsortium.org/olc-innovate-2020-session-page/?session=8486 

Gunning, D. et al. (2010). ‘Project Halo Update – Progress Toward Digital Aristotle’, Association for the Advancement of Artificial Intelligence, 31(3), pp. 33-58. DOI: http:// dx.doi.org/10.1609/aimag.v31i3.2302.