What do you love or hate about the MOOC platforms you’ve used?

There’s an almost endless supply of online courses to learn new skills and deepen existing knowledge. But how user-friendly are online learning platforms, really? Do they do justice to their high-quality course content?

The reason I’m asking is because, along with @mtyaka and other members of the OpenCraft team, @Cassie, and I are on a mission to build an Open edX theme that people love to use! But we need your help. So, if you have a couple of minutes, we’d love to know:

  1. Which is your favourite online learning platform and why? (I’ve added a list below for some inspiration)
  2. What do you wish online learning platforms would do better when it comes to their user experience?
  3. If you had to name the feature that you find most useful in a learning platform, what would it be?
  4. Is there anything else you’d like to mention about your online learning journey?

I’m looking for the things you love, as well as the things that drive you nuts, so don’t hold back!

P.s. This is an open-source project, so we’d also love you to contribute if you’re interested.

8 Likes

Here are a couple more online learning platforms for some inspiration (to add to your list @ali_hugo)

2 Likes

Hey @ali_hugo, @Cassie, and @mtyaka thanks for taking this initiative. A better learning experience definitely has a deeper impact on a learner.

I have used Coursera and Udemy very heavily and I have seen the journey both of these MOOCS host platform has, initially Coursera used to be a just a repository of related video lectures but then they made it more interactive by introducing quizzes and then introducing quizzes while watching those lectures.

The point where the courses get the user more involved through quizzes is what I really enjoy, I love the way Khan Academy uses to give badges but I feel they overdo it. There should be a very subtle balance between involving the learner and incentivizing them.

I am probably looking at a flow where a learner is involved while learning using different activities like quizzes and games and gamified with badges and incentives like that.

The community feature where learners can form community and learn from each other and discuss various learnings. Peer learning is something that I believe can really elevate the whole experience.

I really hate the monotonous lectures because most of the time I watch them at 2x speed and if they get dull I doze off. I really need something that gets me on my toes and helps me to concentrate better. I would want a holistic learning experience knowing my lecturers and interacting with my peers if possible.

Again thanks a lot folks for doing this. Hope we make the experience of our learners better. :slight_smile:

3 Likes

Hi @farhaanbukhsh,

Thanks for your detailed response!

It’s interesting that a lot of your answers highlight the community aspect of learning. I love the idea of peers learning from one another, and think it can be a very effective learning strategy. I also think that a sense of community makes learning a lot more fun!

This, in combination with your suggestions of including quizzes, games, and incentives, could help to encourage learners to keep coming back.

Thanks for your ideas! :slightly_smiling_face:

2 Likes

We’re still on our quest to make online learning platforms more fun and engaging! We’ve turned to some existing sites for a little bit of inspiration, and would love to hear your honest opinions about our ideas.


1. How do you guys like the vertical progress bar shown on the left hand side of this site? This kind of navigation could be used to navigate learners through sections of a course.

Source: Where Is Poland? | A Journey Through A Country That Wasn't


2. Would you like some kind of animation to show which answers are correct or incorrect when it comes to things like quizzes?

Source: 10 Idées reçues sur l'UX Design


3. We’d love to add some cool transitions and hover effects to the theme. What do you think about displaying course options in a similar style to the cards shown in the GIF below? If a card / course is selected it’ll open with some kind of cool transition.

Source: The A-Z of AI


4. When the user is viewing their course, and scrolls to the bottom of the page, we could include a bold, fun way to navigate to the previous, or next option, as shown below. What do you think?

Source: The A-Z of AI


5. Would prefer if courses are listed in a more interesting way on the theme? For instance instead of listing course options one below each other, we could list them horizontally and include a vertical scroll. What do you think?

Source: Merci-Michel - Projects


6. When displaying course content, what do you think about using a split screen showing text on one side, and images or videos on the other?

Source: http://www.100yearsofnps.com


7. Do you like it when videos you come across on a page autoplay? See example below:

Source: Snow Fall: The Avalanche at Tunnel Creek - Multimedia Feature - NYTimes.com

3 Likes

I’ve done courses on edX, Coursera, Udemy, Moodle, and Blackboard (the latter two platforms weren’t MOOCs, but adding for completeness).

While it’s honest opinion time, here are the things that have caused the most frustration for me:

  • Inefficiency in the user interfaces: when simple things are difficult to find, require too many clicks to operate, or too much scrolling. I shouldn’t need to click through multiple ‘helpful’ interfaces to upload a file in an assignment, or click all the blocks on the page to expand each content section.
  • Slowness. Nothing breaks flow more than getting frustrated waiting for a page to load.
  • Unecessary animations. IMHO, animations should only exist to aid in drawing attention to something blocking (eg. flashing a invalid form field when trying to submit) or to give awareness of a transition (eg. scrolling down, expanding a box, etc.). But even then, these animations should be as quick as practical to not get in your way. I’ve used interfaces where switching between sections on the same page takes several seconds while it animates closing the current section, scrolling to the top of the page, scrolling to the selected section, animates opening the section, scrolling to the top of the now opened section content… :scream:
  • Modals. Modals are to be used when the page is in a state where nothing else can happen until the user makes a decision that the modal is presenting. Using modals for notifications, useful information, etc. just results in annoyance and develops the reflex to just click ok on every modal that pops up.
  • “Smart”. I don’t want a smart interface. I want a dumb, consistent interface. No autoplay, no popups, no clickjacking, no arcane icons, no scroll hijacking. Yes to consistency, standard icons, predictable scrolling.
  • Too much gamification. I’m here to learn a topic, not collect a million badges or points. :stuck_out_tongue: Personally, I get motivation from seeing my progress in a course, rather than other virtual rewards.

Now for some positivity! Things I love to see/use in platforms:

  • When the platform gets out of the way. I’m here to find a course and learn something in that course. I’m not here to click buttons, watch animations, or spend hours looking for the right option in a busy interface. I don’t want to see fancy icons taking up the space, when I could be seeing an estimate of how long the activity will take for example. The learning experience and content should be front and centre, in a clear and predictable way.
  • When I get instant feedback. Click a quiz multiple choice answer or submit a text answer and instantly see if correct or not.
  • Clear presentation of current progress. I think Coursera does this particularly well these days - every activity and content item has a complete/incomplete markings. When this is done well, I can open the course page and instantly find the next item I need to look at.
  • Easy to understand grades view. Similar to the previous point; it’s great when I can find an overview of grades, assignments remaining, etc.
  • Discussion forums. Online courses with forums immediately have a community feel, and provide a place to provide feedback, ask questions, discuss topics, etc.
  • Clear presentation of content. Well laid out content, readable typography, nothing hidden behind more clicks, etc.

Ok I forgot to answer the original questions - I’ll write the first things that come to mind:

Which is your favourite online learning platform and why? (I’ve added a list below for some inspiration)

Out of the ones I’ve used, probably Coursera. I think I’ve enjoyed it mainly because it really does get out of the way.

For example (source):

Here I can see the topics, estimated time required to cover the content, required assignments and due dates. No noise.

What do you wish online learning platforms would do better when it comes to their user experience?

Performance. The faster pages load and render, the less interruptions, and the more flow.

If you had to name the feature that you find most useful in a learning platform, what would it be?

Course content with progress tracking. The two things that a learning platform does that is difficult to do by self study is curate and present the content, and let you track your progress through it. Without that, it’s no different to reading a textbook by yourself, or aimlessly browsing web tutorials.

Is there anything else you’d like to mention about your online learning journey?

Look, learning is hard, designing platforms is hard, designing courses is hard. And yet there are still many amazing platforms and courses, that come together to make learning relatively easy. And that’s why I have taken many MOOCs and paid online courses over the years.

Hope this is somewhat useful; it kind of turned into a disjointed set of thoughts. Some of the things I’ve written apply more to actual course content or the underlying platform rather than theming though. ¯\_(ツ)_/¯

2 Likes

Oh, and to respond to @mtyaka’s ideas with honest thoughts:

  1. How do you guys like the vertical progress bar shown on the left hand side of this site?

I don’t like vertical progress. This example usually goes hand-in-hand with scroll hijacking, which breaks the user’s expectations on how scrolling on the web works.

  1. Would you like some kind of animation to show which answers are correct or incorrect when it comes to things like quizzes?

Yes, if it doesn’t get in the way. A full screen ‘well done’ with confetti absolutely does get in the way. I would prefer something a lot more subtle and less ‘hijack the whole page’.

  1. We’d love to add some cool transitions and hover effects to the theme. What do you think about displaying course options in a similar style to the cards shown in the GIF below? If a card / course is selected it’ll open with some kind of cool transition.

No no no no! Personally I like when cards have a subtle hover change in style to indicate it can be clicked (like changing the colour tone), and a quick animation on expanding so as to not get in the way.

  1. When the user is viewing their course, and scrolls to the bottom of the page, we could include a bold, fun way to navigate to the previous, or next option, as shown below. What do you think?

More examples of gratuitous animation. :confused:

  1. Would prefer if courses are listed in a more interesting way on the theme? For instance instead of listing course options one below each other, we could list them horizontally and include a vertical scroll. What do you think?

Vertical scroll should never be a thing. Even worse if the cards change size/shape on hover. Clickjacking + breaking standard behaviour assumptions.

  1. When displaying course content, what do you think about using a split screen showing text on one side, and images or videos on the other?

Sure, that looks nice. :+1: A difficulty might be deciding how that should transition to narrower viewports though.

  1. Do you like it when videos you come across on a page autoplay? See example below:

No. Autoplay is distracting, unsettling when a textual article suddenly starts blasting audio and video at a certain point, breaks the page while you wait for it to load, and it’s a video but you can’t interact with it like a normal video (pause, scrub, fullscreen, etc.).


Maybe I’m just coming across as a grump that doesn’t like animations… but I do think that fancy animations and other ‘cool’ or ‘fun’ things are not a good fit for the web, especially for presenting course content. The web has many longtime standard behaviours (norms in UX speak?) that need to be respected for good usability.

1 Like

Which is your favourite online learning platform and why? (I’ve added a list below for some inspiration)

Difficult to say, as it depends on what and how I’m learning, but here are a few:

What do you wish online learning platforms would do better when it comes to their user experience?

  • EdX
    • the horizontal progress through a course section is jarring and makes it difficult to determine where I am in the course, and how to get to other parts of the course. Scanning left to right takes more effort than scanning top to bottom. If I want to know my progress, I don’t want to have to do work - it should be clear so that I can focus on the learning
  • Coursera
    • slooooooow :turtle:
  • general
    • I’m not a fan of forums and community discussion areas - I don’t enjoy social media, and I feel that by being part of a forum there’s pressure to maintain a presence, as well as potential for being interrupted with notifications / growing inbox. Many platforms want you to introduce yourself, and discuss course content in a specific area away from any specific course item. It’s nice for people who want to join a community, but if I want to find something out about a specific video I’m working through, I want to ask the question right there and then on the same page. egghead.io is great for this.

If you had to name the feature that you find most useful in a learning platform, what would it be?

An obvious indication of my progress available at all times.

Is there anything else you’d like to mention about your online learning journey?

I recently started some data science material on Khan Academy. In their quizzes they have a scratch pad which appears over the question where you can write what you want. The scratch pad doesn’t obstruct text inputs in the question area - this is a delight! No context switching in the interface when thinking and calculating and entering answers!

1. How do you guys like the vertical progress bar shown on the left hand side of this site? This kind of navigation could be used to navigate learners through sections of a course.

Takes too long to determine what each item is - hovering on individual items to find out what they are would frustrate me - I want to scan with my eyes, instead of my mouse, so I can get back to learning

2. Would you like some kind of animation to show which answers are correct or incorrect when it comes to things like quizzes?

Could be nice. IIRC Khan Academy does this nicely when completing a quiz. Maybe not every question, but on conclusion of a section when you know you’ve reached a milestone and you’re happy to have a little distraction, similar to Process Street’s animation when completing a checklist. I’m not sure if I’d be distracted by animations when going through individual questions or not, but it doesn’t seem like it’d necessarily benefit the learning.

3. We’d love to add some cool transitions and hover effects to the theme. What do you think about displaying course options in a similar style to the cards shown in the GIF below? If a card / course is selected it’ll open with some kind of cool transition.

I’m neither here nor there on the transitions. If they’re fast and unobtrusive, then sure, but I don’t imagine they’ll benefit me finishing a course.

4. When the user is viewing their course, and scrolls to the bottom of the page, we could include a bold, fun way to navigate to the previous, or next option, as shown below. What do you think?

Nope, boring and simple is fine with me. UIs are difficult to build and maintain, and animation for the sake of animation is likely not a good idea for maintenance or UX. If the animation is going to help me go to the next page more effectively than a simple button, then maybe it’d be valuable, otherwise I probably wouldn’t mind whether it was there or not. I’d be concerned about potentially being pulled out of flow if their are animations all over the place.

5. Would prefer if courses are listed in a more interesting way on the theme? For instance instead of listing course options one below each other, we could list them horizontally and include a vertical scroll. What do you think?

Side scrolling is quite possibly the feature I like the least on any site - more so than popups. I want scrolling to be as boring as possible, because I want to read the list as efficiently as possible. Also, the cognitive dissonance of scrolling my mouse in the Y plane, while content moves in the X plane is jarring.

6. When displaying course content, what do you think about using a split screen showing text on one side, and images or videos on the other?

This is a great idea :smiley:. FreeCodeCamp makes excellent use of a split for working and context. Likely contextual, though, as in FreeCodeCamp you’re writing code at the same time as evaluating requirements.

7. Do you like it when videos you come across on a page autoplay? See example below:

It drives me bananas :banana: :banana: :banana:. A video can play if it doesn’t affect layout, doesn’t have audio, and provides context to what I’m doing. If I’m looking at a car site, or extreme sports website, sure, they can play their videos in the banner when I get there. If I’m trying to read something, however, it drives me nuts that I have to stop a playing video; it pulls me out of the context of what I’m there to consume

3 Likes

@swalladge and @larrybotha Thanks so much for your thoughts! They’re really insightful and helpful for our cause :slight_smile:

1 Like

@ali_hugo, @Cassie, @mtyaka Thanks a lot for posting this. :slightly_smiling_face:

  1. Which is your favourite online learning platform and why? (I’ve added a list below for some inspiration)

I’ve spent a lot of time in Coursera. The experience is simple, not getting in my way.

  1. What do you wish online learning platforms would do better when it comes to their user experience?
  1. A pleasant Dark theme. It’s a place where I would spend a large amount of time, so I prefer having Dark mode to save my eyes.
  2. Auto caption in videos for multiple language - like Youtube
  1. If you had to name the feature that you find most useful in a learning platform, what would it be?
  1. A powerful search option, that finds things from Course Content, Forum, Wiki, etc.
  2. A category, topic-wise grouped courses, and navigation. So that it is easy to find the type of course I am looking for.
  1. Is there anything else you’d like to mention about your online learning journey?

Online Learning should have a higher number of notifications. In the physical world, we are very engaged with other students, teacher, that keeps our focus strong. I think in an online platform it doesn’t feel the same.

My personal opinions on suggestions provided by @mtyaka :slight_smile: -

How do you guys like the vertical progress bar shown on the left hand side of this site? This kind of navigation could be used to navigate learners through sections of a course.

I would like that, but the title of the section next to it all the time (not in the tooltip). We can make this a sidebar on Mobile devices as well.

Would you like some kind of animation to show which answers are correct or incorrect when it comes to things like quizzes?

Not by that much. Probably one flair on submit button would be enough.

We’d love to add some cool transitions and hover effects to the theme. What do you think about displaying course options in a similar style to the cards shown in the GIF below? If a card / course is selected it’ll open with some kind of cool transition.

Yes, I really like Material Design Guidelines for these kinds of animations.

When the user is viewing their course, and scrolls to the bottom of the page, we could include a bold, fun way to navigate to the previous, or next option, as shown below. What do you think?

I agree with the idea but the example is too eye-catchy for me.

Would prefer if courses are listed in a more interesting way on the theme? For instance, instead of listing course options one below each other, we could list them horizontally and include a vertical scroll. What do you think?

No, I would prefer simple cards with pagination. We could use full-width cards.

When displaying course content, what do you think about using a split-screen showing text on one side, and images or videos on the other?

No, the content of a section will have images within the text so that those conveys more context.

Do you like it when videos you come across on a page autoplay? See example below:

No, I don’t like when it autoplay.

1 Like

I really like such designs because it gives modern look. It feels very natural to scroll or use the arrow keys.

Although it makes the experience look beautiful, this is very inefficient since when someone is taking a quiz, the brain runs in a “power-saving” mode. Hence this should be really minimalistic.

This doesn’t have any practical use but it definitely makes the experience more amicable. Probably even welcoming to new learners.

This is definitely a +1 from my side because right now I miss the information about what I am going back to or what I will be reading.

That’s a novel idea, but it lacks usability for example if I am searching or browsing for courses I want, I would want to see as many courses as I want to rather than clicking to browse.
o,

I like the idea but not for all content this should probably a kind of content. :slight_smile:

No, a strict no, I really don’t like autoplay, hate it on multimedia sites as well.

I was also looking at Neumorphic designs looks like interesting maybe we can experiment.

Answering the main topic:

  • I like it when they offer the information in a way I can use it however I want. For instance they share a download link to a video (then I can watch it in any program I want), or a transcript (then I can copy/paste when taking notes)
  • I don’t like when the platform knows at which point of the course you’re in but it doesn’t tell you so you have to go back to the list of sections to find the first unfinished one
  • I like when I can estimate how long will a section be (e.g. I can see how long is the video or the text I have to read)
  • I don’t like it when there’s a discussion forum that requires a lot of manual work (e.g. because there are too many separate forum channels in the same course, or notifications don’t work)

But I realize this is now about commenting about a design proposal. Here’s mine:

Ok if it’s for information only and you can still navigate through other means. I’m mainly worried that if the screen is small (or the window is short) all the items won’t fit and would be clipped out. Therefore it wouldn’t be good to use it as navigation.
If it adapts to any screen size (e.g. by not being fixed) then ok.

It’s nice for important questions, but I could be tired if this had to happen at each question in a quiz with 20 questions.

This is changing what section you’re in, and it has the potential to break navigation. I’d prefer a more predictable page, and one where 1 URL == 1 page (and always the same page). If those basics are kept, the animation is nice and shows what to focus on.

Same as the previous one: this breaks navigation and then it’s harder to know how to move back, next, to sibling sections, and to keep bookmarks. This type of special effects are usually overengineered and can slow things down or break for technical reasons. They must be well implemented.

I wouldn’t like it. This seems to require a mouse, or maybe a pointing device like fingers on a touch screen. It also requires moving it and playing around and discovering that things move if you roll the mouse wheel or touch the screen from left to right.
I also don’t like that it’s just using a short stripe in my window even if my screen is tall and the window is tall.
The page this effect is sampled from is also overengineered and for instance refuses to work without WebGL; I wouldn’t want this („this effect is cool, so it’s ok to exclude people“) in education.
It also redefines how the keys work (left/right) in a confusing way. It needs and tries to reimplement a core browser function (scrolling) and does it partially (for instance PageUp/PageDown won’t work).

Ok for decoration, and it can be useful. But if the image is important, I’d like to still have a way to access it in any size I want (larger, smaller, separate from the text, …) even if I’m on a small or large screen.
The linked page misses that point: if I shrink the window, I see the text, can’t see the image anymore.
The page also tries to reimplement basic browser functions like scrolling, and just pressing up/down keys triggers a process that takes around 1 second and changes many things. So the effects come at a cost.

Actually I don’t mind it when it’s consistent and when my reason to be in the page is to watch video lessons one after the other. I can get used to arriving to a new page with just 1 video and have it already play. But only in that case (there’s just 1 thing: the video).
But I don’t want an autoplaying video as a surprise, because

  1. some times I have had to control how much bandwidth I consume. I want to choose myself what videos I’ll download
  2. if a video autoplays after scrolling, as in the example above, it’s fighting for attention against other things that may appear when scrolling (like text). autoplay+scroll is too much attention bombardment. Maybe if it’s scroll→wait→autoplay it’s less intrusive.

By the way, in the given example, the autoplaying video is in the background. This wouldn’t be good for course material because it’s easily broken or missed (for instance, in Firefox, I just see LOADING for some reason). If the video is in the foreground or with a download link then it’s easier to make it work.


My ideal system is one which focuses on the content and makes sure that the content can be accessed (even if it’s with a different design or with less automation); design and automation go on top of the content, to extend it, not to replace it. By „content“ I mean text, links, images, videos, navigation, and basic forms.
In MOOCs it’s the same: the design or automation or special effects shouldn’t interfere with navigation through the educational material.

1 Like

Thank you to everyone who has participated! :slight_smile: