Using Accordion Interactions to Group Related Content in E-Learning #227

Accordion Interactions in E-Learning #227: Challenge | Recap

Accordion interactions are a great way to group a large amount of related content into single slide. Similar to tabs interactions, accordions let users explore content using vertical or horizontal layouts.

Accordions can be used to progressively reveal bullet points, quiz questions, module introductions, and summary slides. They're super flexible and they're what this week's challenge is all about!

6-Tab Animated Accordion

Here's a free template to get you started this week. Using motion paths and a variable, this template animates the opening and closing of the tab buttons.

View the project | Download the template

Conditional Next Button

Accordion interactions are similar to tabs, but they introduce a level of complexity with the duplicated buttons. If you need to lock or restrict navigation until the learner visits all tabs, you'll have to approach things a little differently. Here's one way to add conditional navigation to your interaction.

View on YouTube

Challenge of the Week

This week, your challenge is to share an example that demonstrates how accordion interactions can be used in e-learning.

NOTE: Your entry can be anything from a rough concept to a polished example. The challenges are open to everyone, regardless of experience or skill level. If you need technical or creative help with your project, please ask in our forums and reference the challenge number you’re working on.

New Entries Only!

We hosted the first accordion challenge two years ago. To keep things fresh, we’re asking that you share only new examples this week. You’re more than welcome to re-work a previous example.

Last Week’s Challenge:

Before toggling over to this week’s challenge, take some time to check out the interactive timelines your fellow community members shared over the past week:

Zooming and Magnifying Techniques #226: Challenge | Recap

Wishing you a great week, E-Learning Heroes!

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.