Assembling the heterogeneous elements for (digital) learning

Year: 2020

Mountain lake

Reflections on “How learning design systems can help scale and accelerate learning design”

On October 30 I watched a webinar (recording below) given by Joyce Seitzinger (@catspyjamasnz) and hosted by the Commonwealth of Learning. It was titled, “How Learning Design Systems can help scale and accelerate learning design”. If you work in higher education helping with the practice of digital (or post-digital education) – which is a bigger group of folk than it was 12 months ago – then I recommend the talk and the approach. Especially, if you’re having to deal with scale – large student numbers, large numbers of courses, multiple offerings etc.

Joyce’s work is important work because it engages with one of the more challenging questions facing higher education

How might the diverse knowledge required for effective design for digital learning be shared and used sustainably at scale?

aka. how do Universities move beyond providing guidance and actually help with the provision of digital education.

The literature (e.g. the intro of Jones, 2019) recognises this question as essential to higher education, but also identifies significant problems with existing solutions. Buying new technology, running PD sessions outlining the “5 guidelines for X”, or doing ad hoc instructional design projects aren’t cutting it. The work Joyce and her colleagues are doing with Learning Design Systems draws on successful practices from a different realm in an attempt to systematically answer the question.

Upon reflection, I’m wondering if I missed something in Joyce’s talk? Perhaps my limitations and the limitations of a (less than) 60 minute webinar on a complex topic are showing. The bit I missed – the components of the design system – appear to be one of the key enablers of scale in web design systems. I also wonder if/how the concept of design systems can be used without requiring learning design project teams. Before getting into those questions, I’ll start with my summary of Joyce’s talk.

A summary

A familiar problem

Joyce’s presentation started out talking about an increasingly familiar problem facing higher education, especially within Australia. i.e. the increasing complexity of the inputs and expected outputs of learning design. At RMIT Online this involves a need to design large numbers of diverse courses that are offered multiple times a year to an increasing number of students. Where the design and delivery of those courses involves an increasingly diverse modes and is supported by a diversity of partners. With subject matter experts including both traditional academics and external experts, and increasingly involving other partners. Increasingly, these courses are leading to different credentials.

These are trends I’m seeing across Australian higher education. One of the more recent has been the rise of micro-credentials partially in response to moves by the Australian Federal Government. Moves that mean Australian Universities are increasingly going to face the same problem that Joyce describes.

Design Systems – a less familiar solution

Joyce pointed out that seeing teaching as design for learning has long been recommended as one solution to the increasing difficulty and requirement for quality learning and teaching (e.g. Goodyear, 2015). What Joyce didn’t mention directly is that in higher education the practice of teaching as design for learning isn’t as widespread as it should be. In part, because effective design for learning requires a detailed and diverse collection of knowledge. Knowledge that not many teachers have and which institutions continue to struggle with providing at scale.

Joyce’s solution to this scaling problem is design systems. An idea drawn directly from web design. In web design, design systems specify in detail the common components that are used to design a web sites and applications (Churchill, 2019). Joyce points to design systems examples such as Atlassian and one more focused on digital learning from Future Learn. Churchill (2019) points to this gallery of different (web) design systems.

The fundamental idea behind design systems is not new. Manufacturing, industrial design, and architecture (e.g. Alexander et al, 1977) have been using collection of modular components to share the knowledge required to construct large scale products for quite a while. Suarez et al (n.d) cite McIlroy’s (1968) proposal for software components as a solution to the (first?) software crisis as inspiration for design systems. Tesler’s Law of the Conservation of Complexity arises from addressing a similar problem 20 years later in dealing with the production of GUI software. The hypermedia community was talking about patterns and constructive templates in the late 1990s (Nanard, Nanard & Khan, 1998). Echoing work in object oriented programming (Gamma et al, 1995) that had significant impact on practice, and later work with design patterns for educational design and network learning (Jones, 1999; Goodyear, 2005) – that had less impact on practice.

What is a design system?

I was looking for a definition of a design system to use in this post. A task more difficult than I thought it should be. The first definition that started to resonate I found here

A Design System is the single source of truth which groups all the elements that will allow the teams to design, realize and develop a product.

A source that has a nice image outlining some common elements of a design system, including: identity spec; principles; best practices; components & patterns; tools; style guide and pattern library etc.

Learning Design Systems

Design systems for the web don’t having anything to say about design for learning. Raising the question about what makes for a learnign design system? Joyce’s answer appears to answer this by adding fairly common contemporary practices in higher education, including: adopting a collection of learning design principles and standards; and, a focus on a collection of activity types.

The seven learning design principles include a focus on designing specifically for online (assessment, learning activities, resources, tools and social interactions) and explicit integration of industry relevant. These provide a shared goal for design and enable quality assurance.

Course design focuses on learning activities as the “pedagogical building blocks”. A small taxonomy of activity types is specified (assimilative, experiential, interactive, productive, social, meta cognitive) echoing taxonomies from Diana Laurillard (acquisition, inquiry, collaboration, discussion, practice, production) and the Open University (Toetenel & Rientes, 2016) (assimilative, finding/handling information, communication, productive, experiential, interactive/adaptive, assessment). Linked in turn with a focus on constructive alignment.

Wrapped around this is a collection of artefacts including: guidlines, templates, process, examples, and training. For each course, these artefacts are used by a design team including: course coordinator; designing academic; learnign designer; and, multimedia developers.


Measures provides to illustrate the positive impact of this approach, included

  • Reduction in course development time (28 to 16 weeks)
  • More reliable quality at QA checkpoints
  • Internal team spending less time on course projects
  • Improved pass rates and student satisfaction


Is it just a better conceptualised version of common practice?

Much of what was discussed in the talk – a focus on activity types, constructive alignment, course recipe type abstractions, course development teams, course standards or principles – I have seen in use elsewhere. For example, ABC Learning Design and the practices adopted by groups similar to RMIT Online (where Joyce works). Though in my experience those examples were perhaps as not complete and as consistently implemented as Joyce described.

Beyond good implementation, I’m wondering what makes this work an example of a “design system” rather than an instructional design process/team?

Which brings me to the next question.

Where are the components?

In introducting design systems for the web, Suarez et al (n.d) argue that design systems rely on the combination of 2 concepts: standards; and, components. Where they define components as

portions of reusable code within your system and they serve as the building blocks of your application’s interface.

Standards provide guidance about how those components are designed and designed with.

The Future Learn design system – fairly typically for a web design systems and cited by Joyce – provides a collection of components. Suarez et al (n.d) describe the benefit of components is that they reduce “technical overhead”. They do this by packaging necessary design knowledge into reusable buiding blocks. With a decent collection of building blocks the act of design is achieved by assembling building blocks that embody good design. Making it easier to scale good design.

Suarez et al (n.d) also argue that a design system is never static or complete. Over time improvements and changes are required. The reusable components of a design system are not meant to be static. As you use these components to do design you encounter new needs. Hence a part of of the design process is tweaking and improving the components. Given the nature of components, this tweaks and improvements can then be reused in other projects – “[t]his is the power of scaling that a design system offers” (Suarez et al, n.d).

I couldn’t see any mention of components in Joyce’s talk. The closest perhaps being the activity types. But I couldn’t see anything like the Future Learn catalogue of components. Hence I’m wondering if the ability to scale is missing?

Where are the learning activity/task components?

Even the Future Learn catalogue is somewhat limited. All of the components appear to be fairly typical web interface (content) components. For example, card, feedback message, and timeline). None of which I’d consider learning activities. Hence the Future Learn system appears likely to help with scaling the design of the web pages/sites, but not so much help with scaling learning design.

The Future Learn systems is based on the Atomic Design Methodology for web design systems. Atomic Design has five (non-linear) stages of design

  1. Atoms – Basic HTML elements that can be broken down any further. Fairly abstract.
  2. Molecules – Simple groups of atoms (e.g. search form) that have a specific purpose.
  3. Organisms – Complex collections of atoms, molecules and other organisms (e.g. a header that includes a search form). Apparently, organisms provide “an important sense of context” and used to form specific sections of an interface.
  4. Templates – A collection of components placed into a layout to specify a content structure. i.e. there is a focus on structure, rather than content.
  5. Pages – Specific instances of templates.

Folk at Future Learn describe the confusion they had drawing the line between molecules and organisms. Hence they dropped organisms.

Where would learning activity components fit in the Atomic Design Methodology? Would defining organisms as molecules that enable a specific learning activity/task be a place to add in an explicit learning and teaching focus? Or is that just too low a level for an activity that might involve numerous people, completing quite complex tasks, extended over a lengthy time period?

Web components to the rescue?

Somewhere in here is also where the PSU web component work enters the picture. This is a collection of web components which you can use now thanks to their unbundled approach. An approach which I think is potentially very useful for a design system. Though, at the moment, their components are also more focused on content than learning activities.

What about a forward-oriented design perspective?

Dimitriadis and Goodyear (2013) argue that design for learning (aka learning design) needs to be more forward-oriented. That is, there’s a need to move away from the view of design as producing a course (learning task/environment etc) so it’s ready for the start of semester. To move away from the idea that design is somehow separate from the other stages in the lifecycle of a course. Instead, when designing, there’s a need to actively consider what will be required during configuration, orchestration, evaluation, and reflection and respond to that.

Extending that to components, a learning activity component should not only embody design knowledge that helps with creating an effective, consistent interface. It needs to offer functionality that embodies design knowledge that helps learners and teachers during learntime (orchestration) etc. As a simple example, a component that displays options for watching films within learning material in a consistent, effective way (see image below) depending on how the institution has been able to provide access. A component that recognises the film availability changes and hence the learning materials need to be kept up to date. A process that can be painful if the film is mentioned multiple times. A component that supports configuration by drawing film availability from a spreadsheet. Allowing the teacher to change a single line and have that automatically applied throughout the learning materials.

What about when learning design doesn’t/can’t occur?

The RMIT online design system involves a team of five people with different skills helping with the design of each course. The literature has identified that this is a resource intensive approach and that such resources are not always possible. Joyce explains how their design system has reduced the required resources, enabling more scale. However, there is a limit to that. It’s not possible (yet, perhaps) in all contexts. It’s certainly not possible in the context in which I currently work. Nor has it been possible in any university in which I’ve worked over the last 30 years. Even in an earlys 90s distance education provider – where a team approach was nominally possible – it was heavily constrained in terms of staffing and restricted to a very specific set of standards. Bennett et al (2017) describe the situation like this

Design support services exist centrally or within the faculties of all Australian universities, but these are limited resources for which there is strong demand, leaving many university teachers to rely on their own skills. (p. 133)

Teachers are having to do it themselves. No designer in sight. The question then is, if you can’t rely on a project team to bring together the necessary design knowledge to help improve distance education, then how do you do it?

Goodyear (2009) introduces two images of teachers: long arc; and, short arc. The long arc teacher takes time to think about designing a course and associated tasks. A short arc teacher doesn’t have that time. Arguably, the prevalence of short arc teachers is increasing. The long arc teacher image is the focus of almost all attempts by institutions to provide “help”, which is probably why “most of the effort by L&T centres is directed to a small minority of willing academics” and such “centres are not equipped or motivated to operate strategically, at scale” (Ellis & Goodyear, 2019, p. 202). Goodyear’s (2009) suggestion to help short arc teachers – who won’t make use of traditional support measures, but do use a range of tools – is to “embed good ideas in these tools” (p. 16).

The image of the short arc teacher echoes the idea of a bricoleur. Someone when faced with a project does not engage in strategic analysis and design, but rather figures out how to achieve the project with the tools (and knowledge) already at hand. They engage in bricolage. Bricolage is a concept that has been previously used to understand the work that teachers typically do (Hatton, 1989). Given the nature of bricolage, if what the bricoleur is doing is less than stellar, then the issue lays with the tools that they have at hand.

I’m wondering if providing an effective learning activity design system might help address this? i.e. more than just a collection of web design templates, but a collection of components at the organism and template level of the Atomic Design Methodology. Components that provide support for the forward-oriented design of situated learning activities. Echoing the recommendation from Ellis and Goodyear (2019) that institutional strategy around learning and teaching should shift “to infrastructures and service interfaces for a manageably small set of particularly valued activity systems” (p. 188).

Components that can be picked up by teachers engaged in bricolage, but also be used by long-arc teachers and learning design project teams. Components that are not simply collections of purchased technologies, but proactively designed to explicitly support the forward-oriented design of valued learning activities.

The card interface is one of my early attempts at providing this type of support (Jones, 2019). The origins of the Card Interface was a startegically important push by the institution (for better or worse) to encourage the modularisation of online learning content. But the tools at hand really didn’t provide significant support to that activity. The Card Interface does a better job. It’s a tool that’s been used both by project teams and “short-arc” academics. Just this year it’s been used in 300+ courses at my current institution, and it’s spread. Since September, it’s been used in 130+ courses at the National University of Ireland Galway.

What happens when digital education is no longer web-based?

The Future Learn design system, the Atomic Design methodology on which it is based, and the work described by Suarez et al (n.d) are all based on the assumption that you’ve building websites and that you are able to create reusable components. There are two issues with that: 1) the limited forms of integration support by current common digital learning tools; and, 2) the increasing move away from the web.

The Card Interface is possible because Blackboard Learn (Classic) is at some level a collection of HTML pages and we can insert web components within it. The next generation systems – Blackboard Learn Ultra – removes this capability. Echoing the move away from the web to the app and higher education platforms and cloud infrastructures. Most of the other common digital learning tools (e.g. PebblePad, Echo360) generally don’t play well together. When they do play together they are limited to LTI lego block integration.

At the other end of the spectrum are web components (e.g. the PSU web component work). Web components provide an effective way to package and reuse work like the Card Interface. But it requires a different type of infrastructure and approach than the pay for a platform (e.g. O365) and support it approach that most higher education institutions are curently using.


Alexander, C., Ishikawa, S., & Silverstein, M. (1977). A Pattern Language: Towns, Buildings, Construction. Oxford University Press.

Churchill, E. F. (2019). Scaling UX with design systems. Interactions, 26(5), 22–23.

Dimitriadis, Y., & Goodyear, P. (2013). Forward-oriented design for learning: Illustrating the approach. Research in Learning Technology, 21, 1–13.

Ellis, R. A., & Goodyear, P. (2019). The Education Ecology of Universities: Integrating Learning, Strategy and the Academy. Routledge.

Gamma, E., Helm, R., Johnson, R., & Vlissides, J. (1995). Design Patterns: Elements of Reusable Object-Oriented Software (B. Kernighan, Ed.). Addison-Wesley.

Goodyear, P. (2005). Educational design and networked learning: Patterns, pattern languages and design practice. Australasian Journal of Educational Technology, 21(1).

Goodyear, P. (2009). Teaching, technology and educational design: The architecture of productive learning environments (pp. 1–37).

Goodyear, P. (2015). Teaching As Design. HERDSA Review of Higher Education, 2, 27-50.

Hatton, E. (1989). Levi-Strauss’s Bricolage and Theorizing Teachers’ Work. Anthropology and Education Quarterly, 20(2), 74–96.

Jones, D., Stewart, S., & Power, L. (1999). Patterns: Using Proven Experience to Develop Online Learning. ASCILITE, 155-162.

McIlroy, M. D. (1968). Mass-produced software components. Software Engineering, Garmisch, Germany.

Nanard, M., Nanard, J., & Kahn, P. (1998). Pushing Reuse in Hypermedia Design: Golden Rules, Design Patterns and Constructive Templates. 11–20.

Suarez, M., Anne, J., Sylor-Miller, K., Mounter, D., & Stanfield, R. (n.d.). Design Systems Handbook.

Toetenel, L., & Rienties, B. (2016). Learning Design — creative design to visualise learning activities. Open Learning: The Journal of Open, Distance and e-Learning, 31(3), 233–244.

Supporting the design of discipline-specific digital learning activities

It’s widely accepted that the most important part of learning and teaching is what the student does (Biggs, 2012). The spaces, tools and tasks in and through which students “do stuff” (i.e. learning, or not) are in some way designed by a teacher with subsequent learner adaptation (Goodyear, 2020).

Designing learning spaces, tools and tasks is not easy. Especially when digital technologies are involved. The low digital fluency of teachers is seen as a (for some the) significant challenge (Johnson et al, 2014). Hence the big focus on solutions such as requiring all teachers to have a formal teaching qualification. Formal “certification” programs such as the HEA. Or the focus on running workshops and producing online “how-to” support material. The focus on teacher knowledge tends to ignore the distributed and contextual nature of the knowledge required. It doesn’t just reside in the heads of the teachers but is distributed amongst the other agents (people, technologies, policies etc) in the institutional learning and teaching system (Jones et al, 2015).

When knowledge is distributed, it is also situated and highly contextual. As such, knowing the details of any learning and teaching model or theory has value still has to be translated into the design of learning activities within a specific learning and teaching context. The model’s suggestions needs to be adapted and customised to the specifics of the learning activity, including the specific discipline, the specific digital technologies, the specific institutional policies, the specific student cohort etc. This is hard and I don’t know of any institution that is helping meaningfully and sustainably make this problem easier in contextually and discipline specific ways.

This post will

  1. Introduce a discipline specific learning activity.
  2. Describe the learner and teacher experiences of engaging with current common implementations of that learning activity.
  3. Illustrate how the learner and teacher experience is changed by a more discipline specific approach.
  4. Explore some of the implications and next steps for this approach.

Watching films – a discipline-specific activity

A key activity for courses such as film analysis, history, direction etc. is watching films. Analysing existing films to see how certain theories and design principles have been leveraged and their impact. A necessary first step in such a learning activity is being able to source and watch the film. In an on-campus learning experience this is probably a face-to-face experience in a scheduled class. In a totally online learning experience this is commonly done via the course web site. Either way the teacher/institution typically organises access to the film and designs some activity around it.

This type of close analysis of a film typically only a part of a handful (or two) of courses at a university. If there’s any institutional support for this activity it is typically a small part of a broader process. e.g. legally (copyright) correct sourcing of films may be part of the library service. But typically, designing this learning activity draws more on the significant capabilities and expertise of the teacher. Not unlike most of the other activities specific to the other disciplines. Typically this appears to work in the face-to-face environment, but what happens when it goes online?

Watching films in an online course – the current solution

The following is a generic description summarising the practice I’ve observed at a couple of different institutions. I imagine it’s fairly typical. I’m sure there are much better examples of current practice. But my hypothesis is that those better examples were dependent upon an individual with a unique combination of knowledge and skills.

The learner experience

Somewhere on the course site the learner will discover that they need to watch a film (or two) this week. This may be via an announcement, a list of films in a course profile or course reading list, or some details in this week’s page on the course site. There will some details about the film (e.g. director, year of production etc.), perhaps a description of how to engage with the film, and there might be access to a digital version of the film.

Since many films are commercial, copyrighted artefacts. Providing digital access to the film is not straight forward. In some cases the institution may be able to provide access. In other cases the learners or teachers may have shared URLs enabling (probably legally dubious and short-lived) access. In other cases the student is left up to their own devices to gain access to the film. With the rise of streaming services this is significantly easier. However, the nature and diversity of the films used in such courses is such that no single streaming service will provide access. Increasing expense for learners. Also, not all such films will be available via streaming services.

Consequently, learners typically expend a fair bit of cognitive effort and time gaining access to films. A cognitive effort expense which may be seen as a part of the necessary and relevant learning for the course. But it may be a cognitive enegy expense that limits what the learner invests in the actual important learning activities involved in understanding and analysing the film. I have heard reports of learners in such courses being frustrated at having to expend this cognitive effort.

The teacher experience

The teacher of such a course faces four broad questions. Answering these questions is not sequential. My answer to question #1 may change depending on the answer to question #2. The four questions are:

  1. Which films should the students engage with?
  2. Can I provide access to those films?
  3. How to point students to those films and what they need to do?
  4. How well did those films/activities work and what do I need to change for next time?

Answering question #1 draws on the discipline knowledge of the teacher. All the other questions require knowledge that is not (solely) discipline knowledge.

Answering question #2 involves knowledge of copyright law and various institutional systems and processes. that the university’s library. Most provide a service that can legally gain digital access to films. Well, most films. Such a process is typically part of a broader process of providing resources for teaching (e.g. my current institution) which may feed into some sort of formal course reading list. I’ve yet to see such a formal course reading list that is useful for learning and teaching.

Answering question #3 requires pedagogical and technical knowledge to figure where, when and how to embed this information in a course site. It’s the teacher that needs this knowledge. They are provided with generic tools (announcements, discussion boards, and content editing), maybe the formal course reading list, and supported by generic technical and pedagogical advice about how to use the provided tools. None of this is specific to film watching.

Hence answers to question #3 are largely variable. See mention of learner frustration in the previous section. The most common solution I’ve seen is just a description of the films to watch such as the following simple example.

Simple example of a list of films to watch

Answering question #4 requires knowledge of learner activity, learner outcomes, learner satisfaction with the experience of using the film watching activities. It also requires the knowledge and skills necessary to analyse, reflect, and re-design. All of this knowledge is rarely available in any way that could be considered systematic or deep. And a simple list like the above example doesn’t help.

Film Watching Options – a CASA solution

The following describes the Contextually Appropriate Scaffolding Assemblages (CASA) approach we’ve developed. Currently labelled – Film Watching Options. As the same suggestions this approach is specific to this learning activity. It aims to embed good answers to the four questions outlined above into a collection of technology and practices that make it easier for the teacher to design, use and maintain a better quality learning space.

This isn’t a perfect solution. The current solution provides some ok answers to the first three questions, but doesn’t really offer any insight on the fourth questions. There is work to do. But it’s looking better than existing solutions.

Learner perspective

With the Film Watching Options approach, the learner doesn’t just see the list of films as shown above. Instead they see the following showing off three different options

  1. An embedded, ready to stream version of Animal Kingdom as provided by the institution.
  2. A link to a streaming version of Tokyo Story available in an online Film Collection.
  3. A link to a JustWatch search of streaming services available in Australia for Toy Story.

Option #3 illustrating what happens when the institution can’t provide access to a film and the learner has to go searching.

What the student sees with "Film Watch Options"

Teacher perspective

Currently the Film Watching Options feature is implemented as part of the Content Interface a Contextually Appropriate Scaffolding Assemblages (CASA) approach to using Microsoft Word to create and maintain course content. In this context, the teacher designing this learning space sees the following Word document when authoring. Notice the similarity between the Word document in the above below and the web page in the image above?

Word document with Film Watching Options

The idea is that when the teacher wants to provide film watching options to the learner they write (in Microsoft Word) the title of the film and then apply the Film Watching Options style. That’s why the film names in the above image are green. Prior to this the teacher, in collaboration with the library, will have create an Excel spreadsheet that has a table listing all the films in the course and if and where they are available online.

The technology perspective – how it works

From here the Film Watching Options and Content Interface CASA take over.

The Content Interface will translate the Word document edited by the teacher into the following HTML and embed it in the course site.

<h1>Film Watch Options - CASA</h1>

<p>This week watch and take note of the following films.</p>

<h3><em>Animal Kingdom</em> (Michôd, 2009)</h3>t
<div class="filmWatchingOptions">Animal Kingdom</div>

<h3><em>Tokyo Story</em> (Ozu, 1953)</h3>
<div class="filmWatchingOptions">Tokyo Story</div>

<h3><em>Toy Story</em> (Lasseter, 1995)</h3>
<div class="filmWatchingOptions">Toy Story</div>

When a learner views this page the Content Interface will find all the filmWatchingOptions elements and for each element

  1. Call a web service to discover what options exist for watching this films (by checking the Excel spreadsheet maintained by the teacher).
  2. Update the element to display the correct option.

Note: There wasn’t a “technology perspective” section for the current solution because it doesn’t actually do anything specific for this learning activity.

Next steps

Implementation within the Content Interface needs to be refined a touch. In particular, a lot more attention needs to be paid to figuring out if and how this approach can better help teachers answer question #4 above – How well did those films/activities work and what do I need to change for next time?

Longer term, I think there’s significant benefit from being gained implementing this type of approach using unbundled web components. Meaning I have to find time to engage with @btopro’s advice on learning more about web components.

Early implications

Even at this early stage there are two obvious early implications.

First, this makes it easier for the teacher to develop and improved learning space.

Second, these improvements provide affordances that generate unexpected outcomes. For example, the provision of the film specific JustWatch search helped me identify an oversight in a course. The course content listed a film as unavailable. The JustWatch search showed that the film was available via an institutional means. I was able to update the course content.

Broader possible implications

Design patterns have been suggested as a solution to the problem of educational design i.e.

There is a substaintial unmet demand for usable forms of guidance. In general, the demand from academic staff is for help with design – for customisable, re-usable ideas, not fixed, pre-packaged solutions. (Goodyear, 2005, p. 83)

One of the benefits of pattern languages is that they provide “a common language by which practitioners can share and discuss ideas” (Jones et al, 1999) associated with design. The object-oriented software design community is perhaps the best example of this. A community where practitioners use pattern names in design discussions.

Design patterns haven’t really entered mainstream practice in educational design practice. Perhaps because design patterns are bit too abstract/difficult for practitioners to embed in everyday practice. Perhaps picking up on Goodyear’s (2005) distinction between Long and short arc learning design. Some of the hypermedia design literature has previously made the connection between design patterns and constructive templates (Nanard, Nanard & Kahn, 1998). Constructive templates help make the connection between design and implementation. Perhaps this is (part of) the missing connection for design patterns in educational design?

What’s slowly evolving as part of the above work is the ability to start using names. In this case, film watching options is a nascent example of a name that is used to talk about this particular design/implementation solution. If it were implemented as an unbundled web component this would be reinforced further. Not to mention it would become even more customisable and reusable – echoing Goodyear’s description of the demand from teachers.

Might an approach like this implemented as web components help better bridge the gap between educational design and implementation? Might it provide a shared language that helps improve educational design? Might it help encourage the adoption of design patterns?


Biggs, J. (2012). What the student does: Teaching for enhanced learning. Higher Education Research & Development, 31(1), 39–55.

Goodyear, P. (2005). Educational design and networked learning: Patterns, pattern languages and design practice. Australasian Journal of Educational Technology, 21(1).

Goodyear, P. (2009). Teaching, technology and educational design: The architecture of productive learning environments (pp. 1–37). P ALTC Fellowship report 2010.pdf

Goodyear, P. (2020). Design and co-configuration for hybrid learning: Theorising the practices of learning space design. British Journal of Educational Technology, 51(4), 1045–1060.

Johnson, L., Adams Becker, S., Estrada, V., & Freeman, A. (2014). NMC Horizon Report: 2014 Higher Education Edition (No. 9780989733557).

Jones, D., Stewart, S., & Power, L. (1999). Patterns: Using Proven Experience to Develop Online Learning. Proceedings of ASCILITE’1999.

Jones, D., Heffernan, A., & Albion, P. R. (2015). TPACK as shared practice: Toward a research agenda. In D. Slykhuis & G. Marks (Eds.), Proceedings of Society for Information Technology & Teacher Education International Conference 2015 (pp. 3287–3294). AACE.

Nanard, M., Nanard, J., & Kahn, P. (1998). Pushing Reuse in Hypermedia Design: Golden Rules, Design Patterns and Constructive Templates. 11–20.

Multiple exposures - protean

Visualising and pruning my Memex

Update – now automated memex links

In writing the following I stumbled across the idea that writing blog posts in Foam would enable the merging of content from Memex and blog posts. I then discovered it didn’t work out of the box. More work was needed. But the nature of the technology involved meant that it wasn’t that hard and is now complete.
You’ll see links below followed by the spider web emoji (🕸️), those are links to my Memex.
Meaning I this bit of bricolage can be linked to my Memex’s page on Bricolage. It’s this type of capability that might address the Reusability Paradox in digital learning technology, but more on that soon.

Just over a month ago I started exploring the use of Foam as my next attempt at developing a Personal Knowledge Management process. This has evolved into using Foam to curate my personal “Memex” and (amongst other things) populating it with notes from my experiments with Smallest Federated Wiki and Wikity.

Foam has only been under development for just over a month and not surprisingly this brings with a few rough edges. Rough edges are the quickly being sanded down by a combination of the rapidly growing Foam community, the nature of the technologies underpinning Foam, and increasing knowledge on my part. Foam is quickly becoming core to my practice e.g. I’m writing this blog post in Foam (here’s the Foam/Memex version of the post).

The animated GIF below illustrates the utility of Foam. It shows me using Foam’s graph visualisation feature to
1. View the network of connections between the notes I’ve placed into Memex.
2. Identify an outlier note that isn’t connected to anything (the first blog post I wrote in Foam/memex).
3. Click on the graph node to view the content of the associated file.
4. Figure out how that file should be connected.
6. Add in a appropriate connection to the note.
7. See the graph visualisation change to represent the new connection.

Visualising and pruning my memex

Further reflections

Breaking down categories

From the visualisation, I’ve also been able to make some observations reflect on my PKM process. For example, the network shows my use of Seek > Sense > Share as an initial organising metaphor limits connections. Strongly reinforced by the fact that the blog posts I’ve written have yet to connect back to the other notes in memex (e.g. those connected to Sense). Given Foam’s link auto-completion feature this is actually quite easy to do. e.g. Seek > Sense > Share

Or at least I thought. It doesn’t. More on this below.

Illustrating my IT nerdish tendency to be categorising notes as I place them into memex. Starting with seek/sense/share and flowing from there. Even though I’ve argued against hierarchical (tree-like) structures (e.g. SET Mindset). I’ve still not yet fully grasped the advantage of associative ontologies to hierarchical taxonomies

Foam’s ability to produce a public “secondbrain” on github pages (e.g. memex) further breaks down the original conceptions of seek > sense > share. Rather than Share being the focus for “exchanging resources, ideas, and experiences with our networks” this is happening with Seek and Share as well

Mindtools, concept maps and learning

All of which appears to be a perfect example of the graph visualisation of Memex providing me with a concept map. A concept map that allows me to reflect on my own thinking (as captured in Memex) and subquently learn and change my practice. An example of Jonassen’s (1996) idea of mindtools. Digital technologies that enable representation of what is known and using that representation to think about what is known.

An important technical difference (affordance) between Foam, Smallest Federated Wiki and Wikity

All of what is happening in the GIF is occuring within Visual Studio Code Microsoft’s open source code editor. It’s VSCode’s open architecture and its marketplace of extensions that enable Foam’s development and functionality. For example, it’s the Markdown links extension that provides the functionality to visualise the graph and use it to navigate through the notes. It’s not something that the Foam community had to develop.

In addition, while I am not a fan of Markdown it does provide a very good interoperability platform. For example, the Markdown links extension enabling the visualisation. Hence there being Python module for markdown that will convert markdown to HTML. Allowing me to convert this Markdown file in memex into this blog post.

As mentioned above I’ve experimented with Smallest Federated Wiki and Wikity. These are related but also different approaches to Foam. There are many differences in functionality (e.g. Foam doesn’t support federation) and technical platforms (e.g. Wikity is a WordPress plugin). But for me there appears to be a more important difference.

Foam appears more inherently more protean. More protean with how the tool itself is built. More protean in terms of how the content within it can be manipulated. Subsequently, more protean in how it can be integrated into the ad hoc assemblage of technology and practices that is my PKM process. Hence it appears more useful and it becoming (slowly) more integrated into and transforming my practice.

Though appears is the important word in the previous paragraph. YMMV. The protean nature of Foam is an affordance that arises from the combination of the technology, who I am, and my environment/assemblage. If you’ve not done much web development and through that developed knowledge of markdown, github and other technologies…YMMV.

The cost of protean flexibility

The protean nature comes at a cost. The different tools being cobbled together here have different expectations. Differing expectations that clash. e.g. Foam’s link autocompletion works a little differently than a normal markdown link. Differently enough that the Python markdown converter doesn’t know how to handle it. Hence the broken Seek type links above.

Can it be fixed? Not a question I can answer now.


Jonassen, D. H. (1996). Computers in the Classroom: Mindtools for Critical Thinking. Merrill.

House under construction

Pondering if and how Hax & web components fit in Blackboard

2023 Update

Add the “magic script” to my WordPress install and we have…


So look what I’ve done inside my Blackboard Learn sandpit site.

Initial example of magic script web components in Blackboard

It probably doesn’t look that exciting. A bit of HTML and a couple of animated GIFS. Anyone could do that, right?

Not quite. Following explains why this is a bit of game changer and explores how it might be leveraged in work with Blackboard.

It’s not the what, it’s the how

…And what the how makes possible

The core of this image is enabled by four different web components

  1. grid-place – provides an easy way to display the three SpongeBob images in a grid
  2. meme-maker – overlays the meme-like words (i.e. ARE, YOU, READY?) onto the SpongeBob images (no image manipulation required)
  3. hax-logo
  4. type-writer – provides the “type-writer” animation of “Any tag you type here that is listed…”

A web component is a nicely encapsulated bit of code. Code that provides some specific functionality. For example, the ability to make a meme. i.e. take any image on the web and overlay words of my choosing on that image. (e.g. the three times SpongeBob’s happy dance gif was used in the image above.

No online meme maker was used in the construction of the above Blackboard-based content.

Instead – like all web components – I used a specially created HTML tag. Just like any other HTML tag, but provide this unique meme making functionality. What’s more I could use this functionality as many times as I want. For example, I could add a meme with happy dance SpongeBob saying “hello world”

To do this I would (and did) add the following HTML to my Blackboard page.

<p><meme-maker alt="happy dance GIF by SpongeBob SquarePants"
top-text="Hello" bottom-text="World"
toptext="happy dance GIF by SpongeBob SquarePants"></p>

Which produces the following (all on the same Blackboard page).

Hello World Happy Dance

Note: The meme-maker tag wouldn’t work without the p tag around it. Perhaps a Blackboard thing, or perhaps an artefact of the kludge I’ve used to get it to work in Blackboard.

The meme-maker web component includes code that knows how to take the values I’ve placed in the top-text and bottom-text attributes and overlay them onto the image I’ve specified in image-url. Change those attributes and I can create a new “meme”. For example, something a little more HAX.

Joker Hello World

But wait, there’s more

But I’m not limited to those four tags/web components. I can use any of the 560+ web components listed in this JSON file. A list that includes: various types of charts; more layout components like the grid; players for various types of multimedia; a discussion form; rich text editor; and, much, much more.

Thanks to the magic script I just include the right HTML tags and it all happens as if by magic.

It is Magic - Magic | Make a Meme

TODO I do need to find out if and where the docs are for the various components. The NPM pages and git repo aren’t doing it for a lowly end user.

And it works anywhere on the web

Web components are based on web standards that are supported by all modern web browsers. Meaning that the magic script and the bit of content I’ve written above will work in any HTML hosted by any “content management system”.

e.g. view the content from Blackboard in this page from my personal website or view the original inspiration in this CodePen

How it works in Blackboard, currently

It’s a currently a horrendous kludge that’s not really usable. I certainly wouldn’t be using it as it stands (but more on that below). And I wouldn’t expect the average academic or educational developer to be lining up to use it as stands.

The main problem with how it works is the configuration of the TinyMCE editor in Blackboard. Configuration that ends up encoding the HTML elements for the web components into HTML entities. Meaning the web components don’t work.

The kludge to get the magic script to work goes like this

  1. Add the magic script code into a Blackboard content item using TinyMCE.
  2. Use TinyMCE to add the web component HTML into a Javascript string (which will get encoded as HTML entities by TinyMCE when saved).
  3. Add a Javascript function to decode the string into the item.
  4. Call that function and injectsthe decoded string into a specific DOM element.

Together this means that the magic script does it magic when the Blackboard page is viewed.

All this proves is that the magic script can work. Question now is…

How to better use this within Blackboard?

The method described above is usable for just about no-one. A better approach is required for broader, effective adoption.

HAX as a way of editing content (not currently possible)

HAX is the broader project from which the “magic script” originates. There is an 8 minute video that explains what and why HAX is. It describes HAX as providing a way to edit course material in a way that the editor understands what type of content/object is being edited and uses that knowledge to provide content appropriate editing operations. HAX is a way of embedding more design knowledge into the technology thereby reducing the amount of knowledge required of teachers and students.

All of this is enabled through the use of web components. HAX uses the magic script to know about what type of content it is editing and what it can do to that content. HAX itself is a component that can be added to any page, including within Blackboard.

For example, the following screenshot shows the use of HAX to add a horizontal line into the Blackboard page from above.

Adding a horizontal line to Blackboard using HAX

Of course, the edit I’m making to the Blackboard page is only visible to me while I’m looking at the page. Any change I make is not saved for later use. For that to happen HAX needs to be integrated into the authing process of the content management system (in this case Blackboard). The What is HAV? includes examples of this happening in various different content management systems including Grav, Drupal and variations of WordPress. This is achieved via changes to the content management systems editing process. For example, this Javascript for WordPress.

Something like this might be possible with Blackboard. JSHack is a Blackboard building block that enabled the injection of HTML/Javascript into Blackboard pages. Beyond what is possible by manually including HTML/Javascript via TinyMCE that I’ve used above.

But, I don’t have the ability to install Building Blocks into the institutional Blackboard. I’m not even going to try to make the case.

Without this ability, I can’t see how I can make the “HAX as editor” approach work. What follows are some other alternatives.

Make a Black(board) magic script (unlikely)

One potential approach might be to write an extension to the magic script specifically for Blackboard that would work something like this:

  1. Add the magic script etc. to any Blackboard page via the Blackboard editor.
  2. Author adds any of the web components by typing HTML into the Blackboard editor.
  3. But on page load, the magic script would search the content items for any web component HTML entities and decode them.
    Not sure how challenging correctly finding all the HTML entities will be.
  4. At this stage, the original magic script takes over and magic happens.

There are two problems with this approach:

  1. High levels of knowledge.
    It requires authors to write HTML manually. Maybe some educational developers. But not many.
  2. Can it be done.
    I’m not 100% convinced I could write Javascript to find all web component HTML entities and correctly decode them.

The Content Interface approach – partly implemented

The Content Interface is the attempted soluton to the content authoring problem as part of another attempt to share design knowledge for digital learning.

With the Content Interface authors use Microsoft Word (a tool many are comfortable with and which provides various authoring functionality) to create course materials. They use Word styles to semantically mark up the objects in their materials. The Word document is converted to HTML and pasted into Blackboard. A Javascript then transforms the semantically marked up HTML in various ways.

The simple approach – Implemented

One of the styles supported by the Content Interface is the embed style. It’s used to include HTML (e.g. the embed code for a YouTube video) in the Word document which is then turned into HTML in Blackboard that is displayed (e.g. the YouTube video). If the magic script Javascript is added to the Content Interface javascript then it should be possible to embed web component HTML in the Word document and have it displayed via the Content Interface.

Magic script, web components and the Content Interface working together

The more useful approach – not yet

The Content Interface Javascript is currently hard coded to translate Word content with specific styles (e.g. Reading) into a specific collection of HTML and CSS. What is a web component but a way to package up code (Javascript), HTML and CSS into a more reusable form? Suggesting that parts of the Content Interface could be re-written to rely on the magic script and the associated web components. Bringing to the Content Interface all the advantages of web components.

In fact, the Content Interface itself could be rewritten as a web component. Enabling there to be multiple different Content Interface components designed to suit specific purposes. For example, as shown above the Content Interface currently used jQuery accordions to navigate through large course materials. Different components could be written to support different navigation styles. e.g. a parallax scrolling page or a choice like Microsoft Swa offers between vertical and horizontal navigation.

Same for the Card Interface – partially implemented

The Card Interface complements the Content Interface in the act of displaying modules of course materials. The Card Interface generates the “table of contents” of the modules. The Content Interface generates the module content. Given their common origins the two approaches for integrating the magic script with the Content Interface also work for the Card Interface.

The simple approach – sort of implemented

i.e. include the magic script with the Card Interface code and embed a web component. The problem with this approach is that the web component HTML has to be entered via TinyMCE (details about Cards are entered via TinyMCE into Blackboard content items) leading to the HTML entity problem…but it doesn’t. As shown in the following image.

Web components in the Card Interface

This is actually an unexpected outcome. A bit of tidying up would enable this to work somewhat. But of questionable value.

The more useful approach – Card Interface as web component(s) – not yet

As with the Content Interface, the Card Interface could be reimplemented as a web component. Improving its structure and reusability. There could then be potentially a collection of related web components that provide different interfaces and functionality for the purpose of navigating between collection of objects.

What next?

HAX as an editing experience isn’t something I’ll be able to support in Blackboard. However, web components do offer great promise and require more exploration.

I need to

  • Learn more about developing web components.
  • Figure out how to roll out a CDN/magic script specific to my institution/work.
  • Start thinking about productive ways to integrate web components into my daily work.
  • Ponder the implications of web components in terms of the NGDLE/VLE and local strategic directions.
Heading out for a walk

Getting started with memex

My last post was an exploration of Foam (a nascent personal knowledge management and sharing system) and how I might use it. This post documents two steps toward implementation

  1. Writing blog posts using Foam and syncing to my blog (e.g. this post)
  2. Converting almost 100 notes from my wikity into Foam

The end result is that my personal memex is slowly taking shape and a growing familiarity and resonance with how Foam works.

What’s in memex now

Based on Jarche’s Seek > Sense > Share framework the home page points off to three main sections:

  1. seek
    A work in progress.
  2. sense
    Where you’ll find clost to 100 notes imported from my old Wikity site. These are organised into categories, including a “loose” category.
  3. share
    Another work in progress, but does point to the original markdown file for this blog post.


Having more content here has really started to highlight the functionality of Foam and its potential benefits. The auto-complete on Wiki links is very usable and appears likely to help understanding. e.g. it’s already encouraged me to spend more time on naming of notes which means spending more time on thinking about how all this fits together.

At the start, I hadn’t fully grokked the importance of naming files. The wiki-links autocompletion feature means that the location in the file hierarchy isn’t has important as the name.

It’s also reinforced that the very act of using Foam is a form of sharing.

It’s also reinforced the benefit of the “best-of-breed” ecosystem approach to the way Foam is constructed. Each of the VSCode extensions adding a necessary and useful functionality. There’s also been some of the complications of getting disparate systems to talk together. e.g. the aborted first attempt to sync this post and WordPress.

Different bits of the ecosystem introducing unexpected side effects. e.g. if there’s not a blank line before the auto-generated wiki links, it doesn’t display on github.

What’s next?

There are a few limitations/changes to workflow that I haven’t yet figured out/got to

  • Adapting the Foam/Wordpress sync script to maintaining blog pages
  • Explore options for making the interface more visually appealing and easier to navigate
  • Spend a bit more time on the seek process

And generally start embedding this into how I work.

Writing blog posts in memex

One of the assumptions of Foam is that the authoing environment (VSCode/markdown) can be a positive writing experience. I’m not such a fan of markedown. Writing blog posts in Foam will help me explore/change that in addition to all the benefits of POSSE and Foam.

WordPress <–> GitHub sync (failure to launch)

The hope is that the WordPress <–> GitHub sync plugin for WordPress will help.

Installation seems to have worked, but I’ve decided not to import existing posts here. Start afresh.

Is it working? That is the question.

After a bit of fiddling it works. However, it is removing files that Foam uses. Mmmm, not good. It’s not 100% clear to me how and when its removing and moving files in the repo. This is making me nervous.

It’s also 3 years since the last update to the repo, which include a call for maintainers. Moving on.

Python python-wordpress.xmlrpc

There is an option with Python but it’s even longer since it was last updated. But it works. There’s also a [Python markdown module] to convert markdown to HTML.

I’m currently in the process of adding a featured image for each post. Which I’ll do manually to start the post. I need a script that’s going to: read the markdown file, extract config about which post/page it’s related to, and then update that page.

That’s done. Sufficient for now, but a huge kludge. But that’s nothing new to what I do.

Needs some tidying up, but that’s tomorrow’s (which never comes?) job.

Importing notes from wikity?

From previous experimentations I have a Wikity install that contains a collection (not very big) of candidate “zettels”. The idea is that importing those into memex should provide a good collection of zettels to experiment with using Foam. Giving some insights into if and how Foam can work managing such a collection.

The plan here is:

  1. Check out the format of the Wikity entries.
  2. Develop method to programatically extract them from Wikity.
  3. Transform and insert them into memex

Wikity entry format

Wikity (I believe) was based on the idea of Cards and CardBoxes. Cards are the equivalent of zettels (which is German for a small piece of paper) and CardBoxes are the equivalent of structure notes (memex’s paths).

One of the problems I face is that I doubt I ever used Wikity all that well. And what is there seems to have broken links

Card:Three types of decentralisation as some wonky content but does include a “see” link that is meant to point to a Cardbox. The content is in markdown and the “see” link is a wiki link [[BAD]]

Cardbox:Affordances contains two cards. It shows that a CardBox is essentially only links to other cards. The content is shown in the left hand nav bar. The content of this WordPress post is two wiki links to the cards e.g.

[[Why the web scales]]
[[Blackboard tweaks]]

It appears that the only sign that it’s a CardBox is that inclusion of CardBox:: in the title.

Suggesting it should just be a matter of extracting the content of each post and writing it to a proper place and all should be good?

Extract content from Wikity

Wikity is a theme on top of WordPress. Hence the python-wordpress.xmlrpc package used above should be able to grab the cards.

And it can. Quite easily. The question now is how to insert it into memex.

Transform and insert into memex

Since Wikity uses markdown (as does Foam/memex) there is no immediate need to transform. The question will be if there are any specific additional transformations (e.g. links) that need to be made to make it all work in Foam.

Plan is to insert the wikity cards and card boxes into the Sense section of memex. At some level the cards have already been ‘sensed’, just not very well. The question in my mind is how to do this? What structure to use?

The Foam community to the rescue with this example found on Twitter. A concrete example to explore. The concepts directory is holding the equivalent of card boxes. Semi-equivalent to the sense directory in memex. Each “card box” then has its own “index” and directory for cards


  • Get a list of Cards and CardBoxes in Wikity
    Done. Simple Python code.
  • Make directories in sense for each of the card boxes
    Done. More simple processes
  • Save card boxes to files in sense directory
    Now it gets harder. More detail below. But not using wiki links
  • Save each card ito the appropriate directory (card box or “loose”)
    Another case of a bit of markdown linking, rather than wiki-links
  • Add a list of card boxes to sense/
    Will do this one manually, with a bit of help
  • Add a list of “loose” cards to sense/

Generating md files using Python

It’s simple to write the files using Python. But doing so bypasses VS-Code so doesn’t run the plugin that enable wiki links to work.

  1. Figure out how to call the plugin from Python (or other means)
  2. Write normal markdown links using Python

Problem 1 is a step too far for my knowledge and time at the moment.

Fixing misc problems

The wikity notes are imported, but github pages isn’t building. Potentially because the wikity stuff was all over the place. Some HTML, some markdown. Trawling through those, fixing problems and re-allocating notes.

Also removing colons from filenames.

It does appear to be working

[Why the web scales]: ../../sense/Affordances/Why the web scales “Why the web scales”
[Blackboard tweaks]: ../../sense/Distribution/Blackboard tweaks “Blackboard tweaks”

Birds hiding in a bush

Designing a personal “memex” with Foam

For years I’ve been annoyed at the lack of structure in my approach to managing and leveraging information (it never really becomes knowledge). The process through which I Seek > Sense > Share information/knowledge has been ad hoc, disorganised and broken.

Last week @downes shared details about Foam. The first release of which was announced two weeks before I’m writing this.

The following is me figuring out how I might kludge Foam together with the other assemblages I use to help fix what is broken. Of course, it takes much more than a technology.

What is Foam? Why use it? Why not?

Foam is a tool intended to help individuals store, manage and leverage knowledge. It’s inspired by tools such as Roam and Notion, which are getting some attention. It also harks back to Smallest Federated Wiki and Wikity. Ideas that have promised to help with the problem I’ve identified above, but which I’ve never been sufficiently disciplined to effectively use. Hence no solution.

Foam has some established principles which resonate and which may help address some of the dissonance prior toools created with my personal practice. Like @downes I am attracted by the underpinning technology used by Foam – Visual Studio Code and GitHub. First, because I’m increasingly using those technologies in my work so my familiarity with them is increasing. Forming a virtuous circle, using Foam will help improve my familiarity with these tools and help my work. Second, the small pieces loosely joined approach enabled by both technologies resonates strongly with my prior work and assumptions about what works, or not. Though the fact that they still position “Build vs Assemble” as an either/or suggests that they haven’t made explicit the idea that out it is both/and.

Foam’s principles mention an intent to “allow users to operate in a decentralised” manner, which is also pleasing. I need to figure out how to integrate Foam into the assemblage of tools, practices and knowledge that will form my PKM processes. Inevitably my choices will be different than others. VSCode and GitHub are designed to more easily support this difference than some other choices. For example, some early examples of how the tools underpinning Foam might help inter-connect Foam with my existing assemblages, include:

And that list is without exploring further into the VSCode ecosystem (e.g. this citation picker for Zotero or the VSCode extension that allows typing TODO in a note to create a github issue). The presence of these ecosystems point to the strength of using technologies (VSCode/GitHub) that are widely used by a lot of people (who code). The list above illustrates that other people have already provided solutions to requirement I have. Solutions which are generally protean enough for me to customise to my context.

Why not use Foam?

It’s still early days. There remains a question whether this tool and its community will evolve productively. It’s also a bit rough around the edges and perhaps not fully feature complete. Not surprising since it is essentially two weeks since the release of a functional prototype.

Foam is not an integrated system. It’s a best-of-breed system. Each of these product models have plusses and minuses. A best-of-breed approach is more flexible and customisable. It’s also requires more knowledge to use effectively. Especially when the number of components that make up the best-of-breed system becomes quite large. As it can quickly become with Foam. Also, Foam is a best-of-breed system that you are responsible for fitting together.

The technical knowledge required to get going is relatively high. Rough around the edges means it’s probably best if you are familiar already with GitHub and VSCode. Markdown is the core authoring environment. It’s something else to learn.

The reliance on the filesystem to store data may be a limit on functionality and scalability. This type of note-taking approach (arguably) works best with a hypertext type structure. Not a hierarchical/categorical structure. The Web versus Gopher. A problem touched on by Berners-Lee talking about Bush. GitHub controls file structures. File structures are hierarchical.

What else might you use?

There’s a GitHub repository to answer that question. The Digital Gardners repo is described as “A collective of gardners publicly tending their digital notes on the interwebs”. It includes sections on Gardening Tools, How-tos, theory etc.

Interesting that @holden’s dLRN 2015 presentation gets a mention. First connection to my earlier dabbling and still one of the best descriptions of the importance/difference of this type of approach. In which he harks back to memex and explains why the following isn’t an entirely fitting name for what I might do with Foam here. e.g. contains my material and the materials of others. Links are associative. Links made by readers and writers.

Introducing Memex

My first quick test of Foam was labelled secondBrain. I wasn’t happy with that name and the following illustrates that I’ve moved further away from that term. To quote Bush (Bush, 1945)…”it needs a name”…

Consider a future device for individual use, which is a sort of mechanized private file and library. It needs a name, and to coin one at random, “memex’’ will do. A memex is a device in which an individual stores all his books, records, and communications, and which is mechanized so that it may be consulted with exceeding speed and flexibility. It is an enlarged intimate supplement to his memory.

While this use of Foam is certainly not going to be functionaly equivalent to Bush’s “memex” or later conceptualisations informed by the Web and greater hypertext thinking. The purpose certainly fits. I’m hoping the disciplined use of Foam will provide “an enlarged supplement” to my memory etc.

So welcome to my personal prototype memex. That will take you to the github pages representation of the memex. If you’re really keen you can access the github repository.

As it stands it is pretty limited. I still haven’t figured out completely how to use it.

How to use it?

One of the Foam principles is “Foam is not a philosophy”. i.e. how you use Foam is really up to you. Figuring how to use Foam in an effective and disciplined way is perhaps the hardest task. A task I’ve not been successful with to date with other tools. The following is some exploration and thinking about how I might turn this around.

The Foam recipes section on Worflow is currently empty. But Foam does talk mention Second Brain and Zettelkasten (which is not a new idea). There are others. The digital gardeners repo mentions some. Following explore Zettelkasten, SecondBrain and Seek > Sense > Share for ideas to inspire how I might use Foam.


This Medium post on Zettelkasten (a form of notetaking) describes the zettelkasten method as relying on a sequence of activities: Collect, Process, Cross-Reference and Use. It also lists the following requirements

  • Notes are atomic.
    i.e. as mentioned here, make them agnostic to a parent topic.
  • Each note has a home.
    But also points out the limitation of a topic based organisation as notes can belong to multiple topics. An emergent home.
  • Each note has a name.
  • Notes link to other notes.
  • Cross reference keywords.

A more detailed post on zettelkasten offers the following “tools for the zettelkasten method”

  • Inbox.
    Where rough ideas are captured for further processing.
  • Reference manager.
    How you cite references. Mentions Zotero. Rasing the question of how to cite references in Markdown/VSCode? Hey presto, there’s a VSCode package for that.
  • The Zettelkasten
    Recommneded that this be plain-text. This is where Foam most explicitly enters the picture.

It also offers the following process

  • Capture.
    Reading and taking literature notes. Literature notes are a collection of all the notes made on an article/book.
  • Elaborate.
    Turning notes into Zettels. Summarise contents into the Zettel title. Write for others. A structure including

    • Title/Zettel id
    • Elaboration
    • Highlights
  • Connect
    Add them into the network of Zettels. Tags. Links out and in. Structure notes become important here. Including indication of type of note in Zettel UID: L=literature note. L2=mid-level structure note. L1=top-level structure notes….perhaps too much.

    Tags. Use different types of tags ## for L1 notes.

Second Brain

SecondBrain appears to be a similar and more commercial process (e.g. there’s a company LinkedIn page). This description of SecondBrain identifies two core concepts: CODE and PARA.

CODE summarises “four universal steps”

  • Collect – a place to collect what’s interesting.
  • Organise – the structure it suggests is captured by PARA
  • Distill – notes themselves aren’t enough. Progressive summarisation.
  • Express – share with the world.

PARA suggests structuring content into

  • Projects – tasks liked to a goal/deadline
  • Areas – sphere of activity to be maintained
  • Resources – topic or theme of on-going interest
  • Archives – inactive items from the first three.

This sequence is meant to capture the flow between actionable tasks (Projects down) and non-actionable information.

Progressive summarisation appears to be the description of how to create and manipulate notes through the PARA/CODE concepts. Based on the idea of “note-first” rather than tag or category first. i.e. the primary focus is design of individual notes. Balancing discoverability (relying on compression) and understanding (relying on context) – touching on the reusability paradox.

Progress summarisation has layers of summarisation and the idea of opportunistic compression. You do it over time as needed. Not all resources go through all the layers. The layers are

  • Layer 0 – the original, full-length resource.
  • Layer 1 – initial notes/summary generated by note-taking program.
  • Layer 2 – bold passages.
    The “best parts” of the Layer 1 notes. The core of the idea.
  • Layer 3 – Highlighted passages
    The “best of the best”.
  • Layer 4 – Mini-summary.
    2 & 3 converted into an executive summary.
  • Layer 5 – Remix.
    Changes to how and where they are structured. Perhaps more linked with expressing the idea.

SecondBrain doesn’t (as of yet) capture the flow of random insights coming in???

Seek > Sense > Share

The Seek > Sense > Share Framework from @hjarche offers a conceptualisation that I’ve used personally and in my teaching for quite some time. It’s seen as a method for putting Personal Knowledge Mastery into practice. It offers more a way of thinking about what’s required rather than offering explicit guidance into the how – one of its strengths. It’s easy to see connections between Seek/Sense/Share, CODE and the other processes above.

What do I want to do with it?

Frameworks are useful, but how do I want to apply them. What do I need/want to do? Who am I? Who do I want to be?

I increasingly think of myself as a toolsmith in the sense expressed by Brooks (1996) whose delight “is to fasion powertools and amplifiers for minds” (p. 64). I’m a nerd who builds things that people want to use for pesonally productive ends. Mostly in the realm of (formal) educational technology. Consequently, it’s much more complex than just technology. Hence the current title of this blog – some assemblage required. Theory about people, learning, systems, organisations, teaching etc is required. Hence the tasks I need to undertake could include: reading, writing papers, developing software, thinking.

I’m not sure I see SecondBrain’s PARA approach fitting here. I won’t be using Foam for everything. Just tracking of notes. Zettelkasten seems a better fit for the purpose. Plus I’m worrred about too explicit a categorisation scheme and especially Foam’s reliance on the file structure and subsequent scalability issues. All notes in a single directory?

The purpose

The intent is that my memex will be where I store more notes which eventually become Zettels. The workflow will mirror Seek > Sense > Share. With memex being the core of Sense but having connection swith Seek and Share. Perhaps suggesting that Seek > Sense > Share become the structure.

Initial design

The home page could have a brief background, but then links to Seek, Sense and Share. Sections on the home page but also directories in the repo used in the following way

  • Seek.
    Contains pointers (and perhaps scripts) used to triage notes from seeking into memex. Layer 1 in SecondBrain concepts. A todo list of notes that need to be made sense of.
  • Sense.
    Where all the Zettels sit. As “seek notes” are summarised and connected they move into this directory. The sense page contains lists of stucture notes and unallocated notes. Structure notes represent major areas of interest I’m working on and may correspond to directories within the sense directory. Unallocated notes are those that have been “zettelised” but which aren’t yet connected.
  • Share.
    Contain an explanation of various means I’m using for sharing, but also explicit outcomes. e.g. papers, blog posts, github repos? Etc. Some of the outcomes would be works in progress, but others may be concrete artifacts that are used as part of my POSSE model.

To do

I now need to figure out if and how this plan can be best implemented with Foam’s nascent and evolving functionality and subsequently integrated into my assemblage of technologies and practices.

Foam questions

The whole directory/file question is probably the main one at the moment. If/how to do that and what are the trade-offs?

How do wiki links work and from there visualisation and back linking?

If and how can tags be simulated within Foam? Can I add “tags” to markdown files in a way that allows the automated genration of structure notes?

And I’m sure many others

Assemblage integration

For this to work I need to connect memex to the rest of the tools I use


  • Fix my Zotero installation.
  • Translate notes from various sources (Kindle, Zotero, Diigo,, Wikity) into memex.
  • Put in place process to keep those notes flowing into this.


  • Work out the process, structure and technology to make sense of in-coming notes.
    • What’s the landing page into memex like?
    • Structure underneath.
  • Figure out how Zotero and VSCode can effectively work together
  • Figure out how to handle moving notes around the directory structure and connection with links (wiki and markdown)


  • Explore POSSE style links from Foam to
    • my blog (wordpress).
      Posting and pages?
    • Twitter.
    • MS Teams?
  • How it figures into more formal writing.

And of course the simple task of trying to get all this to fit together and use in a disciplined and effective way.


Brooks, F. (1996). The Computer Scientist as Toolsmith II. Communications of the ACM, 39(3), 61–68.

Bush, V. (1945). As We May Think. The Atlantic Monthly.

Understanding (digital) education through workarounds and quality indicators

COVID-19 and the subsequent #pivotonline has higher education paying a lot more attention to the use of digital and online technology for learning and teaching (digital education). COVID-19 has made digital education necessary. COVID-19 has made any form of education – and just about anything else – more difficult. For everyone. COVID-19 and it’s impact is rewriting what higher education will be after. COVID-19 is raising hopes and fears that what will come after will be (positively?) transformative. Not beholden to previous conceptions and corporate mores.

Most of that’s beyond me. Too big to consider. Too far beyond my control and my personal limitations. Hence I’ll retreat to my limited experience, practices, and conceptions. Exploring those more familiar and possibly understandable landscapes in order to reveal something that might be useful for the brave new post-COVID-19 world of university digital education. A world that I’m not confident has any hope of being positively transformed. Regardless of what the experts, prognosticators, futurists and vendors are selling. But I’m well-known for being a pessimist.

Echoing Phipps and Lanclos (2019) I believe that making changes in digital education needs to be grounded in “an understanding of the practices that staff undertake and the challenges they face” (p. 68). Some colleagues and I have started identifying our practices and challenges by documenting the workarounds we’ve used and developed. Alter (2014) defines workarounds as

a goal-driven adaptation, improvisation, or other change to one or more aspects of an existing work system in order to overcome, bypass, or minimize the impact of obstacles, exceptions, anomalies, mishaps, established practices, management expectations, or structural constraints that are perceived as preventing that work system or its participants from achieving a desired level of efficiency, effectiveness, or other organizational or personal goals (p. 1044)

Workarounds are a useful lens because they highlight areas of disconnect between what is needed and what is provided. Alter (2014) suggests that this Theory of Workarounds could be used to understand these disconnects and leverage that understanding to drive re-design. Resonating with Biggs’ (2001) notion of quality feasibility, a practice that actively seeks to understand what the impediements to quality teaching are and to remove them.

The challenge I faced was whether I could remember a reasonable percentage of the workarounds I’ve used in 20+ years.

Enter the following list of eight Online Course Quality Indicators also available as a PDF download and tested in Joosten, Cusatis & Harness (2019) (HT: @plredmond and OLDaily).My interest here isn’t in the validity/value of this type of approach (of which I have my doubts). Instead, my interest in that the eight indicators offer a prompt for the type of considerations to which a conscientious teacher might pay attention. The type of considerations that will point out limitations within institutional support for (digital) education and generate workarounds.

Initial findings

So far I’ve remembered 53 workarounds. Detail provided below. The following table maps workarounds against the quality indicators. The biggest category is Doesn’t fit. i.e. workarounds that didn’t seem to fit the quality indicators. Perhaps suggesting that the quality indictors were designed to analyse the outcome of teacher work (online course), rather than provide insight into the practices teachers undertake to produce that outcome.

Peer interaction and content interaction are the indicators with the next highest number of workarounds. Though I have collapsed both content interaction and richness indicators into content interaction.

Quality Indicator

# of workarounds









Instructor interaction


Peer interaction


Content interaction / Richness


Doesn’t fit


53 is a fair number. But perhaps not surprising given my original discipline is information technology and part of my working life has been spent designing LMS-like functionality.

What’s disappointing is that a number of these workarounds are duplicates solving the same fundamental problem. The only difference being in the institutional and technological context. For example, a number of the workarounds are focused on helping with:

  1. Production and maintenance of well-designed, rich course content.
  2. Increasing the quanity and quality of what teachers know about students background and activity.

What does that say about higher education, digital education, and me?

Proper reflection and analysis will have to wait for another time. But evidence of a difficulties in at least two fundamental practices seems important. Or, perhaps it’s just showing how blinked and obsessive my interest is.

There are some questions about whether the following are actually workarounds. In particular, some of the fairly specific learning activities aren’t actually designed to change an existing part of the institutional context. There was no part of the institutional context that provided for the learning activities. Largely because the learning activities were so specific to the learning intent that the institution would never have been able to provide any support. However, most institutions now have lists of digital tools that have been approved for use in learning and teaching. Typically, the specificity of the learning need means that no appropriate tool has been added to the list.

What does this say about the reusability paradox and institutional approaches to digital education?

Workarounds and quality indicators

The following steps through each of the quality indicators and uses them as an inspiration to answer the above question. For each workaround links to additional detail is provided and initial thoughts on the workaround given.


Systems Emergencies

One attempt at an authentic real world experience was the Systems Emergency assessment item for Systems Administration (Jones, 1995). Each student had to run a program on their computer. A program that would break their computer. Simulating an authentic error. The students had to draw on what they’d learned during the course to disagnose the problem, fix it and complete a report.

Is this a workaround? It’s so specific to a particular course and a particular pedagogical choice there is no institutional system that it is replacing.

Open Learning Computing Platform

Better example from the same course went by the acryonym OLCP (open learning computing platform) (Jones, 1994). The recommended computer systems almost all distance education students were using (Windows 3.1/95) was not up to the requirements of the course (Systems Administration). To workaround this limitation we distributed a version of Linux (Jones, 1996a), eventually relying on commercial distributions. Without Linux the course couldn’t be taught.

Personal Blogs, not ePortfolios

Arguably, my predilection for requiring students to use their choice of public blogging engines, rather than institutional ePotfolio tools was also driven by a desire for authenticity. Not to mention my skepticism about the value of institutional ePortfolio systems (which got me in trouble one time). Initially, individual student blogs were an extension of journaling (introduced in Sys Admin) and an encouragement to engage in open reflection and discussion. Intended to mirror good practice for IT professionals and first used in a Web Engineering course in 2002. Later evolving into the BAM and BIM tools to encourage reflection for assessment purposes and to encourage the development of a professional learning network.

Alignment and curriculum mapping

In terms of alignment of assessments and learning activities I’ve used and more often seen people use bespoke Word documents and spreadsheets to engage in mapping of courses and programs. Mainly because institutions did not have any practice of encouraging such practices, let alone systems to do it (e.g. this from 2009). There’s been a lot more attention paid and importance placed on mapping, but generally it remains an area of bespoke documents and spreadsheets. Perceived shortfalls that led to some design work on alternatives.


Moodle Course design

Designing a well-organised course site that is easy to navigate with manageable sections and a logical and consistent form is no easy task given the nature of most LMS. My first foray into this (before 2012 I was using an LMS I developed) added the fikkiwubg design features using bits of HTML.

A “Jump-to: Topic” navigation bar to my Moodle course sites to avoid the scroll of death.

Addition of non-topic based navigation to the top of the Moodle site to provide a sensible grouping of resources (Course background & content) that didn’t fit with the default Moodle design.

Addition of topic-based photos to generate visual interest, perhaps a bit of dual coding with the topic, and encourage some further exploration.

A “Right now” section at the top manually updated each week (along with the banner image) of term to orient students to the current focus.

Moodle Activity Viewer

Since the in-built Moodle reports aren’t that good and because I really wanted to understand how students were engaging with the Moodle sites I designed the Moodle Activity Viewer scratched an itch. It enabled an analysis of student activity.

Evernote to search a course site?

On of the on-going challenges with using Moodle was the absence of a search engine, a fairly widespread and important part of navigating any website. I did consider a number of different options and ended up trying out a kludge with Evernote. But only for one offering.

Modifying the Moodle search book block

Hosting course content on a WordPress blog

In 2012 I took over a Masters course titled Network and Global Learning. Given the focus of the course, hosting the learning environment in a closed LMS site didn’t seem appropriate. Instead, I decided to try it as an open course. It ended up as a WordPress site and has since been taken over by another academic…at least for one offering. Looks like it probably ended up back in the LMS.

Diigo for course revision

Given NGL was hosted on a course blog, this raised questions about how to take notes about what wasn’t working and ponder options for re-design. In Word, this could be done with the comments feature. For the Web I used Diigo to produce annotations like the following.

Card Interface

Late 2018 saw me stepping backwards to Blackboard 9.1. A very flexible system for structuring a site, but incredibly hard to make look good without a lot of knowledge. How to enable lots of people organise their course sites effectively? Enter the Card Interface. Easily convert a standard Blackboard content page into a contemporary, visual user interface.