How to Build a Tabs Interaction for E-Learning w/ Articulate Storyline 360
Learn how to build one of the most common e-learning interactions and templates in Articulate Storyline 360. Tabs interactions, also known as click-and-reveals, are a fantastic interaction for e-learning courses. Why? They’re a great way to chunk related content that belongs in the same slide topicallyTabs are also intuitive, as learners are conditioned to click on them to see what’s there. And function aside, a big plus about tabs is that you can style them in a ton of different ways, so they can work with nearly any design.
=============================
📖 Table of Contents:
=============================
00:00 Introduction
00:32 Examples of Tabs Interactions
01:44 Get started with a new, blank document in Storyline
02:00 Create your first button using basic rectangle graphics
02:18 Duplicate the button three times to create a total of 4 buttons
02:45 Scale and align the buttons equally across the slide
03:20 Rename the buttons in the timeline (Best Practice)
03:38 ***SECRET TIP: Using common prefixes to name object
04:20 Add the hover and selected states for the first button
06:00 ***SECRET TIP: Shortcut for quickly adding states
06:50 ***PRODUCTION TIP: Quickly format the remaining buttons
08:47 Add the buttons to a button set to create the toggle effect
10:08 Create a new layer for Button 1 content
11:11 Add some placeholder content to Content 01 layer
11:55 Make it great and duplicate!
14:00 Add a trigger for Button 01 to show the Content 01 layer
15:00 ***PRO TIP: Copy the Button 01 trigger and paste on remaining buttons
15:31 Update the hyperlinks for the remaining 3 buttons
16:40 BONUS: More examples of tabs interactions
=============================
✅ Download the Practice Files
=============================
Practice files: http://bit.ly/FolderTabs
=============================
💥 Articulate Storyline 360 Training 💥
=============================
🖥️ Advanced Articulate Storyline 360 Training Course: / articulate-storyline-360-advanced-elearning
🖥️ Interactive E-Learning in Storyline 360: / articulate-360-interactive-learning
🖥️ Using Articulate Rise 360: / using-articulate-rise-360-for-rapid-deploy...
🖥️ Live and On-Demand Training: https://training.articulate.com/
=============================
👉 Where to Find Me:
=============================
Twitter ➜ / elearning
Instagram ➜ / elearning
LinkedIn ➜ / davidanderson
=============================
#ArticulateStoryline #storyline360 #elearning