Blog Post

E-Learning Challenges
2 MIN READ

Chunking Content with Scrolling Panels #415

DavidAnderson's avatar
3 years ago

Scrolling Panels in E-Learning #415: Challenge | Recap

When working with lengthy text blocks in your course design, you can do a few things to ensure the composition is manageable and easy to read:

  1. Break up the text into smaller paragraphs. 
  2. Use typographic hierarchy to ensure the most important information stands out.
  3. Use whitespace to create visual interest and balance. 

But there may be times when you still may need a little extra help. That's where scrolling panels can help.

Scrolling panels are a great option when you're looking for ways to present large images, lengthy text blocks, or other graphics that don't fit well on a slide.

For example, you can divide a long list or set of instructions into manageable chunks by placing each piece of content in its own text box within the scrolling panel. And managing large blocks of content is what this week's challenge is all about.

Challenge of the Week

This week, your challenge is to share an example to show how scrolling panels can be used to present content that doesn't fit well on the slide.

Resources

Share Your E-Learning Work

  • Comments: Use the comments section below to share a link to your published example and blog post.
  • Forums: Start  your own thread and share a link to your published example..
  • Personal blog:  If you have a blog, please consider writing about your challenges. We’ll link back to your posts so the great work you’re sharing gets even more exposure.
  • Social Media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can track your e-learning coolness.

Last Week’s Challenge:

Before you slide into this week’s challenge, check out the creative ways designers use interactive video in e-learning:

Webcam & AI Avatars in E-Learning RECAP #410: Challenge | Recap

New to the E-Learning Challenges?

The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos.

Learn more about the challenges in this Q&A post and why and how to participate in this helpful article

Next Week’s Challenge

  • Next week's challenge #415 (May 05, 2023): Using AI in E-Learning #415. This includes AI images, characters, graphics, chat, content, and more.

Got an idea for a challenge? Are you interested in doing a webinar showcasing how you made one or more challenge demos? Or do you have some comments for your humble challenge host? Use this anonymous form to share your feedback:  https://bit.ly/ElearningChallengeForm.

Published 3 years ago
Version 1.0

122 Comments

  • This week's ID tip - font size matters. I found a study that summarizes that the larger font size can improve reading speed, comprehension, and overall learning outcomes. The participants who read in the larger font size performed significantly better on a memory test than those who read in the smaller font size.

    Another way to increase motivation and interactivity is to replace a formal tone with a personalized, casual tone. Another study confirmed learners had increased motivation with this type of tone and scored higher in quizzing.

    So, here is a cat interaction about a cat type I really, really want. It starts out formal and normal, and you add ID sprinkles to improve it.

    https://bonnenagle.org/cluevo/lms/my-learning-tree/forest-cat/
    • CydWalker_mwhc's avatar
      CydWalker_mwhc
      Community Member
      Nice, I almost want one of these felines! And the ID sprinkles were even more interesting. I agree on the larger font size, and space, and "talk to me" tone.
  • Hello!

    I've tinkered with Javascript-enabled scrolling panels in the past and have refined the code again for this challenge. Triggering events based on the position of the scrolling panel can add interactivity while chunking content.

    This week the robotic HR consultant, Jobsworth, is back from ELHC #413 to welcome you to your first day at Lucifer Industries.

    https://bit.ly/elhc415

    There's a download in there too - hidden in a scrolling panel 😀
    • LisaListama-b25's avatar
      LisaListama-b25
      Community Member
      Hey Jonathan. Question - are scrolling panels accessible? Love your work.
      • Jonathan_Hill's avatar
        Jonathan_Hill
        Super Hero
        Hi Lisa, yes, they are! Like most interactive objects in Storyline, you can access scrolling panels using the Tab key and then use the up and down keys or Page Up and Down keys to move it.
    • JackieMatuza's avatar
      JackieMatuza
      Community Member
      I love having the scroll as an interactive element for the user, very nice work!
    • BrianCho-4b18e2's avatar
      BrianCho-4b18e2
      Community Member
      Wow, great work Jonathan! I really liked the concept of using an elevator integrated with a scroll. The art direction is also really cool, with the good use of generative AI images and voice. There is a nice sense of expectation..what's waiting for me on each floor :D
    • BrianCho-4b18e2's avatar
      BrianCho-4b18e2
      Community Member
      Great choice of music and video clip! It works really well together.
    • CydWalker_mwhc's avatar
      CydWalker_mwhc
      Community Member
      This lends itself really well to scrolling with an elegant display of the stages.