Accordion

Launch Presentation

The challenge:  Learners click a tab to learn about each of the conflict resolution methods. The tab moves from the right side of the screen to the left when clicked.

The process:  A tab is used for each of the five conflict resolution methods to allow learners to click each tab to learn more about each method to resolve conflict in the workplace. Once very tab has been clicked, learners can start over to view all the tabs again.

The solution: This interaction is included as part of a Rise course on conflict resolution. An accordion interaction is used to organize 5 related concepts (conflict resolution methods) to allow learners to navigate across each type. 

Project Features

  • Layers are used to show a different tab when the learner clicks on the tab.
  • Motion paths are used to move the tabs from the right side to the left side of the screen when the learner clicks the tab.
  • States are used to change colors of tabs when clicked and to add animations as the tab moves across the screen.